/*-------------------------------------------------------------------------------------------

	#logo

-------------------------------- */
.logo_specific{
	position:relative; z-index:1;
	display:block;
	color:var(--color-accent);
	font-size:var(--font-md); font-weight:600;
	padding:var(--space-sm) var(--space-xs);
	text-align:center;
	text-shadow: -1px 0 #fff, 0 1px #fff,
      			 1px 0 #fff, 0 -1px #fff;
}
@media (min-width:768px){
	.logo_specific{
		display:inline-block;
		background:#fff;
		border:2px solid rgba(255,255,255,0.1);
		background-clip: padding-box;
		border-radius:30px;
		color:var(--color-accent);
		font-size:var(--font-md); font-weight:600;
		padding:var(--space-xxs) var(--space-unit);
		text-align:center;

		text-shadow:none;
		box-shadow: 5px 5px 10px rgba(255,255,255,0.2),
					5px -5px 10px rgba(255,255,255,0.2),
					-5px -5px 10px rgba(255,255,255,0.2),
					-5px 5px 10px rgba(255,255,255,0.2);
	}
}


/*-------------------------------------------------------------------------------------------

	#menu

-------------------------------- */
.menu{
	display:none;
}
@media (min-width:992px){
	.menu{
		display:flex; flex-wrap:wrap;
		justify-content:flex-end;
	}
}

.menu > li{
	position:relative;
	display:block;
	margin-left:var(--space-lg);
}
.menu > li:first-child{
	margin-left:0;
}
.menu a{
	position:relative;
	display:block;
	font-size:1.125rem; font-weight:600;
	color:#fff;
	transition:transform 0.3s ease;
}
.menu a:hover{
	color:#fff;
	text-shadow:0.1em 0.1em 0.2em black;
}



/* =====加入救災按鈕 */
.btn_join{
	background:#fff;
	border:1px solid #fff;
	border-radius:2.5rem/2.5rem;
	color:var(--color-one);
	font-size:1.125rem; font-weight:600;
	padding:var(--space-sm) var(--space-xl) var(--space-sm) var(--space-lg);
	
	box-shadow: 0 0 0 0.8em transparent;
	
	-webkit-animation: pulse 2s infinite;
			animation: pulse 2s infinite;
}
.btn_join:before{
	position:absolute; bottom:0; right:0; content:"";
	width:60px; height:60px;
	background:url(../images/web-02.png) no-repeat center bottom;
	background-size:cover;
	transition:transform 0.3s ease;
}
.btn_join:hover{
	background:#fff;
	color:var(--color-accent);
	box-shadow: rgb(0,0,0,0.2) 0px 4px 4px;
}
.btn_join:hover:before{
	transform: translateX(-5px);  
}
@-webkit-keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255,255,255,0.5);
  }
}
@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255,255,255,0.5);
  }
}





/*-------------------------------------------------------------------------------------------

	#Header_fixed [is-sticky]：卷軸下捲時固定

-------------------------------- */
.header_relief.header_fixed.is-sticky{
	padding:var(--space-sm) 0;
}
.header_relief.header_fixed.is-sticky .header-two{
	display:none;
}
@media (min-width:768px){
	.header_relief.header_fixed.is-sticky .header-two{
		order:2;
		display:block;
		flex:1 1 auto;
		width:1%; min-width:0;
		margin-top:0;
	}
}
@media (min-width:1200px){
	.header_relief.header_fixed.is-sticky{
		padding:var(--space-xs) 0;
	}
	.header_relief.header_fixed.is-sticky .header-two{
		order:2;
		flex:none;
		width:auto;
		margin:0 var(--space-unit) 0 var(--space-xl);
	}	
}
	
.header_relief.header_fixed.is-sticky .logo{
	max-width:200px;
}
.header_relief.header_fixed.is-sticky .logo_specific{
	font-size:var(--font-sm); font-weight:600;
	padding:var(--space-xs) var(--space-unit);
}

.header_relief.header_fixed.is-sticky .btn_join{
	font-size:0.875rem;
	padding:var(--space-xs) 2.5rem var(--space-xs) var(--space-unit);
}
.header_relief.header_fixed.is-sticky .btn_join:before{
	width:40px; height:40px;
}





/*-------------------------------------------------------------------------------------------

	#Offside

-------------------------------- */
.offside .btnbar_join{
	margin:var(--space-lg) 0 var(--space-sm) 0;
}
.offside .btn_join{
	min-width:50%;
}





/*-------------------------------------------------------------------------------------------

	#idx

-------------------------------- */
.heading_idxsec{
	text-align:center;
	margin-bottom:var(--space-xl);
}

.heading_idxsec .heading-text{
	position:relative;
	padding:0 50px;
}

.heading_idxsec .heading-text:before,
.heading_idxsec .heading-text:after{
	position:absolute; top:50%; content:"";
	width:40px; height:2px;
	background:#333;
}
.heading_idxsec .heading-text:before{
	left:0;
}
.heading_idxsec .heading-text:after{
	right:0;
}



.btnbar_idx_more{
	justify-content:center;
	margin-top:var(--space-lg);
}
.btn_idx_more{
	background:var(--color-one) url(../images/web-03.png) no-repeat center;
	background-size:cover;
	color:#fff;
	border-radius:30px;
	padding:var(--space-sm) var(--space-xl);
	box-shadow: rgb(0,0,0,0.1) 0 4px 4px;
}
.btn_idx_more:hover{
	background-color:var(--color-accent);
	color:#fff;
	box-shadow: rgb(0,0,0,0.3) 2px 6px 6px;
}





/*-------------------------------------------------------------------------------------------

	#secbox_idx_needs

-------------------------------- */
.secbox_idx_needs{
	background:rgba(var(--color-two-rgb),0.1);
	margin:0;
	padding:var(--space-lg) 0;
}

.secbox_idx_needs.skill{
	background:rgba(var(--color-two-rgb),0.2);
}

.secbox_idx_needs .row{
	align-items:center;
}


.heading_idx_needs{
	text-align:center;
	margin:var(--space-lg) 0;
}

.heading_idx_needs .heading-text{
	position:relative;
	display:inline-block;
}
.heading_idx_needs .heading-tag{
	position:absolute; bottom:110%; left:75%;
	width:70px;
	background:var(--color-one);
	border-radius:4px;
	color:#fff;
	font-size:1rem; font-weight:600;
	text-align:center;
	padding:var(--space-xxxs);
}
.heading_idx_needs .heading-tag:before{
	position:absolute; z-index:-1; bottom:-6px; left:10px; content:"";
	width:0; height:0;
	border-top:8px solid var(--color-one);
	border-left:6px solid transparent;
	border-right:6px solid transparent;
}

.heading_idx_needs.skill .heading-tag{
	background:var(--color-accent);
}
.heading_idx_needs.skill .heading-tag:before{
	border-top-color:var(--color-accent);
}



.navbar_idx_needs a{
	position:relative;
	display:block;
	
	background:#fff;
	border:1px solid #fff;
	border-radius:10px;
	/*font-size: var(--font-unit);*/ font-weight:600;
	padding:var(--space-md) var(--space-xs);
	text-align:center;
	box-shadow: rgb(0,0,0,0.1) 0px 4px 4px;
}
.navbar_idx_needs a:hover{
	border-color:var(--color-accent);
	color:var(--color-accent);
}
@media (min-width:992px){
	.heading_idx_needs{
		text-align:left;
	}

	.navbar_idx_needs a{
		/*font-size:var(--font-unit);*/
		padding:var(--space-md) var(--font-xs);
	}
	.navbar_idx_needs a:before{
		position:absolute; bottom:0; right:10px; content:"";
		width:40px; height:40px;
		background:url(../images/web-02.png) no-repeat center bottom;
		background-size:cover;
		
		transition:transform 0.3s ease,
					opacity 0.3s ease;
		opacity:0;
	}
	.navbar_idx_needs a:hover:before{
		opacity:0.8;
		transform: translateX(5px);
	}
}





/*-------------------------------------------------------------------------------------------

	#secbox_lastest_news

-------------------------------- */
.secbox_lastest_news{
	margin:0;
	padding:var(--space-lg) 0;
}


.heading_lastest_news{
	text-align:center;
	margin-bottom:var(--space-lg);
}
@media (min-width:992px){
	.heading_lastest_news{
		text-align:left;
		margin:0;
	}
}


@media (min-width:992px){
	.secbox_lastest_news{
		margin:0;
		padding:0;
	}
	.row_lastest_news{
		position:relative;
		
		display:flex; flex-wrap:wrap;
		align-items:center;
	}
	.row_lastest_news:before{
		position:absolute; z-index:-1; top:0; right:70%; content:"";
		width:1000px; height:100%;
		background:var(--color-three)  url(../images/web-01.png) no-repeat left top;
	}
	.row_lastest_news .col-one{
		width:30%;
	}
	.row_lastest_news .col-two{
		width:70%;
		padding:var(--space-unit) var(--space-lg);
		padding-right:0;
	}
}
@media (min-width:1400px){
	.row_lastest_news:before{
		right:80%;
	}
	.row_lastest_news .col-one{
		width:20%;
	}
	.row_lastest_news .col-two{
		width:80%;
	}
}


.btnbar_news_more{
	justify-content:center;
	margin-top: var(--space-lg);
}
@media (min-width:992px){
	.btnbar_news_more{
		position:absolute; z-index:1; bottom:0; right:70%;
		margin:0;
	}
}
@media (min-width:1400px){
	.btnbar_news_more{
		right:80%;
	}
}


.btn_lastest_news{
	background:var(--color-one) url(../images/web-03.png) no-repeat center;
	background-size:cover;
	color:#fff;
	border-radius:30px;
	padding:var(--space-sm) var(--space-xl);
	box-shadow: rgb(0,0,0,0.1) 0 4px 4px;
}
.btn_lastest_news:hover{
	background-color:var(--color-accent);
	color:#fff;
	box-shadow: rgb(0,0,0,0.3) 2px 6px 6px;
}
@media (min-width:992px){
	.btn_lastest_news{
		background:rgba(255,255,255,0.6);
		border-radius:0;
		margin:0;
		padding:var(--space-sm) var(--space-md);
		box-shadow:none;
	}
	
	.btn_lastest_news .btn-text{
		position:relative;
		color:var(--color-accent);
		padding-right:12px;
	}
	.btn_lastest_news .btn-text:before{
		position:absolute; top:50%; right:0; content:"";
		width:0; height:0;
		border-top:6px solid transparent;
		border-bottom:6px solid transparent;
		border-left:8px solid var(--color-accent);
		transform:translate(0, -50%);
	}
	
	.btn_lastest_news:hover{
		background:var(--color-accent);
		box-shadow:none;
	}
	.btn_lastest_news:hover .btn-text{
		color:#fff;
	}
	.btn_lastest_news:hover .btn-text:before{
		border-left-color:#fff;
	}
}




/*首頁-最新公告*/

/* ===== #marquee-slide：跑馬燈-文字 */

.marquee-slide{
	background:rgba(var(--color-two-rgb),0.2);
	height: 88px;
	border-radius:5px;
	padding:0;
	overflow: hidden;
}

.card_marquee{
	position:relative;
	padding: var(--space-xs) var(--space-sm);
}

.card_marquee .card-info{
	color:var(--color-one-dark);
	font-weight:600;
	margin-right:var(--space-unit);
}


.card_marquee .card-name-text{
	display:block;
	font-size:var(--font-md); font-weight:600;
	line-height:34px;
	
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (min-width:992px){
	.marquee-slide{
		height: 66px;
	}

	.card_marquee{
		display:flex; flex-wrap:wrap;
		align-items:center;
	}
	.card_marquee .card-name{
		flex:1 1 auto;
		width:1%; min-width:0;
	}
}












/*-------------------------------------------------------------------------------------------

	#needs 志工媒合

-------------------------------- */
.needs-match{
	padding:var(--space-unit);
}
.formlist_needs_match > li{
	border-bottom:1px solid rgba(var(--color-two-rgb),0.4);
	padding-bottom:var(--space-sm);
	margin-bottom:var(--space-sm);
}
@media (min-width:992px){
	.needs-match{
		border:1px solid rgba(var(--color-two-rgb),0.7);
		border-radius: 10px;
		margin:var(--space-lg) 0 var(--space-xl) 0;
	}
	
	.formlist_needs_match > li:last-child{
		border-bottom-width:0;
		padding-bottom:0;
		margin-bottom:0;
	}
}

.formlist_needs_match .form-check{
	background:#fff;
	border-width:0;
	color:var(--color-one-dark);
}


.needs-match .btnbar_submit{
	margin:0;
}
.needs-match .btnbar_submit .btn{
	width:30%;
	background-color:var(--color-four);
	border-color:var(--color-four);
	color:#fff;
}
.needs-match .btnbar_submit .btn:hover{
	background-color:var(--color-accent);
	border-color:var(--color-accent);
	color:#fff;
}
@media (min-width:992px){
	.needs-match .btnbar_submit .btn{
		width:100%;
		border-radius: 5px;
		font-size:var(--font-md);
		padding:var(--space-md) var(--space-sm);
	}
}








/*-------------------------------------------------------------------------------------------

	#secbox_qa

-------------------------------- */
.secbox_qa{
}


.cardlist_idx_qa{
	align-items:stretch;
}



/*首頁-常見問題*/
.card_idx_qa{
	border:1px solid var(--color-one);
	border-radius:5px;
	padding:var(--space-sm);
	padding-left:60px;
	height:100%;
}
.card_idx_qa .card-info_sign{
	position:absolute; top:17px; left:10px;
    display:block;
    width:36px; height:36px;
	
	background:var(--color-one) url(../images/web-03.png) no-repeat left bottom;
	background-size:cover;
	
	border-radius:50%;
}
@media (min-width:992px){
	.card_idx_qa .card-info_sign{
		top:14px;
	}
}
.card_idx_qa .card-info_sign:before{
	position:absolute; top:0; left:0; content:"";
	width:100%; height:100%;
	background-color:#fff; 

    -webkit-mask-position:center;
    mask-position:center;
    
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    
    -webkit-mask-size:65% 65%;
    mask-size:65% 65%;
	
	-webkit-mask-image:url(../images/icon/icon_q.svg);
    mask-image:url(../images/icon/icon_q.svg);
}
.card_idx_qa:hover .card-info_sign{
	background:var(--color-accent); 
}
.card_idx_qa:hover .card-info_sign:after{
	border-left-color:var(--color-accent); 
}





/*-------------------------------------------------------------------------------------------

	#secbox_news

-------------------------------- */
.secbox_news{
	background:rgba(var(--color-two-rgb),0.1);
	padding:var(--space-xl) 0;
}
.secbox_news .secbox_inner{
	max-width:1000px;
	margin-left:auto; margin-right:auto;
}

.secbox_news .heading_idxsec{
	
}



/*首頁-常見問題*/
.cardlist_news > li{
	border-bottom:1px dashed rgba(var(--color-one-dark-rgb),0.7);
}
.cardlist_news > li:first-child{
	border-top:1px dashed rgba(var(--color-one-dark-rgb),0.7);
}


.card_news{
	position:relative;
	padding:var(--space-sm) var(--space-xs); padding-left:30px;
}
.card_news:before{
	position:absolute; top:25px; left:var(--space-xs); content:"";
	width:8px; height:8px;
	background:var(--color-one);
	border-radius:50%;
	/*transform:translate(0, -50%);*/
}
@media (min-width:992px){
	.card_news{
		display:flex; flex-wrap:wrap;
		align-items:center;
	}
	.card_news:before{
		top:29px;
	}
}


.card_news .card-info{
	color:var(--color-one-dark);
	font-size: var(--font-md); font-weight:600;
	margin-right:var(--space-unit);
}





/*-------------------------------------------------------------------------------------------

	#btn:我有志工需求

-------------------------------- */
/*.btn_needs{
	position:relative;
	width:100%;
	background:var(--color-four);
	border-color:var(--color-four);
	border-radius:5px;
	color:#fff;
	font-size:var(--font-unit);
	text-align:center;
	margin:0;
}
.btn_needs .iconsvg{
	display:none;
	width:30px; height:30px;
}
.btn_needs .iconsvg:before{
	background-color:var(--color-four);
}	
@media (min-width:768px){
	.btn_needs{
		position:relative;
		display:block;
		background:transparent;
		border-width:0;
		color:var(--color-four);
		font-size:var(--font-md);
		text-align:center;
	}
	.btn_needs:before{
		position:absolute; top:50%; left:50%; content:"";
		width:60px; height:60px;
		background:rgba(var(--color-four-rgb),0.1);
		border-radius:50%;
		transform:translate(-50%, -50%);
	}
	.btn_needs:after{
		position:absolute; top:50%; left:50%; content:"";
		width:100px; height:100px;
		background:rgba(var(--color-four-rgb),0.1);
		border-radius:50%;
		transform:translate(-50%, -50%);
	}
	.btn_needs .iconsvg{
		display:block;
		width:80px; height:80px;
		margin:0 auto;
		transition:transform 0.5s ease;
	}
	.btn_needs .iconsvg:before{
		background-color:var(--color-four);
	}
	
	.btn_needs:hover{
		color:var(--color-four);
	}
	.btn_needs:hover .iconsvg{
		transform:scale(1.1);
	}
	.btn_needs:hover .iconsvg:before{
		background-color:var(--color-four);
	}
	.btn_needs:hover:after{
		box-shadow: 0 0 0 0.8em transparent;
		
		-webkit-animation: pulse_pink 2s infinite;
				animation: pulse_pink 2s infinite;
	}
}
@-webkit-keyframes pulse_pink {
  0% {
    box-shadow: 0 0 0 0 rgba(var(--color-four-rgb),0.2);
  }
}
@keyframes pulse_pink {
  0% {
    box-shadow: 0 0 0 0 rgba(var(--color-four-rgb),0.2);
  }
}*/






/*-------------------------------------------------------------------------------------------

	#Accordion：手風琴效果-常見問題

-------------------------------- */
.accordion{
}

.accordion-trigger{
    cursor:pointer;
}

.accordion-collapse{ display:none; }
.accordion-collapse.is-visible{ display:block; }

.accordionPart > li{
	margin-bottom:var(--space-md);
}




.info_file{
	position:relative;
	font-size:1rem;
	margin:0;
}
.info_file a{
	display:flex; flex-wrap:wrap;
	align-items:center;
	width:100%;
}
.info_file span{
	display:block;
}
.info_file span:nth-child(2n){
	flex:1 1 auto;
	width:1%; min-width:0;
	margin-left:4px;
}
.info_file img{
	width:32px; height:32px;
}






/*-------------------------------------------------------------------------------------------

	#view 詳細頁

-------------------------------- */
.itembox_intro{
	margin-top:0;
}


/* ===== [in view]：詳細頁-相片集 */
.itembox_view_figure{
	margin:var(--space-xl) 0;
}
.itembox_view_figure .row{
	justify-content:center;
}



/* ===== [in view]：相片集大標 */
.heading_figure{
	margin:1rem 0 2rem 0;
	color:var(--color-two);
	text-align:center;
	overflow:hidden;
}
.heading_figure .heading-text{
	position:relative;
	display:inline-block;
	font-size:1.1rem;
	letter-spacing:10px;
	text-transform:uppercase;
}
.heading_figure .heading-text:before, 
.heading_figure .heading-text:after{
	position:absolute; top:50%; content:"";
	width:1000px; height:1px;
	background:var(--color-two);
}
.heading_figure .heading-text:before{ left:-1010px; }
.heading_figure .heading-text:after{ right:-1010px; }



/* ===== [in view ]：下載按鈕 */
.btnbar_download{
	margin-top:var(--space-unit);
}
.btn_download{
	background:#fff;
	border:2px solid var(--color-one);
	border-radius:20px;
	color:var(--color-one);
}
.btn_download .iconsvg:before{
	background-color:var(--color-one);
}

.btn_download:hover{
	background:var(--color-one);
	border-color:var(--color-one);
	color:#fff;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
}
.btn_download:hover .iconsvg:before{
	background-color:#fff;
}



/* ===== [in view ]：主內容區-頁尾 */
.itembox_mainbtm{
	border-top:1px dashed #ccc;
	padding-top:var(--space-unit);
	margin-top:var(--space-unit);
}
.itembox_mainbtm .itembox_row{ align-items:center; } 
.itembox_mainbtm .itembox-left{ order:2; margin-top:var(--space-unit); }
.itembox_mainbtm .itembox-right{ order:1; }

@media (min-width:768px){
    .itembox_mainbtm .itembox-left{ order:1; width:50%; margin:0; }
	.itembox_mainbtm .itembox-right{ order:2; width:50%; margin:0; }
}




/* ===== [in view]：返回按鈕 */
@media (min-width:768px){
	.btnbar_pageback{
		justify-content:flex-start;
	}
}
.btn-pageback{
	background:transparent;
	border-color:transparent;
	color:#333;
	font-size:1rem;
	padding:var(--space-xxxxs);
}
.btn-pageback .iconsvg:before{
	background-color:#333;
}
.btn-pageback:hover{
	color:var(--color-accent);
}
.btn-pageback:hover .iconsvg:before{
	background-color:var(--color-accent);
}



/* ===== [in view]#social link */
.sharelink_bar{ text-align:center; }
.sharelink{ display:inline-block; margin-top:5px; }

@media (min-width:768px){
	.sharelink_bar{ text-align:right; }
}










/*-------------------------------------------------------------------------------------------

	#card_needs：志工需求

-------------------------------- */
/*.card_needs{
	border:1px solid #ccc;
	border-left-width:5px;
	border-left-color:#EF4444;
	padding:var(--space-xs); padding-left:var(--space-unit);
}

.card_needs.status_finish{
	border-left-color:#22C55E;
}


.card_needs .card_top{
	border-bottom:1px dashed #ccc;
	padding-bottom:var(--space-xs);
	margin-bottom:var(--space-xs);
}*/


/*狀態*/
/*.card_needs .info_status{
	color:#EF4444;
	font-size:var(--font-lg); font-weight:600;
}
.card_needs .info_status .iconsvg{
	width:24px; height:24px;
	margin-right:3px;
}
.card_needs .info_status .iconsvg:before{
	background-color:#EF4444;
}

.card_needs .info_status.status_finish{
	color:#22C55E;
}
.card_needs .info_status.status_finish .iconsvg:before{
	background-color:#22C55E;
}*/


/*進度*/
/*.card_needs .info_progress{
	width:100%; height:100%;
	background:rgba(var(--color-four-rgb),0.1);
	font-size:var(--font-unit);
	padding:var(--space-sm);
	color:var(--color-four);
}
.card_needs .info_progress span:nth-child(1){
	width:70%;
}
.card_needs .info_progress span:nth-child(2){
	width:30%;
	text-align:right;
}

.card_needs.status_finish .info_progress{
	background:#eee;
	color:#333;
}*/


/*資訊*/
/*.card_needs .infolist .info{
	font-weight:600;
	margin:0;
}
.card_needs .infolist .info .info-text{
	flex:1 1 auto;
	width:1%; min-width:0;
}

.card_needs .infolist .iconsvg{
	width:18px; height:18px;
	margin-right:3px;
}

.card_needs .infolist .iconsvg:before{
	background-color:var(--color-one);
}*/


/*.card_needs .btnbar{
}
.card_needs .btn{
	width:40%;
	background:var(--color-one) url(../images/web-03.png) no-repeat left bottom;
	background-size:cover;
	color:#fff;
}
.card_needs .btn br{
	display:none;
}
.card_needs .btn:hover{
	background-color:var(--color-four);
	color:#fff;
}

@media (min-width:768px){
	.card_needs .btnbar{
		justify-content:flex-end;
	}
	.card_needs .btn{
		align-items:center; justify-content:center;
		
		width:60px; height:60px;
		border-radius:50%;
		line-height:1.8;
		padding:0;
	}
	.card_needs .btn br{
		display:block;
	}
}*/





/*-------------------------------------------------------------------------------------------

	#card_location：志工站點

-------------------------------- */
.card_location{
	border:1px solid #ccc;
	padding:var(--space-xs);
}

.card_location .card-name{
	text-align:center;
}


/*資訊*/
.card_location .infolist{
	border-top:1px dashed #ccc;
	border-bottom:1px dashed #ccc;
	margin:var(--space-xs) 0;
	padding:var(--space-xs) 0;
}
.card_location .infolist .info{
	font-size:var(--font-sm);
	font-weight:600;
	margin:0;
}
.card_location .infolist .info .info-text{
	flex:1 1 auto;
	width:1%; min-width:0;
}

.card_location .infolist .iconsvg{
	width:18px; height:18px;
	margin-right:3px;
}

.card_location .infolist .iconsvg:before{
	background-color:var(--color-one);
}


.card_location .btnbar{
	margin:0;
}
.card_location .btn{
	width:40%;
	background:rgba(var(--color-two-rgb),0.2);
	font-size:var(--font-sm);
	padding:var(--space-xxs) var(--space-xxxs);
}
.card_location .btn:hover{
	background:var(--color-one) url(../images/web-03.png) no-repeat left bottom;
	background-size:cover;
	color:#fff;
}
.card_location .btn:hover .iconsvg:before{
	background-color:#fff;
}


/*地圖*/
.mapbox{
	width:100%; height:500px;
}
.mapbox iframe{
	width:100%; height:100%;
}





/*-------------------------------------------------------------------------------------------

	#card_qa：常見問題

-------------------------------- */
.card_qa{
}

.card_qa .card-info_sign{ display:none; }


/*展開-加號*/
.card_qa .card-info_open{
	position:absolute; top:50%; right:10px;
	width:30px; height:30px;
	border-radius:50%;
	margin-top:-15px;
}
.card_qa .card-info_open:before,
.card_qa .card-info_open:after{
    position:absolute; left:50%; top:50%; content:"";
	width:2px; height:12px;
    margin-left:-1px; margin-top:-6px;
	background:#333;
	
	border-radius:2px;
    transition:transform 0.4s ease-in-out;
}
.card_qa .card-info_open:before{ transform:rotate(90deg); }


.accordion-trigger.is-open .card_qa .card-info_open{
	background:var(--color-accent);
	opacity:1;
}
.accordion-trigger.is-open .card_qa .card-info_open:before,
.accordion-trigger.is-open .card_qa .card-info_open:after{
	background:#fff;
}
.accordion-trigger.is-open .card_qa .card-info_open:before{
	transform:rotate(135deg);
}
.accordion-trigger.is-open .card_qa .card-info_open:after{
	transform:rotate(45deg);
}	

.card_qa .btn-bar{ text-align:right; }


.card_qa .card-header{
	position:relative;
	border:1px solid var(--color-one);
	background:#fff;
	border-radius:3px;
	color:#333;
	cursor:pointer;
	padding:var(--space-md) var(--space-xl);
}
.card_qa .card-header:hover{
	background:rgba(var(--color-two-rgb),0.1);
}

.card_qa .card-info_q{
	position:absolute; top:50%; left:10px;
    display:block;
    width:36px; height:36px;
    margin-top: -18px;
	
	background:var(--color-one) url(../images/web-03.png) no-repeat left bottom;
	background-size:cover; 
	
	border-radius:50%;
}
.card_qa .card-info_q:before{
	position:absolute; top:0; left:0; content:"";
	width:100%; height:100%;
	background-color:#fff; 

    -webkit-mask-position:center;
    mask-position:center;
    
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    
    -webkit-mask-size:65% 65%;
    mask-size:65% 65%;
	
	-webkit-mask-image:url(../images/icon/icon_q.svg);
    mask-image:url(../images/icon/icon_q.svg);
}
.accordion-trigger.is-open .card_qa .card-info_q{
	background:#fff;
}
.accordion-trigger.is-open .card_qa .card-info_q:before{
	background-color:var(--color-one);
}		


.card_qa .card-info_a{
	display:none;
}

.card_qa .card-name{
	color:#333;
	padding:0;
	margin:0;
}
.card_qa .card-header:hover .card-name{
	color:var(--color-one); 
}

.card_qa .card-body {
	background:#fff;
	color:#777;
	padding:var(--space-sm); padding-left:var(--space-xl);
	margin-top:0;
}

.accordion-trigger.is-open .card_qa .card-header{
	background:var(--color-one) url(../images/web-01.png) no-repeat left bottom;
	background-size:cover; 
	border-color:var(--color-one);
}
.accordion-trigger.is-open .card_qa .card-name{
	color:#fff;
}

.card_qa .card-text{
	color:#333;
}





/*-------------------------------------------------------------------------------------------

	#card_download：文件下載

-------------------------------- */
.cardlist_download > li{
	border-bottom:1px dashed rgba(91,57,20,0.4);
}
.cardlist_download li:first-child{
	border-top:1px dashed rgba(91,57,20,0.4);
}
@media (min-width:992px){
    .cardlist_download li:first-child{
        border-top-width:0;
    }
}
.cardlist_download > li:nth-child(2n){
	background:rgba(var(--color-two-rgb),0.05);
}

.card_download{
	padding:var(--space-xs);
}
.card_download .card-td_date{
	order:1;
	flex:none;
	width:50%;
}
.card_download .card-td_name{
	order:3;
	width:100%;
}
.card_download .card-td_file{
	order:4;
	width:100%;
}
.card_download .card-name{
	margin:0;
}
.card_download .card-name a{
	padding:0.2rem 0;
}

.card_download .card-td_file{
	padding-left:var(--space-md);
}
@media (min-width:992px){
	.card_download{
		padding:0;
	}

	.card_download .card-td_date{
		order:1;
		width:100px;
		margin-right:20px;
		color:var(--color-one-dark);
		font-weight:600;
	}
	.card_download .card-td_name{
		order:2;
		flex:2 1 auto; width:1%;
		min-width:0;
	}
	.card_download .card-td_file{
		order:3;
		flex:1 1 auto;
		width:1%; min-width:0;
		padding:0;
	}
	.card_download .card-name a{
		padding:1.1rem 0;
	}
}




.card_download_header{
    display: none;
}
@media (min-width:992px){
    .card_download_header{
        display: block;
        background:rgba(var(--color-two-rgb),0.1);
		border-bottom:1px solid rgba(var(--color-two-rgb),0.8);
        border-radius:5px;
        color:var(--color-one-dark);
        font-size:0.875rem; font-weight:600;
        padding:0.1rem 1rem;
    }
}





/*-------------------------------------------------------------------------------------------

	#contact

-------------------------------- */
.qrcodebox{
	max-width:600px;
	margin:var(--space-lg) auto;
}
.qrcodebox img{
	display:block; max-width:100%; height:auto;
}



.secbox_contact{
	overflow:hidden;
}

.contact-infobox .col{
	position:relative;
	padding:var(--space-xl) var(--space-sm);
}
.contact-infobox .col-one{
	background:rgba(var(--color-two-rgb),0.1);
}
.contact-infobox .col-two{
	background:rgba(var(--color-two-rgb),0.2);
}
@media (min-width:992px){
    .contact-infobox{
		display:flex; flex-wrap:wrap;
		align-items:stretch
	}
	.contact-infobox .col{
		width:50%;
		background:transparent;
	}
	
	.contact-infobox .col-one:before,
	.contact-infobox .col-two:before{
		position:absolute; top:0; content:"";
		width:1000px; height:100%;
	}
	.contact-infobox .col-one:before{
		right:0;
		background:rgba(var(--color-two-rgb),0.1);
	}
	.contact-infobox .col-two:before{
		left:0;
		background:rgba(var(--color-two-rgb),0.2);
	}
}


.infobox_contact{
	max-width:500px;
	margin:0 auto;
}
.info_contact{
	display:block;
	font-weight:600;
	text-align:center;
}

.info_contact .info-title{
	display:inline-block;
	background:var(--color-one) url(../images/web-01.png) no-repeat left bottom;
	background-size:cover; 
	border-color:var(--color-one);
	border-radius:25px;
	color:#fff;
	font-size:var(--font-unit);
	padding:var(--space-xxxs) var(--space-unit);
}

.info_contact .info-text{
	display:block;
	width:100%;
	font-size:var(--font-lg);
	font-style:italic;
}

.info_contact .info-text,
.info_contact .info-text a{
	color:var(--color-one-dark);
}

.info_contact .info-text a:hover{
	color:var(--color-accent);
}
@media (min-width:992px){
	.info_contact .info-title{
		font-size:var(--font-md);
	}
	
	.info_contact .info-text{
		font-size:var(--font-xl);
	}
}





/*-------------------------------------------------------------------------------------------

	#card_figure 相片集

-------------------------------- */
.card_figure .card-photo{
	border:1px solid transparent;
	transition:transform 0.3s ease;
}
.card_figure:hover .card-photo{
	transform: translateY(-5px);
}

.card_figure .card-text{
	color:#666;
	font-size:0.875rem;
	text-align:center;
	margin-top:5px;
}