/*----------------------------------------------------------------------
	{C} #card [骨架 base；來源 main]
-------------------------------- */

/* ===== 取消將連結擴展至整個card */
.card_store .card-name a:before,
.card_people .card-name a:before,
.card_post .card-name a:before,
.card_post_sub .card-name a:before{
	display:none;
}



/*----------------------------------------------------------------------
	{C} 【本專案：n】 #eft-photo-limit [來源 #eft-photo-limit [圖片寬度受限]]
-------------------------------- */
.eft-photo-limit .card-photo{
	display:block;
	width:100%;
	max-width:220px;
	background:rgba(255,255,255,0.6);
	margin:0 auto;
	overflow:hidden;
}



/*----------------------------------------------------------------------
	{C} 【本專案：n】 #eft-photo-radius-full [來源 #eft-photo-radius-full [圖片圓形框]]
-------------------------------- */
/*.eft-photo-radius-sm .card-photo{
	border-radius:1rem;
}

.eft-photo-radius-full .card-photo{
	border-radius:50%;
}*/
/*.eft-photo-radius-full .card-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}*/




/*----------------------------------------------------------------------
	{C} 共用_#eft-symbolinfo [來源 #eft-symbolinfo [有圖標info]]
-------------------------------- */
.eft-symbolinfo{
}
.eft-symbolinfo .card-infobar{
	gap:var(--spacing-xs);
	
	border-width:0;
	border-style:dashed;
	border-color:rgba(var(--color-one-rgb),0.2);
	text-align:left;
}
.eft-symbolinfo .card-infobar .card-info{
	align-items:flex-start;
	gap:var(--spacing-2xs);
	
	width:100%;
	font-size:var(--text-xs); font-weight:600;
	padding:0 var(--spacing-2xs);
}
.eft-symbolinfo .card-infobar .card-info,
.eft-symbolinfo .card-infobar .card-info a{
	color:#333;
}
.eft-symbolinfo .card-infobar .card-info a:hover,
.card:hover .card-infobar .card-info a{
	color:#fff;
}

.eft-symbolinfo .card-infobar .card-info .iconsvg{
	margin-top:2px;
}
.eft-symbolinfo .card-infobar .card-info .iconsvg:before{
	--icon-color: #333;
}
.eft-symbolinfo .card-infobar .card-info .card-info-text{
	flex:1 1 auto;
    width:1%; min-width:0;
}


/* ===== [in 512_#store 、 490_#people] */
.card_store .card-infobar,
.card_people .card-infobar{
	border-width:1px 0 0 0;
	
	padding-top:var(--spacing-sm);
	margin-top:var(--spacing-sm);
}


/* ===== [in 455_#franchiser] */
.card_franchiser .card-infobar{
	border-width:1px 0;
	
	padding:var(--spacing-base) 0;
	margin:var(--spacing-sm) 0;
}








/*----------------------------------------------------------------------
	{C} #effect [骨架 base；來源 main]
-------------------------------- */
.effect_base_vt .card-photo,
.effect_bg_vt .card-photo,
.effect_base_hz .card-photo,
.effect_bg_hz .card-photo,
.effect_btm_arrow .card-photo{
	background:#fff;
	border-radius:0.5rem/0.5rem;
	overflow:hidden;
}
.effect_base_vt .card-photo .item-fitimg,
.effect_bg_vt .card-photo .item-fitimg,
.effect_base_hz .card-photo .item-fitimg,
.effect_bg_hz .card-photo .item-fitimg,
.effect_btm_arrow .card-photo .item-fitimg{
	transition: transform 0.5s ease;
}
.effect_base_vt:hover .card-photo .item-fitimg,
.effect_bg_vt:hover .card-photo .item-fitimg,
.effect_base_hz:hover .card-photo .item-fitimg,
.effect_bg_hz:hover .card-photo .item-fitimg,
.effect_btm_arrow:hover .card-photo .item-fitimg{
	transform: scale(1.1);
}





/*----------------------------------------------------------------------
	{C} 【本專案：n】 #effect_base_vt [來源 #effect_base_vt [直式-白底有色雲]]
-------------------------------- */
.effect_base_vt{
	background:#fff;
	border:1px solid rgba(var(--color-one-rgb),0.4);
	border-radius:1rem/1rem;
	padding:1rem; padding-bottom:1.5rem;
	box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
	transition: background 0.3s ease,
				box-shadow 0.3s ease;
	overflow:hidden;
}

.effect_base_vt:before,
.effect_base_vt:after{
	position: absolute; z-index:-1; bottom:0; right:0; content: "";
	
	-webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
			
	transition: transform 0.5s ease;
}
.effect_base_vt:before{
	width:360px; height:200px; /*90:50*/
	
	background-color:rgba(var(--color-one-rgb),0.3);
	-webkit-mask-image: url(../images/cloud-04.svg);
   			mask-image: url(../images/cloud-04.svg);
			
	transform:translate(30%, 25%);
}
.effect_base_vt:after{
	width:480px; height:200px; /*120:50*/
	
	background-color:rgba(var(--color-one-rgb),0.1);
	-webkit-mask-image: url(../images/cloud-05.svg);
   			mask-image: url(../images/cloud-05.svg);

	transform:translate(30%, 25%);
}


.effect_base_vt:hover{
	background:var(--color-gradient-three);
	border-color:transparent;
	box-shadow: none;
}
.effect_base_vt:hover:before{
	background-color:rgba(255,255,255,0.3);
}
.effect_base_vt:hover:after{
	background-color:rgba(255,255,255,0.1);
}


.effect_base_vt:hover .card-name,
.effect_base_vt:hover .card-name a,
.effect_base_vt .card-name a:hover,
.effect_base_vt:hover .card-name a:hover{
	color:#fff;
	text-shadow: black 0.1em 0.1em 0.2em;
}

.effect_base_vt:hover .card-text,
.effect_base_vt:hover .card-info{
	color:rgba(255,255,255,0.9);
}
.effect_base_vt:hover .card-info .iconsvg:before{
	--icon-color: rgba(255,255,255,0.8);
}



.effect_base_vt .card-btn:hover{
	border-color:#fff;
}



/*----------------------------------------------------------------------
	{C} 【本專案：n】 #effect_base_hz [來源 #effect_base_hz [橫式-白底有色雲]]
-------------------------------- */
.effect_base_hz{
	background:#fff;
	border:1px solid rgba(var(--color-one-rgb),0.4);
	border-radius:1rem/1rem;
	padding:1rem; padding-bottom:1.5rem;
	box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
	transition: background 0.3s ease,
				box-shadow 0.3s ease;
	overflow:hidden;
}

.effect_base_hz:before,
.effect_base_hz:after{
	position: absolute; z-index:-1; bottom:0; right:0; content: "";
			
    -webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
			
	transition: transform 0.5s ease;
}
.effect_base_hz:before{
	width:360px; height:200px; /*90:50*/
	
	background-color:rgba(var(--color-one-rgb),0.3);
	-webkit-mask-image: url(../images/cloud-04.svg);
   			mask-image: url(../images/cloud-04.svg);
	
	transform:translate(30%, 25%);
}
.effect_base_hz:after{
	width:480px; height:200px; /*120:50*/
	
	background-color:rgba(var(--color-one-rgb),0.1);
	-webkit-mask-image: url(../images/cloud-05.svg);
   			mask-image: url(../images/cloud-05.svg);
	
	transform:translate(30%, 25%);
}

.effect_base_hz:hover{
	background:var(--color-gradient-three);
	border-color:transparent;
	box-shadow: none;
}
.effect_base_hz:hover:before{
	background-color:rgba(255,255,255,0.3);
}
.effect_base_hz:hover:after{
	background-color:rgba(255,255,255,0.1);
}


.effect_base_hz:hover .card-name,
.effect_base_hz:hover .card-name a,
.effect_base_hz .card-name a:hover,
.effect_base_hz:hover .card-name a:hover{
	color:#fff;
	text-shadow: black 0.1em 0.1em 0.2em;
}

.effect_base_hz:hover .card-text,
.effect_base_hz:hover .card-info{
	color:rgba(255,255,255,0.8);
}
.effect_base_hz:hover .card-info .iconsvg:before{
	--icon-color: rgba(255,255,255,0.8);
}


.effect_base_hz .card-btn:hover{
	border-color:#fff;
}




/*----------------------------------------------------------------------
	{C} 【本專案：n】 #effect_btm_arrow [來源 #effect_btm_arrow]
-------------------------------- */
.effect_btm_arrow{
	background:#fff;
	border:1px solid #fff;
	border-radius:1rem/1rem;
	padding:1rem; padding-bottom:0;
	box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
	transition: background 0.3s ease,
				box-shadow 0.3s ease;
	overflow:hidden;
	text-align:center;
}
.effect_btm_arrow:hover{
	background:var(--color-gradient-two);
	box-shadow: none;
}

.effect_btm_arrow .card-photo{
	background:#fff;
}

.effect_btm_arrow .card-body{
	position:relative; z-index:2;
}

.effect_btm_arrow:hover .card-name a,
.effect_btm_arrow:hover .card-name a:hover{
	color:#fff;
	text-shadow: black 0.1em 0.1em 0.2em;
}


.effect_btm_arrow .card-text,
.effect_btm_arrow:hover .card-info{
	color:var(--color-dark-one);
}
.effect_btm_arrow .card-info .iconsvg:before{
	--icon-color: var(--color-dark-one);
}

.effect_btm_arrow:hover .card-text,
.effect_btm_arrow:hover .card-info{
	color:rgba(255,255,255,1);
}
.effect_btm_arrow:hover .card-info .iconsvg:before{
	--icon-color: rgba(255,255,255,1);
}


.effect_btm_arrow .card-btnbar{
}
.effect_btm_arrow .card-btn{
	width:140px; height:50px;
	background:transparent;
	border-radius:0;
	border-width:0;
	margin:0;
	overflow:visible;
	
	transform:translate(0, 20px);
	transition: transform 0.5s ease;
	
}

.effect_btm_arrow .card-btn:before{
	position: absolute; z-index:-2; top: 0; right:-20px; content: "";
	width:140px; height:50px; /*140:50*/
	
	background:transparent;
	border-radius:0;
	
	background-color:#fff;
	-webkit-mask-image: url(../images/cloud-10.svg);
   			mask-image: url(../images/cloud-10.svg);
			
    -webkit-mask-position: center left;
    		mask-position: center left;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
			
	transform-origin:center center;
	transform:translateY(0);
	
	-webkit-transition: transform 0.5s ease;
			transition: transform 0.5s ease;
			
	transition: background-color 0.5s ease;
	opacity:0;
}

.effect_btm_arrow .card-btn:after{
	position: absolute; z-index:-1; bottom:0; right:0; content: "";
	width:140px; height:50px; /*140:50*/
	
	background-color:var(--color-one);
	-webkit-mask-image: url(../images/cloud-10.svg);
   			mask-image: url(../images/cloud-10.svg);
			
    -webkit-mask-position: center left;
    		mask-position: center left;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
}
.effect_btm_arrow .card-btn .card-btn-text{
	display:none;
	
}

.effect_btm_arrow .card-btn .iconsvg{
	--icon-size: 30px;
	
	position:absolute; top:50%; left:50%;
	transform:translate(-50%, -50%);
}
.effect_btm_arrow .card-btn .iconsvg:before{
	--icon-color: #fff;
	--icon-url: url(../images/icon/icon_go.svg);
}


.effect_btm_arrow:hover .card-btn{
	transform:translate(0, 15px);
	box-shadow:none;
}
.effect_btm_arrow:hover .card-btn:before{
	opacity:0.2;
}
.effect_btm_arrow:hover .card-btn:after{
	background-color:#fff;
}

.effect_btm_arrow:hover .card-btn .iconsvg:before{
	--icon-color: var(--color-accent);
}





/*----------------------------------------------------------------------
	{C} 【本專案：n】 #effect_albums [來源 #effect_albums]
-------------------------------- */
.effect_albums .card-photo{
	border:1px solid rgba(var(--color-one-rgb),0.2);
	border-radius:0.5rem/0.5rem;
	overflow:hidden;
}

.effect_albums .card-name{
	text-align:center;
	margin:var(--spacing-base) 0;
}

@media (min-width:992px){
	.effect_albums .card-body{
		position:absolute; top:0; left:0;
		width:100%; height:100%;
	}
	
	
	.cardlist_albums_idx .effect_albums{
		max-width:90%;
		margin:0 auto 2rem auto;
	}
	.cardlist_albums_idx li:nth-of-type(2n) .effect_albums{
		margin-top:3rem;
	}
	
	.effect_albums .card-name{
		position:absolute; z-index:5; top:0; left:0;
		width:100%; height:100%;
		margin:0;
	}
	.effect_albums .card-name a{
		display:flex; flex-wrap:wrap;
		align-items:center; justify-content:center;
		
		width:100%; height:100%;
		padding:27%;
		text-align:center;
	}
	.effect_albums .card-name a:before{
		position:absolute; z-index:-1; top:15%; left:15%; content:"";
		width:70%; height:70%;
		background:rgba(255,255,255,0.7);
	}
	.effect_albums .card-name a:after{
		position:absolute; z-index:-1; top:15%; left:15%; content:"";
		width:calc( 70% + 30px ); height:calc( 70% + 30px );
		margin-left:-15px; margin-top:-15px;
		border:2px solid rgba(255,255,255,0.8);
	}
	.effect_albums .card-name-text{
		display:block;
		color:var(--color-dark-one);
		
		display:-webkit-box; 
		text-overflow:ellipsis; overflow:hidden;
		-webkit-box-orient:vertical; white-space:normal;
		-webkit-line-clamp:2;
	}
	
	
	.effect_albums .card-name a:before,
	.effect_albums .card-name a:after,
	.effect_albums .card-name-text{
		transform:scale(0.9);
		
		transform-origin:center center;
		transition: transform 0.5s ease;
	}
	.effect_albums:hover .card-name a:before,
	.effect_albums:hover .card-name a:after,
	.effect_albums:hover .card-name-text{
		transform:scale(1);
	}
	

	.effect_albums:hover .card-name a:before{
		background:rgba(255,255,255,0.9);
	}
}




/*----------------------------------------------------------------------
	{C} 【本專案：n】 #effect_profile [來源 #effect_profile [人物介紹]]
-------------------------------- */
.effect_profile{
	text-align:center;
}

.effect_profile .card-photo{
	display:block;
	max-width:220px;
	background:rgba(255,255,255,0.6);
	border-color:#ccc;
	border-radius:50%;
	margin:0 auto;
	overflow:hidden;
}
.effect_profile .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}

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







/*----------------------------------------------------------------------
	{C} 219_#about [來源 219_#about [關於我們]]
-------------------------------- */
.card_about_one,
.card_about_two{
	background:transparent;
}

/* ===== in idx */
.card_about_one .card-name,
.card_about_two .card-name{
	display:none;
}

.card_about_one .card-text,
.card_about_two .card-text{
	font-size:var(--text-lg);
	margin-top:0;
}

.card_about_one .card-text, .card_about_one .card-text a,
.card_about_two .card-text, .card_about_two .card-text a{
	color:#333;
}
.card_about_one .card-text a:hover
.card_about_two .card-text a:hover{
	color:var(--color-accent);
}


/* ===== 多則之第一則 [in idx] */
.idx_about_one{
	position:relative;
	padding-bottom:var(--spacing-md);
}

.card_about_one{
	border-width:0;
	margin-bottom:var(--spacing-md);
}
.card_about_one .card-photo{
	background:transparent;
	margin-bottom:var(--spacing-md);
}
.card_about_one .card-photo img{
	margin-left:auto; margin-right:auto;
	/* 圖片小於限定區塊時，圖片置中 */
}

.card_about_one .card-btnbar{
	justify-content: center;
	margin-top:var(--spacing-md);
}



/* ===== 多則之第二則以後 [in idx] */
.card_about_two{
	border-width:0;
	margin-bottom:var(--spacing-md);
}

.idx_about_two_figure{
	position:relative;
	max-width:1000px;
	margin:0 auto;
}


/*關於我們slide*/
.baseslide-container{
	position:relative;
}
.swiper-baseslide{
	width: 100%;
	height: auto;
}
.card_baseslide .card-photo{
    border-radius: 1rem/1rem;
    overflow: hidden;
}
.card_baseslide .card-text{
	display:none;
}


.baseslide-fixed{
	position:absolute; z-index:5; top:5px; left:15px;
}
.baseslide-pagination .swiper-pagination-bullet{
	vertical-align:middle;
	width:10px; height:10px;
	background: #ccc;
	margin:2px;
}
.baseslide-pagination .swiper-pagination-bullet:hover{
	background:#fff;
	 opacity: 1;
}
.baseslide-pagination .swiper-pagination-bullet-active {
	width:12px; height:12px;
    background: #fff;
    opacity: 1;
}





/*----------------------------------------------------------------------
	{C} 220_#albums [來源 220_#albums [相簿管理]]
-------------------------------- */







/*----------------------------------------------------------------------
	{C} 293_#download [來源 293_#download [文件下載]]
-------------------------------- */
.card_download{
	padding-bottom:1rem;
}
.card_download .card-text{
	font-size:var(--text-base);
}
.card_download .card-btnbar{
	justify-content:flex-end;
}
.card_download .card-btn{
	margin-bottom:0;
}






/*----------------------------------------------------------------------
	{C} 225_#qa [來源 225_#qa [常見問題] [use #accordion:component]]
-------------------------------- */
.card_qa{
}
.card_qa .card-header{
	padding: 1.5rem 5rem 1.5rem 3.5rem;
}

.card_qa .card-body{
	border:1px solid #eee;
	padding: 1rem 1.5rem 1rem 3.5rem;
}


/*符號-q*/
.card_qa .card-sign_q{
	position:absolute; top:50%; left:10px;
    display:block;
    width:36px; height:36px;
	background:var(--color-one); 
	transform:translate(0, -50%);
	border-radius:50%;
}
.card_qa .card-sign_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);
}
.card_qa .card-sign_q:after{
	position:absolute; z-index:1; bottom:1px; right:-12px; content:"";
	width:0; height:0;
	
	border-left:8px solid var(--color-one);

	transform:rotate(21deg);
}

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



/*開啟項目*/
.card_qa .accordion-button.active .card-name{
	color:#fff;
}
.card_qa .accordion-button.active .card-sign_q{
	background:#fff;
}
.card_qa .accordion-button.active .card-sign_q:before{
	background-color:var(--color-one); 
}



.card_qa .card-text{
	font-size:var(--tex-base);
}





/*----------------------------------------------------------------------
	{C} 244_#member [來源 244_#member [會員管理] [use #accordion:component]]
-------------------------------- */
.card_member{
}


.card_member_headline,
.card_member .card-header{
	padding: 0.75rem 3rem 0.75rem 1rem;
}
.card_member_headline{
	padding-top:0.25rem;
	padding-bottom:0.25rem;
}
@media (min-width:768px){
	.card_member_headline,
	.card_member .card-header{
		padding-right:5rem;
	}
}



.card_member .card-body{
	border:1px solid #eee;
	padding: 1rem 1rem;
}


.card_member .card-td.jobtitle{
	display:none;
}
@media (min-width:768px){
	.card_member .card-td.jobtitle{
		display:block;
	}
}

.card_member .card-name{
	margin:0;
}
.card_member .card-name span{
	display:block;
}
.card_member .card-name span:last-child{
	font-size:var(--text-sm);
}
@media (min-width:768px){
	.card_member .card-name span{
		display:inline;
	}
}

.card_member .card-jobtitle{
	display:inline-block;
	background:rgba(var(--color-one-rgb),0.1);
	border-radius:30px;
	color:var(--color-dark);
	font-size:var(--text-sm); font-weight:600;
	padding:0.25rem 1rem;
}


/*開啟項目*/
.card_member .accordion-button.active .card-name{
	color:#fff;
}
.card_member .accordion-button.active .card-jobtitle{
	background-color: rgba(255,255,255,0.2);
	color:#fff;
}




.card_member .card-body-left{
	margin-bottom:var(--spacing-md);
}
@media (min-width:768px){
	.card_member .card-body-row{
		display:flex; flex-wrap:wrap;
	}
	.card_member .card-body-left{
		width:200px;
		margin-right:30px; margin-bottom:0;	
	}
	.card_member .card-body-right{
		flex:1 1 auto;
		width:1%; min-width:0;
	}
}

.card_member .card-photo{
	max-width:400px; margin:0 auto;
}


/*開啟區塊-資訊組*/
.card_member .card-infolist .card-info,
.card_member .card-infolist .card-info a{
	color:#333;
}
.card_member .card-infolist a{
	text-decoration:underline;
}
.card_member .card-infolist .card-info a:hover{
	color:var(--color-accent); 
}

.card_member .card-infolist{
	gap:0;
}
.card_member .card-infolist li:hover{
	background:rgba(var(--color-one-rgb),0.05);
}
.card_member .card-infolist .card-info{
	padding:0.5rem 0;
	font-size:var(--text-base); font-weight:600;
	border-bottom:1px dashed rgba(var(--color-one-rgb),0.1);
}
.card_member .card-infolist .card-info-title{
	position:relative;
	color:var(--color-one);
	width:100px;
	padding:0 1rem 0 0;
	text-align:right;
}
.card_member .card-infolist .card-info-title:after{
	position:absolute; top:2px; right:0; content:"：";
	line-height:1;
}
	
.card_member .card-infolist .card-info-text{
	flex:1 1 auto;
	width:1%; min-width:0;
	
	padding-left:0;
}
@media (min-width:1200px){
	.card_member .card-infolist{
		display:flex; flex-wrap:wrap;
		align-items:center;
		margin-top:0;
	}
	.card_member .card-infolist li{
		width:calc( (100% - var(--spacing-xs)) / 2 );
	}
	.card_member .card-infolist li.full-w{
		width:100%;
	} 

}


/*開啟區塊-編輯器*/
.card_member .card-intro{
	margin-top:var(--spcing-md);
}
.card_member .card-intro-heading{
    display:block;
	border-bottom:1px dashed #ccc;
    
    color:var(--color-dark);
	
	font-size:var(--text-sm); font-weight:600;
    text-align:center;
    padding:var(--spacing-2xs) 0;
    margin:var(--spacing-lg) 0 var(--spacing-sm) 0;
}

.card_member .card-intro-text{
	font-size:var(--text-base);
}





/*----------------------------------------------------------------------
	{C} 227_#location [來源 227_#location [經銷地區]]
-------------------------------- */
.card_location .card-iframe{
	position:relative; z-index:3;
	padding-bottom:50%;
}
.card_location .card-text{
	text-align:left;
}






/*----------------------------------------------------------------------
	{C} 230_#product [來源 230_#product [產品管理]]
-------------------------------- */

/* ===== 商品詳細頁 */
.pro-view-area{
	border-bottom:1px dashed #ccc;
	padding-bottom:var(--spacing-md);
	margin-bottom:var(--spacing-sm);
}





/*----------------------------------------------------------------------
	{C} 453_#agent_pd [來源 453_#agent_pd [代理產品]]
-------------------------------- */
.card_agent_pd{
	text-align:center;
}
.card_agent_pd .price_sale {
    font-size:var(--text-2xl);
}

.card_agent_pd:hover .price{
	color:#fff;
}
.card_agent_pd:hover .price_sale{
	color:#cc3333;
	text-shadow: 0 0 0.1em #fff,
				 0 0 0.2em #fff,
				 0 0 0.3em #fff;
}






/*----------------------------------------------------------------------
	{C} 235_#works [來源 235_#works [作品管理]]
-------------------------------- */






/*----------------------------------------------------------------------
	{C} 237_#designer [來源 237_#designer [設計師(使用者)]]
	331_個人介紹
-------------------------------- */
.card_designer{
}

.card_designer .card-info{
	position:relative;
	display:inline-block;
	color:#000;
	font-size:var(--text-sm); font-weight:600;
	font-style:italic;
	text-align:center;
	padding:var(--spacing-2xs) var(--spacing-xs);
	margin-top:var(--spacing-sm);
}
.card_designer .card-info:before,
.card_designer .card-info:after{
	position:absolute; top:50%; content:"";
	width:30px; height:1px;
	background:rgba(var(--color-one-rgb),0.3);
	transform:translate(0, -50%);
}
.card_designer .card-info:before{ left:-30px; }
.card_designer .card-info:after{ right:-30px; }


.card_designer:hover .card-info:before,
.card_designer:hover .card-info:after{
	background:rgba(255,255,255,0.3);
}




/*----------------------------------------------------------------------
	{C} 【本專案：n】 會議列表 [以未開放為初始顏色設定]
-------------------------------- */
.card_meeting{
	background:#fff;
	border:1px solid #fff;
	border-top:4px solid #ccc;
	border-radius:10px;
	padding:var(--spacing-base);
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
.card_meeting:hover{ border-color:#fff; border-top-color:#ccc; }

.card-badgebar{
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content: right;
}
.card_meeting .card-badge{
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content: center;
	gap: var(--spacing-2xs);

	position:relative;
	background:var(--color-disabled-container);
	color:var(--color-disabled);
	font-size: var(--text-xs);
	font-weight: 700;
	padding: var(--spacing-2xs) var(--spacing-sm);
	border-radius: 60px;
}
.card_meeting .card-badge-tag{
	display:block;
	width: 8px; height: 8px;
	border-radius: 50%;
	background:var(--color-disabled);
}

.card_meeting .card-body{
	background-color: #f8fafc;
	border-radius:8px;
	padding:var(--spacing-xs) var(--spacing-sm);
}
.card_meeting .card-infolist{
	margin:0;
}
.card_meeting .card-info{
	gap:var(--spacing-sm);
}
.card_meeting .card-info .iconsvg{
	display:none;
}
.card_meeting .card-info-text{
	color:#333;
}

/*按鈕-視訊與否*/
.card_meeting .btn_switch{
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content: center;
	gap: var(--spacing-2xs);
	
	width:100%;
	background:var(--color-disabled-container);
	border-radius: 8px;
	color:var(--color-disabled);
	font-weight:600;
	cursor: pointer;
	padding: var(--spacing-sm) var(--spacing-base);
	transition: background-color 0.2s ease;

	cursor: not-allowed;
}
.card_meeting .btn_switch .iconsvg{ --icon-size: 20px; }
.card_meeting .btn_switch .iconsvg:before{ --icon-color: var(--color-disabled); }


/*參加視訊*/
.card_meeting.meeting-available{
	border-color:var(--color-one);
}
.card_meeting .card-badge.available{
	background:var(--color-success-container);
	color:var(--color-success);
}
.card_meeting .card-badge.available .card-badge-tag{
	background:var(--color-success);
}

.card_meeting .btn_switch.meeting-available{
	background-color: var(--color-one);
	color:#fff;
	cursor:pointer;
}
.card_meeting .btn_switch.meeting-available .iconsvg:before{
	--icon-color: #fff;
}
.card_meeting .btn_switch.meeting-available:hover{
	background-color: var(--color-accent);
	color:#fff;
}


/*未開放視訊*/
.card_meeting.meeting-disabled .card-name{
	color:var(--text-muted);
}
.card_meeting.meeting-disabled .card-text{
	color:var(--text--muted-low);
}





/* ===== 詳細頁-個人介紹 [in designer_view] */
.card_summary{
	max-width:400px;
	border:1px solid var(--color-light-one);
	border-radius:10px;
	margin:0 auto var(--spacing-md) auto;
	overflow:hidden;
	box-shadow:2px 2px 5px rgba(0,0,0,0.1);
}
.card_summary:hover{
	background:transparent;
	border-color:#ccc;
}
.card_summary .col-two,
.card_summary .col-three{
	padding:0 var(--spacing-md); 
}

.card_summary .card-photo .fitimg{
	object-position: top;
}

.card_summary .card-name{
	margin-bottom:var(--spacing-xs);
	padding-bottom:var(--spacing-xs);
	border-bottom:1px solid rgba(0,0,0,0.1);
}

.card_summary .card-name,
.card_summary .card-text{
	color:#333;
}


.card_summary .card-box_qrcode{
    max-width:120px;
    margin:1rem auto;
	text-align:center;
}
.card_summary .card-info_scan{
	justify-content: center;
	color:#333;
}
.card_summary .card-info_scan .card-info-text{
	font-size:var(--text-sm); font-weight:600;
}
.card_summary .card-info_scan .iconsvg{
	display:none;
}
.card_summary .card-box_qrcode .card-photo{
	border:1px solid #ccc;
	margin-top:var(--spacing-2xs);
}





/*----------------------------------------------------------------------
	{C} 274_#link [來源 274_#link [相關連結]]
-------------------------------- */
.card_link .card-photo{
	background:#fff;
}
.card_link .card-name{
	text-align:center;
	margin-top:1rem;
}






/*----------------------------------------------------------------------
	{C} 343_#announcement [來源 343_#announecment [活動管理]]
-------------------------------- */
.card_activity{
}

@media (min-width:576px){
	.card_activity .card-body{
		padding:var(--spacing-sm) 0;
	}
}

.card_activity .card-name{
	position:static;
}

.card_activity .card-text{
	font-size:var(--text-base);
	color:#333;
}


/* ===== 狀態*/
.card_activity .card-status{
	justify-content:center;
	font-weight:600;
	margin:var(--spacing-sm) 0;
}



.card_activity .card-info_status{
	position:relative;
	justify-content:center;
	font-weight:600;
	margin:var(--spacing-sm) 0;
}
.card_activity .card-info_status .card-info-icon,
.card_activity .card-info_status .card-info-text{
	line-height:1;
	margin:0;
}

.card_activity .card-info_status .card-info-icon{
    width:22px; height:22px;
	margin-right:var(--spacing-2xs);
}
.card_activity .card-info_status .card-info-text{
	font-size:var(--text-base);
}




/* ===== 活動資料 */
.card_activity .card-infolist{
	gap:var(--spacing-sm);
	margin-top:var(--spacing-base);
}

.card-info_event{
	align-items:flex-start;
	color:#333;
	font-size:var(--text-sm); font-weight:600;
	text-align:left;
}
.card-info_event .card-info-title,
.card-info_event .card-info-text{
	display:block;
	width:100%;
	padding:var(--spacing-2xs);
}

.card-info_event .card-info-title{
	display:block;
	width:120px;
	background:rgba(var(--color-one-rgb),0.1);
	color:rgba(0,0,0, 0.8);
	text-align:center;
}
.card-info_event .card-info-text{
	width:100%;
}

@media (min-width:576px){
	.card-info_event .card-info-text{
		flex:1 1 auto;
		width:1%; min-width:0;
	}
}

.card_activity:hover .card-info_event{
	color:#fff;
}
.card_activity:hover .card-info_event .card-info-title{
	background:rgba(255,255,255,0.1);
	color:rgba(255,255,255, 0.9);
}


.card-info_event .day_sat,
.card-info_event .day_sun{
	display:inline-block;
	width:18px; height:20px;
	background:rgba(255,255,255,1);
	border-radius:50%;
	font-size:var(--text-xs); line-height:20px;
	text-align:center;
}
.card_activity .card-info_event .day_sat{ color:green; }
.card_activity .card-info_event .day_sun{ color:red; }


.card_activity .card-btnbar{
	position:relative; z-index:5;
	display:block;
}
.card_activity .card-btn{
	width:100%;
}


.calendar_box{
	text-align:center;
	margin:var(--spacing-lg) 0;
}





/*----------------------------------------------------------------------
	{C} 406_#job [來源 406_#job [人才招募]]
-------------------------------- */
.card_job{
	background:#fff;
	border:1px solid rgba(var(--color-one-rgb),0.4);
	border-radius:1rem/1rem;
	padding:1rem;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 15px 0px;
	margin-bottom:3rem;
	
	transition: background 0.3s ease,
				box-shadow 0.3s ease;
	overflow:hidden;
}
.card_job:before,
.card_job:after{
	position: absolute; z-index:-1; bottom:0; right:0; content: "";
	
	-webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
			
	transition: transform 0.5s ease;
}
.card_job:before{
	width:540px; height:300px; /*90:50*/
	
	background-color:rgba(var(--color-one-rgb),0.2);
	-webkit-mask-image: url(../images/cloud-04.svg);
   			mask-image: url(../images/cloud-04.svg);
			
	transform:translate(30%, 25%);
}
.card_job:after{
	width:720px; height:300px; /*120:50*/
	
	background-color:rgba(var(--color-one-rgb),0.1);
	-webkit-mask-image: url(../images/cloud-05.svg);
   			mask-image: url(../images/cloud-05.svg);

	transform:translate(30%, 25%);
}


.card_job .card-name{
	color:var(--color-one);
	text-align:center;
	margin-bottom:var(--spacing-lg);
}

.card_job .card-infolist{
	display:grid;
	gap: var(--spacing-2xs);
}

.card_job .card-info{
	position: relative;
	align-items: flex-start;
	
	border-bottom:1px dashed #ccc;
	font-size: var(--text-base); font-weight:600;
	color: #333;
	padding: var(--spacing-xs) 0;
}
.card_job .card-info .card-info-title{
	position: relative;
	display: block;
	width: 100%;
	color:var(--color-dark);
    font-weight: 600;
	margin-bottom: var(--spacing-2xs);
}
.card_job .card-info .card-info-text{
	flex:1 1 auto;
    width:1%; min-width:0;
	
	padding: 0 0 0 var(--spacing-sm);
	margin-bottom: var(--spacing-2xs);
}
.card_job .card-info .card-info-text p{
	margin-top:0;
}

@media (min-width: 576px){
    .card_job .card-info .card-info-title{
        width: 145px;
        margin-right: var(--spacing-2xs);
        padding-right: var(--spacing-md);
		text-align: right;
    }
    .card_job .card-info .card-info-title:after{
        position: absolute; top: 2px; right: 0; content: "：";
		color:var(--color-dark);
        line-height: 1;
    }
    .card_job .card-info .card-info-text{
        padding: 0;
    }
}

@media (min-width: 992px){
	.card_job{
		padding: var(--spacing-lg);
	}
    .card_job .card-infolist{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .card_job .card-infolist > li.w-100{
		grid-column: span 2 / span 2;
	}
}



/* ====== in idx */
.card_recruit{
	background:#fff;
	border:1px solid rgba(var(--color-one-rgb),0.4);
	border-radius:1rem/1rem;
	padding:1rem; padding-bottom:1.5rem;
	box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
	transition: background 0.3s ease,
				box-shadow 0.3s ease;
	overflow:hidden;
}

.card_recruit:before,
.card_recruit:after{
	position: absolute; z-index:-1; bottom:0; right:0; content: "";
			
    -webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
			
	transition: transform 0.5s ease;
}
.card_recruit:before{
	width:360px; height:200px; /*90:50*/
	
	background-color:rgba(var(--color-one-rgb),0.3);
	-webkit-mask-image: url(../images/cloud-04.svg);
   			mask-image: url(../images/cloud-04.svg);
	
	transform:translate(30%, 25%);
}
.card_recruit:after{
	width:480px; height:200px; /*120:50*/
	
	background-color:rgba(var(--color-one-rgb),0.1);
	-webkit-mask-image: url(../images/cloud-05.svg);
   			mask-image: url(../images/cloud-05.svg);
	
	transform:translate(30%, 25%);
}


.card_recruit .col-two{
	border-width:1px 0 0 0;
	border-style:solid;
	border-color:rgba(var(--color-one-rgb), 0.3);
	
	padding:0 var(--spacing-sm);
}
@media (min-width:768px){
	.card_recruit .col-two{
		border-width:0 1px;
	}
}

.card_recruit .card-name{
	text-align:center;
	padding:var(--spacing-sm) 0;
}
	
.card_recruit .card-infolist li{
    margin-bottom:var(--spacing-sm);
}
.card_recruit .card-infolist li:last-child{
	margin-bottom:0;
}
.card_recruit .card-info span{
    width:100%;
}
.card_recruit .card-info .iconsvg{
	display:none;
}
.card_recruit .card-info .card-info-title{
	background:transparent;
	border-radius:0.8rem/0.8rem;
	color:var(--color-dark-one);
    font-size:var(--text-sm); font-weight:600;
    margin-bottom:var(--spacing-2xs);
}
.card_recruit .card-info .card-info-text{
    width:100%;
    color:#333;
	padding-left:26px;
}


.card_recruit .card-btnbar{
	position:relative; z-index:5;
	padding:0 var(--spacing-sm);
	margin:var(--spacing-2xs) 0;
	justify-content:center;
}
.card_recruit .card-btn{
	width:100%;
	margin:0;
}
@media (min-width:768px){
	.card_recruit .card-btn{
		width:auto;
	}	
}





/*----------------------------------------------------------------------
	{C} 435_#equipment [來源 435_#equipment [設備資料]]
-------------------------------- */



/*----------------------------------------------------------------------
	{C} 454_#franchiser_event [來源 454_#franchiser_event [加盟主活動]]
-------------------------------- */





/*----------------------------------------------------------------------
	{C} 455_#franchiser [來源 455_#franchiser [加盟主資訊]]
-------------------------------- */
.card_franchiser{
	padding:var(--spacing-base);
	text-align:center;
}

.card_franchiser .card-iconlist{
	justify-content: center;
	margin-top:var(--spacing-xs);
}
.card_franchiser .card-icon{
}
.card_franchiser .card-iconlist .iconsvg{
	--icon-size: 36px;
	
	margin-left:auto; margin-right:auto;
}





/*----------------------------------------------------------------------
	{C} 484_#timeline [來源 484_#timeline [時間記事]]
-------------------------------- */

/*項目*/
.card_timeline{
    background:#fff;
	border-radius:1rem / 1rem;
	border:1px solid rgba(var(--color-one-rgb),0.4);
	box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
    padding: var(--spacing-sm);
	transition: box-shadow 0.3s ease;
}
.card_timeline .card_row{
	display:flex; flex-wrap:wrap;
	gap:var(--spacing-sm);
}
.card_timeline .card-one,
.card_timeline .card-two{
	width:100%;
}
.card_timeline .card-one{ order:2; }
.card_timeline .card-two{ order:1; }
@media (min-width:576px){
	.card_timeline .card-one{
		width: 30%;
	}
	.card_timeline .card-two{
		flex:1 1 auto;
		width:1%; min-width:0;
	}
}


/*項目-header */
.card_timeline .card-header{
}
.card_timeline .header_row{
    display:flex; flex-wrap:wrap;
    align-items:center;
	gap:var(--spacing-sm);
}
.card_timeline .header_row > .header-one{
	width:70px;
}
.card_timeline .header_row > .header-two{
	flex:1 1 auto;
	width:1%; min-width:0;
}


/*項目-日期*/
.card_timeline .card-date-box{
	position:relative;
	background:var(--color-one);
	border-radius:0.5rem/0.5rem;
	padding:5px;
}
.card_timeline .card-date-box:before{
	position: absolute; z-index:10; bottom:0; right:0; content: "";
	width:120px; height:50px; /*120:50*/
	
	background-color:rgba(255,255,255,0.5);
	-webkit-mask-image: url(../images/cloud-05.svg);
   			mask-image: url(../images/cloud-05.svg);
			
    -webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
			
	transition: transform 0.5s ease;
	transform:translate(30%, 20%);
}
.card_timeline:hover .card-date-box{
	background:var(--color-accent);
}

.card_timeline .card-date-item{
    display:flex; flex-wrap:wrap;
    justify-content:center;
    text-align:center;
}
.card_timeline .card-date-item .card-date{
    display:block;
	color:#fff;
    font-size:var(--text-sm); line-height:1;
    font-family:Helvetica;
    padding:0.25rem 0;
}
.card_timeline .card-date.year{ order:2; }
.card_timeline .card-date.year:after{ content:"-"; }

.card_timeline .card-date.month{ order:3; }

.card_timeline .card-date.day{
	order:1;
    width:100%;
    font-size:26px; font-weight:600;
}
@media (min-width:992px){
	.card_timeline .card-date.day{
		font-size:32px;
	}
}

/*行數限制*/
.card_timeline .card-name{
	display:-webkit-box;
	text-overflow:ellipsis;
	overflow:hidden;
	
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	white-space:normal;
}


/*年份*/
.timeline-year{
    position: relative; z-index: 2;
    width: 100%;
    margin: var(--spacing-xl) 0 var(--spacing-lg) 0;
    text-align: center;
}
.timeline-year:first-child{ margin-top:0; }
.timeline-year-text{
	position: relative;
	display:inline-block;
	background:var(--color-one);
	color:#fff;
	font-size:var(--text-lg); font-weight:600; line-height:1;
	padding:0.75rem 1.5rem;
	margin-left:-1px;
}


.timeline-box{
    margin-bottom:var(--spacing-md);
}


@media (min-width:992px){

	.timeline-event{
		position:relative;
		padding-bottom:var(--spacing-lg);
		margin:var(--spacing-lg) 0;
	}

    /*消除float*/
    .timeline-area{}
    .timeline-area:before, .timeline-area:after{ display:table; content:" " }
    .timeline-area:after{ clear:both }
	
    .timeline-year{
        float:left;
        clear:both;
        margin-top:var(--spacing-sm);
    }
    .timeline-year:nth-child(1){ margin-top:0; }
        
    .timeline-box{
        float:left;
        width:55%;
        padding-right:calc(5% + 60px);
        margin-bottom: var(--spacing-xl);
        margin-top: -80px;
    }
    .timeline-box:nth-of-type(2n){
        float:right;
        padding-left:calc(5% + 60px);
        padding-right:0;
    }
	
    /*中間年份 與 漂浮項目之設定 */
    .timeline-year + .timeline-box{ margin-top:0; }



	/*中間線*/
	.timeline-event:before{
		position:absolute; top:0; left:50%; content:"";
		width:2px; height:100%;
		
		background:#ccc;
		
		transform:translate(-50%, 0);
	}
	
	/*中間線底的圓圈*/
	.timeline-event:after{
		position:absolute; bottom:0; left:50%; content:"";
		width:12px; height:12px;
		
		background:#ccc;
		
		border-radius:50%;
		transform:translate(-50%, 0);
	}



	/*項目-延伸至中間的線條 */
    .card_timeline:before{
        position:absolute; top:40px; right:-60px; content:"";
        width:60px; height:1px;
		border-top:2px dashed #ccc;
    }
    .timeline-box:nth-of-type(2n) .card_timeline:before{
        left:-60px; right:auto;
    }
	.card_timeline:hover:before{ border-color:var(--color-accent); }
	
	
    /*項目-延伸至中間的圓圈 */
    .card_timeline:after{
        position:absolute; top:41px; right:-60px; content:"";
        width:14px; height:14px;
        margin-top:-7px;
        margin-right:-7px;
        background:#fff;
        border-radius:50%;
        border:2px solid #ccc;
    }
    .card_timeline:hover:after{ border-color:var(--color-accent); }
    .timeline-box:nth-of-type(2n) .card_timeline:after{
        left:-60px; right:auto;
		margin-left:-8px;
		margin-right:0;
    }

}







/*----------------------------------------------------------------------
	{C} 490_#people [來源 490_#people [人物介紹] [use effect_profile]]
-------------------------------- */
.card_people{
}

.card_people .card-name a:before{
	display:none;
}


.card_people .card-slogan{
	position:relative;
	background:rgba(var(--color-one-rgb),0.03);
	color:var(--color-one);
	font-size:var(--text-lg); font-weight:600;
	padding:var(--spacing-sm);
	margin:var(--spacing-xs) 0 var(--spacing-base) 0;
}
.card_people:hover .card-slogan{
	background:rgba(255,255,255,0.1);
	color:#fff;
}

.card_people .card-text{
	color:#000;
	font-size:var(--text-base);
	padding:0 var(--spacing-sm);
}


.card_people .card-callerbar{
	display: flex; align-items: center;
	align-items:center; justify-content: center;
	gap:0.5rem;
	
	max-width:360px;
	margin:var(--spacing-md) auto var(--spacing-sm) auto;
}
.card_people .card-callerbar a{
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content: center;

	flex: 1;
	max-width:150px;
	background:#fff;
	border:1px solid rgba(var(--color-one-rgb),1);
	border-radius:20px;
	color:var(--color-one);
	font-weight:600;
	padding:var(--spacing-2xs) var(--spacing-sm);
	text-align:center;
}
.card_people .card-callerbar a:hover{
	background:var(--color-one);
	border-color:#fff;
	color:#fff;
	box-shadow:2px 2px 8px rgba(0, 0, 0, 0.4);
}

.card_people .card-body .card-callerbar{
	display:none;
}
@media (min-width:992px){
	.card_people .card-callerbar{
		display:none;
	}
	.card_people .card-body .card-callerbar{
		display:flex;
	}
}





/*----------------------------------------------------------------------
	{C} 512_#store [來源 512_#store [推薦店家]]
-------------------------------- */
.card_store{
}



/* ===== in store_view ===== */
.card_store_summary{
	max-width:400px;
	border:1px solid var(--color-light-one);
	border-radius:10px;
	margin:0 auto var(--spacing-md) auto;
	overflow:hidden;
	box-shadow:2px 2px 5px rgba(0,0,0,0.1);
}
.card_store_summary:hover{
	background:transparent;
	border-color:#ccc;
}

.card_store_summary .card-body{
	padding:var(--spacing-xs); padding-top:0;
}


.card_store_summary .card-infolist{
	gap:0;
}
.card_store_summary .card-infolist > li{
	padding:var(--spacing-xs) var(--spacing-2xs);
}
.card_store_summary .card-infolist > li:hover{
	background:rgba(var(--color-one-rgb),0.05);
}

.card_store_summary .card-info{
	display: grid;
	grid-template-columns: 26px 1fr;
	grid-template-rows: 20px 1fr;
	grid-column-gap: 10px;
	grid-row-gap: 0;
	
	font-weight:600;
	align-items:center;
}
.card_store_summary .card-info .iconsvg{ grid-area: 1 / 1 / 3 / 2; }
.card_store_summary .card-info-title { grid-area: 1 / 2 / 2 / 3; }
.card_store_summary .card-info-text { grid-area: 2 / 2 / 3 / 3; }


.card_store_summary .card-info .iconsvg{ --icon-size: 24px; }
.card_store_summary .card-info .iconsvg:before{ --icon-color: var(--color-dark-one); }

.card_store_summary .card-info-title{
	color:#666;
	font-size:var(--text-xs);
}

.card_store_summary .card-info-text,
.card_store_summary .card-info-text a{
	color:var(--color-dark-one);
}
.card_store_summary .card-info-text a:hover{
	color:var(--color-accent);
}


.mapbox_store{
	height:300px;
	margin-top:var(--spacing-xl);
}
.mapbox_store iframe{
	width:100%; height:100%;
}


/* ===== 地圖檢視 [in store_map] */
.around-map{
	text-align:center;
	margin:var(--spacing-xl) 0;
}
.around-map-item{
	display:inline-block;
	border:1px solid #ccc;
}





/*----------------------------------------------------------------------
	{C} 519_#god [來源 519_#god [供奉神明]]
-------------------------------- */
.card_god .card-name{
	margin:1rem 0 1.5rem 0;
	text-align:center;
}
.card_god .card-name-text{
	position:relative; z-index:1;
	display:inline-block;
	padding:0 15px;
}
.card_god .card-name-text:before{
	position:absolute; z-index:-1; left:0; bottom:-2px; content:"";
	width:100%; height:15px;
	
	background-color: rgba(var(--color-one-rgb),0.5);

	-webkit-mask: url(../images/icon/icon_god_frame.svg) repeat-x center / auto 100%;
            mask: url(../images/icon/icon_god_frame.svg) repeat-x center / auto 100%;
	
	opacity:0.7;
}

.card_god:hover .card-name-text:before{
	background-color:#fff;
}



/* ===== in god_view */
.card_god_summary{
	margin-bottom:var(--spacing-xl);
	text-align:center;
}
.card_god_summary .card-photo{
	max-width:280px;
	border:8px solid #fff;
	border-radius:50%;
	overflow:hidden;
	box-shadow:2px 2px 5px rgba(0,0,0,0.2);
	margin:0 auto;
}
.card_god_summary .card-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}

.card_god_summary .card-name-text{
	position:relative; z-index:2;
	color:#990000;
	font-weight:600;
	margin:0;
	padding:0;
}

.card_god_summary .card-name-text:before{
    position:absolute; z-index:-1; content:attr(data-storke);
    
    -webkit-text-stroke:5px #F6DB82;
			text-stroke:5px #F6DB82;
}





/*----------------------------------------------------------------------
	{C} 523_#case [來源 523_#case_result [陳情成果]]
-------------------------------- */
.card_case_result{
	position:relative;
	border:1px solid rgba(var(--color-one-rgb),0.4);
	border-radius:1rem/1rem;
	box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
	transition: background 0.3s ease,
				box-shadow 0.3s ease;
	overflow:hidden;
}

.card_case_result:before,
.card_case_result:after{
	position: absolute; z-index:-1; bottom:0; right:0; content: "";
	
	-webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
			
	transition: transform 0.5s ease;
}
.card_case_result:before{
	width:360px; height:200px; /*90:50*/
	
	background-color:rgba(var(--color-one-rgb),0.2);
	-webkit-mask-image: url(../images/cloud-04.svg);
   			mask-image: url(../images/cloud-04.svg);
			
	transform:translate(30%, 25%);
}
.card_case_result:after{
	width:480px; height:200px; /*120:50*/
	
	background-color:rgba(var(--color-one-rgb),0.1);
	-webkit-mask-image: url(../images/cloud-05.svg);
   			mask-image: url(../images/cloud-05.svg);

	transform:translate(30%, 25%);
}

/* =====標題 */
.card_case_result .card-name{
	font-size:var(--text-lg);
	text-align:center;
	margin:var(--spacing-lg) 0 var(--spacing-base) 0;
}

.card_case_result .card-footer{
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content:center;
	
	/*border-top:1px solid #eee;
	padding-top:var(--spacing-base);*/
	margin-top:var(--spacing-base);
}
.card_case_result .progress-infobox{
	width:100%; max-width:100px;
}





/*----------------------------------------------------------------------
	{C} 523_#case [來源 523_#case [陳情案件]]
-------------------------------- */

/* ===== case [card-status] color set */
.card-status.case_finish,
.card-status.case_ongoing{
	font-weight:600;
}
.card-status.case_finish .iconsvg,
.card-status.case_ongoing .iconsvg{ --icon-size: 24px; }

/* card-status 狀態：已完成*/
.card-status.case_finish .iconsvg:before{ --icon-color: var(--color-case-finish); }
.card-status.case_finish .card-status-text{ color:var(--color-case-finish); }

/* card-status 狀態：進行中*/
.card-status.case_ongoing .iconsvg:before{ --icon-color: var(--color-case-ongoing); }
.card-status.case_ongoing .card-status-text{ color:var(--color-case-ongoing); }




/* ===== card_case */
.card_case{
	position:relative;
	background:#fff;
	border: 1px solid rgba(var(--color-one-rgb),0.4);
    border-radius: 1rem/1rem;
    overflow: hidden;
	padding:1rem;
	box-shadow: 0 4px 6px rgb(0 0 0 / 5%);
	
	transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/*狀態:進行中 */
.card_case.case_ongoing{
	border-left:6px solid var(--color-case-ongoing);
}

/*狀態:已結案 */
.card_case.case_finish{
	border-left:6px solid var(--color-case-finish);
}


.card_case .card-header{
	display:flex; flex-wrap:wrap;
	align-items:center;
	
	border-bottom:1px dashed #ccc;
	padding-bottom:1rem;
	margin-bottom:1rem;
}

/*狀態*/
.card_case .card-status{
	margin-bottom:1rem;
}
@media (min-width:768px){
	.card_case .card-status{
		position:absolute; top:1.1rem; right:1.4rem;
		width:auto;
		font-size:var(--text-sm);
		margin-bottom:0;
	}
}

.card_case .card-infolist{
	margin:0;
}
@media (min-width:768px){
	.card_case .card-infolist li{ width:auto; }
}

.card_case .card-info{
	width:auto;
	font-size:var(--text-base); font-weight:600;
	color:#333;
}
.card_case .card-info-title{
	position:relative;
	padding-right:0.75rem;
	width:80px;
	
	/*文字左右對齊*/
	text-align:justify;
	text-align-last:justify;
	text-justify:inter-word;
}
.card_case .card-info-title:after{
	position:absolute; top:0; right:0; content:"：";
	font-size:var(--text-sm); font-weight:600;
	color:#666;
}
@media (min-width:768px){
	.card_case .card-info{
		background:rgba(0,0,0,0.05);
		border-radius:1rem;
		font-size:var(--text-sm);
		padding:0.25rem 1rem;
	}
	.card_case .card-info-title{
		width:auto;
	}
}


.card_case .card-body{
	margin:1rem 0;
}
@media (min-width:992px){
	.card_case .card-body{
		padding-right:200px;
		margin-bottom:0;
	}
}

.card_case .card-text{
	color:#333;
	font-size:var(--text-base);
}


.card_case .card-btn{
	width:100%;
	background:rgba(var(--color-one-rgb),0.1);
	border-radius: 20px;
	border:1px solid var(--color-one);
	border-width:0;
	color:var(--color-dark-one);
	padding: var(--spacing-sm) var(--spacing-md);
	margin:0;
}
.card_case .card-btn:hover{
	background:var(--color-accent);
	border-color:var(--color-accent);
	color:#fff;
}
@media (min-width:992px){
	.card_case .card-btnbar{
		position:absolute; bottom:1rem; right:1rem;
		margin:0;
	}
	.card_case .card-btn{
		width:auto;
	}
}






/*----------------------------------------------------------------------
	{C} 523_#case [來源 523_#case_petition_c [完成陳情]]
-------------------------------- */
.petition-success{
	text-align:center;
	color:var(--color-one);
	font-size:var(--text-lg); font-weight:600;
}





/*----------------------------------------------------------------------
	{C} 523_#case [來源 523_#case_track [陳情追蹤]]
-------------------------------- */

/* =====案件追蹤*/
.infolist_case_track{
	gap:0;

	background:#fff;
	border:1px solid #ccc;
	border-radius: 0.25rem;
	margin:var(--spacing-lg) auto var(--spacing-2xl) auto;
	padding:1rem;
    overflow: hidden;
	box-shadow: 0 4px 6px rgb(0 0 0 / 5%);
}
.infolist_case_track li{
	width:100%;
	padding:var(--spacing-xs) 0;
	border-top:1px dashed #ccc;
}
.infolist_case_track li:nth-child(1){
	border-top-width:0;
}
@media (min-width:992px){
	.infolist_case_track li:nth-child(2){
		border-top-width:0;
	}

	.infolist_case_track li.status,
	.infolist_case_track li.serialnum{
		width:calc( (100% - 1rem) / 2);
	}
	.infolist_case_track li.status{ order:2; }
	.infolist_case_track li.serialnum{ order:1; }
	.infolist_case_track li.subject{ order:3; }
	.infolist_case_track li.reply{ order:4; }
}


.infolist_case_track .info{
	font-weight:600;
}
.infolist_case_track .info-title{
	background:var(--color-one);
	color:#fff;
	padding:2px 4px;
}
.infolist_case_track .info-text{
	width:100%;
	padding-left:var(--spacing-sm);
}
@media (min-width:992px){
	.infolist_case_track .info{
		gap:var(--spacing-base);
	}
	.infolist_case_track .info-title{
		position:relative;
		width:120px;
		text-align:center;
	}
	.infolist_case_track .info .info-text{
		flex:1 1 auto;
		width:1%; min-width:0;
		
		padding-left:0;
	}
}


/* ===== 狀態 */
.infolist_case_track li.status{
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content: flex-end;
}
.badge_case_status{
	font-size:var(--text-lg);
	font-weight:600;
}
.badge_case_status .iconsvg{
	--icon-size: 22px;
}

.badge_case_status.finish{ color:var(--color-case-finish); }
.badge_case_status.finish .iconsvg:before{ --icon-color: var(--color-case-finish); }

.badge_case_status.goon{ color:var(--color-case-ongoing); }
.badge_case_status.goon .iconsvg:before{ --icon-color: var(--color-case-ongoing); }



/* ====== card_case_track */
.card_case_track{
	max-width:1000px;
	background:#fff;
	border:1px solid #ccc;
	border-radius: 0.25rem;
	margin:0 auto;
    overflow: hidden;
	box-shadow: 0 4px 6px rgb(0 0 0 / 5%);
}

.card_case_track .card-header,
.card_case_track .card-body,
.card_case_track .card-footer{
	padding:var(--spacing-xs);
}
.card_case_track .card-header{
	background:#eee;
}

.card_case_track .card-infolist{
    margin-top: 0;
}
.card_case_track .card-info{
	color:#333;
	font-size:var(--text-sm); font-weight:600;
}
.card_case_track .card-info .iconsvg{
	--icon-size: 16px;
}
.card_case_track .card-info .card-info-title{
	position:relative;
	padding-right:var(--spacing-md);
}
.card_case_track .card-info .card-info-title:after{
	position:absolute; top:0; right:0; content:"：";
}

/*狀態*/
.card_case_track .card-status{
	justify-content: flex-end;
}

.card_case_track .card-text{
	color:#333;
	font-size:var(--text-base);
	margin-top:0;
}





/*----------------------------------------------------------------------
	{C} 609_#uniarticle [來源 609_#post [數據中心] [news,uninews,life,article、uniarticle]]
-------------------------------- */
.card_post{
}

.card_post .card-name-text{
	display:-webkit-box;
	text-overflow:ellipsis;
	overflow:hidden;
	
	-webkit-box-orient:vertical;
	white-space:normal;
	-webkit-line-clamp:3;
}





/*----------------------------------------------------------------------
	{C} 609_#uniarticle [來源 609_#post_sub [數據中心-側邊] [uniarticle]]
-------------------------------- */
.card_post_sub{
}
@media (min-width:1200px){
	.card_post_sub{
		background:transparent;
		border-width:0;
	}
	.card_post_sub .card-photo{
		border-radius:20px;
		overflow:hidden;
	}
}

.card_post_sub .card-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}


/*取消將連結擴展至整個card*/
.card_post_sub .card-name a:before{
	display:none;
}
.card_post_sub .card-name-text{
	display:-webkit-box;
	text-overflow:ellipsis;
	overflow:hidden;
	
	-webkit-box-orient:vertical;
	white-space:normal;
	-webkit-line-clamp:3;
}

.card_post_sub .card-body{
	padding:var(--spacing-xs);
}
.card_post_sub .card-name{
	margin:0;
}
@media (min-width: 1200px){
	.card_post_sub .card-body{
		padding:0;
	}
	.card_post_sub .card-name{
		font-size: var(--text-base);
	}
	.card_post_sub .card-name-text{
		-webkit-line-clamp:2;
	}
}


.card_post_sub .card-infolist{
	display:flex; flex-wrap:wrap;
	margin-top:var(--spacing-2xs);
}
.card_post_sub .card-infolist > li{
	margin-right:var(--spacing-xs);
}
.card_post_sub .card-infolist > li:last-child{
	margin-right:0;
}
.card_post_sub .card-info .iconsvg{
	display:none;
}
.card_post_sub .card-info{
	margin:0;
}
.card_post_sub .card-info,
.card_post_sub .card-info a{
	color:#666;
	font-size:var(--text-sm); font-weight:600;
}
.card_post_sub .card-info a:hover{
	color:var(--color-accent);
}





/*----------------------------------------------------------------------
	{C} 609_#uniarticle [來源 609_#listicle [數據中心詳細-延伸閱讀-條列清單] [uniarticle]]
-------------------------------- */
.card_listicle{
	background:transparent;
	border-width:0;
	padding-left:20px;
}
.card_listicle:before{
	position: absolute; top: 6px; left: 5px; content: "";
    width: 8px; height: 8px;
    background: var(--color-dark-one);
    transform: rotate(45deg);
}
.card_listicle .card-name{
	margin:0;
}
@media (min-width: 1400px){
	.card_listicle:before{
		top: 10px;
	}
}





/*----------------------------------------------------------------------
	{C} 221_#news [來源 221_#news [最新消息] [數據中心]]
-------------------------------- */
.card_news .card-date-item{
    display:flex; flex-wrap:wrap;
	justify-content:center;
	text-align:center;
	margin-bottom:1rem;
}
.card_news .card-date-item .card-date{
    display:block;
	color:var(--color-dark-two);
    font-size:0.75rem; font-weight:600; letter-spacing:2px;
	line-height:1;
    padding:5px 0;
}
.card_news .card-date.year{}
.card_news .card-date.year:after{ content:"/"; }

.card_news .card-date.month{}

.card_news .card-date.day{
    width:100%;
	color:var(--color-dark-one);
    font-size:2.5rem; font-weight:600;
}




/*----------------------------------------------------------------------
	{C} 223_#article [來源 223_#article [文章] [數據中心]]
-------------------------------- */
 


/*----------------------------------------------------------------------
	{C} 491_#uninews [來源 491_#uninews [在地新聞] [數據中心]]
-------------------------------- */



/*----------------------------------------------------------------------
	{C} 492_#life [來源 492_#life [在地生活] [數據中心]]
-------------------------------- */



/*----------------------------------------------------------------------
	{C} D1_#define [來源 D1_#define [自訂選單]]
-------------------------------- */



/*----------------------------------------------------------------------
	{C} 共用_#contact [來源 D2_#contact [聯絡我們-聯絡資料]]
-------------------------------- */
.contact-info-right{
	margin-top:3rem;
}

.mapbox_contact{ height:300px; }
.mapbox_contact iframe{ height:100%; }



.infolist_contact_company li{
	padding:var(--spacing-sm) var(--spacing-xs);
}
.infolist_contact_company li:hover{
	background:rgba(var(--color-one-rgb),0.05);
}

.infolist_contact_company .info{
	display: grid;
	grid-template-columns: 50px 1fr;
	grid-template-rows: 20px 1fr;
	grid-column-gap: 10px;
	grid-row-gap: 0;
	
	font-weight:600;
	align-items:center;
}
.infolist_contact_company .info .iconsvg{ grid-area: 1 / 1 / 3 / 2; }
.infolist_contact_company .info-title { grid-area: 1 / 2 / 2 / 3; }
.infolist_contact_company .info-text { grid-area: 2 / 2 / 3 / 3; }

.infolist_contact_company .info .iconsvg{
	--icon-size: 46px;
}
.infolist_contact_company .info .iconsvg:before{
	--icon-color: #fff;
	
	-webkit-mask-size:40% 40%;
			mask-size:40% 40%;
}
.infolist_contact_company .info .iconsvg:after{
	position: absolute; z-index:-1; top:0; left:0; content: "";
	width:100%; height:100%; /*110:50*/

	background-color:var(--color-one);
	
	-webkit-mask-image: url(../images/cloud-12.svg);
   			mask-image: url(../images/cloud-12.svg);
			
	-webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
}

.infolist_contact_company .info-title{
	color:#333;
	font-size:var(--text-xs); line-height:1.4;
}

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





/*----------------------------------------------------------------------
	{C} 共用_#contact [來源 D2_#contact [分店資訊]]
-------------------------------- */
.card_branch{
	background:#fff;
	border:1px solid rgba(var(--color-one-rgb),0.4);
	border-radius:1rem/1rem;
	padding:1rem; padding-bottom:1.5rem;
	box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
	transition: background 0.3s ease,
				box-shadow 0.3s ease;
	overflow:hidden;
}
.card_branch:before,
.card_branch:after{
	position: absolute; z-index:-1; bottom:0; right:0; content: "";
			
    -webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
			
	transition: transform 0.5s ease;
}
.card_branch:before{
	width:360px; height:200px; /*90:50*/
	
	background-color:rgba(var(--color-one-rgb),0.3);
	-webkit-mask-image: url(../images/cloud-04.svg);
   			mask-image: url(../images/cloud-04.svg);
	
	transform:translate(30%, 25%);
}
.card_branch:after{
	width:480px; height:200px; /*120:50*/
	
	background-color:rgba(var(--color-one-rgb),0.1);
	-webkit-mask-image: url(../images/cloud-05.svg);
   			mask-image: url(../images/cloud-05.svg);
	
	transform:translate(30%, 25%);
}


.card_branch .card-iframe{
	height:100%;
    padding-bottom:0;
}
.card_branch .card-iframe iframe{
	position:relative; top:0; left:0;
	width:100%; height:100%;
}

.card_branch .card-body{
	padding:var(--spacing-sm);
}	
.card_branch .card-name{
	margin-bottom:var(--spacing-md);
}

.card_branch .card-infolist{
	gap:0;
}
.card_branch .card-infolist li{
	width:100%;
	border-bottom:1px dashed rgba(var(--color-one-rgb),0.2);
	padding:var(--spacing-xs) var(--spacing-xs);
}
@media (min-width:992px){
	.card_branch .card-infolist li{
		width:50%;
	}
}

.card_branch .card-info{
	display: grid;
	grid-template-columns: 26px 1fr;
	grid-template-rows: 20px 1fr;
	grid-column-gap: 10px;
	grid-row-gap: 0;
	
	font-weight:600;
	align-items:center;
}
.card_branch .card-info .iconsvg{ grid-area: 1 / 1 / 3 / 2; }
.card_branch .card-info-title { grid-area: 1 / 2 / 2 / 3; }
.card_branch .card-info-text { grid-area: 2 / 2 / 3 / 3; }

.card_branch .card-info .iconsvg{ --icon-size: 24px; }
.card_branch .card-info .iconsvg:before{ --icon-color: var(--color-dark-one); }

.card_branch .card-info-title{
	color:#333;
	font-size:var(--text-xs); line-height:1.4;
}

.card_branch .card-info-text,
.card_branch .card-info-text a{
	color:var(--color-dark-one);
}
.card_branch .card-info-text a:hover{
	color:var(--color-accent);
}





/*----------------------------------------------------------------------
	{C} 共用_#consult [來源 #consult [問題諮詢]]
-------------------------------- */
/* 按鈕 */
.btn_consult{
	min-width:160px;
	background:#fff;
	border:2px solid #CC3333;
	border-radius:40px;
	color:#CC3333;
	padding:var(--spacing-sm);
	overflow:hidden;
}
.btn_consult .iconsvg{
	--icon-size: 64px;
	
	position:absolute; right:-5px; top:50%;
	margin-top:-32px;
	opacity:0.2;
	transform:rotate(10deg);
}
.btn_consult .iconsvg:before{
	--icon-color: #CC3333;
}
.btn_consult:hover{
	box-shadow:1px 1px 3px rgba(0,0,0,0.3);
} 
@media (min-width: 992px){
	 .btn_consult{
		border-radius:22px;
	}
	.btn_consult .iconsvg{
		--icon-size: 54px;
		margin-top:-28px;
	}
}

.btn_consult:hover{
	border-color:var(--color-accent);
}
.btn_consult:hover .iconsvg{
	opacity:0.5;
}



.consult{
	padding-top:var(--spacing-md);
}
.consult .page{
	margin:var(--spacing-md) 0 0 0;
}

/*in view*/
.consult_view .consult_inner{
	background:rgba(var(--color-one-rgb),0.05);
	padding-top:5rem;
	padding:7rem 1.5rem 1rem 1.5rem;
	margin-top:-6rem;
}

.card-btnbar.consult{
	position: relative; z-index: 2;
	justify-content:center;
}



.card_consult{
	background:#fff;
	border:1px solid rgba(var(--color-one-rgb),0.4);
	border-radius:1rem/1rem;
	padding:1rem;
	overflow:hidden;
}

.card_consult .card-header{
	display:flex; flex-wrap:wrap;
	align-items:center;
}
.card_consult .card-info_sign{
	gap:0;
	width: 32px; height: 32px;
	
	justify-content: center;
	background: var(--color-dark);
	border-radius: 50%;
	color: #fff;
	font-size: var(--text-sm); font-weight:600; line-height: 32px;
    font-family: Helvetica, sans-serif;
	text-align: center;
	margin-right:var(--spacing-xs);
}
.card_consult .card-info_sign:before{
	position: absolute; z-index:-1; top:0; left:0; content: "";
	width:100%; height:100%; /*110:50*/

	background-color:var(--color-one);
	
	-webkit-mask-image: url(../images/cloud-12.svg);
   			mask-image: url(../images/cloud-12.svg);
			
	-webkit-mask-position: center right;
    		mask-position: center right;
    
    -webkit-mask-repeat: no-repeat;
    		mask-repeat: no-repeat;
    
    -webkit-mask-size: auto 100%;
    		mask-size: auto 100%;
}

.card_consult .card-name{
	flex:1 1 auto;
	width:1%; min-width:0;
}

.card_consult .card-info-title,
.card_consult .card-info-text{
	margin: 0;
	flex: none;
	width: auto; min-width: auto;
}

.card_consult .card-name{
	color:var(--color-one);
	font-weight: 600;
	margin: 0;
}


.card_consult .card-body{
	padding-left:2.5rem;
}
.card_consult .card-body .card-info_sign{ display: none; }
.card_consult .card-text{
	color: #333;
	font-size: var(--text-base);
	margin: 0;
}





/*----------------------------------------------------------------------
	{C} 共用_#advertise [來源 #advertise [母子新聞]]
-------------------------------- */
.card_advertise{
	position:relative;
	background:#fff;
	border:3px solid var(--color-light-one);
	border-radius:1rem/1rem;
	padding:1rem;
}
.card_advertise .card-photo{
	background:#fff;
}
.card_advertise .card-name{
	font-size:var(--text-sm);
}





/*----------------------------------------------------------------------
	{C} 共用_#appdownload [來源 #appdownload [首次使用商務夥伴APP in idx]]
-------------------------------- */
.btnbar_appdownload{
	justify-content:flex-end;
	margin:var(--spacing-sm) auto;
}
@media (min-width:992px){
	.btnbar_appdownload{
		margin-top:calc(var(--spacing-lg) * -1);
	}
}
.btn_appdownload{
	font-size:var(--text-sm);
	margin:0;
}


/* ===== 標題 */
.heading_appdownload{
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content: center;
	gap: var(--spacing-2xs);
	margin-bottom:var(--spacing-lg);	
}
.heading_appdownload .heading-icon{
	width:50px; height:50px;
}
.heading_appdownload .heading-icon img{
	display:block; max-width:100%; height:auto;
}
.heading_appdownload .heading-text{
	color:#fff;
	font-size: var(--text-4xl); font-weight:600;
}


/* ===== 列表 */
.cardlist_appdownload{
    max-width:500px;
    margin:0 auto;
    text-align:center;
}
.cardlist_appdownload > li{
    display:inline-block;
    width:160px;
    margin:var(--spacing-md) var(--spacing-md) 0 var(--spacing-md);
}


.card-app{
	background:transparent;
	border-width:0;
}
.card-app .card-name{ margin-top:var(--spacing-sm); }
.card-app .card-name, 
.card-app .card-name a{
    color:#fff;
}





/*----------------------------------------------------------------------
	{C} 共用_#caller [來源 #caller [叫號系統]]
-------------------------------- */
.callerbox{
	max-width:1000px; margin:0 auto;
}
.card_caller{
	background:#fff;
	border:3px solid var(--color-light-one);
	border-radius:1rem/1rem;
	padding:var(--spacing-sm);
	text-align:center;
}
.card_caller:hover{
	box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, 
				rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
.card_caller .card-photo{
	max-width:110px; max-height:110px;
	border-width:0;
	margin-left:auto; margin-right:auto;
}
@media (min-width:992px){
	.card_caller{
		text-align:left;
	}
	.card_caller .card-photo{
		margin:0;
	}
}
.card_caller .card-info,
.card_caller .card-info a{
	display:block;
	color:#333;
}

.card_caller .card-info a:hover{
	color:var(--color-one);
}




/*----------------------------------------------------------------------
	{C} 共用_#namecard [來源 #namecard [雲端名片]]
-------------------------------- */
.namecardbox{
	max-width:1000px; margin:0 auto;
}
.card_namecard{
	background:#fff;
	border:3px solid var(--color-light-one);
	border-radius:1rem/1rem;
	transition: box-shadow 0.3s ease;
}

.card_qrcode{
	background:transparent;
	
	border-width:1px 1px 0 0;
	border-style:solid;
	border-color:rgba(var(--color-one-rgb), 0.2);
	
	padding:var(--spacing-sm);
	margin:0;
	text-align:center;
	height:100%;
}
.card_namecard .row > div:nth-child(2) .card_qrcode,
.card_namecard .row > div:nth-child(4) .card_qrcode{
	border-right-width:0;
}
.card_namecard .row > div:nth-child(1) .card_qrcode,
.card_namecard .row > div:nth-child(2) .card_qrcode{
	border-top-width:0;
}


.card_qrcode .card-photo{
	max-width:110px; max-height:110px;
	border-width:0;
	margin-left:auto; margin-right:auto;
}
@media (min-width:992px){
	.card_qrcode .card-photo{
		margin:0;
	}
}

.card_qrcode .card-name{
	margin-bottom:0.5rem;
	text-align:center;
}
.card_qrcode .card-name-text,
.card_qrcode .card-info.jobtitle{
	display:inline-block; vertical-align:bottom;
	padding:0;
	margin:0;
}
.card_qrcode .card-name-text{
	color:var(--color-dark-one);
	font-size:var(--text-xl);
}
.card_qrcode .card-info.jobtitle{
	font-size:var(--text-sm);
}
@media (min-width:992px){
	.card_qrcode .card-name{
		text-align:left;
	}
}


.card_qrcode .card-btn{
	border-width:1px;
	font-size:var(--text-sm);
	padding:var(--spacing-xs);
}
@media (min-width:992px){
	.card_qrcode .card-btnbar{
		justify-content: flex-end;
		gap:var(--spacing-xs);
		margin:0;
	}
}


/* ===== 加line好友(in idx namecard) */
.card_qrcode .card-infobar .card-info{
	justify-content: center;
	
	width:100%;
	font-size:var(--text-sm);
}

.card_namecard:hover .card-infobar .card-info,
.card_namecard:hover .card-infobar .card-info a,
.card_qrcode:hover .card-infobar .card-info,
.card_qrcode:hover .card-infobar .card-info a{
	color:#333;
}
.card_namecard:hover .card-infobar .card-info a:hover,
.card_qrcode:hover .card-infobar .card-info a:hover{
	color:var(--color-one);
}
@media (min-width:992px){
	.card_qrcode .card-infobar .card-info{
		justify-content: flex-start;
	}
}

/*加line好友*/
.card_qrcode .card-info.line-add .iconsvg{
    --icon-size: 26px;
}

/*允許--加line好友*/
.card_qrcode .card-info.line-allow{
	color:var(--color-line);
}
.card_qrcode .card-info.line-allow .iconsvg:before{
	--icon-color: var(--color-line);
}






/*----------------------------------------------------------------------
	{C} 共用_#card_figure [來源 #card_figure [相片集]]
-------------------------------- */
.card_figure,
.card_about_figure{
	border-width:0;
	transition:box-shadow 0.5s ease-in-out;
}

.card_about_figure .card-photo,
.card_figure .card-photo{
	background:#fff;
	border:1px solid #eee;
	border-radius:1rem/1rem;
	padding:0.5rem;
	box-shadow:1px 1px 2px rgb(0,0,0,0.4);
	overflow:hidden;
	transition:box-shadow 0.1s ease;
}

.card_figure:hover .card-photo,
.card_about_figure:hover .card-photo{
	box-shadow:5px 5px 10px rgba(0,0,0,0.3);
}

.card_figure .card-text,
.card_about_figure .card-text{
	color:#666;
	font-size:var(--text-sm);
	text-align:center;
	margin-top:var(--spacing-2xs);
}