@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=1776234046237)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: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgfixed.jpg?t=1776234046238) 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=1776234046238) 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=1776234046238) 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=1776234046238) 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=1776234046238) 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 -10px;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%}
}

/* 共用背景 */
.Area .bg_repeat { border: solid 6px #d3b0fc;margin:0px  auto ;width:941px ;  border-radius: 0px 0px 30px 30px ;/* filter: drop-shadow(0 0 8px #0066ff)*/;padding:  0px 0px;}
.Area .bg_repeat .PD_box { background: #6a33b6 ; border-radius: 0px 0px 26px 26px;margin:0px  auto ;width:881px ; padding: 30px;/* box-shadow: inset 0 0 10px #fff;*/}

@media screen and (max-width:767px){
  .Area .bg_repeat { border-radius:  0vw 0vw 3vw 3vw ; width: 98%; margin: -1vw auto 0;border: solid 3px #d3b0fc ;/* filter: drop-shadow(0 0 8px #0066ff)*/;padding: 0vw;}
  .Area .bg_repeat .PD_box {width: 96%; border-radius: 0vw 0vw 3vw 3vw ; padding: 2%;background: #6a33b6  ;/* box-shadow: inset 0 0 10px #fff;*/}
  .Area .bg_repeat .PD_box ul { width: 100%;}
}

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

/* 共用樣式 */
.pointer-off ul li{ pointer-events: none;}

/*版頭*/
.Area_top { height:617px; }
.Area_top .toptitle {z-index:1;position: absolute;top: 110px;left: 113px;width: 72%;}
.Area_top .linelogo { z-index:1;position: absolute; top:18px; left:441px; width:331px; }
.Area_top .logo { z-index:25;position: absolute; top:53px; left:325px; width:34%; }
.Area_top .date {z-index:25;position: absolute;top: 72px;left: 665px;width:17.2%;}
.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:80vw; }
  .Area_top .Area960 { width: 100%;}
  .Area_top .toptitle {z-index: 11;position: absolute;top:19vw;width: 81%;left: 6.8vw;}
  .Area_top .logo {z-index: 25;position: absolute; top:11.5vw; width:35%;left:32vw;}
  .Area_top .date {z-index: 25;position: absolute; top:18vw;width:17%;left:70vw;}
  .Area_top .linelogo {z-index: 11; position: absolute; top:3vw; width:32%;left:34vw;}
  .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%;}
}

/* 版頭特標輪播 */
.Area_top .mainsubtitle {position: absolute;top: 386px;width: 102%;left: 27px;z-index: 1;}
.Area_top .mainsubtitle img { width: 94%;}
.Area_top .mainsubtitle ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; grid-gap: 0; box-sizing: content-box; height: 166px;}
.Area_top .mainsubtitle ul.PD_wrapper li { position: relative; flex-shrink: 0; margin: 0; padding: 0; background-image: none;}
@media screen and (max-width:767px){
  .Area_top .mainsubtitle {top: 43.5vw;left: -7%;width: 100%;z-index: 1;}
  .Area_top .mainsubtitle img { width: 100vw;}
  .Area_top .mainsubtitle ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; grid-gap: 0; box-sizing: content-box; height: 166px;}
  .Area_top .mainsubtitle ul.PD_wrapper li { position: relative; flex-shrink: 0; margin: 0; padding: 0; background-image: none;}
}


/*版頭品*/
@media screen and (min-width:768px){
.Area_top .layout_topPD  {position:absolute;width:95%;top:488px;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 .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_danji .danji_box ul li .activityText .gifts span { color: #ffed57;}                 
                    

/*登記活動*/
.Area02 .title {  background-size: 100%; margin: 0 auto -7px;left:1px;}
.Area02 .Area_danji .danji_box { width: 100%;}
.Area02 .warningTxt h3 { padding: 0;}
.Area02 .Area_sectionTitle ul {position: relative;padding: 0;margin: 0 auto;list-style: none;height: 75px!important;top:0px;}
.Area02 .Area_sectionTitle ul li { background-color: transparent; pointer-events: none;}
.Area02 .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:#ffe450;letter-spacing: 0px;overflow: hidden;/*text-shadow: 0px 0px 5px #000;*/}

@media screen and (max-width:767px){
  .Area02 {}
  .Area02 .title {  background-size: 100%;; margin: 0 auto -5vw;}
  .Area02 .Area_sectionTitle ul {padding: 0;margin: 0vw auto 0vw;list-style: none;}
  .Area02 .Area_sectionTitle ul li { background-color: transparent; pointer-events: none;}
  .Area02 .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:#ffe450;letter-spacing: 0px;overflow: hidden;/*text-shadow: 0px 0px 5px #000;*/}
}

/* 人氣 */
.Area03{}
@media screen and (max-width:767px){
  .Area03{}
}


/* 好評 */
.Area04 .title {  background-size: 100%; margin: 0 auto -7px; left:1px;}
@media screen and (max-width:767px){
  .Area04 .title {  background-size: 100%;; margin: 0 auto -4vw;}
}

.Area_logo .PD_layout{ padding: 0 30px;}
.Area_logo ul li{ padding: 0 10px;}
@media screen and (max-width:767px){
  .Area_logo .PD_layout{ padding: 0 1vw;}
  .Area_logo ul li{ padding: 0 1vw;}
}