@charset "utf-8";
/*基本*/
body { margin: 0; padding: 0; width:100%; background-color:#82000a;}
.for_phone { display:none;}
.for_m ul { margin: 0px; padding: 0px;list-style: none outside none;}
 @media screen and (max-width:767px){
    .for_pc{ display:none !important;}
    .for_phone{ display:block !important;}
	body { margin: 0; padding: 0; background-image:none ; background-color:#82000a; }
	.for_m_magintop { margin-top:3vw;}
 }


/*全BOX版面*/
.WRAPPER {position:relative; display:inline-block;  margin:0; padding:0;  width:100%;  overflow:hidden;min-width:1220px;   }
.WRAPPER img {border:0; vertical-align:top;}
.WRAPPER .mainArea {  margin:0 auto; width:1220px; font-family:"Century Gothic", "微軟正黑體", sans-serif; position:relative; }
.WRAPPER .mainArea a{ padding:0; margin:0; text-decoration:none; font-family:"微軟正黑體" }
.WRAPPER  a { text-decoration:none;font-family:"微軟正黑體"} 
/*控制區塊背景的位置*/
.Areabg{ margin-left:-390px;} 
@media screen and ( max-width:736px) {
	.WRAPPER {min-width: inherit;  background-size: 100%;background-image:url("mb_reapet.jpg?t=1748834996091");background-repeat: repeat-y;}
	.WRAPPER img {width:100%; height:auto;}
}

#canvas { z-index: 5; pointer-events: none; position: fixed; bottom: 0; left: 0; width: 100%; height: 100%;}


/*區塊背景*/
@media screen and ( min-width:768px) {
.Areabg01{ position:absolute;z-index:-1; top:0px; left:0; width:100%; min-width:1220px; height:3000px;background-image:url(pc_01.jpg?t=1748834996091); background-repeat:no-repeat; background-position:center top;}
.repeat_bg2{ position:absolute;z-index:-3; top:600px; left:0; width:100%; min-width:1220px; height:30000px;background-image:url(pc_reapet.jpg?t=1748834996091); background-repeat:repeat-y; background-position:center top;  pointer-events:none; }
.bgdeco { z-index:2; position: absolute; top:500px; left: 0; width:100%; min-width:1220px; height:60000px; background: url(bgdeco.png?t=1748834996091) repeat-y center top; pointer-events: none;}		
.Areabg03{ position:absolute;z-index:1; top:0px; left:0; width:100%; min-width:1220px; height:758px;background-image:url(pc_01.png?t=1748834996091); background-repeat:no-repeat; background-position:center top;pointer-events: none;}		
}
@media screen and ( max-width:767px) {
.Areabg01{ display:none }
.Areabg02{ display:none }
.repeat_bg2{ display:none }	
.bgdeco{ display:none }		
}

    

/*回版頭*/
#gotopBtn { display:none !important;} /*把系統手機版原本的Gotop關掉*/
#gotop { display: none; position:fixed; z-index:201; right:0; padding:14px 6px 3px 10px; font:12px/30px Verdana; text-align:center; color:#fff; cursor:pointer; transition: 0.2s; transform: translateX(200%);
        bottom:90px;
        bottom: calc(90px + constant(safe-area-inset-bottom)*0.6 );
        bottom: calc(90px + env(safe-area-inset-bottom)*0.6 );}
#gotop::before { content: ""; position:absolute; top:9px; left:19px; width: 0; height: 0; border: 4px solid #fff; border-color: transparent transparent #fff; }
#gotop::after  { content: ""; z-index:-1; position:absolute; top:50%; left:50%; border-radius:50px 0 0 50px; transform:translate(-50%,-50%); width:44px; height:44px; background-color:rgba(0,0,0,0.8);}
#gotop.cate-open { transform: translateX(0%);}
  /*白色*/
  #gotop { color:#000; }
  #gotop::before { border-color: transparent transparent #000;}
  #gotop::after  { background-color: rgba(255,255,255,0.95);  box-shadow:0 1px 0 rgba(242,242,242,1), 0 0 10px rgba(0,0,0,0.2);}



/*區塊_all*/
.Area1220 { margin:0 auto; width:1220px;}
.Area960 { margin:0 auto; width:960px;}
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { position:relative; 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);}
		  
		  
.WRAPPER .go_bt1 {
  -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;}
.WRAPPER .go_bt1:hover { 
  -webkit-transform:translateY(-10px);
     -moz-transform:translateY(-10px);
      -ms-transform:translateY(-10px);
       -o-transform:translateY(-10px);
          transform:translateY(-10px);}
		  
		  
	@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
		.Area .go_bt:hover {  
			-webkit-transform:none;
			-moz-transform:none;
			-ms-transform:none;
			-o-transform:none;
			transform:none;}
	}

	
		  
/*區塊-共用按鈕*/
.Area .btn_go {}
.Area .btn_go *{
						  -webkit-transition: all 0.1s ease;
							 -moz-transition: all 0.1s ease;
							  -ms-transition: all 0.1s ease;
							   -o-transition: all 0.1s ease;
								  transition: all 0.1s ease;} 
.Area .btn_go a:hover {  -webkit-transition: all 0.35s;
    transition: all 0.35s;
    -webkit-transform: scale(0.9);
    transform: scale(0.9);}
.Area .btn_go a:after  { 
								  -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 .btn_go:active a,
.Area .btn_go:focus a,
.Area .btn_go:hover a { color:#fff;}
.Area .btn_go:active a:after,
.Area .btn_go:focus a:after,
.Area .btn_go:hover a:after  { width:150% !important;}
.Area .btn_go:active a i,
.Area .btn_go:focus a i,
.Area .btn_go:hover a i { background-color:#000; transform:translateX(-10px); transition-delay:0.1s;}
.Area .btn_go a strong { z-index:2; position: relative; }
.Area .btn_go a i {
	z-index: 3;
	position: absolute;
	top: -63px;
	right: -278px;
	display: inline-block;
	border-radius: 60px;
	width: 60px;
	height: 60px;
	background: #09006e url(btn_icon_r.png?t=1748834996091);
	background-size: contain;
}
	@media screen and (max-width:736px){ 
	    .Area{width:100%; height:100%; min-width:100%;}
		.Area .btn_go { position:absolute; }
		.Area .btn_go *{
								  -webkit-transition: all 0.2s ease;
									 -moz-transition: all 0.2s ease;
									  -ms-transition: all 0.2s ease;
									   -o-transition: all 0.2s ease;
										  transition: all 0.2s ease;} 
		.Area .btn_go a { display:block; color:#fff; letter-spacing:-2px;}
		.Area .btn_go a:after  { }
		.Area .btn_go:active a,
		.Area .btn_go:focus a,
		.Area .btn_go:hover a { color:#fff;}
		.Area .btn_go:active a:after,
		.Area .btn_go:focus a:after,
		.Area .btn_go:hover a:after  { width:150% !important;}
		.Area .btn_go:active a i,
		.Area .btn_go:focus a i,
		.Area .btn_go:hover a i { background-color: transparent; transform:translateX(-10px); transition-delay:0.1s;}
		.Area .btn_go a strong { z-index:2; position: relative; }
		.Area .btn_go a i { z-index:3; position: absolute; top:0; right:0; display:inline-block; border-radius:35px; width:35px; height:35px; background:#09006e url(btn_icon_r.png?t=1748834996091);  background-size:contain;}
	}




/*間距*/
.Area_bottom { margin-bottom: 100px;}
@media screen and (max-width:767px){
  .Area_bottom { margin-bottom: 10vw;}
}



@media screen and (min-width:768px){
/*版頭*/
.Area01 { height:480px; }
.Area01 .title01 { z-index:1; position:absolute; top:80px; left:250px; width:60%; }
.Area01 .title02 { z-index:2; position:absolute; top:265px; left:305px; width:50%; }
.Area01 .momoco_all {z-index:4; position:absolute; top:233px; left:900px; }
.Area01	.deco02{ z-index:4; position:absolute; top:297px; left:90px; }	
.Area01	.deco03{ z-index:4; position:absolute; top:0 ; left:692px; width:77px; }		
}
@media screen and (max-width:767px){
.Area01 { width:100%; height:48vw; }
.Area01 .title01 { z-index:1; position:absolute; width:78%; top:9vw; left:12vw;}
.Area01 .title02 { z-index:1; position:absolute; width:71%; top:28vw; left:14vw;}	
.Area01 .momoco_all {z-index:4; position:absolute;left:78vw; top:27vw;width:19%;}		
.Area01	.deco02{ z-index:4; position:absolute; width:14%; top:34vw; right:90vw;}	
.Area01	.deco03{ z-index:4; position:absolute; width:8%; top:0; left:67vw;}	
.Area01 .bg {z-index:0; position:absolute;top:0; left:0;width:100%;pointer-events: none;}	
.Area01 .box_bg{ position:absolute;width:100%;left:0;top:133vw;z-index:2}				
}


/*共用*/
.for_pc { display:block !important;}
.for_m  { display:none !important;}
	@media screen and (max-width:736px){ 
		/*共用*/
		.for_pc { display:none !important;}
		.for_m  { display:block !important;}
	}




/* it折價券 */
@media screen and (min-width:768px){
	.Area_coupon .box { background-image:url(coupon_repeat.jpg?t=1748834996091) ; background-repeat: repeat-y; background-size: 100%; }
	.Area_coupon .layout_coupon ul{ grid-gap: 1em; width: 96%; margin: auto;}
}
@media screen and (max-width:736px){ 
	.Area_coupon .box { background-image:url(coupon_repeat.jpg?t=1748834996091) ; background-repeat: repeat-y; background-size: 100%;}
	.Area_coupon .layout_coupon ul{ grid-gap: .5em; width: 96%; margin: auto;}
}


/* 1張banner */
.Area_swiper_box .PD_layout li { background: none; }
.swiper-pagination-black { --swiper-pagination-color: #fff; }
.swiper-pagination-bullet { background: #fff;}
@media screen and (max-width:736px){ 
.Area_banner .layout_banner { width: 96%;}
}




/* 館連結 */
.Area_icon .layout_icon { background-image:url(coupon_repeat.jpg?t=1748834996091) ; background-repeat: repeat-y; background-size: 100%; }
.Area_icon .layout_icon ul{ grid-gap: 1em ;width: 85%; margin: auto; }
@media screen and (max-width:736px){
	.Area_icon .layout_icon { background-image:url(coupon_repeat.jpg?t=1748834996091) ; background-repeat: repeat-y; background-size: 100%; }
	.Area_icon .layout_icon ul{ grid-gap: .5em ; width: 85%; margin: auto;}
}




/* 熱搜話題*/
@media screen and (min-width:768px){

	.Area_new {height:100%;display: flex;flex-wrap: wrap;}

	.Area_new .box {position:relative;margin-bottom:50px;width: 100%;margin: -28px auto 40px auto;padding-top: 0px;}	
	.Area_new .box .PD_layout ul{border-radius: 0px;width: 90%;margin-top: 44px;margin-bottom: 34px;}
	/**區標**/	
	.Area_new .text { width: 70%;margin: 0 auto 30px;}
	.Area_new .text .PD_layout{z-index: 9;}
	.Area_new .text .layout_text .PD_slide:hover{transform:none;}
	.Area_new .text .layout_text .PD a {pointer-events: none!important}
	.Area_new .text02 {width: 100%;margin: 0px auto;padding-top: 14px;}

	/**公版**/	
	.Area_new .box  {width:96%!important;margin:0 auto;overflow: hidden;}
	.Area_new .box .layout_PD {}
	.Area_new .box .layout_PD ul {display:flex;margin:0;padding:0;grid-gap:0; background: none;}
	.Area_new .box .layout_PD ul li {margin:0;padding:0;grid-gap:0;background: url(mo_li_list.png?t=1748834996091)top center no-repeat;background-size: 100%;height: 460px; border: 0;}	
	.Area_new .box .layout_PD ul li:hover {box-shadow: none; }	
	.Area_new .box .swipwe_remove_box_style ul li {}
	.Area_new .box .layout_PD .swiper-pagination {top:0;position:relative;}

	.Area_new .box .layout_PD ul li .PD .PD_img{ margin: 113px 20px 0; width: 82%;}
	.Area_new .box .layout_PD ul li .PD .PD_into{ margin: 20px 36px; color: #870009; width: 74%;}
	.Area_new .box .layout_PD ul li .PD .PD_into h4{ font-size: 22px !important;}


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

	.Area_new  {}
	.Area_new .box {position: relative;top: 0;margin-top: -9vw;margin-bottom: 6vw;}
	.Area_new .box .PD_layout ul{border-radius: 0vw;width: 94%;margin-top: -2vw;}
	/**區標**/	
	.Area_new .text {width: 100%;padding-top: 0;margin: 0 auto 3vw;}
	.Area_new .text .PD_layout {z-index: 9;}
	.Area_new .text .layout_text .PD_slide:hover{transform:none;}
	.Area_new .text .layout_text .PD a {pointer-events: none!important}

	/**公版**/	
	.Area_new .box  {width:96%!important; margin: 0 auto ;}
	.Area_new .box .layout_PD {}
	.Area_new .box .layout_PD ul {display:flex;margin:0;padding:0;grid-gap:0; background: none; }
	.Area_new .box .layout_PD ul li {margin:0;padding:0;grid-gap:0;background: url(mo_li_list.png?t=1748834996091)top center no-repeat;background-size: 100%;height: 70vw; border: none; }	
	.Area_new .box .layout_PD ul li:hover {box-shadow: none; }	
	.Area_new .box .layout_PD .swiper-pagination {top:0;position:relative;}

	.Area_new .box .layout_PD ul li .PD .PD_img{ margin: 17vw 1vw 0;width: 94% ; }
	.Area_new .box .layout_PD ul li .PD .PD_into{ margin-top: 2vw;margin-bottom: 2vw;padding: 0 5vw 0; color: #870009;}
	
}



/* 輪播 */
.Area_BN .Area_swiper_box .PD_layout li{ height: 305px; }
@media screen and (max-width:767px){
	.Area_BN .Area_swiper_box .PD_layout li{ height: 31vw; }
}





/*分享浮層*/
.floatBox { position:relative; margin:2% auto; padding: 2% 0; width: 700px; height:auto; background-color:rgba(0,0,0,0.8); text-align:center; position:relative; border-radius:20px; z-index: 5;}
.floatBox img { width:100%; height:auto;}
.floatBox .go_bt {
  -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
      -ms-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
          transition: all 0.2s ease;}
.floatBox .go_bt:hover { filter: brightness(120%);
  -webkit-transform:translateY(-6px);
     -moz-transform:translateY(-6px);
      -ms-transform:translateY(-6px);
       -o-transform:translateY(-6px);
          transform:translateY(-6px);}
.floatBox .closeButton a { display:block; cursor:pointer; position:absolute; top:-20px; right:-20px; width:40px; height:40px; border-radius:50%; border:solid 2px #999999; font:bold 40px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none; z-index:2}
.floatBox .closeButton:hover {background-color:#666; text-decoration:none;}
.floatBox .title  { display:inline-block; margin:0 0 10px 0; border-bottom:1px solid #ffd800; font:bold 45px/1.5em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;  color:#ffd800; text-align:center}
.floatBox .box_ { margin:0 auto; width:90%;}
.floatBox .box_:after { content: ""; display:block; clear:both;}
.floatBox .box_btn { margin:20px auto 0; width: 80%;}
.floatBox .box_btn a { display:block; margin:3% 0;}
.floatBox .box_btn img { width:100%;}
.floatBox .box_btn .btn { margin:0 auto; width:60%;}
.floatBox .box_btn2 a { float:left; margin:0 1%; width:48%;}
	@media screen and (max-width:767px){
		.floatBox { padding:5% 0; width:90%; height: auto;}
		.floatBox .closeButton a {display:block; position:absolute; top:-15px; right:-15px; width:30px; height:30px; border-radius:50%; border:solid 2px #999999; font:bold 30px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none; z-index:2}
		.floatBox .closeButton:hover {background-color:#666; text-decoration:none}
		.floatBox .title  { margin:0 5% 3vw; font-size: 6vw; line-height:2rem;}
		.floatBox .box_btn { margin:2% auto 0;}
		.floatBox .box_btn .btn { margin:0 auto; width:80%;}
	}