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

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


/*全BOX版面*/
.WRAPPER { position: relative; display: block; margin: 0 auto; padding: 0; width: 100%;  min-width: 1220px; overflow: hidden; font-family: "微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border: 0; vertical-align: top;}
.WRAPPER a { text-decoration: none;}
@media screen and (max-width:767px){
  .WRAPPER { min-width: inherit; padding-bottom: 10vw; background: url(bgrepeat_m.jpg?t=1752718406510)top center repeat-y; background-size: 100%;}
  .WRAPPER img {  width: 100%;  height: auto;}
}

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

/*背景*/
@media screen and (min-width:787px){
.bgfixed { z-index: 0; position: absolute; top: 835px; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgfixed.jpg?t=1752718406510) repeat-y center top;}
.bgtop { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgtop.jpg?t=1752718406510) no-repeat center top;}
.bglight { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bglight.png?t=1752718406510) no-repeat center top; mix-blend-mode: screen;}
}
@media screen and (max-width:767px){
  .bgtop { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: inherit; height: 100%; background: url(bgtop_m.jpg?t=1752718406510) no-repeat center 44px; background-size: 100%;}
  .bglight { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: inherit; height: 100%; background: url(bglight_m.png?t=1752718406510) no-repeat center 44px; background-size: 100%; mix-blend-mode: screen;}
}
	
/*區塊_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);}
.Area .go_bt2 {
  -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_bt2:hover { 
  filter: brightness(130%);
  -webkit-transform: translateY(-10px);
     -moz-transform: translateY(-10px);
      -ms-transform: translateY(-10px);
       -o-transform: translateY(-10px);
          transform: translateY(-10px);
		  }
.Area1220 { margin: 0 auto; width: 1220px;}
.Area960 { margin: 0 auto; width: 960px;}
@media screen and (max-width:767px){
  .Area .go_bt:hover {  
    -webkit-transform: none;
     -moz-transform: none;
      -ms-transform: none;
       -o-transform: none;
          transform: none;}
  .Area .go_bt2:hover { 
    filter: brightness(1);
    -webkit-transform: none;
       -moz-transform: none;
        -ms-transform: none;
         -o-transform: none;
            transform: none;
        }
  .Area1220 { width: 100%;}
  .Area960 { width: 100%;}


}




/*Area_txt(有設計的區標PC手機共用)*/
@media screen and (min-width:768px){
	.Area_txt {margin:0 auto 0px;width:100% }
	.Area_txt img {width:960px; }	  
}
@media screen and (max-width:767px){
		.Area_txt {width:100% }
	  .Area_txt img {width:100%;}
}




.txt a{pointer-events: none}
@media screen and (min-width:768px){
	.txt{width: 700px}
}

@media screen and (max-width:767px){
	.txt{width: 100%}
}









/*間距*/
@media screen and (min-width:768px){
.Area_bottom { margin-bottom: 50px;}
}

@media screen and (max-width:767px){
  .Area_bottom { margin-bottom: 1vw;}
}



/*版頭*/
.Area_top { height:540px; }
.Area_top .Area960 { width: 960px;}
.Area_top .toptitle { z-index:9;position: absolute; top: 210px; left:200px; width:400px; }
.Area_top .mainlight {z-index:-1;  position: absolute; top: 0; left: 90px; width: 80%; mix-blend-mode: screen;}
.Area_top .linelogo { z-index:9;position: absolute; top:100px; left:210px; width:320px; }
.Area_top .date { z-index:40;position: absolute; top:45px; left:800px; width:20%; }
.Area_top .topPD { background: #ffe746; border-radius: 30px; padding: 20px; box-shadow: inset 0 0 10px #ffe746;}
@media screen and (max-width:767px){
  .Area_top { height:53vw; }
  .Area_top .Area960 { width: 100%;}
  .Area_top .toptitle {z-index: 0; position: absolute; top:21vw; width:42%;left:8vw;}
  .Area_top .date {z-index: 25;position: absolute; top:3vw; width:28%;left:75vw;}
  .Area_top .linelogo {z-index: 11; position: absolute; top:10vw; width:40%;left:8.5vw;}
  .Area_top .mainlight { position: absolute; top: 0vw; left: 0vw; width: 100%; mix-blend-mode: screen;}
  .Area_top .topPD { padding: 2%; border-radius: 20px;}
  .Area_top .topPD ul { width: 100%;}
}











/*副標*/
@media screen and (min-width: 768px){
.Area_top .sub {z-index: 30;position: absolute;top: 100px;margin: 0 auto 0; left: 640px;width:390px;}
	
}
@media screen and (max-width:767px){
.Area_top .sub { z-index: 1 ;position: absolute ;width: 100%; margin: 0vw auto 0vw;top:0vw; }
.Area_top .sub li{ margin: 0 auto 0; top: 11vw;left: 22vw; width: 35%!important;opacity: 1 !important ; transform: translate3d(0px, 0px, 0px)!important;}
.Area_top .sub .PD_layout .PD img { width: 100%; }	
}



/*版頭品*/
@media screen and (min-width:768px){
.Area_top .bg_border_toppd { position: absolute;top:500px;border: solid 3px #fff; border-radius: 20px; filter: drop-shadow(0 0 8px #aadba3); }
.Area_top .layout_topPD  {position:absolute;width:95%;top:586px;left: 30px;}
.Area_top .layout_topPD ul {padding:15px!important }
.Area_top .layout_topPD ul li {}	
.Area_top .layout_topPD ul li:hover {box-shadow: none; }	
.Area_top .layout_topPD ul li .PD_into {justify-content:center}	
}
@media screen and (max-width:767px){  
.Area_top .bg_border_toppd { width: 96%; border-radius: 25px; margin: 12vw auto 0;}
.Area_top .layout_topPD  {position:absolute;width:100%;top: 50vw;left: 0;}
.Area_top .layout_topPD {}
.Area_top .layout_topPD ul {}
.Area_top .layout_topPD ul li {}	
.Area_top .layout_topPD ul li:hover {box-shadow: none; }	

}


/*好康活動*/
.Area01 {}
.Area01 .event ul { grid-gap: 0 10px;}
@media screen and (max-width:767px){
  .Area01 {}
  .Area01 .event ul { grid-gap: 0 0.2em; padding: 0 0.5em;}
}



/*強牌活動 給你最好的*/
.Area_event {}
.Area_event .btn ul {position: absolute; grid-gap: 10px; padding: 0 10.5em;width:100%;margin-top:-463px ;}
@media screen and (max-width:767px){
  .Area_event {}
  .Area_event .btn ul {position: absolute; grid-gap: 0.2em; padding: 0 4.1em;width:100%;margin-top:-48vw ; }
}




/*攻略*/
@media screen and (min-width:768px){
.cut_BN .more {z-index:15;position: absolute;width:100%;top: 414px;left: 0px;margin: auto}
.cut_BN .more img {width:180px;}
.cut_BN.Area_bottom { margin-bottom: 50px;}
} 
@media screen and (max-width:767px){
.cut_BN .more {position: absolute;width:25%;top: 47vw;left: 37vw;z-index:15;}
.cut_BN.Area_bottom { margin-bottom: 5vw;}
}





/*強牌活動 給你最好的*/
.Area_event_12 {}
.Area_event_12 .btn ul { grid-gap: 10px; padding: 0 1.5em;}
.Area_event_12.Area_bottom { margin-bottom: 50px;}
@media screen and (max-width:767px){
  .Area_event_12 {}
  .Area_event_12 .btn ul { grid-gap: 0.2em; padding: 0 0.8em;width:100%; }
  .Area_event_12.Area_bottom { margin-bottom: 5vw;}
}





/*Youtube影片浮層css*/
.Area_youtube .box_youtube { margin: 0 auto; overflow: hidden }
@media screen and (min-width:768px){
  .Area_youtube .box_youtube { width: 874px; border-radius: 20px;margin-top:-562px ; }
}
@media screen and (max-width:767px){
  .Area_youtube .box_youtube { width: 92%; border-radius: 10px;margin-top:-59vw ;}
}

.Area_youtube .bigpicture { height: 100%;	width: 100%; position: relative; background-position: center center; background-size: cover; cursor: pointer;}
.Area_youtube .bigpicture h3 { position: absolute; left: 5%; bottom: 0; z-index: 1; color: #fff; font-size: 20px }
.Area_youtube .bigpicture:before,
.Area_youtube .bigpicture:after { z-index: 1; content: ''; position: absolute; left: 0; top: 0; right: 0;	bottom: 0;height: 100%;	width: 100%; transition: opacity 0.2s;}
.Area_youtube .bigpicture:after { background-repeat: no-repeat; background-position: center; opacity: 1; background-size: 2em;}
.Area_youtube .bigpicture:before { background: linear-gradient(0deg, #000, transparent 40%); opacity: 0.7;}
/*.bigpicture:hover:after { opacity: 0.8; }*/
.Area_youtube .bigpicture:hover:before { opacity: 0.5; }
.Area_youtube .bigpicture:after { height: 100%; width: 100%;	
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20159.00691%20111.60904%22%3E%3Cpath%20d%3D%22M36.2%20111c-25-1.3-29.6-4-34-18.6C.3%2086.7%200%2080%200%2057.4%200%2019%202.3%209.7%2013.6%204c11.5-5.6%20120-5.6%20131.4%200%206%203%2010%208.7%2011.8%2017.2%202%209.8%203%2042.2%201.5%2057.5-2%2020.4-7%2028.5-19.2%2030.8-7.6%201.5-82%202.4-102.8%201.3zM85%2065.3c11.3-6%2020.4-11%2020.3-11L84%2043%2063%2032v22c0%2012%20.4%2022%20.8%2022%20.3%200%2010-5%2021.2-10.8z%22%20fill%3D%22%23db2823%22%2F%3E%3Cpath%20d%3D%22M63.2%2032c-.4.3-.2%201-.3%201.3v28.5c0%204.6%200%209.2.5%2013.8%200%20.4.3.7.6.5%206.3-3%2012.3-6%2018.4-9.3%207.5-4%2015-7.8%2022.2-12%20.3%200%201-.4.6-.8-12.8-7-25.7-13.5-38.6-20.2-1-.6-2.2-1.3-3.4-1.7z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E');
  background-size: 4em;
}
.Area_youtube .bigpicture img { width: 100%; border-radius: 10px; aspect-ratio: 1.777777;}
@media screen and (max-width:767px) {
  .Area_youtube .bigpicture h3 { font-size: 3vw; left: 1.2em;}
}
      @media screen and (min-width:768px){
		 .Area_youtube { height: 750px;margin-bottom: 35px; }
     .Area_youtube .box_youtube.box1 {z-index: 120; width: 886px; top: 182px; left: 167px; border-radius: 20px; }
		 
      }
      @media screen and (max-width:767px){
		 .Area_youtube { height: 80vw;margin-bottom:5vw ;}
     .Area_youtube .box_youtube.box1 {z-index: 120; width: 92%; top: 20vw; left: 4vw; border-radius: 10px;}
		
     .Area_youtube .box_youtube iframe { border-radius: 10px; } 
      }





/*2品公版*/	
.Area_2pd .videobox1 { z-index:5; }
@media screen and (min-width:768px){
.Area_2pd { height: 430px; margin: 0px auto 70px!important; }

}
@media screen and (max-width:767px){	
.Area_2pd { height: 116vw; margin: 0px auto 10vw!important; }

}

/*影片*/		
.videobox {position:relative; height: auto;}
.videobox .youtubeBG {width: 100%;position:relative;}
.videobox .youtubeArea { position:absolute; top:23px; right:173px; width:872px; height:494px}
.videobox .youtubeArea iframe {border-radius:25px;}
@media screen and (max-width:767px){
	.videobox{position:relative; width:100%; height: auto;}
	.videobox .youtubeBG {width: 96%;left:2vw;}
	.videobox .youtubeArea {position: relative;width:93vw; height:200px; top:-30vw; right:0; margin:-92px auto;}
	.videobox .youtubeArea iframe {border-radius:5px;}
}








/*登記活動*/
.Area_danji_all {height:auto ;margin-bottom:50px !important;}
.Area_danji_all .title {  background-size: 100%;}
.Area_danji_all .Area_danji .danji_box { width: 98%;}
.Area_danji_all .warningTxt h3 { padding: 0;}
.Area_danji_all .bg_border_danji { border: solid 3px #fff; border-radius: 20px ;/* filter: drop-shadow(0 0 8px #fff);*/}
.Area_danji_all .bg_border_danji .PD_box {  border-radius: 20px ; padding: 8px;/* box-shadow: inset 0 0 10px #fff;*/}
@media screen and (max-width:767px){
  .Area_danji_all {height:auto ;margin-bottom:10vw !important;}
  .Area_danji_all .title {  background-size: 100%;}
  .Area_danji_all .bg_border_danji { border-radius:  5vw ; width: 96%; margin: 0 auto;}
  .Area_danji_all .bg_border_danji .PD_box { border-radius: 5vw ; padding: 2%;}
  .Area_danji_all .bg_border_danji .PD_box ul { width: 100%;}
}

@media screen and (min-width:768px){
.Area_danji_all .Area_sectionTitle ul {position: relative;padding: 0;margin: 0 auto;list-style: none;height: 75px!important;top:0px;}
.Area_danji_all .Area_sectionTitle ul li { background-color: transparent; pointer-events: none;}
.Area_danji_all .Area_sectionTitle ul li h5 {position: relative;top:0px;margin: 0;padding: 0;width: 100%;height: 88px;font: 41px/80px "微軟正黑體","Microsoft JhengHei",Helvetica;font-weight: bolder;text-align: center;color:#007968;letter-spacing: 0px;overflow: hidden;/*text-shadow: 0px 0px 5px #000;*/}

}

@media screen and (max-width:767px){
  .Area_danji_all .Area_sectionTitle ul {padding: 0;margin: 0vw auto 0vw;list-style: none;}
  .Area_danji_all .Area_sectionTitle ul li { background-color: transparent; pointer-events: none;}
  .Area_danji_all .Area_sectionTitle ul li h5 {position: relative;top:4vw;margin: 0;padding: 0;width: 100%;height: 10vw;font: 6vw/7vw "微軟正黑體","Microsoft JhengHei",Helvetica;font-weight: bolder;text-align: center;color:#007968;letter-spacing: 0px;overflow: hidden;/*text-shadow: 0px 0px 5px #000;*/}

}


.Area_danji_all .Area_coupon {z-index: 1;position: relative;height: auto;margin:0 auto 70px!important;width:100% ; }
.Area_danji_all .Area_coupon .box {z-index: 1;position: relative;margin:2px auto 0px; width:100% ; height:224px ;}
.Area_danji_all .Area_coupon ul {margin-top:0px ;margin-bottom:0px ; display: flex}
@media screen and (max-width:767px){
	.Area_danji_all .Area_coupon {z-index: 1;position: relative;height:auto;margin:0vw auto !important;}
	.Area_danji_all .Area_coupon .box {z-index: 100;top: 0vw;margin:0 auto 0;left: 0vw;width: 100%!important;height:24vw ;}
  .Area_danji_all .Area_coupon ul {display: flex}
}





/*輪播BN*/
.Area_BN1 .swiper_remove_box_style ul li { background-color: #0000!important;margin: 0 3px;}
@media screen and (min-width: 768px){
.Area_BN1 { margin-bottom: 0px!important;height:600px; }
.Area_BN1 .Area_swiper_box { overflow: hidden; }
.Area_BN1 .Area_swiper_box ul {height: 390px;margin-bottom: 20px; }
.Area_BN1 .swiper_remove_box_style ul{height: 408px;margin:0px auto 0px}

}
@media screen and (max-width:767px){
.Area_BN1 {position: relative;margin-bottom: 0vw!important;height:62vw;}
.Area_BN1 .Area_swiper_box ul {height: 39vw;margin-bottom: 2vw; }
.Area_BN1 .swiper_remove_box_style ul{margin:0vw auto 0vw;  height: 40vw;width:96%;}

}







/*下方公版*/
.Area05 .PD_layout ul {border-radius:1px;}
.Area05 .title { /*background: url(titlebg03.png?t=1752718406510)top center no-repeat;*/ background-size: 100%;}
.Area05 .bg_border_01 { border: solid 3px #f5c69d ; border-radius: 3px;/* filter: drop-shadow(0 0 8px #fff);*/}
.Area05 .bg_border_02 { border: solid 3px #f5c69d ; border-radius: 3px;/* filter: drop-shadow(0 0 8px #fff);*/}
.Area05 .bg_border_01 .PD_box { background: #ffef91; border-radius: 3px; padding: 8px;/* box-shadow: inset 0 0 5px #fff;*/}
.Area05 .bg_border_02 .PD_box { background: #f5c69d ; border-radius: 3px; padding: 8px;/* box-shadow: inset 0 0 5px #fff;*/}
.Area05.Area_bottom { margin-bottom: 50px;}
@media screen and (max-width:767px){
  .Area05 .PD_layout ul {border-radius:2vw;}
  .Area05 .bg_border_01 { border-radius: 4vw; width: 96%; margin: 0 auto;}
  .Area05 .bg_border_02 { border-radius: 4vw; width: 96%; margin: 0 auto;}
  .Area05 .bg_border_01 .PD_box { border-radius: 3vw; padding: 2%;}
  .Area05 .bg_border_02 .PD_box { border-radius: 3vw; padding: 2%;}
  .Area05 .bg_border_01 .PD_box ul { width: 100%;}
  .Area05 .bg_border_02 .PD_box ul { width: 100%;}
  .Area05.Area_bottom { margin-bottom: 10vw;}
}



