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

/*基本*/
html, body { margin: 0; padding: 0; background-color: #0f0214;}

@media screen and (max-width: 767px) {
  #gotop {z-index: 999;}
}
/*寬度,間距*/
  @media screen and (max-width:767px){
    .Area1220 { margin:0 auto; width:100%;}
    .Area960 { margin:0 auto; width:100%;}
    .Area_bottom { margin-bottom:5vw!important;}
    .Area_top {margin-top: 5vw!important; }   
  }
  @media screen and (min-width:768px){
    .Area1220 { width:1220px;}
    .Area960 { width:960px;}
    .Area_bottom { margin-bottom:80px!important;}
    .Area_top { margin-top: 80px!important; }
  }
  
/*全BOX版面*/
.WRAPPER { z-index:0; position: relative; display:block; margin: 0 auto; padding:0; overflow:hidden; width:100%; min-width:1220px; text-align:left; font-family:"Century Gothic","Microsoft JhengHei","微軟正黑體", Arial, sans-serif; /*background: url("main_item_bg.jpg?t=1781156211837") no-repeat bottom fixed;*/  }
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none; -webkit-tap-highlight-color: transparent}
/*預設清單樣式*/
.Area .list_00 ul {display:inline-block; margin:0; padding:0;}
.Area .list_00 li {list-style:none;float:left;overflow: hidden;}
	@media screen and (max-width:767px){
		.WRAPPER { padding-bottom:0px; min-width: inherit; min-height:100vh; overflow: hidden; /* background: url("main_item_bg_m.jpg?t=1781156211837") no-repeat bottom fixed; background-size: 100%;*/}
		.WRAPPER img {  width:100%;  height:auto;}
	}

/*fixed背景*/
.bg_01 { z-index:0; position:absolute;top:0;left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; pointer-events:none;}
.bg_02 { z-index:1; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.bg_03 { z-index:-1; position:absolute; top:0px; left:0; width:100%; height:100%; background-repeat:repeat-x; background-position: center top; pointer-events:none;}

  @media screen and (max-width:767px){
  .m_bg01 { z-index:0; position:absolute; top:44px; left: 0; width: 100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%;}
  .m_bg02 { z-index:0; position:absolute; top:122vw; left: 0; width: 100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%;}
  .m_bg03 { z-index:0; position:absolute; top:146vw; left: 0; width: 100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;background-size: 100%;}
		}


@media screen and (min-width: 768px) {
  .btn_list {width: 120px; position: absolute; top: 260px; right: 30px;}
  }
  

/*bn*/
@media screen and (min-width: 768px){  
  .bn img{ border-radius: 20px;}
 }
 @media screen and (max-width:767px){
  .bn img { border-radius: 0.5em }
 }

 /*區標*/
.Area_txt {top:0; left: 0; width: 100%; height:auto; z-index: 1; }
.Area_txt2 {position: absolute; top:0; left: 0; width: 100%; height:auto; z-index: 2; mix-blend-mode: screen;}

/*全背景*/
@media screen and (min-width: 768px){  
  .Area_full .bg {position: absolute; top:60px; left: 0; width: 100%; height:98%; z-index: -2; background-color: rgba(41,89,164,0.4); border-top: #95c7f4 3px solid; border-bottom: #95c7f4 3px solid;}
 }
 @media screen and (max-width:767px){
  .Area_full .bg {position: absolute; top:7vw; left: 0; width: 100%; height:98%; z-index: -2; background-color: rgba(41,89,164,0.4); border-top: #95c7f4 2px solid; border-bottom: #95c7f4 2px solid;}
 }
 
/*版頭背景*/
.Area_bgtop { z-index: 0; position: absolute; top: 0; left: 50%; width: 2000px; -webkit-transform: translateX(-50%); transform: translateX(-50%); pointer-events: none;}
.Area_bgtop .bgtop_ { position: absolute; top: 0; left: 0; width: 100%; height: 1500px;}
.Area_bgtop .bgtop_ span { position: absolute; display: block; width: 100%; height: 100%; background-position: center top;}
.bgdeco { z-index: 5; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgdeco1.png?t=1781156211837) repeat-y center top; transition: 0.5s linear; pointer-events: none;}
.bgdeco1 { z-index: -10; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgdeco2.png?t=1781156211837) repeat-y center top; transition: 0.5s linear; pointer-events: none;}

/*版頭區塊*/
.Area_title img{ width: 100%; }
@media screen and (min-width:768px){
.Area_title {height: 1110px;z-index: 20;}
.date_bg {position: absolute;top: 35px;left: 471px; z-index: -30;width: 12.3%;pointer-events: none;}	
.top_tag {position: absolute;top: 523px;left: 220px;z-index: 50;width: 16%;}
}

@media screen and (max-width:767px){
.Area_title {height: 72vw;}
.top_tag {position: absolute;top: 53.6vw;left: 10vw;z-index: 30;width: 21%;}
}


/*版頭主標微調*/
.Area_title img{width: 100%;border-radius: 0!important;}
.Area_title .PD_layout .PD_slide { min-width:auto; }
.Area_title .PD_layout li { border:none; }
.Area_title .topTitle ul { padding: 0!important;}
.Area_title .topTitle2 ul { padding: 0!important;}
.Area_title .topBg {top: 0; left: 0; position: absolute; z-index:-5;}

@media screen and (min-width: 768px) {
  .Area_title {height: 670px; width: 2000px; }

  .Area_title .topTitle { z-index:1; position: absolute; top:0; left:0; width: 100%; margin-left: 0px;}
  .Area_title .topTitle .lightSweep {width: 960px; position: absolute; margin-left: -520px; top: 0;}

  .Area_title .topPD_01 { z-index:7; position: absolute; top:0; left:0; width: 100%;}
  .Area_title .sub { z-index:5; position: absolute; top:0px; left:0; width: 100%; margin-left: 0px;}
  .Area_title .date { z-index:12; position: absolute; top:0; left:0; width: 100%; margin-left: 0px;}
  .Area_title .m_momo_logo { z-index:1; position: absolute; top:0; left:0; width: 100%;}

  .Area_title .top_front { z-index:11; position: absolute; top:0; left:0; width: 2000px; margin-left: -520px;}
  .Area_title .top_front_light { z-index:11; position: absolute; top:0; left:0; width: 100%; mix-blend-mode: screen;}
  .Area_title .topTitle_light { z-index:11; position: absolute; top:0; left:0; width:960px; mix-blend-mode: screen; }
  .Area_title .top_bg { z-index:-1; position: absolute; top:0; left:0; width: 960px; }

}
@media screen and (max-width:767px){
  .Area_title .topTitle { z-index:1; position: absolute; top:0; left:0; width: 100%;}
  .Area_title .topTitle .lightSweep {width: 100%; position: absolute; top:0; left:0;}

  .Area_title .topPD_01 { z-index:7; position: absolute; top:0; left:0; width: 100%;}
  .Area_title .sub { z-index:5; position: absolute; top: 0vw; left:0; width: 100%;}
  .Area_title .date { z-index:12; position: absolute; top:0; left:0; width: 100%;}
  .Area_title .m_momo_logo { z-index:1; position: absolute; top:0; left:0; width: 100%;} 

  .Area_title .top_front { z-index:11; position: absolute; top:0; left:0; width: 100%; }
  .Area_title .top_front_light { z-index:11; position: absolute; top:0; left:0; width: 100%; mix-blend-mode: screen;}
  .Area_title .topTitle_light { z-index:11; position: absolute; top:0; left:0; width: 100%; mix-blend-mode: screen; }
  .Area_title .top_bg { z-index:-1; position: absolute; top:0; left:0; width: 100%; }

}		

@media screen and (min-width: 768px){
.title {position: relative;z-index: 10;}
.title .PD_layout li:nth-of-type(1) {position: absolute;top: 0px;left: 130px;z-index: 10;width: 960px;}
.title .PD_layout li:nth-of-type(2) {position: absolute;top: 0px;left: 130px;z-index: 11;width: 960px;opacity: 0;}
.title .PD_layout li:nth-of-type(3) {position: absolute;top: 0px;left: 130px;z-index: 10;width: 960px;opacity: 0;}
.title .PD_layout .PD img { width: 100%!important; }
}

@media screen and (max-width:767px){
.title {position: relative;top: 0;left: 0;}
.title .PD_layout li:nth-of-type(1) {position: absolute;top: 0vw;left: 0vw;z-index: 10;width: 100%;}
.title .PD_layout li:nth-of-type(2) {position: absolute;top: 0vw;left: 0vw;z-index: 30;width: 100%;opacity: 0;}
.title .PD_layout li:nth-of-type(3) {position: absolute;top: 0vw;left: 0vw;z-index: 10;width: 100%;opacity: 0;}
.title .PD_layout .PD img { width: 100%!important; }
}


/*副標*/
.sub .PD_layout ul{display: flex;padding: 0;}
@media screen and (min-width: 768px){
.sub {position: absolute;top: 0px;left:130px;width: 960px;height: 1100px;z-index: 30;}	
}
@media screen and (max-width:767px){
.sub {position: absolute;top: 0;left: 0vw;width: 100%;height: 41vw;z-index: 30;}
.sub .PD_layout .PD img {width:100%;padding: 0;}
}


/*提醒我按鈕*/
a.mo_remind_btn { z-index:9999; position: absolute!important; right: 0; top: 88vw; width: 14%;}

/*詳情按鈕*/
@media screen and (min-width: 768px){
  a.more_btn { z-index:99; position: absolute!important; right: 30px; top: 200px; }
}
@media screen and (max-width:767px){
  a.more_btn { z-index:99; position: absolute!important; right: 0; top: 20vw; width: 18%;}
}

/** 倒數 **/
.TimerNick { z-index:0; display:inline-block; padding:0; height:96px; text-align:left; margin-top: 510px; }
.TimerNick .FontStyle { display:inline-block; margin:0px 0 0 0 ; padding:0; border:0px; width:60px; font: bold 35px/38px Century Gothic; color: #fff; /*text-shadow:1px 1px 0px #fff;*/ letter-spacing:-1px; text-align:right; background:transparent; }
.TimerNick div:nth-of-type(2),
.TimerNick div:nth-of-type(3) { width:60px;}
.TimerNick span { font: bold 30px/40px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #fff;}
    @media screen and (max-width:767px){
        .TimerNick { z-index:2; position: relative; top:52.8vw; display:inline-block; margin:0; padding:0; width:100%; overflow:hidden; text-align:center;}
        .TimerNick .FontStyle { display:inline-block; margin:0px 0 0 0 ; padding:0; border:0px; width:1.5em; font: bold 1.5em/1em Century Gothic; color: #fff; /*text-shadow:1px 1px 0px #fff;*/ letter-spacing:-1px; text-align:right; background:transparent;}
        .TimerNick div:nth-of-type(2),
        .TimerNick div:nth-of-type(3) { width:1.5em;}
        .TimerNick span { padding-left:0; font: bold 1.2em/1em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em; color: #fff;}
    }

/* --------------------------------------
* Page 頁籤_202405291900
* -------------------------------------- */
.NavArea_tabbar_page { margin: 0 auto 20px  ; width: 94%; }  
.NavArea_tabbar_page .Nav { overflow: visible; transform: translate3d(-30.5%, 0, 0);}  
.NavArea_tabbar_page .Nav_box { border-radius: 8px; overflow: hidden; padding: 0 2%;}
.NavArea_tabbar_page[data-num="2"] .Nav-wrapper { transform: translate3d(55.5%, 0, 0)!important}
.NavArea_tabbar_page[data-num="3"] .Nav-wrapper { transform: translate3d(43.0%, 0, 0)!important}
.NavArea_tabbar_page[data-num="4"] .Nav-wrapper { transform: translate3d(30.5%, 0, 0)!important}
.NavArea_tabbar_page[data-light="box"] .Nav ul { padding: 0 }
.NavArea_tabbar_page .Nav li { overflow: visible; }
@media screen and (min-width:768px){ 
  .NavArea_tabbar_page { display: block; }
}
/*頁籤高亮顏色設定 */  
.NavArea_tabbar_page .Nav .swiper-slide-active a { color:#fff;}
.NavArea_tabbar_page .Nav .swiper-slide-active i { display:block; border: 1px solid #000000 !important; background-color: #000000 !important;}
/*推編輯按鈕 */  
.NavArea_tabbar_page .Nav input { position: fixed; left: 30%}
                    
  
/*Area_page*/
.Area_page .NavArea .Nav {overflow-y: visible;}
.Area_page .bg {content: ""; position: absolute; display: block; width: 1220px; height: 96%; pointer-events: none; z-index: -30; background-color: #2d298b; border-radius: 42px; margin-top: 62px;}
.Area_page h3 { color: #fff; margin: 0; padding: 0}
.Area_page .PD_layout { width: 96%}
  @media screen and (min-width:768px){ 
  .Area_page { overflow: hidden; /*background-color: #555;*/ padding: 15px 0 ; border-radius: 1em } 
  .Area_page h3 { color: #fff; margin: 0 auto 20px; padding: 0}
  }
  @media screen and (max-width:767px){
  .Area_page .bg {content:""; position: absolute; display:block; margin-top:11vw; margin-left:0; width:100%; height: 95%; pointer-events:none ;z-index: -30; background-color: #2d298b;border-radius: 5vw; }
  .Area_page { width: 100% !important; overflow: hidden; /*background-color: #555;*/ padding: 2vw 0 ; border-radius: 1em } 
  .Area_page h3 { color: #fff; margin: 0 auto 2vw; padding: 0}
  }

  @media screen and (max-width:767px){
  .PD_layout-btn{padding: 2vw 0 0vw;}
}
	/*熱搜好物(6品頁簽)/
.PD_layout-btn li .PD h3 {background: #2d298b;}*/


/*區塊_all*/
.Area2000 { margin:0 auto; width:2000px;}
.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.97);
     -moz-transform:scale(0.97);
      -ms-transform:scale(0.97);
       -o-transform:scale(0.97);
          transform:scale(0.97);}
		  
		  
.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;}
	}


/*置底*/
.fixbn a {padding-bottom:constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
				    padding-bottom:env(safe-area-inset-bottom);}   /* 兼容 iOS >= 11.2 */ 
.fixbn{position:fixed; background-size:100%;bottom:-25vw; display:block; z-index:30;}
.fixbn ul li{float:left;padding:0;list-style-type:none;width:50vw;}
.fixbn ul li img{width:100%;margin:0 auto;}

.fixbn ul{
    margin-top: 0px;
    margin-bottom: 0px;
    padding-left: 0px;
}

/*注意事項區*/
.edm_notice{ text-align:center; padding:10px 10px 70px 10px; color:#fff; font:12px/18px Helvetica;}
.edm_notice .apple_notice{  padding:10px 0px 10px 0px; }


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

/*分享浮層*/
.floatBox { position:relative; margin:2% auto; padding: 2% 0; width: 700px; height:auto; background-color:rgba(0,0,0,0.8); text-align:center;  border-radius:20px;}
.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%;}
	}


/*天天簽到倒數移位*/
@media screen and (max-width:767px){
	.dailytaskArea p{ transform: translateX(-20vw)!important;}
}



/*星星閃*/
@media screen and (min-width:768px){
  .slideshow-container {
          /*position: relative;*/
          width: 1220px; /*設定圖像寬度*/
          height: 470px; /*設定圖像高度*/
          overflow: hidden; /*隱藏溢出內容*/
        }
  }
        .slideshow-container img {
          position: absolute;
          width: 100%;
          height: 100%;
          animation: fadeAnimation 8s infinite; /*啟動動畫效果*/
          animation-timing-function: ease-in-out;
          opacity: 0;
        }
  
        .slideshow-container img:nth-of-type(1) {
          animation-delay: 0s;/*依次播放效果*/
        }
  
        .slideshow-container img:nth-of-type(2) {
          animation-delay: .5s;
        }
  
        @keyframes fadeAnimation {
          0% {
            opacity: 0;
          }
          20% {
            opacity: 0;
          }
          40% {
            opacity: 1;
          }
          60% {
            opacity: 0;
          }
          80% {
            opacity: 1;
          }
          100% {
            opacity: 0;
          } 
          }


/*詳情說明*/
table {	border-collapse: collapse;
	background-color: white;
	margin-left: 2.5%;
    margin-bottom: 2.5%;
    width: 95%;
}

th, td {
	border: 1px solid #ddd;
	padding: 12px 15px;
	text-align: center;
	width: 80px;
	height: 40px;
}

th {
	background-color: #604acd;
	color: white;
	font-weight: bold;
}

tr:nth-child(even) {
	background-color: #f2f2f2;
}

tr:hover {
	background-color: #f5f5f5;
}


/*總票數*/
@font-face { font-family:"BebasNeue-Bold"; src: url(BebasNeue-Bold.otf);}
.Area_votesum { margin-top: 15px; margin-bottom: 50px; z-index: 99;}
.Area_votesum .txt { position:absolute; top:10px; left:98px; }
.Area_votesum .txt span { float:left; display:block; margin-right:14px; width:107px; height:auto; font-size:170px; line-height:185px; color:#000; text-align:center; letter-spacing: 6px;}

.Area_votesum .txt span { text-indent: 7px; font-family:'BebasNeue-Bold';}
/*.Area_votesum .txt span { background-image: url(Area_votesum_numbg.png?t=1781156211837); background-repeat: no-repeat; background-size: 100%;}*/
    @media screen and (max-width:767px){
      .Area_votesum { margin-bottom:10px;}
      .Area_votesum .txt { position:absolute; top:2.5vw; left:34.4vw; }
      .Area_votesum .txt span { margin-right:1.4vw; width:11.2vw; height:20vw; font-size:5em; line-height:20vw;text-indent: 0; letter-spacing: -0.01em;}
    }

  
/*篩選按鈕樣式*/
.box_tab { position: absolute; top: 0px; right: 23px;}
    @media screen and (max-width:767px){
			.box_tab { position: absolute; top:13vw; right:0;}
    }


/*人氣戰況*/
.Area_topone { margin-top: 65px;}
.Area_topone .btn_toplost {position:absolute; top:46px; right:21px; }
.Area_topone .btn_toplost a { padding:0;}
.Area_topone .box_cards li:first-child { margin-left:0; background: url("pop01.png?t=1781156211837") center top no-repeat;}
.Area_topone .box_cards li:nth-child(2) { background: url("pop02.png?t=1781156211837") center top no-repeat;}
.Area_topone .box_cards li:nth-child(3) { background: url("pop03.png?t=1781156211837") center top no-repeat;}
/* .Area_topone .box_cards li:nth-child(4) { background: url("pop04.png?t=1781156211837") center top no-repeat;} */
    @media screen and (max-width:767px){
			.Area_topone { margin-top: 5vw;}
			.Area_topone .btn_toplost {top:0.2%;right: 1.5%;width:32%;}
			.Area_topone .btn_toplost img { width:100%;}
    }
		
		

		/*.Area_topone .box_cards li:after  {content: ""; pointer-events: none; z-index: -2; position: absolute; top: 8px; left: 7px; display: block; width: 97%; height:calc(100% - 8px);}*/
		  .Area_topone .box_cards .cardstyle_ .cubeCard { position:relative; margin:0; padding:0; width:100%; height:auto; /*border:solid 1px #ffe0c2;*/ /*background-color:#ffdccc;*/  }
		/*.Area_topone .box_cards .cardstyle_ .cubeCard:after  {content: ""; pointer-events: none; z-index: 1; position: absolute; top: 0; left:0; display: block; width: 100%; height:100%; background-image:url(deco-lineA.png?t=1781156211837); background-position:center; background-size:100%; background-repeat:no-repeat;}*/
		
			/*排名*/
			.Area_topone .box_cards .cardstyle_ .topone_icon { z-index:1; position:absolute; top:-83px; left:100px; color:#FFF; font-size:28px; font-family: 'Century Gothic'; line-height:39px;font-weight:600;}
			.Area_topone .box_cards .cardstyle_ .topone_icon:before { content:""; display:block; position:absolute; top:15px; left:-47px; width:56px; height:43px; background-image:url(top_icon.png?t=1781156211837); background-position:center; background-size:100%; background-repeat:no-repeat;}
			
			/*照片*/
			.Area_topone .box_cards .cardstyle_ .card_img { z-index:2; position:relative; margin:30% 17.5% 2% 17.5%; padding:0; width:65%; height:auto; border-radius: 50%; border:solid 1px #ffe0c2; overflow: hidden;}
			.Area_topone .box_cards .cardstyle_ .card_img img { width:100%; height: auto; margin: 0 auto;}
			
			/*文字*/
			.Area_topone .box_cards .cardstyle_ h4 { position:relative; z-index:3; font-size: 36px; margin: 0 auto; padding:0; width:60%; color: #fff;  }
			.Area_topone .box_cards .cardstyle_ h4 > span { font-size: 36px;}
			.Area_topone .box_cards .cardstyle_ h5 { position:relative; z-index:3; margin: 0 auto; padding: 0; width:66%; color: #fff;}
			.Area_topone .box_cards .cardstyle_ h5 > span { font-size: 28px; font-weight: 500;}
      .Area_topone .box_cards { position:relative; margin:0 auto; padding:0;  box-sizing:border-box;}
		  .Area_topone .box_cards ul { margin:0 auto; padding:0 0 0 158px; list-style:none;width: 100%;}
		  .Area_topone .box_cards ul:after { content: ""; display: block; clear: both;}
      .Area_topone .box_cards .cardstyle_ h4 b { position: absolute; top: -76px; left: -40px; font-size: 30px; font-weight: 800;}
      .Area_topone .box_cards .cardstyle_ h4 b span { font-size: 35px; font-weight: 300; font-family:'Century Gothic';}
		  .Area_topone .box_cards li {float: left;z-index: 0;position: relative; margin: 0 0 0 21px; padding:0; box-sizing: border-box; width: 288px; height: 443px; text-align: center; letter-spacing: -0.05rem;
																			-webkit-transition: all 0.3s ease;
																			-moz-transition: all 0.3s ease;
																			-ms-transition: all 0.3s ease;
																			-o-transition: all 0.3s ease;
																			transition: all 0.3s ease;}
			/*票數*/
			.Area_topone .box_cards .cardstyle_ h6 { margin: 0 auto; padding:3.5% 0 0 0 ; color: #fff; font-size: 24px; font-weight: 700; text-align: center; }
			.Area_topone .box_cards .cardstyle_ h6 span { position: relative; margin-right:0; top: 1px; font-size: 30px; font-family:'Century Gothic'; font-weight:300; letter-spacing: 0.1rem;}
            
      .Area_topone .box_cards li:after  { width: 0; height: 100%;}
		
           @media screen and (max-width:767px){
					.Area_topone .box_cards {}
			        
					.Area_topone .box_cards ul { padding:0 3%;}
					.Area_topone .box_cards li {margin-left: 1%;padding: 0;width: 31.6%;height:53vw;text-align: left;background-size: 100%!important; }

						/*排名*/
						.Area_topone .box_cards .cardstyle_ .topone_icon { z-index:1; position:absolute; top:1.5%; left:53%; font-size:16vw; line-height:14.5vw;display: none;}
						.Area_topone .box_cards .cardstyle_ .topone_icon:before { content:""; display:block; position:absolute; top:1.5vw; left:-7.5vw; width:47%; height:40%; }
						/*文字*/
			      .Area_topone .box_cards .cardstyle_ h4 b span { font-size: 25px;}
	          .Area_topone .box_cards .cardstyle_ h4 b { position: absolute; top: -18vw; left: -18vw; font-size: 20px; font-weight: 800;}
						.Area_topone .box_cards .cardstyle_ h4 {width: 100%;height: 7vw;font-size: 4vw;word-break: break-all;text-align: center;}
						.Area_topone .box_cards .cardstyle_ h4 > span {font-size: 5vw;line-height:1.2;position: absolute;top:-150%;left: -30%; }
						.Area_topone .box_cards .cardstyle_ h5 {width:65%;height: 8.5vw;text-align: center;color: #000;position: absolute;top:70%;left:15%;}
						.Area_topone .box_cards .cardstyle_ h5 > span {font-size: 5.5vw;letter-spacing:0;}
						/*票數*/
						.Area_topone .box_cards .cardstyle_ h6 {position: relative;top:-9%;left:0;width:96%;padding:0 0 0 0;font-size: 4.5vw;text-align: center;overflow:visible;}
						.Area_topone .box_cards .cardstyle_ h6 span {top: 5%;font-size: 6.5vw;font-family:'Century Gothic';font-weight:300;letter-spacing: 0.01rem;}
				}



/*集氣抽大獎*/ 
.Area_strategy{position:relative;margin-top: 157px;}
.Area_strategy .box_title{position:absolute; top:-146px;}
.Area_strategy .step{ margin-top: 20px;}
.Area_strategy .arrow{position:absolute; top:129px;left: 364px;}
    @media screen and (max-width:767px){
    .Area_strategy{position:relative;margin-top: 17vw;}
    .Area_strategy .box_title{position:absolute; top:-14vw;}
    .Area_strategy .step{ margin-top: 2vw;}
    .Area_strategy .arrow{position:absolute; top:29vw;left: 41vw;width: 14%;}
}

/*投票區*/ 
.Area_vote { position: relative; margin:300px auto 0 auto;}

.Area_vote .Area_boxstyle_box { padding-top:115px; padding-bottom:50px;}
	 @media screen and (max-width:767px){
		.Area_vote { margin-top: 27vw; } /*有注意事項時margin-bottom:50px;*/

		.Area_vote .Area_boxstyle_box { padding-top:11vw; padding-bottom:6vw}
	 }
    /*搜尋*/
    .Area_vote .box_search {position: relative; top: 0px; margin: 0 auto;}
	  .Area_vote .box_search .txt_01 { margin:0; margin-right:25px; padding:0; color:#ffdccb; font-size:30px; font-family:'Century Gothic',"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; vertical-align:top;}
    .Area_vote .box_search .input { position:relative; display:inline-block; width:320px; overflow:hidden; color:#a30b5e; text-align:left; background-color:#ffffff; }
    .Area_vote .box_search .input input { margin:0; padding:0 10px; border: none; width:80%; height:40px; font-size:18px; font-weight: 800; line-height:40px; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; text-align:left;}
    .Area_vote .box_search .input input { -webkit-appearance: none;	/* Safari 和 Chrome，常用於iOS下移除內建樣式 */ 
                                          -moz-appearance: none;	/* FireFox */
                                               appearance: none;
                                               outline:none; /*取消選取藍框*/}
    .Area_vote .box_search .input input::-webkit-input-placeholder { color: #5e5e5e;}
    .Area_vote .box_search .input input:-ms-input-placeholder { color: #5e5e5e;}
    .Area_vote .box_search .input input::-moz-placeholder { color: #5e5e5e;}
    .Area_vote .box_search .input input:-moz-placeholder { color: #5e5e5e;}
    .Area_vote .box_search .input input::placeholder { color: #5e5e5e;}  
    .Area_vote .box_search .input a { z-index:1; position:absolute; top:0; right:0; padding:0; width:20%; height:100%; font-size:22px; font-weight: 800; line-height: 40px; color:#fff; text-align:center; background-color: #666;}
    .Area_vote .box_search .input a:hover { background-color:#de660e;}
        @media screen and (max-width:767px){
          .Area_vote .box_search {position: relative;margin: 0 ;padding: 0; width: 100%; top:0vw; left: 0vw;}
		      .Area_vote .box_search .txt_01 { margin-right:0; font-size:4.5vw;}
          .Area_vote .box_search .input { margin-top:1vw; width: 86%; }
          .Area_vote .box_search .input input { padding:0 2vw; height: 9vw; font-size:4vw; line-height: 9vw;}
          .Area_vote .box_search .input a { font-size: 4.2vw; line-height: 9vw; }
        }
				
    /*卡片樣式*/
    .Area_vote .box_cards { padding: 0;}
    .Area_vote .box_cards ul { margin: 50px 0 0 0; list-style: none;}
    .Area_vote .box_cards ul:after { content: ""; display: block; clear: both;}
    .Area_vote .box_cards li {float: left; z-index: 0; position: relative; margin: 0; margin-left:15px; margin-bottom: 20px; padding: 0; box-sizing: border-box; overflow: hidden; width: 288px; height: 500px; text-align: center; /*background-color: #c56cac;*/ letter-spacing: -0.05rem; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; 
															}  
   /* .Area_vote .box_cards li:hover { box-shadow: 0 0 14px rgba(0,0,0,0.3);}*/
    .Area_vote .box_cards li:nth-last-of-type(3n+1) {  }
		/*.Area_vote .box_cards li .conbox_bg { overflow: hidden; z-index: -1; display: block; position: absolute; top: 0%; left: 0%;}*/
		/*.Area_vote .box_cards li .conbox_bg:after { content: ""; pointer-events: none; z-index: 1; position: absolute; top: 0; left:0; display: block; width: 100%; height:100%; background-image:url(deco-lineB.png?t=1781156211837); background-position:center top; background-size:100%; background-repeat:no-repeat;}*/
.Area_vote .box_cards .cardstyle_A {background: url(conbox_bg.png?t=1781156211837) center top no-repeat; background-size:100%; }
.Area_vote .box_cards .cardstyle_B {background: url(conbox_bg.png?t=1781156211837) center top no-repeat;background-size:100%; }
.Area_vote .box_cards .cardstyle_C {background: url(conbox_bg.png?t=1781156211837) center top no-repeat;background-size:100%; }
.Area_vote .box_cards .cardstyle_D {background: url(conbox_bg.png?t=1781156211837) center top no-repeat;background-size:100%; }

 @media screen and (max-width:767px){
          .Area_vote .box_cards {}
		      .Area_vote .box_cards ul { position: relative; margin: 5vw 0 0 0; padding:0 1%; list-style: none;}
          .Area_vote .box_cards li { margin-left: 0%; margin-bottom: 0%; padding: 0; width: 32%; height:58vw; }
          .Area_vote .box_cards li:nth-of-type(3n+1) { }
          .Area_vote .box_cards li:nth-of-type(1n+1) { margin-left: 1%;}
		  	/*	.Area_vote .box_cards li .conbox_bg {width: calc(100% - 3vw); height: calc(100% - 3vw); background-image: radial-gradient(rgba(255,199,173,0.5) 25%, transparent  0); background-size: 4px 4px;}*/
        }
        /*資料*/
        .Area_vote .box_cards .cardstyle_ .card_into { position: relative; top: 0; width: 100%; height:auto; overflow: hidden; }
        .Area_vote .box_cards .cardstyle_ .card_into:before,
        .Area_vote .box_cards .cardstyle_ .card_into:after { content: "";pointer-events: none;z-index: -2;position: absolute;top: 0;left: 0;display: block;width: 100%;height: 76%;}
        .Area_vote .box_cards .cardstyle_ .card_into:before { }
        .Area_vote .box_cards .cardstyle_ .card_into:after  { top: 0;left: 0; border-bottom: none;}
        .Area_vote .box_cards .cardstyle_ .card_into .card_img { padding:0; width: 77%; height: 168px; display: block; overflow: hidden; margin: -8% auto 0 auto;}


        .Area_vote .box_cards .cardstyle_ .card_into .card_img img { margin: 0; width: 100%; height: auto;}
		    .Area_vote .box_cards .cardstyle_ .card_into h3 {margin: 0 auto;padding: 10px 0 0 0;font-size: 35px;line-height: 40px;color: #ffffff;letter-spacing: 0;text-align: center;height: 46px;overflow:hidden;top:296px;}
		    .Area_vote .box_cards .cardstyle_ .card_into h4 {margin: 0 auto; padding:0; font-size: 30px; line-height: 40px; color: #ffffff; letter-spacing: 0; text-align: center; width: 80%;}
        .Area_vote .box_cards .cardstyle_ .card_into h5 { margin: 0; padding: 22px; height:40px; color:#efb956; font-size: 40px; line-height:20px; font-weight: bold; letter-spacing:0px; overflow:hidden; font-style: italic;}
        .Area_vote .box_cards .cardstyle_ .card_into h5 > span { /*margin-left:28%;*/ /*position: absolute;top: 11%;left: 25%;*/}
        .Area_vote .box_cards .cardstyle_ .card_into h6 { position: relative; margin: 0; padding: 12px 0 0 0; color: #efb956; font-size: 28px;  line-height: 100px; height:145px; text-align: right; overflow:hidden; width: 88%;}
        .Area_vote .box_cards .cardstyle_ .card_into h6 > span { position:absolute; top:0; right:12%; font-size: 77px; font-family: 'BebasNeue-Bold'; font-weight: bold; letter-spacing: 2px; color: #efb956;   }


        .Area_vote .box_cards .cardstyle_ .card_into .card_into_bg { z-index: -1; position: absolute; bottom: 0; right: 0; display: block; width: 74%; height: 17%; background-color: #fff; background-image: radial-gradient(#ccc 1px, transparent 2px); background-size: 14px 14px; background-position: 0 0;}
        /*.Area_vote .box_cards .cardstyle_ .card_into .card_img {  -webkit-transition: all 0.3s ease;
                                                                     -moz-transition: all 0.3s ease;
                                                                      -ms-transition: all 0.3s ease;
                                                                       -o-transition: all 0.3s ease;
                                                                          transition: all 0.3s ease;}  
        .Area_vote .box_cards .cardstyle_ .card_into h3 .vote_icon1,
        .Area_vote .box_cards .cardstyle_ .card_into .card_into_bg {  -webkit-transition: all 3s ease;
                                                                         -moz-transition: all 3s ease;
                                                                          -ms-transition: all 3s ease;
                                                                           -o-transition: all 3s ease;
                                                                              transition: all 3s ease;}  
        .Area_vote .box_cards .cardstyle_:hover .card_into .card_img {transform: translateY(1%);}
        .Area_vote .box_cards .cardstyle_:hover .card_into h3 .vote_icon1 { background-position: 0 65px;}
        .Area_vote .box_cards .cardstyle_:hover .card_into .card_into_bg { background-position: -100px 0;}*/
				.Area_vote .box_cards .cardstyle_ .card_into .picPlay i:before,
				.Area_vote .box_cards .cardstyle_ .card_into .picPlay i:after {  -webkit-transition: all 3s ease;
                                                                          -moz-transition: all 3s ease;
                                                                           -ms-transition: all 3s ease;
                                                                            -o-transition: all 3s ease;
                                                                               transition: all 3s ease;}
				.Area_vote .box_cards .cardstyle_:hover .card_into .picPlay i { background-color:#f5b32b;}
				.Area_vote .box_cards .cardstyle_:hover .card_into .picPlay i:before { width:115%; height:115%; border: 1px solid #f5b32b;}
				.Area_vote .box_cards .cardstyle_:hover .card_into .picPlay i:after { width:130%; height:130%;  border: 1px solid #f5b32b;}

        @media screen and (max-width:767px){
              .Area_vote .box_cards .cardstyle_ .card_into h3 {margin: 0 auto;padding: 1vw 0 0 0;font-size: 5vw;line-height: 6vw;color: #ffffff;letter-spacing: 0;text-align: center;height: 7vw;overflow:hidden;top:38vw;}				
              .Area_vote .box_cards .cardstyle_ .card_into h4 {padding: 0; font-size: 1.2em; line-height: 1em; height:2.8em; overflow: hidden;}
              .Area_vote .box_cards .cardstyle_ .card_into h4 > span {  }
							.Area_vote .box_cards .cardstyle_ .card_into h5 {margin: 0; padding: 2vw; height: 1.4em; font-size: 1.4em; line-height:0.8em; font-weight: bold; letter-spacing:0; }
							.Area_vote .box_cards .cardstyle_ .card_into h5 > span {  }
							.Area_vote .box_cards .cardstyle_ .card_into h6 {  padding: 0; font-size: 1em; line-height: 3em; height: 18vw; top:-3vw;}
        			.Area_vote .box_cards .cardstyle_ .card_into h6 > span { top:0; left:5%; font-size: 2.6em; letter-spacing: 0; font-family: 'BebasNeue-Bold'; font-weight: bold; text-shadow: 0 0 0 #1a1a47; width: 80%; }

							.Area_vote .box_cards .cardstyle_ .card_into .picPlay { padding:0 5%; bottom:4%;}
              .Area_vote .box_cards .cardstyle_ .card_into .card_img { padding:0; width: 77%; height: 18vw; display: block; overflow: hidden; margin: -8% auto 0 auto;}
            }
				
					
						
        /*按鈕*/
        .Area_vote .box_cards .cardstyle_ .card_btns { position: relative; display: block; margin: -7.5% auto 0; padding:0 ; text-align:center;}
        .Area_vote .box_cards .cardstyle_ .card_btns:after { content: ""; display: block; clear: both;}
        .Area_vote .box_cards .cardstyle_ .card_btns .btn_ { display: inline-block; position: relative; margin: 0; width: 48%;}
        .Area_vote .box_cards .cardstyle_ .card_btns .btn_vote {}
        .Area_vote .box_cards .cardstyle_ .card_btns .btn_:hover { filter: brightness(120%);}
        .Area_vote .box_cards .cardstyle_ .card_btns .btn_ a { display: block; padding-top: 3px; padding-bottom:4px; font-size: 28px; line-height:44px; font-weight: 800; color: #fff;}
				.Area_vote .box_cards .cardstyle_ .card_btns .btn_vote { width: 100%; position:absolute; bottom:-70px; right:0;} 			
				.Area_vote .box_cards .cardstyle_ .card_btns .btn_vote a { width: 100%; margin: 0 auto;}
				.Area_vote .box_cards .cardstyle_ .card_btns .btn_vote a img { width: 100%;margin-top:7px; }
            @media screen and (max-width:767px){
              .Area_vote .box_cards .cardstyle_ .card_btns {position: absolute; top:84%;width: 120%;left:-5vw; }
              .Area_vote .box_cards .cardstyle_ .card_btns .btn_ { }
              .Area_vote .box_cards .cardstyle_ .card_btns .btn_ a {  width: 100%; padding-top: 0vw; }
              .Area_vote .box_cards .cardstyle_ .card_btns .btn_vote { width: 100%; position:absolute;bottom:-10vw;right:0;} 			
              .Area_vote .box_cards .cardstyle_ .card_btns .btn_vote a img { width: 100%;margin-top: 2vw; }
            }


    /*看更多*/
    .btn_cardmore { width:85%; margin:0 auto;
						-webkit-transform: translateY(0%); transform: translateY(0%);
								-webkit-transition: all 0.3s ease;
									 -moz-transition: all 0.3s ease;
										-ms-transition: all 0.3s ease;
										 -o-transition: all 0.3s ease;
												transition: all 0.3s ease;}
	.btn_cardmore img { width:100%;}
    .btn_cardmore:hover { -webkit-transform: translateY(6px); transform: translateY(6px); filter: brightness(120%);}
        @media screen and (max-width:767px){
					.btn_cardmore { width:95%; margin:1vw auto;}
        }



/*詳情投票總數位置調整*/
.Area_votesum { margin-top: 0px;  margin-bottom: 0px;}
.Area_votesum .txt { position:absolute; top:22px; left:87px; }
  @media screen and (max-width: 767px){
	  .Area_votesum { margin-top: 0; margin-bottom: 0;}
    .Area_votesum .txt { position:absolute; top:0; left:9vw; }
  }

.box_cards_for_tame .cardstyle_A .card_into .card_img:after {content: ""; position: absolute; top: 0; left: 0; display: block; width: 150px; height: 44px; background-image: url(mark_A.png?t=1781156211837); background-repeat: no-repeat; background-size: 100%; pointer-events: none;}
.box_cards_for_tame .cardstyle_B .card_into .card_img:after {content: ""; position: absolute; top: 0; left: 0; display: block;  width: 150px; height: 44px; background-image: url(mark_B.png?t=1781156211837); background-repeat: no-repeat; background-size: 100%; pointer-events: none;}
  @media screen and (max-width: 767px){
	.box_cards_for_tame .cardstyle_A .card_into .card_img:after, .box_cards_for_tame .cardstyle_B .card_into .card_img:after{width: 34%; height: 22%;}
  }


/*手機紀錄查詢*/
.fixedfooterArea {z-index: 201; position: fixed; left: 0px; right: 0px; width: 124px; height: 34px; text-align: center; font-size: 14px; line-height: 34px; color: rgb(0, 0, 0); font-family: 微軟正黑體, "Microsoft JhengHei", Arial; background-color: rgba(0, 0, 0, 0); bottom: calc(145px + env(safe-area-inset-bottom) * .6); margin: auto; padding: 0px;}
.fixedfooterArea a { display: block; color: #454545; text-decoration: none;}
.fixedfooterArea .fixedBox_1 ul { position: relative; margin: 0; padding: 0; width: 100%; list-style: none outside none; white-space: nowrap;}
.fixedfooterArea .fixedBox_1 ul li { z-index: 1; position: relative; display: inline-block; padding: 0; border-radius: 44px; height: 34px; -webkit-box-shadow: 0 1px 0 #f2f2f2, 0 0 10px rgba(0, 0, 0, .2); box-shadow: 0 1px 0 #f2f2f2, 0 0 10px rgba(0, 0, 0, .2); background-color: hsla(0, 0%, 100%, .95);}
.fixedfooterArea .fixedBox_1 ul li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 24px 0 20px;}
.fixedfooterArea .fixedBox_1 ul li a span { width: 24px; height: 24px; background-image: url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2034%2034%22%20style%3D%22enable-background%3Anew%200%200%2034%2034%3B%22%20xml%3Aspace%3D%22preserve%22%3E%20%3Cg%3E%20%3Cg%3E%20%3Crect%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3Anone%3B%22%20width%3D%2234%22%20height%3D%2234%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3Cg%3E%20%3Cg%3E%20%3Cpath%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3A%23000%3B%22%20d%3D%22M29.3%2C11.9c0.4-0.6%2C0.5-1.3%2C0.3-1.9c-0.2-0.6-0.6-1.2-1.3-1.5l-3.7-2c-0.6-0.3-1.4-0.4-2.1-0.2%20c-0.7%2C0.2-1.3%2C0.6-1.6%2C1.2l-0.5%2C0.8l-1.8%2C2.8L14%2C18.3l-0.5%2C0.8l-0.6%2C8.2h-8v1.7h19.4v-1.7h-8.6l6.2-3.8%20C24.4%2C19.6%2C26.9%2C15.7%2C29.3%2C11.9z%20M22.6%2C8.3C22.7%2C8.2%2C22.8%2C8%2C23%2C8c0.2%2C0%2C0.4%2C0%2C0.6%2C0.1l3.7%2C2c0.2%2C0.1%2C0.3%2C0.3%2C0.4%2C0.4%20c0.1%2C0.2%2C0%2C0.4-0.1%2C0.5l-0.5%2C0.8L22%2C9.2L22.6%2C8.3z%20M20.9%2C10.9l1.1%2C0.6l-4.3%2C6.8l-1.1-0.6L20.9%2C10.9z%20M17.2%2C24.2l-2.1-1.1l0.3-3.7%20c0.8%2C0.3%2C1.6%2C0.9%2C2.3%2C1.8c1.2%2C0%2C2.3%2C0.2%2C3.1%2C0.8L17.2%2C24.2z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E);}