*{
	margin: 0;
	padding: 0;
	list-style:none;
	text-decoration: none;
	box-sizing: border-box;
	font-family: 'Noto Serif TC', serif;
	/* font-family: 'Noto Sans TC', sans-serif; */
}
:root {
    --swiper-theme-color: #000;
}
html{
	position: relative;
	height: 100%;
	width: 100%;
	font-size: 1.2rem;
	/* border: 1px solid #000; */
}
body{
	position: relative;
	margin: 0 auto;
	width: 100%;
	height: 100%;
	background-color: #f4f4f4;
}
p{
	margin: 0 0 0px;
}
a{
	outline: none;
	text-decoration: none;
}
button{
	font-family: 'Noto Sans TC', sans-serif;
}

.share-line {
    position: absolute;
    display: block;
    z-index: 1;
    opacity: 0;
}
.page{
	position: relative;
	display: block;
	width: 100%;
	top: 0;
	overflow: hidden;
}
.nav_bar,.page_main_area,.page,.footer{
	-webkit-animation: first_fadein_ani 0.5s 0.5s forwards ease-in-out;
	-moz-animation: first_fadein_ani 0.5s 0.5s forwards ease-in-out;
	-ms-animation: first_fadein_ani 0.5s 0.5s forwards ease-in-out;
	animation: first_fadein_ani 0.5s 0.5s forwards ease-in-out;
	opacity: 0;
}
@-webkit-keyframes first_fadein_ani{
	0%{opacity:0;}
	100%{opacity:1;}
}
@-moz-keyframes first_fadein_ani{
	0%{opacity:0;}
	100%{opacity:1;}
}
@-o-keyframes first_fadein_ani{
	0%{opacity:0;}
	100%{opacity:1;}
}
@-ms-keyframes first_fadein_ani{
	0%{opacity:0;}
	100%{opacity:1;}
}
@keyframes first_fadein_ani{
	0%{opacity:0;}
	100%{opacity:1;}
}

/*modal loading gif*/
.loading_gif{
	position: relative;
	display: block;
	margin: 0 auto;
	width: 20%;
}

/*jquery ui*/
.ui-loader{
	display: none;
}

/*gsap 動畫 class*/
.gs_reveal {
	opacity: 0;
	visibility: hidden;
}
.img_reveal{
	opacity: 0;
	visibility: hidden;
}

/*fixed area*/
.fixed_area{
	position: fixed;
	display: none;
	z-index: 10;
	top: 50%;
	right: 0%;
	text-align: center;
}
.fixed_area > a{
	position: relative;
	display: block;
	padding: 1rem 0.1rem;
	text-align: center;
	overflow: hidden;
	text-decoration: none;
}
.fixed_area p{
	position: relative;
	display: block;
	color: #000;
	font-size: 1.1rem;
	z-index: 2;
}
.goToTop_btn{
	position: relative;
	display: block;
	margin: 0 auto;
}
.goToTop_btn img{
	width: 5rem;
}

/*隱藏區塊有*/
/* .page3,.page9,.public_election_result_box{
	display: none !important;
} */

/*page_main_area*/
.page_main_area{
	position: relative;
	display: block;
	width: 100%;
	/* border: 1px solid #f00; */
	overflow: hidden;
}
.page_main_bg{
	position: absolute;
	display: block;
	z-index: 1;
	top: 0;
	width: 100%;
	height: 100%;
	background: url('../img/page1_main_bg.png') center center no-repeat;
	background-size: cover;
	/* transform: scale(1,1);
    -webkit-animation: page1_bg_ni 13s forwards linear;
	-moz-animation: page1_bg_ni 13s forwards linear;
	-ms-animation: page1_bg_ni 135s forwards linear;
	animation: page1_bg_ni 13s forwards linear; */
	
	/* ▼讓文字消失 */
	text-indent: 101%;
	overflow: hidden;
	white-space: nowrap;

	mask: linear-gradient(0deg, transparent 0%, #000 10%, #000 100%);
	-webkit-mask: linear-gradient(0deg, transparent 0%, #000 10%, #000 100%);
}
@-webkit-keyframes page1_bg_ni{
	0%{
        transform: scale(1,1);
    }
    100%{
        transform: scale(1.15,1.15);
    }
}
@-moz-keyframes page1_bg_ni{
    0%{
        transform: scale(1,1);
    }
    100%{
        transform: scale(1.15,1.15);
    }
}
@-o-keyframes page1_bg_ni{
	0%{
        transform: scale(1,1);
    }
    100%{
        transform: scale(1.15,1.15);
    }
}
@-ms-keyframes page1_bg_ni{
	0%{
        transform: scale(1,1);
    }
    100%{
        transform: scale(1.15,1.15);
    }
}
@keyframes page1_bg_ni{
    0%{
        transform: scale(1,1);
    }
    100%{
        transform: scale(1.15,1.15);
    }
}

/*page1*/
.page1{
	position: relative;
	display: block;
	width: 100%;
	z-index: 3;
	/* border: 1px solid #f00; */
}
.logo{
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
    height: 78%;
	margin-top: auto;
	margin-bottom: auto;
}
.logo1{
	width: 4%;
	z-index: 3;
	margin-left: 4rem;
	background: url('../img/bt_logo.png') center center no-repeat;
	background-size: contain;
}
/* .logo2{
	width: 7%;
	z-index: 3;
	margin-left: 11rem;
	background: url('../img/life_logo.png') center center no-repeat;
	background-size: contain;
} */
.logo a{
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
}
.sandwich_box{
	position: absolute;
	display: none;
	z-index: 2;
	top: 10%;
	right: 2%;
	width: 8%;
	height: 0;
	padding-bottom: 8%;
	/* border: 1px solid #f00; */
}
.sandwich_box img{
	position: absolute;
	display: block;
	width: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
.menu_close_box{
	position: absolute;
	display: none;
	z-index: 2;
	top: 1%;
	right: 2%;
	width: 10%;
	height: 0;
	padding-bottom: 10%;
	/* border: 1px solid #fff; */
}
.menu_close_box svg{
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	color: #1f1f1f;
}
.nav_bar{
	position: fixed;
	display: block;
	z-index: 11;
	top: 0;
	width: 100%;
	height: 75px;
	opacity: 0;
}
.header_bg{
	position: absolute;
	display: block;
	z-index: 1;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	opacity: .8;
	pointer-events: none;
	transition: .3s;
}
.menu_list{
	position: absolute;
	display: none;
	z-index: 2;
	right: 0;
	height: 100%;
	width: 75%;
	font-size: 0;
	text-align: center;
	/* border: 1px solid #0f0; */
}
.menu_list_pc{
	display: block;
}
.menu_list_mb{
	display: none;
}
.menu_list li{
	position: relative;
	display: inline-block;
	/* border: 1px solid #0f0; */
	height: 100%;
	width: 10%;
    padding-top: 1.5%;
}
.menu_list li.active .red_bottom_bar{
	display: block;
}
.menu_list li span{
	position: absolute;
	display: block;
	top:50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.menu_list li span p{
	color: #372f2f;
	white-space:nowrap;
	font-family: 'Noto Sans TC', sans-serif;
}
.menu_list li span p:nth-child(1){
	font-size: 1.2rem;
	margin-bottom: 0.2rem;
}
.menu_list li span p:nth-child(2){
	font-size: 0.8rem;
	letter-spacing: 0.1rem;
}
.menu_list li:hover{
	cursor: pointer;
}
.menu_list li:hover span p{
	color: #d2022e;
}
.mb_item{
	margin: auto;
	text-align: center;
	padding-top: 0 !important;
}
.mb_item::before{
	content:'';
	display: inline-block;
	height: 100%;
	width: 0;
	vertical-align: middle;
}
.review_area{
	position: relative;
	display: none;
	width: 100%;
	background-color: #e3474c;
}
.review_area > div{
	position: relative;
	display: inline-block;
	padding: 2% 4%;
}
.review_area > div a{
	text-decoration: none;
	color: #fff;
	font-size: 1.5rem;
	white-space:nowrap;
	font-family: 'Noto Sans TC', sans-serif;
}
.mb_header_social_area{
	position: absolute;
	display: block;
	width: 100%;
	top: 20%;
}
.mb_header_social_area a{
	position: relative;
	display: inline-block;
    width: 7%;
    height: 0;
    padding-bottom: 7%;
	margin: 0 auto;
}
.mb_header_social_area a:nth-child(1){
	margin-right: 4%;
	background: url('../img/social_btn_fb.png') center center no-repeat;
	background-size: contain;
}
.mb_header_social_area a:nth-child(2){
	background: url('../img/social_btn_line.png') center center no-repeat;
	background-size: contain;
}
.header_social_area{
	position: absolute;
	display: block;
	z-index: 3;
	top: 0;
	bottom: 0;
    right: 0%;
    width: 9%;
    height: 60%;
	margin-top: auto;
	margin-bottom: auto;
	/* border: 1px solid #fff; */
	font-size: 0;
	text-align: center;
}
.header_social_area a{
	position: relative;
	display: inline-block;
	width: 15%;
	height: 100%;
	outline: none;
}
.header_social_area a:hover{
	opacity: .5;
}
.header_social_area a:nth-child(1){
	margin-right: 10%;
	background: url('../img/social_btn_fb.png') center center no-repeat;
	background-size: contain;
}
.header_social_area a:nth-child(2){
	margin-right: 10%;
	background: url('../img/social_btn_line.png') center center no-repeat;
	background-size: contain;
}
.item8:hover .dropdown_area{
	display: none;
}
.dropdown_area{
	position: absolute;
	display: none;
	width: 100%;
	top: 100%;
	padding-left: 0;
}
.dropdown_area li{
	position: relative;
	display: block;
	z-index: 2;
	width: 100%;
	padding: 0.3rem;
	text-align: center;
}
.dropdown_area li a{
	position: relative;
	display: block;
	font-size: 1.2rem;
	color: rgb(58, 58, 58);
	font-family: 'Noto Sans TC', sans-serif;
	text-decoration: none;
	padding: 0.3rem;
}
.dropdown_area li:hover a{
	color: #f5b1c6;
}
.dropdown_area_bg{
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 1;
	background-color: rgb(255, 255, 255);
}

.page1_main_box{
	position: relative;
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: 55%;
}

.main_text{
	position: absolute;
	display: block;
	z-index: 4;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto auto auto auto;
    width: 100%;
    height: 100%;
	opacity: 1;
	text-align: center;
	/* transform: scale(0.9,0.9); */
	/* border: 1px solid #0f0; */
}

.page1_tittle{
	position: absolute;
	display: block;
	width: 55%;
	right: 0;
	top: 9%;
	-webkit-animation: page1_tittle_ni_1 2s forwards linear;
	-moz-animation: page1_tittle_ni_1 2s forwards linear;
	-ms-animation: page1_tittle_ni_1 2s forwards linear;
	animation: page1_tittle_ni_1 2s forwards linear;
	opacity: 0;
}
@-webkit-keyframes page1_tittle_ni_1{
	0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 9%;
		opacity: 1;
    }
}
@-moz-keyframes page1_tittle_ni_1{
    0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 9%;
		opacity: 1;
    }
}
@-o-keyframes page1_tittle_ni_1{
	0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 9%;
		opacity: 1;
    }
}
@-ms-keyframes page1_tittle_ni_1{
	0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 9%;
		opacity: 1;
    }
}
@keyframes page1_tittle_ni_1{
    0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
		top: 9%;
		opacity: 1;
    }
}

@-webkit-keyframes page1_tittle_ni_2{
	0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 10%;
		opacity: 1;
    }
}
@-moz-keyframes page1_tittle_ni_2{
    0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 10%;
		opacity: 1;
    }
}
@-o-keyframes page1_tittle_ni_2{
	0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 10%;
		opacity: 1;
    }
}
@-ms-keyframes page1_tittle_ni_2{
	0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 10%;
		opacity: 1;
    }
}
@keyframes page1_tittle_ni_2{
    0%{
        top: -100%;
		opacity: 0;
    }
	80%{
		opacity: 1;
	}
    100%{
        top: 10%;
		opacity: 1;
    }
}

/*page2*/
.page2{
	z-index: 3;
	font-size: 0;
	padding: 10rem 0 10rem 0;
	background-color: #f4f4f4;
}
.page2_text_area{
	font-size: 1.7rem;
	font-weight: 500;
	text-align: justify;
	letter-spacing: 0.1rem;
}
.page2_text_area_pc{
	display: block;
}
.page2_text_area_mb{
	display: none;
}
.page2_text_area p{
	text-align: justify;
	margin-bottom: 0.5%;
	color: rgb(43, 43, 43);
	font-weight: bold;
}
.deadline_box{
	position: relative;
	display: block;
	width: fit-content;
	padding: 0.5rem 2rem 0.5rem 2rem;
	border: 2px solid #d52644;
	border-radius: 30rem;
	margin: 0 auto;
}
.deadline_text_area span{
	white-space: nowrap;
	font-family: 'Noto Sans TC', sans-serif;
	color: #d52644;
	vertical-align: middle;
}
.deadline_text_area .deadline_text{
	font-size: 1.3rem;
	letter-spacing: 0.1rem;
}
.deadline_text_area .deadline_num{
	font-size: 2rem;
	margin: 0 1rem;
	font-weight: bold;
}

/*page3*/
.page3{
	display: none;
	font-size: 0;
	padding: 1rem 0 0.5rem 0;
	background-color: #fff;
	min-height: 17rem;
	cursor: pointer;
}
.page3_tittle_box{
	height: 3.5rem;
}
.volume_icon{
	position: absolute;
	display: block;
	z-index: 3;
    width: 2.5rem;
    top: 0;
    bottom: 0;
    right: -3rem;
    margin: auto 0;
}
.page3_tittle{
	position: relative;
	display: block;
	z-index: 3;
	font-size: 1.5rem;
	text-align: center;
	font-family: 'Noto Sans TC', sans-serif;
	margin: 0.5rem 0;
	color: #fff;
}
.page3_tittle_bg{
	position: absolute;
	display: block;
	z-index: 1;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: #d2002c;
	margin: auto 0;
	overflow-y: hidden;
}
.page3_tittle_bg::after{
	position: absolute;
	display: block;
	z-index: 2;
	content: '';
	right: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 4vw 2vw;
	border-color: transparent transparent #ffffff transparent;
}
.page3_ballot_box{
	position: relative;
	display: block;
}
.page3_ballot_item{
	width: 100%;
	/* transform: translate(0%, 120%); */
}
.page3_city_name{
	text-align: center;
	margin: 0.5rem 0;
	font-size: 1.5rem;
	font-family: 'Noto Sans TC', sans-serif;
	color: rgb(43, 43, 43);
}
.page3_political_icon{
	display: inline-block;
	vertical-align: middle;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	text-align: center;
	margin-right: 1rem;
}
.page3_political_icon.elected::before{
	content: '';
	position: absolute;
	display: block;
	top: 0;
	width: 100%;
	height: 100%;
	left: -53%;
	background: url('../img/elected_icon.png') center center no-repeat;
	background-size: contain;
}
.page3_political_icon::before{
	position: relative;
	display: inline-block;
	content:'';
	height: 100%;
	width: 0;
	vertical-align: middle;
}
.page3_political_text{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	font-weight: bold;
	font-size: 1.5rem;
	font-family: 'Noto Sans TC', sans-serif;
	vertical-align: middle;
}

/*政黨顏色相關*/
/*無黨籍*/
.political_border_color0{
	border: 2px solid #67574f;
}
.political_color0{
	color: #67574f;
}
.political_fill_color0{
	fill: #bababa;
}
/*國民黨*/
.political_border_color1{
	border: 2px solid #000095;
}
.political_color1{
	color: #000095;
}
.political_fill_color1{
	fill: #98c5e7;
}
/*民進黨*/
.political_border_color2{
	border: 2px solid #1B9431;
}
.political_color2{
	color: #1B9431;
}
.political_fill_color2{
	fill: #b2d292;
}
/*親民黨*/
.political_border_color3{
	border: 2px solid #FF6310;
}
.political_color3{
	color: #FF6310;
}
.political_fill_color3{
	fill: #FF6310;
}
/*台灣維新黨*/
.political_border_color4{
	border: 2px solid #51458B;
}
.political_color4{
	color: #51458B;
}
.political_fill_color4{
	fill: #51458B;
}
/*民眾黨*/
.political_border_color5{
	border: 2px solid #28C8C8;
}
.political_color5{
	color: #28C8C8;
}
.political_fill_color5{
	fill: #28C8C8;
}
/*民國黨*/
.political_border_color6{
	border: 2px solid #FFEA00;
}
.political_color6{
	color: #FFEA00;
}
.political_fill_color6{
	fill: #FFEA00;
}
/*樹黨*/
.political_border_color7{
	border: 2px solid #B4D205;
}
.political_color7{
	color: #B4D205;
}
.political_fill_color7{
	fill: #B4D205;
}
/*金門高粱黨*/
.political_border_color8{
	border: 2px solid #933b35;
}
.political_color8{
	color: #933b35;
}
.political_fill_color8{
	fill: #933b35;
}
/*教科文預算保障e聯盟*/
.political_border_color9{
	border: 2px solid #18266a;
}
.political_color9{
	color: #18266a;
}
.political_fill_color9{
	fill: #18266a;
}
/*時代力量*/
.political_border_color10{
	border: 2px solid #F9BE01;
}
.political_color10{
	color: #F9BE01;
}
.political_fill_color10{
	fill: #F9BE01;
}
/*天一黨*/
.political_border_color11{
	border: 2px solid #a75144;
}
.political_color11{
	color: #a75144;
}
.political_fill_color11{
	fill: #a75144;
}
/*龍黨*/
.political_border_color12{
	border: 2px solid #0c217d;
}
.political_color12{
	color: #0c217d;
}
.political_fill_color12{
	fill: #0c217d;
}
/*台澎國際法法理建國黨*/
.political_border_color13{
	border: 2px solid #77AEA5;
}
.political_color13{
	color: #77AEA5;
}
.political_fill_color13{
	fill: #77AEA5;
}
/*台灣動物保護黨*/
.political_border_color14{
	border: 2px solid #3c6830;
}
.political_color14{
	color: #3c6830;
}
.political_fill_color14{
	fill: #3c6830;
}
/*勞動黨*/
.political_border_color15{
	border: 2px solid #FF0000;
}
.political_color15{
	color: #FF0000;
}
.political_fill_color15{
	fill: #FF0000;
}
/*綠黨*/
.political_border_color16{
	border: 2px solid #99E64D;
}
.political_color16{
	color: #99E64D;
}
.political_fill_color16{
	fill: #99E64D;
}
/*新黨*/
.political_border_color17{
	border: 2px solid #FFDB00;
}
.political_color17{
	color: #FFDB00;
}
.political_fill_color17{
	fill: #FFDB00;
}
/*小民參政歐巴桑聯盟*/
.political_border_color18{
	border: 2px solid #8f5822;
}
.political_color18{
	color: #8f5822;
}
.political_fill_color18{
	fill: #8f5822;
}
/*中國和平統一黨*/
.political_border_color19{
	border: 2px solid #dd504e;
}
.political_color19{
	color: #dd504e;
}
.political_fill_color19{
	fill: #dd504e;
}
/*無黨團結聯盟*/
.political_border_color20{
	border: 2px solid #C20F51;
}
.political_color20{
	color: #C20F51;
}
.political_fill_color20{
	fill: #C20F51;
}
/*金色力量黨*/
.political_border_color21{
	border: 2px solid #edad24;
}
.political_color21{
	color: #edad24;
}
.political_fill_color21{
	fill: #edad24;
}
/*共和黨*/
.political_border_color22{
	border: 2px solid #2a2741;
}
.political_color22{
	color: #2a2741;
}
.political_fill_color22{
	fill: #2a2741;
}
/*中國國家社會主義勞工黨*/
.political_border_color23{
	border: 2px solid #221913;
}
.political_color23{
	color: #221913;
}
.political_fill_color23{
	fill: #221913;
}
/*社會民主黨*/
.political_border_color24{
	border: 2px solid #FF0088;
}
.political_color24{
	color: #FF0088;
}
.political_fill_color24{
	fill: #FF0088;
}
/*臺灣人民共產黨*/
.political_border_color25{
	border: 2px solid #de2910;
}
.political_color25{
	color: #de2910;
}
.political_fill_color25{
	fill: #de2910;
}
/*台灣基進*/
.political_border_color26{
	border: 2px solid #A73f24;
}
.political_color26{
	color: #A73f24;
}
.political_fill_color26{
	fill: #A73f24;
}

.page3_candidate_area{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	width: 33%;
	margin-bottom: 1rem;
	white-space: nowrap;
}
.page3_candidate_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
.page3_candidate_name_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin-right: 1rem;
	width: 5rem;
}
.page3_candidate_name{
	font-size: 1.5rem;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: bold;
	white-space: normal;
}
.page3_vote_num_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
.page3_vote_num{
	font-size: 1.5rem;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: bold;
	color: rgb(43, 43, 43);
}

/*page3_search_page*/
.btn_search_bar_bg{
	position: relative;
    display: inline-flex;
    width: fit-content;
}
.page3_search_page{
	display: none;
	font-size: 0;
	padding: 1rem 0 0.5rem 0;
	background-color: #fff;
	min-height: 6rem;
	z-index: 3;
	overflow: visible;
}
.page3_search_page i.fa-search{
	position: absolute;
    display: block;
    top: 0.2rem;
    bottom: 0;
    right: -2.5rem;
    margin: auto 0;
    color: #d2002c;
    font-size: 2rem;
}
.page3_search_page.search_bar_page{
	padding-top: 85px;
}
.page3_search_item{
	margin-top: 0.6rem;
	padding-left: 3rem;
}
.page3_search_item .btn-group,.page3_search_item .btn-group-vertical{
	width: 17rem;
	vertical-align: middle;
	font-family: 'Noto Sans TC', sans-serif;
}
.page3_search_item .btn_search_bar{
	border: 1px solid #643851;
	padding-left: 2rem;
	padding-right: 2rem;
	width: 100%;
	height: fit-content;
}
.page3_search_item .btn-group2,.page3_search_item .btn-group3{
	margin-right: 1rem;
}
.title_li{
	pointer-events: none;
    background-color: #eee;
}
.title_li a{
	margin-left: -0.5rem;
    font-weight: bold;
}
.page3_search_item .dropdown-menu{
	height: 12rem;
	overflow-y: auto;
}
.page3_search_item .dropdown-item{
	font-family: 'Noto Sans TC', sans-serif;
}
.page3_search_item .btn_search_bar_submit{
	background-color: #643851;
	border-radius: 30rem;
	padding: 0.5rem 2rem;
	color: #fff;
	height: fit-content;
}
.page3_search_item .btn_search_bar_submit:hover{
	cursor: pointer;
	transform: scale(1.1,1.1);
	transition: .3s;
}

/*當選快搜 跳窗候選人資訊*/
.page3_search_page_candidate_area{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	width: 33%;
	margin-bottom: 1rem;
	white-space: nowrap;
	padding-left: 3rem;
}
.page3_search_page_candidate_area .page3_political_icon{
	margin-right: 0.5rem;
}
.page3_search_page_candidate_area .page3_political_text{
 margin-left: -0.2rem;
}
.page3_search_page_candidate_area .page3_political_icon.elected::before{
	content: '';
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
    margin: auto 0;
	width: 80%;
	height: 2.5rem;
	left: -33%;
	background: url('../img/elected_icon.png') center center no-repeat;
	background-size: contain;
}
.page3_search_page_candidate_area .page3_political_icon.elected .page3_political_text{
	margin-left: 0rem;
    margin-top: 0.2rem;
}
.page3_search_page_candidate_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
.page3_search_page_candidate_name_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin-right: 0rem;
	width: 4.6rem;
}
.page3_search_page_candidate_name{
	font-size: 1rem;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: bold;
	white-space: normal;
	word-wrap:break-word;
}
.page3_search_page_vote_num_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
.page3_search_page_vote_num{
	font-size: 1rem;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: bold;
	color: rgb(43, 43, 43);
}

/*page4*/
.page4{
	z-index: 2;
	font-size: 0;
	padding: 10rem 0 10rem 0;
	background-color: #fafafa;
	overflow: hidden;
}
.page4_page_text_area{
	background-color: #fafafa;
}
.page_text_area{
	position: relative;
	display: block;
	z-index: 2;
	width: fit-content;
	margin: 0 auto 4rem auto;
	padding-bottom: 0.1rem;
	padding-left: 1rem;
    padding-right: 1rem;
}
.page_text_area::before{
	position: absolute;
	display: block;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	content: '';
	width: 7rem;
	border-bottom: 5px solid rgb(43, 43, 43);
}
.page_title{
	text-align: center;
	font-size: 2.5rem;
	font-weight: bold;
	color: rgb(43, 43, 43);
}
.taiwan_map_area{
	position: relative;
	display: block;
	width: 100%;
	height: 52vw;
}
.back_btn{
	position: absolute;
	display: none;
	z-index: 3;
	padding: 0.5rem 1.5rem;
	background-color: indianred;
	border-radius: 3rem;
	width: 13rem;
	text-align: center;
	top: -15%;
	left: 0%;
	right: 0;
	margin: 0 auto;
}
.back_btn.active{
	display: block;
}
.back_btn:hover{
	cursor: pointer;
	transition: .3s;
	transform: scale(1.1,1.1);
}
.back_btn p{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	color: #fff;
	font-weight: bold;
	font-size: 1.5rem;
	font-family: 'Noto Sans TC', sans-serif;
}
.back_btn i{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	color: #fff;
	font-size: 1.5rem;
	margin-right: 0.5rem;
}
.taiwan_map_area svg{
	position: absolute;
	display: block;
}
.taiwan_location path{
	position: relative;
	display: block;
	z-index: 1;
}
.taiwan_map_area text:hover{
	cursor: pointer;
}
.taiwan_location:hover path{
	position: relative;
	display: block;
	cursor: pointer;
	stroke: rgb(255, 238, 4) !important;
}
.lianjiang_county_href{
	position: absolute;
	display: none;
	z-index: 3;
    top: -2%;
    left: 34%;
    width: 9%;
    height: 30%;
}
.lianjiang_county_href.active{
	display: block;
}
.kinmen_county_href{
	position: absolute;
	display: none;
	z-index: 3;
	top: 28%;
    left: 20%;
    width: 11%;
    height: 14%;
}
.kinmen_county_href.active{
	display: block;
}
.penghu_county_href{
	position: absolute;
	display: none;
	z-index: 3;
	top: 50%;
    left: 26%;
    width: 9%;
    height: 24%;
}
.penghu_county_href.active{
	display: block;
}

.vote_rate_info_area{
	position: absolute;
	display: block;
	width: 18%;
	height: fit-content;
	top: 0;
	bottom: 0;
	right: 18%;
	margin: auto 0;
	border: 1px solid rgb(240, 240, 240);
}
.vote_rate_info_box{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	background-color: #fff;
	padding: 1rem;
}
.vote_rate_city_name_area{
	position: relative;
	display: block;
	padding: 0 0 1rem 0;
}
.vote_rate_city_name{
	color: rgb(43, 43, 43);
	font-weight: bold;
	font-size: 1.5rem;
	font-family: 'Noto Sans TC', sans-serif;
	text-align: center;
}
.vote_rate_political_area{
	position: relative;
	display: block;
	width: 100%;
	padding: 0.5rem 0;
	text-align: center;
}
.vote_rate_candidate_box{
	position: relative;
	display: block;
	text-align: center;
	padding: 0.5rem 0;
}
.vote_rate_candidate_box p.by_election{
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: -0.8rem;
	font-family: 'Noto Sans TC', sans-serif;
	color: rgb(43, 43, 43);
	font-size: 0.8rem;
}
.vote_rate_political_circle{
	position: relative;
	display: inline-block;
	width: 2.2rem;
	height: 2.2rem;
	text-align: center;
	border-radius: 50%;
	margin-right: 0.5rem;
}
.vote_rate_political_circle.elected::before{
	content: '';
	position: absolute;
	display: block;
	top: 0;
	width: 100%;
	height: 100%;
	left: -140%;
	background: url('../img/elected_icon.png') center center no-repeat;
	background-size: contain;
}
.vote_rate_political_circle::after{
	position: relative;
	display: inline-block;
	content: '';
	height: 100%;
	width: 0;
	vertical-align: middle;
}
.vote_rate_political_name{
	position: relative;
	display: inline-block;
	font-size: 1rem;
	font-weight: bold;
	vertical-align: middle;
	font-family: 'Noto Sans TC', sans-serif;
}
.vote_rate_political_text{
	position: relative;
	display: inline-block;
	font-size: 1rem;
	vertical-align: middle;
	font-family: 'Noto Sans TC', sans-serif;
}
.vote_rate_candidate_name{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 1rem;
	margin-right: 0rem;
	min-width: 4rem;
	max-width: 4rem;
	text-align: left;
}
.vote_rate_status{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 1rem;
	min-width: 9rem;
	text-align: right;
}
.vote_rate_status.ready{
	color: #7d7c7c;
}
.vote_rate_2022_area{
	position: relative;
	display: block;
	width: 100%;
	margin-top: 1rem;
}
.vote_rate_2018_area{
	position: relative;
	display: block;
	width: 100%;
	margin-top: 2rem;
}
.vote_rate_title_area{
	position: relative;
	display: block;
	width: 100%;
	padding: 0.5rem 0;
	margin-bottom: 0.5rem;
}
.city_chia_yi_p{
	font-size: 1rem;
	color: #7d7c7c;
	font-family:'Noto Sans TC', sans-serif;
}
.vote_rate_candidate_area{
	position: relative;
	display: block;
	width: 100%;
}
.vote_rate_title_area::before{
	position: absolute;
	display: block;
	content: '';
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 85%;
	height: 0;
	border-bottom: 1px solid rgb(43, 43, 43);
	margin: auto;
}
.vote_rate_title{
	position: relative;
	display: block;
	z-index: 2;
	font-size: 1.1rem;
	color: rgb(43, 43, 43);
	font-family: 'Noto Sans TC', sans-serif;
	background-color: #fff;
	width: fit-content;
	margin: 0 auto;
	padding: 0 1rem;
}
.information_from_area{
	position: absolute;
	display: block;
	right: 5%;
	bottom: 0%;
	width: fit-content;
}
.pen_icon_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
.pen_icon_box i{
	width: 100%;
	color: #675750;
	font-size: 1.8rem;
	margin-right: 0.5rem;
}
.information_from_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
.information_from_box p{
	font-size: 1rem;
	font-family: 'Noto Sans TC', sans-serif;
	color: #675750;
}

.vote_info_msg_box{
	position: absolute;
	display: none;
	top: -32rem;
	left: 0;
	width: fit-content;
	height: fit-content;
	text-align: center;
	padding: 0.5rem;
	background-color: #fafafa;
}
.vote_info_msg_box p{
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 1.8rem;
	color: rgb(43, 43, 43);
}
.vote_info_msg_box i{
	position: relative;
	display: block;
	font-size: 1.8rem;
	color: rgb(43, 43, 43);
}


/*page5*/
.page5{
	font-size: 0;
	padding: 6rem 0 6rem 0;
	background-color: #fff;
	text-align: center;
}
.page5_data_menu_area{
	position: relative;
	display: block;
	width: 100%;
	margin-bottom: 3rem;
}
.page5_data_menu_box{
	position: relative;
	display: block;
	width: 60%;
	margin: 0 auto;
}
.page5_data_menu_box .item_box{
	position: relative;
	display: block;
	width: 100%;
}
.page5_data_menu{
	position: relative;
	display: inline-block;
	padding: 0.5rem 2rem;
	border: 2px solid #643851;
	border-radius: 30rem;
	width: fit-content;
}
.page5_data_menu:nth-child(1){
	margin-right: 1rem;
}
.page5_data_menu p{
	font-size: 1.3rem;
	color: #643851;
	font-family: 'Noto Sans TC', sans-serif;
}
.page5_data_menu:hover{
	transition: .3s;
	cursor: pointer;
	background-color: #643851;
}
.page5_data_menu:hover p{
	color: #fff;
}
.page5_data_menu.active{
	background-color: #643851;
}
.page5_data_menu.active p{
	color: #fff;
}
.item_box1_1{
	margin-bottom: 1rem;
}
.page5_show_data_area{
	position: relative;
	display: block;
	width: 70%;
	margin: 0 auto;
}
.page5_show_data_box{
	position: relative;
	display: block;
	width: 100%;
	height: 20vw;
}
.page5 svg{
	position: relative;
	display: block;
}
.page5 .not_yet_invoiced_text{
	position: absolute;
	display: block;
	z-index: 2;
    left: 15rem;
    top: 3rem;
	font-size: 1rem;
	color: #aaa;
	font-family: 'Noto Sans TC', sans-serif;
}
.not_yet_invoiced_area{
	position: absolute;
	display: none;
	z-index: 2;
	width: 100%;
	height: 100%;
	background-color: #797979;
	text-align: center;
}
.not_yet_invoiced_area.active{
	display: block;
}
.not_yet_invoiced_area::before{
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 0;
	height: 100%;
}
.not_yet_invoiced_area h1{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	font-family: 'Noto Sans TC', sans-serif;
	color: rgb(223, 223, 223);
	font-size: 5rem;
	letter-spacing: 1rem;
}

/*chert*/
.chert{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}

/*swiper*/
.swiper-button-next1,.swiper-button-prev1{
	display: none;
}

/*page6*/
.page6{
	font-size: 0;
	padding: 0rem 0 6rem 0;
	background-color: #fff;
	text-align: center;
}
.page6 .page_title{
	font-size: 2.8rem;
}
.page_text_area.style2{
	position: relative;
	display: block;
	z-index: 3;
	margin: 0;
}
.page6 .card{
	min-height: auto;
	flex-direction: row;
	border-bottom: 1px solid rgb(43, 43, 43);
	border-left: 0;
	border-right: 0;
}
.article_area .col:first-child .card{
	border-top: 1px solid rgb(43, 43, 43);
}
.article_area .col:nth-child(odd) .card{
	background-color: #fcfbfb;
}
.article_area .col:nth-child(even) .card{
	background-color: #f4f1f1;
}
.page6 .card-text{
	text-align: justify;
	font-size: 1.2rem;
	color: #505050;
	font-family: 'Noto Sans TC', sans-serif;
}
.page6 .card_text_content p:nth-child(1){
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
	text-align: justify;
	font-size: 1.2rem;
	color: #505050;
	font-family: 'Noto Sans TC', sans-serif;
}
.page6 .card-tittle{
	font-weight: bold;
	font-size: 1.5rem;
	margin-bottom: 2rem;
}
.page6_card_img{
	width: 15rem;
	object-fit: contain;
}
.page6 .card_read_more{
	margin-top: 1rem;
	text-align: right;
    font-size: 1.1rem;
    color: #d2002c;
    font-family: 'Noto Sans TC', sans-serif;
}
.article_more_btn{
	position: relative;
	display: none;
	width: fit-content;
	padding: 0.5rem 2rem;
	background-color: #995989;
	margin-left: auto;
	margin-right: 0;
}
.article_more_btn:hover{
	cursor: pointer;
	/* transition: .3s;
	transform: scale(1.1,1.1); */
}
.article_more_btn.active{
	display: block;
}
.article_more_btn span{
	font-size: 1.4rem;
	font-family: 'Noto Sans TC', sans-serif;
	color: #fff;
	margin-right: 1rem;
}
.article_more_btn i{
	font-weight: bold;
	font-size: 1.4rem;
	color: #fff;
}

/*page7*/
.page7{
	z-index: 2;
	overflow: visible;
	font-size: 0;
	padding: 10rem 0 10rem 0;
	background-color: #fff;
}
.page7 .page_title{
	font-size: 2.8rem;
}
.page7 .card{
	min-height: auto;
	flex-direction: row;
	border-bottom: 1px solid rgb(43, 43, 43);
	border-left: 0;
	border-right: 0;
}
.page7 .card-text{
	text-align: justify;
	font-size: 1.2rem;
	color: #505050;
	font-family: 'Noto Sans TC', sans-serif;
}
.page7 .card_text_content p:nth-child(1){
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
	text-align: justify;
	font-size: 1.2rem;
	color: #505050;
	font-family: 'Noto Sans TC', sans-serif;
}
.page7 .card-tittle{
	font-weight: bold;
	font-size: 1.5rem;
	margin-bottom: 2rem;
}
.page7_card_img{
	width: 15rem;
	object-fit: contain;
}
.page7 .card_read_more{
	margin-top: 1rem;
	text-align: right;
    font-size: 1.1rem;
    color: #d2002c;
    font-family: 'Noto Sans TC', sans-serif;
}

/*page8*/
.page8{
	z-index: 3;
    font-size: 0;
    padding: 4rem 0 4rem 0;
    background-color: #f4eeed;
}
.page8 .page_title{
	font-size: 2.8rem;
}
.page8 .card{
	min-height: 34rem;
	background-color: #fff;
	border: 0px;
}
.page8 .card-text{
	font-size: 1rem;
	color: #505050;
}
.page8_card_img{
	width: 100%;
	height: 14vw;
	object-fit: cover;
}
.page8 .card-text{
	text-align: justify;
	font-size: 1.2rem;
	color: #505050;
	font-family: 'Noto Sans TC', sans-serif;
}
.page8 .card-tittle{
	font-weight: bold;
	font-size: 1.5rem;
	margin-bottom: 2rem;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}
.page8_article_box{
	background-color: #fff;
}
.page8 .card-footer{
	border-top:0;
	background-color: #fff;
}
.page8 .card-footer p{
	text-align: right;
	font-size: 1.1rem;
	color: #d2002c;
	font-family: 'Noto Sans TC', sans-serif;
}
.candidate_election_area{
	margin: 0 auto;
}

/*page9*/
.page9{
	display: block;
	font-size: 0;
	padding: 10rem 0 10rem 0;
	background-color: #fff;
}
.page9_text_area{
	margin: 0 auto 2rem auto;
}
.page9_title{
	margin-bottom: 0;
}
.page9_discribe{
	color: #505050;
	font-size: 1.2rem;
	margin-bottom: 0.5rem;
}
.video_iframe{
	position: relative;
	display: block;
	margin: 0 auto 3rem auto;
	width: 50%;
	height: 28vw;
}
.video_iframe:last-child{
	margin: 0 auto 0 auto;
}

/*page10*/
.page10{
	font-size: 0;
	background-color: #fafafa;
	padding: 10rem 0 10rem 0;
}
.page10 .page_title br{
	display: none;
}
.public_election_area{
	position: relative;
	display: block;
	width: 70%;
    margin: 0 auto;
}
.public_election_title_area{
	position: relative;
	display: block;
	width: 100%;
	white-space: nowrap;
	margin-bottom: 8rem;
	text-align: center;
}
.public_election_title_text_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin: 0 auto 2rem auto;
	white-space: normal;
	width: 60rem;
}
.public_election_title_text_box p{
	font-size: 1.5rem;
	color: #505050;
	font-family: 'Noto Sans TC', sans-serif;
	text-align: center;
}
.public_election_result_box{
	position: relative;
	/* display: inline-block; */
	display: none;
	border-radius: 30rem;
	padding: 0.5rem 1.5rem;
	vertical-align: middle;
	width: fit-content;
	margin: 0 auto;
}
.public_election_result_box p{
    font-size: 1.5rem;
	font-family: 'Noto Sans TC', sans-serif;
}
.public_election_result_box.pass{
	display: block;
	border: 1px solid #14ca6f;
}
.public_election_result_box.pass p{
	color: #14ca6f;
}
.public_election_result_box.fail{
	display: block;
	border: 1px solid #d52644;
}
.public_election_result_box.fail p{
	color: #d52644;
}
.public_election_bar_area{
	position: relative;
	display: block;
	width: 100%;
	margin-bottom: 6rem;
}
.poll_bar_row_area{
	position: relative;
	display: block;
	width: 100%;
}
.poll_bar_row_box{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	width: 100%;
	margin: auto;
}
.poll_bar_row_box::before{
	content: '1/2過門檻(961萬9697票)';
	position: absolute;
	display: block;
	font-size: 1.5rem;
	top: -47%;
	left: 0%;
	right: 0;
	margin: 0 auto;
	text-align: center;
	font-family: 'Noto Sans TC', sans-serif;
	color: #505050;
}
.poll_bar_row_box::after{
	content: '';
	position: absolute;
	display: block;
	z-index: -1;
	top: -15%;
	left: 0%;
	right: 0;
	margin: 0 auto;
	text-align: center;
	width: 3px;
	height: 13rem;
	background-color: #dbdbdb;
}

.poll_bar_row_box_left{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	width: 15%;
	margin: auto;
}
.poll_bar_title_row{
	position: relative;
	display: block;
	width: 100%;
}
.poll_bar_title_text{
	position: relative;
	display: block;
	font-size: 1.5rem;
	color: #1f1f1f;
	font-family: 'Noto Sans TC', sans-serif;
	text-align: right;
	margin-right: 1rem;
}

.poll_bar_row{
	position: relative;
	display: block;
	width: 100%;
	white-space: nowrap;
}
.poll_bar_row:first-child{
	margin-bottom: 2rem;
}
.poll_bar_row1 .poll_bar_item_hover::before{
	content: '0%';
	position: absolute;
	display: block;
	font-size: 1.5rem;
	top: -100%;
	left: -1%;
	font-family: 'Noto Sans TC', sans-serif;
	color: #6d6d6d;

}
.poll_bar_row1 .poll_bar_item_hover::after{
	content: '100%';
	position: absolute;
	display: block;
	font-size: 1.5rem;
	top: -100%;
	right: -3%;
	font-family: 'Noto Sans TC', sans-serif;
	color: #6d6d6d;

}
.poll_bar_item_hover{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	width: 70%;
	background-color: #dbdbdb;
}
.poll_bar_item{
	position: relative;
	height: 4rem;
	background-color: #1f1f1f;
}
.poll_bar_item_1{
	background-color: #9b3350;
	width: 0%;
	transition: .3s;
}
.poll_bar_item_2{
	background-color: #5f4377;
	width: 0%;
	transition: .3s;
}
.poll_bar_percent{
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	left: 1rem;
	margin: auto 0;
	font-size: 1.5rem;
	font-family: 'Noto Sans TC', sans-serif;
	color: #fff;
	padding-top: 0.9rem;
}

.poll_bar_row_box_right{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	width: 15%;
	margin: auto;
}
.poll_bar_count{
	position: relative;
	display: block;
	width: 100%;
}
.poll_bar_count_num{
	position: relative;
	display: block;
	font-size: 1.5rem;
	color: #1f1f1f;
	font-family: 'Noto Sans TC', sans-serif;
	text-align: left;
	margin-left: 1rem;
}

.public_election_notice_area{
	position: relative;
	display: block;
	width: fit-content;
	margin: 0 auto;
}
.public_election_notice_area p{
	font-size: 1.3rem;
	font-family: 'Noto Sans TC', sans-serif;
	color: #717171;
}

/*page12*/
.page12{
	font-size: 0;
	background-color: #fff;
	padding: 10rem 0 10rem 0;
}
.page12_organizers_list{
	position: relative;
	display: block;
	width: 100%;
	margin-bottom: 2%;
}
.page12_organizers_list:last-child{
	margin-bottom: 0;
}
.page12_organizers_title_area{
	position: relative;
	display: inline-block;
	width: 13%;
	vertical-align: top;
}
.page12_organizers_title_area p{
	font-size: 1.5rem;
	color: #000;
}
.page12_organizers_logo_area{
	position: relative;
	display: inline-block;
	width: 87%;
	vertical-align: top;
}
.page12_organizers_logo_area a{
	position: relative;
	display: inline-block;
	width: 20%;
	vertical-align: middle;
	margin-bottom: 2%;
}
.page12_organizers_logo_area .bt_logo_a{
	position: relative;
	display: inline-block;
	width: 12%;
	margin: 0 4% 2% 0;
}
.page12_organizers_logo_area .hma_logo_a{
	position: relative;
	display: inline-block;
	width: 12%;
	margin: 0% 0 2% 0;
}
.page12_organizers_logo_area .logotype3_2_logo{
	width: 28%;
}
.page12_organizers_logo_area a img{
	width: 100%;
}


/*footer*/
footer{
	position: relative;
	display: block;
	width: 100%;
	background-color: #2d2d2d;
	padding: 2rem 0 2rem 0;
	text-align: center;
}
footer p{
	font-family: 'Noto Sans TC', sans-serif;
	color: #fff;
	font-size: 1rem;
	margin-bottom: 0.5rem;
}
footer p:last-child{
	margin-bottom: 0%;
}

/*swiper*/
.swiper {
	width: 100%;
	height: 100%;
}
.swiper-slide {
	text-align: center;
	font-size: 18px;

	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	flex-direction: column;
}
.swiper-button-next:after, .swiper-button-prev:after{
    font-weight: bold;
}
.swiper-button-prev{
	left: 0%;
}
.swiper-button-next{
	right: 0%;
}
.swiper-pagination-bullets.swiper-pagination-horizontal{
	bottom: -10% !important;
}
.swiper-pagination-bullet{
	background: #bea954;
	width: 1rem;
    height: 0;
    padding-bottom: 1rem;
}
.swiper-pagination-bullet-active{
	background: #ffcc00;
	width: 1rem;
    height: 0;
    padding-bottom: 1rem;
}
.swiper-slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/*modal*/
.modal-title{
	font-family: 'Noto Sans TC', sans-serif;
}
.modal-body{
	font-family: 'Noto Sans TC', sans-serif;
}
.modal-body h2{
	font-family: 'Noto Sans TC', sans-serif;
	color: #aaa;
}


@media screen and (max-width:1920px){
	html{
		font-size: 1rem;
	}

	/*當選快搜 候選人資訊*/
	.page3_search_page_candidate_area .page3_political_icon.elected::before{
		left: -37%;
	}
}
@media screen and (max-width:1770px){
	html{
		font-size: 0.9rem;
	}
}
@media screen and (max-width:1600px){
	html{
		font-size: 0.8rem;
	}
	.page8 .card{
		min-height: 33rem;
	}
}
@media screen and (max-width:1460px){
	html{
		font-size: 0.7rem;
	}
	.page8 .card{
		min-height: 36rem;
	}
}
@media screen and (max-width:1280px){
	html{
		font-size: 0.6rem;
	}
	.map_area iframe {
		height: 26rem;
	}
}
@media screen and (max-width:1200px){
}
@media screen and (min-width:1025px){
	
}
@media screen and (max-width:1024px){
	html{
		font-size: 1rem;
	}

	.header_social_area{
		display: none;
	}

	.nav_bar{
		height: 70px;
	}

	/*modal loading gif*/
.loading_gif{
	width: 40%;
}

	/*fiexd area*/
	.fixed_area{
		top: 70%;
	}

	/*page_main_area*/
	.page_main_bg{
		position: absolute;
		display: block;
		top:50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
		height: 100%;
	}

	/*page1*/
	.page1{
		height: 130vw;
	}
	.main_text{
		width: 95%;
		height: 42%;
	}
	.page1_tittle{
		width: 90%;
		right: -15%;
		-webkit-animation: page1_tittle_ni_2 1.5s forwards linear;
		-moz-animation: page1_tittle_ni_2 1.5 forwards linear;
		-ms-animation: page1_tittle_ni_2 1.5s forwards linear;
		animation: page1_tittle_ni_2 1.5s forwards linear;
	}
	.logo {
		width: 18%;
		height: 59%;
		margin-left: 1%;
	}
	.logo1{
		width: 6rem;
		z-index: 3;
		margin-left: 4rem;
	}
	.logo2{
		width: 10rem;
		z-index: 3;
		margin-left: 11rem;
	}
	.sandwich_box{
		display: block;
		top: 0rem;
		width: 3rem;
		height: 3rem;
	}
	.menu_close_box{
		display: block;
	}
	.menu_list{
		position: fixed;
		display: block;
		z-index: 10;
		top: 0;
		left: -200%;
		width: 100%;
		height: 100%;
		background-color: rgb(255, 255, 255);
		padding-top: 8%;
		padding-left: 0;
		transition: .3s;
	}
	.menu_list_pc{
		display: none;
	}
	.menu_list_mb{
		display: block;
	}
	.menu_list li{
		display: block;
		height: 10%;
		width: 100%;
		border-bottom: 1px solid #525252;
	}
	.menu_list li:nth-child(3), .menu_list li:nth-child(4){
		width: 100%;
	}
	.menu_list li:last-child{
		border-bottom: 0;
	}
	.menu_list li p{
		font-family: 'Noto Sans TC', sans-serif;
		font-size: 1.5rem;
		color: #1f1f1f;
		display: inline-block;
		vertical-align: middle;
	}

	.main_text {
		margin: 19% auto auto auto;
	}
	.main_text > svg{
		margin: 2% auto 0 auto;
		transform: scale(2.5,2.5);
	}
	.page1_main_box{
		padding-bottom: 131.3%;
		width: 100%;
		height: 100%;
		/* transform: scale(1,1) rotate(90deg);
		-webkit-animation: page1_bg_ni 15s forwards linear;
		-moz-animation: page1_bg_ni 15s forwards linear;
		-ms-animation: page1_bg_ni 15s forwards linear;
		animation: page1_bg_ni 15s forwards linear; */
	}
	@-webkit-keyframes page1_bg_ni{
		0%{
			transform: scale(1,1);
		}
		100%{
			transform: scale(1.2,1.2);
		}
	}
	@-moz-keyframes page1_bg_ni{
		0%{
			transform: scale(1,1);
		}
		100%{
			transform: scale(1.2,1.2);
		}
	}
	@-o-keyframes page1_bg_ni{
		0%{
			transform: scale(1,1);
		}
		100%{
			transform: scale(1.2,1.2);
		}
	}
	@-ms-keyframes page1_bg_ni{
		0%{
			transform: scale(1,1);
		}
		100%{
			transform: scale(1.2,1.2);
		}
	}
	@keyframes page1_bg_ni{
		0%{
			transform: scale(1,1);
		}
		100%{
			transform: scale(1.2,1.2);
		}
	}
	
	/*page2*/
	.page2 {
		padding: 6rem 2rem 6rem 2rem;
	}
	.page_big_tittle div{
		display: inline-block;
	}
	.page_tittle.style1{
		width: 32%;
	}
	.page2_text_area{
		text-align: left;
	}
	.page2_text_area_pc{
		display: none;
	}
	.page2_text_area_mb{
		display: block;
	}
	.page_big_tittle{
		text-align: center;
		-webkit-writing-mode: horizontal-tb;
		writing-mode: horizontal-tb;
	}
	.deadline_box{
		padding: 1rem 2.5rem 1rem 2.5rem;
	}
	.deadline_text_area .deadline_text{
		font-size: 1.6rem;
		letter-spacing: 0.1rem;
	}
	.deadline_text_area .deadline_num{
		font-size: 2rem;
	}
	

	/*page3*/
	.page3{
		padding: 0 0 0.5rem 0;
		min-height: 46rem;
	}
	.page3_box{
		width: 42%;
		padding-bottom: 42%;
	}
	.page3_box::after{
		border-width: 0 0 20vw 20vw;
	}
	.page3_tittle_box{
		height: auto;
		padding: 1rem 0;
	}
	.page3_tittle{
		font-size: 2rem;
		width: fit-content;
		margin: 0 auto;
	}
	.page3_tittle_bg::after{
		display: none;
	}
	.page3_candidate_area{
		width: 50%;
		padding-left: 7rem;
	}
	.page3_candidate_name_box{
		display: block;
		width: 6rem;
	}
	.volume_icon{
		right: -3rem;
		filter: grayscale(100%) brightness(1000%);
	}
	.page3_city_name{
		font-size: 1.8rem;
		margin: 1.5rem 0;
	}
	.page3_political_icon{
		width: 3.5rem;
		height: 3.5rem;
	}
	.page3_political_icon.elected::before{
		width: 70%;
		height: 70%;
		bottom: 0;
		margin: auto 0;
		left: -21%;
	}
	.page3_political_text{
		font-size: 1.8rem;
	}
	.page3_candidate_name{
		font-size: 1.8rem;
	}
	.page3_vote_num{
		font-size: 1.4rem;
	}

	/*page3_search_page*/
	.page3_search_item{
		padding-left: 0;
		margin: 2rem 0;
	}
	.page3_search_page.search_bar_page{
		padding-top: 65px;
	}
	.btn_search_bar_bg{
		position: relative;
		display: block;
		width: 80%;
		height: fit-content;
		padding: 2rem;
		margin: 0 auto;
		background-color: #f5f5f5;
		margin-bottom: 1rem;
		text-align: center;
	}
	.dropdown-menu{
		font-size: 1.5rem;
	}
	.page3_search_item .btn-group{
		width: 46%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 1rem;
	}
	.page3_search_item .btn-group1,
	.page3_search_item .btn-group2,
	.page3_search_item .btn-group3,
	.page3_search_item .btn-group4{
		width: 71%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 2rem;
	}
	.page3_search_item .btn-group1{
		width: 54%;
		margin-bottom: 2rem;
	}
	.page3_search_item .btn-group3{
		margin-bottom: 0;
	}
	.page3_search_item .btn-group4{
		display: none;
		margin-bottom: 0;
	}
	.page3_search_item .btn-group5{
		margin-bottom: 0;
		width: fit-content;
	}
	.page3_search_item .btn_search_bar{
		font-size: 1.5rem;
		padding-top: 0.7rem;
		padding-bottom: 0.7rem;
	}
	.page3_search_item .btn_search_bar_submit{
		font-size: 1.5rem;
		padding: 0.7rem 5rem;
	}
	.page3_search_item .dropdown-menu{
		width: 95%;
	}

	/*當選快搜候選人資訊*/
	.page3_search_page_candidate_area{
		width: 45%;
	}

	/*page4*/
	.taiwan_map_area{
		transform: scale(1.6,1.6);
		margin: 12rem 0;
		left: auto;
		height: 74vw;
	}
	.taiwan_map_area.focus{
		height: 10vw;
	}
	.taiwan_map_area svg{
		width: 150%;
		left: -15%;
	}
	.taiwan_map_area svg text{
		font-size: 1.4rem !important;
	}
	.back_btn{
		padding: 0.5rem 1.5rem;
		border-radius: 3rem;
		top: -15%;
		right: 0%;
		left: 0%;
		width: 16rem;
		height: fit-content;
		margin: 0 auto;
	}
	.back_btn p{
		font-size: 1.8rem;
	}
	.back_btn i{
		font-size: 1.8rem;
	}
	.vote_rate_info_area{
		position: relative;
		width: 100%;
		right: 0;
		top: auto;
	}
	.vote_rate_info_box{
		text-align: center;
	}
	.vote_rate_city_name_area{
		display: inline-block;
		padding: 0 0 0 0;
		width: fit-content;
		vertical-align: middle;
		margin-right: 1.5rem;
	}
	.vote_rate_city_name{
		font-size: 1.8rem;
	}
	.vote_rate_political_area{
		display: inline-block;
		width: fit-content;
		vertical-align: middle;
	}
	.vote_rate_political_circle{
		width: 2.8rem;
		height: 2.8rem;
	}
	.vote_rate_political_name{
		font-size: 1.3rem;
	}
	.vote_rate_political_text{
		font-size: 1.3rem;
	}
	.vote_rate_candidate_area{
		padding: 0 4rem;
	}
	.vote_rate_candidate_name{
		font-size: 1.3rem;
		max-width: 5rem;
	}
	.vote_rate_status{
		min-width: 12rem;
		font-size: 1.3rem;
	}
	.vote_rate_candidate_box{
		width: 100%;
		margin: 0 auto;
	}
	.vote_rate_candidate_box p.by_election{
		bottom: -1rem;
		font-size: 1rem;
	}
	.vote_rate_2022_area{
		margin-top: 1rem;
	}
	.vote_rate_2018_area{
		margin-top: 1rem;
	}
	.information_from_area{
		left: 0;
		right: 0;
		bottom: -7%;
		margin: 0 auto;
	}
	.vote_info_msg_box{
		display: block;
		-webkit-animation: gotoNextBtn 4s 4s infinite ease-in-out;
		-moz-animation: gotoNextBtn 4s 4s infinite ease-in-out;
		-ms-animation: gotoNextBtn 4s 4s infinite ease-in-out;
		animation: gotoNextBtn 4s 4s infinite ease-in-out;
	}
	@-webkit-keyframes gotoNextBtn{
		0%,30%{opacity:0;-webkit-transform:translate(0,-8px)}
		40%{opacity:1;-webkit-transform:translate(0,0)}
		90%{opacity:1;-webkit-transform:translate(0,0)}
		100%{opacity:0;-webkit-transform:translate(0,10px)}
	}
	@-moz-keyframes gotoNextBtn{
		0%,30%{opacity:0;-moz-transform:translate(0,-8px)}
		40%{opacity:1;-moz-transform:translate(0,0)}
		90%{opacity:1;-webkit-transform:translate(0,0)}
		100%{opacity:0;-moz-transform:translate(0,10px)}
	}
	@-o-keyframes gotoNextBtn{
			0%,30%{opacity:0;-o-transform:translate(0,-8px)}
			40%{opacity:1;-o-transform:translate(0,0)}
			90%{opacity:1;-webkit-transform:translate(0,0)}
			100%{opacity:0;-o-transform:translate(0,10px)}
	}
	@-ms-keyframes gotoNextBtn{
		0%,30%{opacity:0;-ms-transform:translate(0,-8px)}
		40%{opacity:1;-ms-transform:translate(0,0)}
		90%{opacity:1;-webkit-transform:translate(0,0)}
		100%{opacity:0;-ms-transform:translate(0,10px)}
	}
	@keyframes gotoNextBtn{
		0%,30%{opacity:0;transform:translate(0,-8px)}
		40%{opacity:1;transform:translate(0,0)}
		90%{opacity:1;-webkit-transform:translate(0,0)}
		100%{opacity:0;transform:translate(0,10px)}
	}

	/*page5*/
	.page5_data_menu_box{
		width: 80%;
	}
	.page5_data_menu{
		display: block;
		margin: 0 auto 0 auto;
		border: 1px solid #643851;
	}
	.page5_data_menu:nth-child(1) {
		margin-right: auto;
		margin-bottom: 0rem;
	}
	.page5_data_menu p{
		font-size: 1.7rem;
	}
	.item_box1_1 .page5_data_menu_pc{
		display: none;
	}
	.item_box1_2 .page5_data_menu_pc{
		display: none;
	}
	/*swiper*/
	.swiper-button-next1,.swiper-button-prev1{
		display: block;
	}
	.page5_show_data_area{
		width: 100%;
	}
	.page5_show_data_box{
		height: 50vw;
	}

	/*page6*/
	.article_more_btn{
		margin: 0 auto;
	}
	.page6_card_img{
		height: fit-content;
	}
	.page6 .card-text{
		font-size: 1.9rem;
	}
	.page6 .card .card-text:nth-child(2){
		display: none;
	}

	/*page7*/
	.page7_card_img{
		height: fit-content;
	}
	.page7 .card-text{
		font-size: 1.9rem;
	}
	.page7 .card .card-text:nth-child(2){
		display: none;
	}
	

	/*page8*/
	.page8 .card{
		min-height: auto
	}
	.page8_card_img{
		height: 52vw;
	}
	.page8 .card-text{
		font-size: 1.8rem;
	}

	/*page9*/
	.video_iframe {
		width: 80%;
		height: 55vw;
	}

	/*page10*/
	.page10 .page_title br{
		display: block;
	}
	.public_election_area{
		width: 95%;
	}
	.public_election_title_text_box{
		width: 40rem;
	}
	.public_election_bar_area{
		width: 87%;
		margin: 0 auto 6rem auto;
	}
	.public_election_title_text_box p{
		font-size: 1.8rem;
	}

}
@media screen and (max-width:991px){
	html{
		font-size: 0.9rem;
	}

	/*當選快搜 候選人資訊*/
	.page3_search_page_candidate_area {
		display: block;
	}
	.page3_search_page_candidate_area .page3_political_icon.elected::before {
		left: -30%;
	}
}
@media screen and (max-width:767px){
	html{
		font-size: 0.9rem;
	}

	.nav_bar{
		height: 55px;
	}

	/*page1*/
	.page1{
		height: 150vw;
	}
	.sandwich_box{
		top: 0rem;
	}
	.main_text{
		margin: 26% auto auto auto;
	}

	/*page2*/
	.page_tittle.style1 {
		width: 42%;
		margin: 0 auto 8% auto;
	}
	.deadline_text_area .deadline_num{
		margin: 0 1rem;
	}

	/*page3*/
	.page3_candidate_area{
		padding-left: 4.2rem;
	}
	.page3_political_icon.elected::before{
		left: -25%;
	}
	.page3_search_page_candidate_name_box{
		margin-right: 0.5rem;
	}
	.page3_search_page_candidate_name{
		font-size: 1.5rem;
	}
	.page3_search_page_vote_num{
		font-size: 1.5rem;
	}

	/*page4*/
	.page_text_area{
		padding-bottom: 0.5rem;
	}
	.taiwan_map_area svg text{
		font-size: 2.2rem !important;
	}

	/*page5*/
	.page5_data_menu_box{
		width: 97%;
	}

	/*page6*/
	.page6_card_img{
		width: 100%;
	}
	.page6 .card{
		flex-direction: column;
	}

	/*page7*/
	.page7_card_img{
		width: 100%;
	}
	.page7 .card{
		flex-direction: column;
	}
	
	/*page8*/
	.page8_piece{
		width: 16%;
	}
	.swiper_title_area p{
		font-size: 1.8rem;
	}
	.page8_slider_area .item_box > p{
		font-size: 1.8rem;
	}


}
@media screen and (max-width:630px){
	html{
		font-size: 0.8rem;
	}
	.sandwich_box{
		top: 0.5rem;
	}
}
@media screen and (max-width:575px){
	html{
		font-size: 0.6rem;
	}
	.sandwich_box{
		top: 1rem;
	}

	/*當選快搜 候選人資訊*/
	.page3_search_page_candidate_area .page3_political_icon.elected::before {
		left: -35%;
	}

	/*page4*/
	.page_text_area::before{
		border-bottom: 2px solid rgb(43, 43, 43);
	}
}
@media screen and (max-width:375px){
	html{
		font-size: 0.5rem;
	}
}
@media screen and (max-width:360px){
	html{
		font-size: 0.4rem;
	}
}
@media screen and (max-width:320px){
	html{
		font-size: 0.4rem;
	}

	/*page4*/
	.back_btn{
		top: 170%;
		width: 8rem;
	}
}
@media screen and (orientation: landscape) and (max-width:1024px) {
	/* body{
		min-height: 95em;
	} */
}
@media screen and (orientation: landscape) and (max-width:980px) {
	/* body{
		min-height: 95em;
	} */
}
@media screen and (orientation: landscape) and (max-width:846px) {/*阿頡*/
	/* html{
	    font-size: 1.3rem;
	} */
}
@media screen and (orientation: landscape) and (max-width:812px) {
	/* body{
		min-height: 75em;
	} */
}
@media screen and (orientation: landscape) and (max-width:720px) {
	/* body{
		min-height: 65em;
	} */
}
@media screen and (orientation: landscape) and (max-width:640px) {
	/* body{
		min-height: 69em;
	} */
}
@media screen and (orientation: landscape) and (max-width:620px) {
	/* body{
		min-height: 69em;
	} */
}
@media screen and (orientation: landscape) and (max-width:375px) {
	/* body{
		min-height: 69em;
	} */
}