
/*------------------------------------------------------------------------------------------- card*/
/*----- card */
.card{
	background:transparent;
	border-radius:0;
}




/* ------------------------------------------------ #card-name */
.card-name{
	font-size: 1.125rem; font-weight:600;
	line-height: 1.4;
}
/*@media (min-width: 992px){
	.card-name{
		font-size: 1.1rem;
	}
}*/

.card-name,
.card-name a{
	color:#333;
}
/*.card:hover .card-name a{
	color:var(--color-dark);
}*/
.card-name a:hover,
.card:hover .card-name a:hover{
	color:var(--color-accent);
}





/* ------------------------------------------------ #card-text */
.card-text{
	font-size: 1rem;
	line-height: 1.6;
}

.text-limit-1,
.text-limit-2,
.text-limit-3,
.text-limit-4{
	display:-webkit-box;
	text-overflow:ellipsis;
	overflow:hidden;
	
	-webkit-box-orient:vertical;
	white-space:normal;
}
.text-limit-1{ -webkit-line-clamp:1; }
.text-limit-2{ -webkit-line-clamp:2; }
.text-limit-3{ -webkit-line-clamp:3; }
.text-limit-4{ -webkit-line-clamp:4; }





/* ------------------------------------------------ #card-info */
.card-info{
    font-size: 0.875rem; line-height: 1;
}
.card-info,
.card-info a{}
.card-info a:hover{
	color: var(--color-accent);
}



.card_job .card-info .card-info-text,
.card_store .card-info .card-info-text{
	flex:1 1 auto;
    width:1%; min-width:0;
}





/* ------------------------------------------------ #card-btn */
.card-btnbar{
	position:relative; z-index:5;
	text-align:center;
}
.card-btn{
	background: #fff;
	border-radius:2rem / 2rem;
	border:2px solid var(--color-light-one);
	color:var(--color-dark-one);
	overflow:hidden;
	padding:0.5rem 1.2rem;
}
.card-btn:before{
	position: absolute; top: 0; right:0; content: "";
	display: block;
	width: 100%; height: 100%;
	
	background:var(--color-gradient-accent);
	/*border-radius:1.5rem / .15rem;*/
	
	transform-origin:center center;
	transform:translateY(100%);
	
	-webkit-transition: transform 0.5s ease;
			transition: transform 0.5s ease;
}
.card-btn .iconsvg{
	width:20px; height:20px;
}
.card-btn .iconsvg:before{
	background-color:var(--color-dark-one);
}



/* ===== card-btn_more */
/*.card-btn_outlink .iconsvg:before,*/
/*.card-btn_more .iconsvg:before{
	-webkit-mask-image: url(../images/icon/icon_arrow_toright.svg);
			mask-image: url(../images/icon/icon_arrow_toright.svg);
}*/




/* ===== card-btn_reserve 、 card-btn_meeting */
.card-btn_reserve,
.card-btn_meeting{
	/*border-radius:5px;*/
	padding:5px 5px;
	margin:0.5rem 0.1rem;
}
.card-btn_reserve{
	background:#fff;
	border-color:var(--color-reserve);
	color:var(--color-reserve);
}
.card-btn_reserve:before{
	background:var(--color-reserve);
}
.card-btn_reserve .iconsvg:before{
	background-color:var(--color-reserve);
}


.card-btn_meeting{
	background:#fff;
	border-color:var(--color-meeting);
	color:var(--color-meeting);
}
.card-btn_meeting:before{
	background:var(--color-meeting);
}
.card-btn_meeting .iconsvg:before{
	background-color:var(--color-meeting);
}






/* ------------------------------------------------ #card-btn:hover */
.card-btn:hover{
	border-color:var(--color-accent);
	color:#fff;
}
.card-btn:hover:before{
	transform:translateY(0);
}
.card-btn:hover .iconsvg:before{
	background-color:#fff;
}




/* ===== card-btn_reserve 、 card-btn_meeting ===== */
.card-btn_reserve:hover{
	border-color:var(--color-reserve);
}
.card-btn_meeting:hover{
	border-color:var(--color-meeting);
}










/*項目 hover:圖片-放大*/
.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{
	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);
}






/*------------------------------------------------------------------------------------------- */
/*---- #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-accent);
	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.8);
}
.effect_base_vt:hover .card-info .iconsvg:before{
	background-color:rgba(255,255,255,0.8);
}



.effect_base_vt .card-btn:hover{
	border-color:#fff;
}









/*------------------------------------------------------------------------------------------- */
/*---- #effect_bg_vt：直式-有色底白雲 */
/*.effect_bg_vt{
	background:var(--color-gradient-two);
	border:1px solid #fff;
	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_bg_vt:before,
.effect_bg_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_bg_vt:before{
	/*width:360px; height:200px;*/ /*90:50*/
	
	/*background-color:rgba(255,255,255,0.3);
	-webkit-mask-image: url(../images/cloud-04.svg);
   			mask-image: url(../images/cloud-04.svg);
	
	transform:translate(30%, 25%);*/
}
.effect_bg_vt:after{
	/*width:480px; height:200px;*/ /*120:50*/
	
	/*background-color:rgba(255,255,255,0.1);
	-webkit-mask-image: url(../images/cloud-05.svg);
   			mask-image: url(../images/cloud-05.svg);
	
	transform:translate(30%, 25%);*/
}

/*.effect_bg_vt:hover{
	background:var(--color-gradient-accent);
	border-color:transparent;
	box-shadow: none;
}
.effect_bg_vt:hover:before{
	background-color:rgba(255,255,255,0.3);
}
.effect_bg_vt:hover:after{
	background-color:rgba(255,255,255,0.1);
}



.effect_bg_vt .card-name,
.effect_bg_vt .card-name a{
	color:#fff;
}
.effect_bg_vt .card-name a:hover,
.effect_bg_vt:hover .card-name a:hover{
	color:#fff;
	text-shadow: black 0.1em 0.1em 0.2em;
}


.effect_bg_vt .card-text{
	color:var(--color-dark-one);
}
.effect_bg_vt:hover .card-text{
	color:rgba(255,255,255,0.8);
}*/







/*------------------------------------------------------------------------------------------- */
/*---- #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-accent);
	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{
	background-color:rgba(255,255,255,0.8);
}


.effect_base_hz .card-btn:hover{
	border-color:#fff;
}








/*------------------------------------------------------------------------------------------- */
/*---- #effect_bg_hz：橫式-有色底白雲 */
/*.effect_bg_hz{
	background:var(--color-gradient-two);
	border:1px solid #fff;
	border-radius:1rem/1rem;
	padding: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;
}

.effect_bg_hz:before,
.effect_bg_hz:after{
	position: absolute; z-index:-1; bottom:0; right:0; content: "";
	
	-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%;
			
	transition: transform 0.5s ease;
}*/
.effect_bg_hz:before{
	/*width:245px; height:175px;*/ /*70:50*/
	
	/*background-color:rgba(255,255,255,1);
	-webkit-mask-image: url(../images/cloud-06.svg);
   			mask-image: url(../images/cloud-06.svg);

	transform:scaleX(-1) translate(0, 12%);*/
}
.effect_bg_hz:after{
	/*width:385px; height:175px;*/ /*110:50*/
	
	/*background-color:rgba(255,255,255,0.3);
	-webkit-mask-image: url(../images/cloud-09.svg);
   			mask-image: url(../images/cloud-09.svg);
			
	transform: translate(15%, 5%);*/
}


/*.effect_bg_hz:hover{
	background:var(--color-gradient-accent);
	box-shadow: none;
}

.effect_bg_hz .card-name,
.effect_bg_hz .card-name a{
	color:#fff;
}
.effect_bg_hz .card-name a:hover,
.effect_bg_hz:hover .card-name a:hover{
	color:#fff;
	text-shadow: black 0.1em 0.1em 0.2em;
}

.effect_bg_hz .card-text{
	color:var(--color-dark-one);
}
.effect_bg_hz:hover .card-text{
	color:rgba(255,255,255,0.8);
}


.effect_bg_hz .cardcol-btn{
	align-self:flex-end;
}
.effect_bg_hz .card-btnbar{
	text-align:right;
}

.effect_bg_hz .card-btn{
	border-color:transparent;
}

.effect_bg_hz:hover .card-btn{
	background:rgba(var(--color-one-rgb),0.2);
}
.effect_bg_hz:hover .card-btn:hover{
	background:#fff;
	border-color:var(--color-accent);
}*/










/*------------------------------------------------------------------------------------------- */
/*---- #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:before{
	position:absolute; z-index:-1; top:0; left:0; content:"";
	width:100%; height:100%;
	background:#fff;
	opacity:0.2;
}*/
.effect_btm_arrow:hover{
	background:var(--color-gradient-accent);
	box-shadow: none;
}
/*.effect_btm_arrow:hover:before{
	background:var(--color-gradient-accent);
	opacity:1;
}*/

.effect_btm_arrow .card-body{
	position:relative; z-index:2;
}

/*.effect_btm_arrow .card-name,
.effect_btm_arrow .card-name a{
	color:#fff;
}*/
.effect_btm_arrow .card-name a:hover,
.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);
	text-align:left;
}
.effect_btm_arrow .card-info .iconsvg:before{
	background-color:var(--color-dark-one);
}

.effect_btm_arrow:hover .card-text,
.effect_btm_arrow:hover .card-info{
	color:rgba(255,255,255,0.8);
}
.effect_btm_arrow:hover .card-info .iconsvg:before{
	background-color:rgba(255,255,255,0.8);
}



.effect_btm_arrow .card-btnbar{
	margin-top:0.5rem;
}

.effect_btm_arrow .card-btn{
	width:140px; height:50px;
	background:transparent;
	border-radius:0;
	border-width:0;
	margin:0;
	overflow:visible;
	
	transform:translate(0, 10px);
	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{
	position:absolute; top:50%; left:50%;
	width:30px; height:30px;
	transform:translate(-50%, -50%);
}
.effect_btm_arrow .card-btn .iconsvg:before{
	background-color:#fff;
	-webkit-mask-image: url(../images/icon/icon_go.svg);
			mask-image: url(../images/icon/icon_go.svg);
}


.effect_btm_arrow:hover .card-btn{
	transform:translate(0, 0);
}
.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{
	background-color:var(--color-accent);
}










/*------------------------------------------------------------------------------------------- */
/*---- #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-photo .item-fitimg:before{
    padding-bottom: 70%;
}
.effect_albums .card-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}

.effect_albums .card-name{
	text-align:center;
}


@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{
		color:var(--color-dark-one);
	}
	
	
	.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);
	}
}












/*------------------------------------------------------------------------------------------- */
/* ----- 219_關於我們 #about */

.card_about_one .card-body{
	margin-top:2rem;
}
@media (min-width:992px){
	.card_about_one .card-body{
		padding-left:5%;
		margin-top:0;
	}
}

.slide-about-one .slick-dots{
	position:absolute; top:0; right:0;
	width:100%;
	padding:5px 10px;
}
.slide-about-one .slick-dots{
	justify-content:flex-end;
}
.slide-about-one .slick-dots li button{
	width:14px; height:14px;
	background:rgba(0,0,0,0.3);
	border:1px solid #fff;
	border-radius:50%;
}

.slide-about-one,
.slide-about-one .slick-slide{
	border-radius:1rem/1rem;
	overflow:hidden;
}







/* ===== 共同設定 [in idx] */
.card_about_one_figure,
.card_about_two_figure{
	background:transparent;
}

.card_about_one .card-photo,
.card_about_two_figure .card-photo{
	border-radius:1rem/1rem;
	overflow:hidden;
	transition:box-shadow 0.1s ease;
}
.card_about_two_figure .card-photo:hover{
	box-shadow:5px 5px 10px rgba(0,0,0,0.3);
}


.card_about_one,
.card_about_two{
	background:transparent;
}

.card_about_one .card-name,
.card_about_two .card-name{
	display:none;
}

.card_about_one .card-text,
.card_about_two .card-text{
	font-size:1.125rem; /*font-weight:600;*/
	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);
}

.card_about_one .card-btnbar{
	display:block;
	text-align:center;
	margin-top:1rem;
}

@media (min-width:640px){
	.card_about_one .card-btnbar{
		text-align:right;
	}
}


/*.idx_about_one_figure,*/
.idx_about_two_figure{
	margin-top:3rem;
}
.about_two_figure_row{
	justify-content:center;
}














/*------------------------------------------------------------------------------------------- */
/*---- 220_相簿管理 #albums */
/*.card_albums{
	text-align:center;
}*/










/*------------------------------------------------------------------------------------------- */
/*---- 221_最新消息 #news */
/*.card_news{
	background:#fff;
	border-radius:1rem/1rem;
	padding:1rem;
	text-align:center;
	transition: box-shadow 0.3s ease,
				transform 0.3s ease;
}
.card_news:hover{
	box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, 
				rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
	transform: translateY(-10px);
}

.card_news .card-photo{
	margin-bottom:1rem;
}
.card_news .card-photo .item-fitimg .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}

.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-one);
    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;
}*/

.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;
}













/*------------------------------------------------------------------------------------------- */
/*---- 223_文章 #article */
.card_article{
	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_article:before,
.card_article: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_article: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_article: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_article:hover{
	background:var(--color-gradient-accent);
	border-color:transparent;
	box-shadow: none;
}
.card_article:hover:before{
	background-color:rgba(255,255,255,0.3);
}
.card_article:hover:after{
	background-color:rgba(255,255,255,0.1);
}



/*.card_article:hover{
	box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, 
				rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}*/
/*.card_article .card-name{
	background:var(--color-light-one);
	margin-top:-1rem;
	margin-left:-1rem;
	margin-right:-1rem;
	margin-bottom:1rem;
	padding:1rem 1rem;
}*/

/*.card_article .card-name:hover{
	background:var(--color-accent);
}
.card_article .card-name:hover a,
.card_article .card-name:hover a:hover{
	color:#fff;
}*/






/*------------------------------------------------------------------------------------------- */
/*---- 293_文件下載 #download */
/*.card_download{
	background:#fff;
	border: 3px solid var(--color-light-one);
	border-radius:1rem/1rem;
	padding:1rem;
	transition: box-shadow 0.3s ease;
	overflow:hidden;
}
.card_download:hover{
	box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, 
				rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
.card_download .card-name{
	background:var(--color-light-one);
	margin-top:-1rem;
	margin-left:-1rem;
	margin-right:-1rem;
	margin-bottom:1rem;
	padding:1rem 1rem;
}
.card_download .card-btnbar{
	text-align:right;
}*/
.card_download{
	padding-bottom:1rem;
}
.card_download .card-btnbar{
	text-align:right;
}
.card_download .card-btn{
	margin-bottom:0;
}







/*------------------------------------------------------------------------------------------- */
/*---- 225_常見問題 #qa (套用#accordion) */
.card_qa{
	position:relative; z-index:2;
	background:#fff;
	margin-bottom:40px;
}

.card_qa .card-info_sign{ display:none; }

.card_qa .card-info_open{
	position:absolute; top:50%; right:10px;
	width:30px; height:30px;
	border-radius:5px;
	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:var(--color-one);
	
	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;
	background:#fff;
	border-radius:10px;
	color:#333;
	cursor:pointer;
	padding:2rem 70px;
	box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}
.card_qa .card-header:before{
	position:absolute; top:0; left:0; content:"";
	width:100%; height:100%;
	background-color:var(--color-light-one); 
	border-radius:10px;
	opacity:0;
}
.card_qa .card-header:hover:before{
	opacity:0.1;
}

.card_qa .card-info_q{
	position:absolute; top:50%; left:10px;
    display:block;
    width:50px; height:50px;
	background:var(--color-one);
	border-radius:50%;
    transform:translate(0, -50%);
	margin:0;
	overflow:hidden;
}
.card_qa .card-info_q:before{
	position:absolute; z-index:2; 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:50% 50%;
    mask-size:50% 50%;
	
	-webkit-mask-image:url(../images/icon/icon_q.svg);
    mask-image:url(../images/icon/icon_q.svg);
}
.card_qa .card-info_q:after{
	position: absolute; z-index:1; top:0; left:0; content: "";
	width:110px; height:50px; /*70:50*/
	
	background-color:rgba(255,255,255,0.3);
	-webkit-mask-image: url(../images/cloud-09.svg);
   			mask-image: url(../images/cloud-09.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%;
			
	transition: transform 0.5s ease;
	transform:translate(-10%, 15%);
}
.accordion-trigger.is-open .card_qa .card-info_q{
	background:var(--color-gradient-accent);
}	


.card_qa .card-info_a{
	display:none;
}

.card_qa .card-name{
	font-size:1.125rem;
	color:#333;
	padding:0;
	margin:0;
}
.card_qa .card-header:hover .card-name{
	color:var(--color-one); 
}

.card_qa .card-body {
	background:#fff;
	border-top:1px dashed #ccc;
	color:#777;
	padding:15px 15px 15px 55px;
	margin-top:-40px;
	box-shadow: rgba(100, 100, 111, 0.2) 7px 7px 10px;
}

.accordion-trigger.is-open .card_qa .card-header{
	background:#fff;
	border-radius:10px 10px 0 0;
}
.accordion-trigger.is-open .card_qa .card-name{
	color:var(--color-accent);
}

.card_qa .card-text{
	color:#333;
}










/*------------------------------------------------------------------------------------------- */
/*---- 244_會員管理 #member (套用#accordion) */
.card_member .card-tr{
    display:flex; flex-wrap:wrap;
    align-items:center;
}
.card_member .card-td{
    flex:1 1 auto;
    width:1%;
    min-width:0;
}

.card_member .card-td_jobtitle{ display:none; }
.card_member .card-td_company{ width:40%; }
.card_member .card-td_name{ width:30%; }
.card_member .card-td_moreinfo{ width:30%; text-align:right; }
@media (min-width:992px){
	.card_member .card-td_jobtitle{ display:block; width:15%; }
	.card_member .card-td_company{ width:35%; }
	.card_member .card-td_name{ width:20%; }
	.card_member .card-td_moreinfo{ width:30%; }
}



/*標題列*/
.card_member_headline{
	font-size:0.875rem;
	color:var(--color-one);
	padding:0 10px 5px 10px;
	border-bottom:3px solid rgba(var(--color-one-rgb),0.4);
}



/*觸發列*/
.card_member .card-header{
	position:relative;
	color:var(--color-dark-one);
	font-weight:600;
    padding:1.5rem 0.5rem;
	border-bottom:1px dashed var(--color-one);
}
.card_member .card-header:before{
	position:absolute; top:0; left:0; content:"";
	width:100%; height:100%;
	
	background-color:var(--color-one); 
	
	opacity:0;
}
.card_member .card-header:hover:before{
	opacity:0.2;
}


.card_member_top .card-info{
	font-size:1rem; font-weight:600;
}


/*詳細-箭頭*/
.card_member .card-info_open{
    position:relative;
    display:inline-block;
    padding-right:14px;
	font-size:0.875rem; line-height:1;
    color:var(--color-dark-one);
}
.card_member .card-info_open:before{
	position:absolute; top:50%; right:0; content:"";
	width:0; height:0;
    
    border-width:5px 5px 0 5px;
    border-style:solid;
    border-color:var(--color-dark-one) transparent transparent transparent;
	
	margin-top:-3px;
}


/*觸發列 開啟*/
.accordion-trigger.is-open .card_member .card-header{
	background:var(--color-one); 
	color:#fff;
}
.accordion-trigger.is-open .card_member .card-header .card-info{
    color:#fff;
}
.accordion-trigger.is-open .card_member .card-info_open:before{
    border-top-width:0;
    border-top-color:transparent;
    
    border-bottom-width:5px;
    border-bottom-color:#fff;
}



/*開啟區塊*/
.card_member_btm{
	background:#fff;
    padding:20px;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 15px 0px;
}

/*開啟區塊-相片*/
.card_member .card-photo{
	max-width:400px; margin:0 auto;
}





/*資訊組*/
.card_member .card-infolist a{
	text-decoration:underline;
}
.card_member .card-infolist .card-info{
	border-bottom:1px dashed #ccc;
	color:#333;
	padding:5px 0;
    border-bottom:1px dashed #ccc;
}
.card_member .card-infolist .card-info-title{
	width:100%;
    color:var(--color-dark);
	font-size:0.875rem; font-weight:600;
}
.card_member .card-infolist .card-info-text{
    padding-left:16px;
}
@media (min-width:576px){

    .card_member .card-infolist .card-info-title{
        position:relative;
        width:120px;
        margin-right:10px;
        text-align:right;
        padding-right:15px;
		margin-top:2px;
    }
    .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{
        padding-left:0;
    }
}


/*個人介紹-標題*/
.card_member .card-text-heading{
    display:block;
	border-bottom:1px dashed #ccc;
    
    color:var(--color-dark);
	
	font-size:0.875rem; font-weight:600;
    text-align:center;
    padding:5px 0;
    margin:30px 0 10px 0;
}

.card_member .card-text{
	font-size:1rem;
}










/*------------------------------------------------------------------------------------------- */
/*---- 227_經銷地區 #location */
.card_location .card-iframe{
	position:relative; z-index:3;
	padding-bottom:50%;
}
.card_location .card-text{
	text-align:left;
}









/*------------------------------------------------------------------------------------------- */
/*---- 230_產品管理 #product */

.pro-view-area{
	border-bottom:1px dashed rgba(var(--color-two-rgb),0.6);
	padding-bottom:3rem;
	margin-bottom:3rem;
}

.pro-view-row{ display:flex; flex-wrap:wrap; }
.pro-view-left{ width:100%; }
.pro-view-right{ width:100%; padding-top:1rem; }

@media (min-width:992px){
	.pro-view-left{ width:45%; }
	.pro-view-right{ width:55%; padding-left:60px; }
}

.sync-thum-slide .slide-photo .thumb{ background-size:cover; }


/*圖輪播*/
.sync-slide{ border:1px solid #ccc; margin-bottom:20px; }
.sync-slide .slick-prev,
.sync-slide .slick-next{
	position:absolute; z-index:1; top:0;
	display:block;
	width:70px; height:100%;
	background:transparent;
	font-size:0;
	color:transparent;
	border:none;
	cursor:pointer;

	-webkit-transition:opacity 0.7s ease , transform 0.7s ease;
	transition:opacity 0.7s ease , transform 0.7s ease;
}

.sync-slide .slick-prev{ left:0; transform:translateX(-70px); }
.sync-slide .slick-next{ right:0; transform:translateX(70px); }

.sync-slide .slick-prev:before,
.sync-slide .slick-next:before{
	position:absolute; top:50%; left:50%; content:"";
	width:10px; height:10px;
	margin-top:-7px; margin-left:-7px;
	
	border-width:3px;
	border-style:solid;
	border-color:#fff;
	
	transform:rotate(45deg);
}

.sync-slide .slick-prev:before{ border-top-width:0; border-right-width:0; }
.sync-slide .slick-next:before{ border-left-width:0; border-bottom-width:0; }

.sync-slide:hover .slick-prev,
.sync-slide:hover .slick-next{
	transform:translateX(0);
}

.sync-slide .slick-prev:hover,
.sync-slide .slick-next:hover{
	background:linear-gradient(top, transparent, rgba(255, 255, 255, 0.35), transparent);
	background:-moz-linear-gradient(top, transparent, rgba(255, 255, 255, 0.35), transparent);
	background:-webkit-linear-gradient(top, transparent, rgba(255, 255, 255, 0.35), transparent);
	background:-o-linear-gradient(top, transparent, rgba(255, 255, 255, 0.35), transparent);
	background:-ms-linear-gradient(top, transparent, rgba(255, 255, 255, 0.35), transparent);
}

.sync-slide .slick-prev.slick-disabled,
.sync-slide .slick-next.slick-disabled{ opacity:0.2; cursor:default; }




/*縮圖輪播*/
.sync-thum-slide .slide-photo .thumb{ padding-bottom:75%; }

.sync-thum-slide .slick-slide{
	margin:0 5px;
	border:3px solid rgba(255,255,255,0.1);
	cursor:pointer;
	
	transition:border-color 0.7s ease;
}
.sync-thum-slide .slick-slide:hover{
	border-color:var(--color-two);
}
.sync-thum-slide .slick-slide.slick-current{
	border-color:var(--color-accent);
	
	opacity:1; cursor:default;
}











/*------------------------------------------------------------------------------------------- */
/*---- 453_代理產品 #agent_pd */
.card_agent_pd{
	text-align:center;
}

.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;
}




/* ===== agent_pd [in idx] */
.item-slide-agent{ padding:0 15px; }
.item-slide-agent .slick-slide{ padding:15px 15px; }

.item-slide-agent .card{
	box-shadow:none;
}

.item-slide-agent .slick-prev , .item-slide-agent .slick-next{
	top:50%;
	margin-top:-25px;
	width:50px; height:50px;
	background:#fff;
	border:2px solid #fff;
	border-radius:50%;
}
.item-slide-agent .slick-prev{
	left:3px; transform:translateX(0);
	box-shadow:4px 0 6px rgb(0 0 0 / 30%);
}
.item-slide-agent .slick-next{
	right:3px; transform:translateX(0);
	box-shadow:-4px 0 6px rgb(0 0 0 / 30%);
}

.item-slide-agent .slick-prev:before, 
.item-slide-agent .slick-next:before{
	border-color:var(--color-one);
}
.item-slide-agent .slick-prev:hover, 
.item-slide-agent .slick-next:hover{
	background:var(--color-accent);
}
.item-slide-agent .slick-prev:hover:before, 
.item-slide-agent .slick-next:hover:before{
	border-color:#fff;
}












/*------------------------------------------------------------------------------------------- */
/*---- 235_作品管理 #works */









/*------------------------------------------------------------------------------------------- */
/*---- 237_設計師(使用者) #designer */
/*---- 331_個人介紹 */
@media (min-width:992px){
	.card_designer .card-btnbar{
		text-align:right
	}
}
/*.card_designer .card-btn{
	width:100%;
	border-width:1px;
	padding:0.5rem 0.7rem;
}*/





/*會議列表*/
.meeting-list > li{ margin-bottom:20px; }

.card_meeting{
	border:1px solid #ccc;
	border-radius:1rem/1rem;
	padding:15px;
	box-shadow:none;
}
.card_meeting:before,
.card_meeting:after{
	display:none;
}

@media (min-width:992px){
	.card_meeting .card-left{ width:150px; }
	.card_meeting .card-center{
		width:calc( 100% - 400px );
		padding:0 30px;
		margin:0;
	}
	.card_meeting .card-right{ width:250px; margin:0; }
}


.card_meeting .card-name{
	background:#f3f3f3;
	color:#000;
	padding:8px;
	margin:1rem 0;
}
@media (min-width:992px){
	.card_meeting .card-name{
		margin-top:0;
	}
}

.card_meeting .card-info,
.card_meeting .card-info a{
	color:#333;
}
.card_meeting .card-info a:hover{
	color:var(--color-dark);
}
.card_meeting .card-info .iconsvg:before{
	background-color:#333;
}


/* 允許(in designer meeting) */
.card_meeting .card-btnbar{
	position:relative; z-index:5;
}
.card_meeting .card-btn_allow_meet{
	width:100%;
	background:#fff;
	border:1px solid var(--color-meeting);
	border-radius: 2rem / 2rem;
	color:var(--color-meeting);
	text-align:center;
	font-size:0.875rem; font-weight:600; line-height:1;
	padding:0.6rem 1.1rem 0.6rem 1.3rem;
	margin:0;
}
.card_meeting .card-btn_allow_meet .iconsvg{
	width:16px; height:16px;
}
.card_meeting .card-btn_allow_meet .iconsvg:before{
	background-color:var(--color-meeting);
}
.card_meeting .card-btn_allow_meet:hover{
	background:var(--color-meeting);
	border-color:var(--color-meeting);
	color:#fff;
}
.card_meeting .card-btn_allow_meet:hover .iconsvg:before{
	background-color:#fff;
}



/* 不允許(in designer meeting) */
.card_meeting .card-info_noallow{
	width:100%;
	justify-content:center;
	border:1px solid red;
	border-radius: 2rem / 2rem;
	color:red;
    font-size:0.875rem; font-weight:600; line-height:1;
	padding:0.5rem 1.1rem 0.5rem 1.3rem;
}
.card_meeting .card-info_noallow .iconsvg,
.card_meeting .card-info_noallow .card-info-text{
	margin:0 1px;
}

.card_meeting .card-info_noallow .iconsvg{
    display:block;
	width:20px; height:20px;
}
.card_meeting .card-info_noallow .iconsvg:before{
	background-color:red;
}
.card-info_noallow:hover{
    cursor:no-drop;
}


/* 視訊日期-起訖(in designer meeting) */
.card_meeting .card-info_date{
	align-items:flex-start;
	font-size:0.875rem;
}
.card_meeting .card-info_date .card-info-title{
    width:60px;
	border:1px solid rgba(0,0,0,0.2);
	border-radius:10px;
	text-align:center;
}
.card_meeting .card-info_date_start{ color:#009933; }
.card_meeting .card-info_date_start .card-info-title{
	border-color:#009933;
}


.card_meeting .card-text{ color:#333; }






/* ===== card_summary [in designer_view]：詳細頁-個人介紹 */
.card_summary{
	max-width:400px;
	border-bottom:1px dashed var(--color-light-one);
	padding-bottom:1rem;
	margin-bottom:2rem;
}

@media (min-width:992px){
	.card_summary{
		max-width:100%;
		padding:2rem;
	}
    .card_summary .card-left{ width:300px; }
	.card_summary .card-center{
		width:calc( 100% - 450px );
		padding:0 30px;
		margin:0;
	}
	.card_summary .card-right{
		width:150px;
		margin:0;
	}
}

.card_summary .card-name{
	margin-top:15px;
	margin-bottom:20px;
	padding-bottom:10px;
	border-bottom:2px dashed rgba(var(--color-two-rgb),0.3);
}
.card_summary .card-text{
	font-size:1rem;
}

.card_summary .card-btnbar{
	margin-top:0;
	text-align:center;
}
.card_summary .card-btn{
	width:100%;
	margin:0 0 10px 0;
}
/*.card_summary .card-btn_reserve,
.card_summary .card-btn_meeting{
	padding:0.5rem;
}*/
/*.card_summary .card-btn .iconsvg{
	width:24px; height:24px;
	margin-bottom:5px;
}*/


.card_summary .card-box_qrcode{
    max-width:120px;
    margin:20px auto 0 auto;
	text-align:center;
}
.card_summary .card-info_scan{
	justify-content:center;
}
.card_summary .card-info_scan .card-info-text{
	font-size:0.875rem; font-weight:600;
}
.card_summary .card-info_scan .iconsvg{
	display:none;
}
.card_summary .card-box_qrcode .card-photo{
	border:1px solid #ccc;
	margin-top:5px;
}









/*------------------------------------------------------------------------------------------- */
/*---- 274_相關連結 #link */
.card_link .card-name{
	text-align:center;
	margin-top:1rem;
}











/*------------------------------------------------------------------------------------------- */
/*---- 343_活動管理 #announecment */
/*.card_activity{
	background:#fff;
	border-radius:1rem / 1rem;
	border:3px solid var(--color-one);
	
    padding: 1rem;
}

.card_activity .card-photo{
	background:transparent;
	border-width:0;
}

.card_activity .card-name{
	position:static;
	text-align:left;
}*/


.card_activity .item-fitimg:before {
    padding-bottom: 70%;
}



/*狀態*/
.card_activity .card-info_status{
	position:relative;
	justify-content:center;
	font-weight:600;
	margin:1rem 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:2px;
}
.card_activity .card-info_status .card-info-text{
	font-size:1rem;
	color:var(--color-dark-one);
}

.card_activity:hover .card-info_status .card-info-text{
	color:#fff;
}



/* 活動資料 */
.card_activity .card-infolist{
	border-width:1px 0 0 0;
	border-style:dashed;
	border-color:rgba(255,255,255,0.5);
	padding:0.5rem 0 0 0;
	margin:1rem 0 0 0;
}
.card_activity .card-infolist li{
	margin:0.7rem 0;
}

.card-info_event .card-info-title{
	display:block;
	width:120px;
	background:#fff;
	border:1px solid var(--color-dark-one);
	border-radius:1rem/1rem;
	color:var(--color-dark-one);
	padding:1px;
	text-align:center;
}
.card-info_event .card-info-text{
	width:100%;
	padding:5px 0 5px 1rem;
}

@media (min-width:992px){
	.card_activity .card-infolist li{
		margin:0.4rem 0;
	}

	.card-info_event .card-info-text{
		flex:1 1 auto;
		width:1%; min-width:0;
		
		padding-left:5px;
	}
}

.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:0.75rem; 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;
}
@media (min-width:992px){
	.card_activity .card-btnbar{
		margin-top:0;
	}
}




.calendar_box{
	text-align:center;
	margin:2rem 0;
}










/*------------------------------------------------------------------------------------------- */
/*---- 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:2rem;
}

.card_job .card-infolist{
    display:flex; flex-wrap:wrap;
}
.card_job .card-infolist > li{
	width:100%;
	padding:5px;
}

.card_job .card-info{
	position:relative;
	align-items:flex-start;
	
    border-bottom:1px dashed rgba(var(--color-one-rgb),0.4);
	
	font-size:1rem;
	color:#333;
	padding:10px 0;
}
.card_job .card-info .card-info-title{
	position:relative;
	display:block;
	width:100%;
	color:var(--color-dark);
    font-weight:600;
	margin-bottom:3px;
}
.card_job .card-info .card-info-text{
    padding-left:16px;
	margin-bottom:3px;
}


@media (min-width:576px){

    .card_job .card-info .card-info-title{
        width:145px;
        margin-right:5px;
        padding-right:15px;
		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-left:0;
    }
}


@media (min-width:992px){
	.card_job{
		padding:30px;
	}
    .card_job .card-infolist > li{
        width:50%;
        padding:0 5px;
    }
    .card_job .card-infolist > li.w-100{ width:100%; }
}





/* ====== card_recruit [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 .card-name{
	text-align:center;
	padding:1rem 0;
}

.card_recruit .card-infolist li{
    margin-bottom:20px;
}
.card_recruit .card-infolist li:last-child{
	margin-bottom:0;
}

.card_recruit .card-info{
	font-size:1rem;
}
.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-weight:600;
	padding:0 10px;
    margin-bottom:5px;
}
.card_recruit .card-info .card-info-text{
	width:100%;
    padding-left:26px;
    /*color:#fff;*/
}












/*------------------------------------------------------------------------------------------- */
/*---- 435_設備資料 #equipment */











/*------------------------------------------------------------------------------------------- */
/*---- 454_加盟主活動 #franchiser_event */










/*------------------------------------------------------------------------------------------- */
/*---- 455_加盟主資訊 #franchiser */
.card_franchiser .card-name{
	font-size: 1rem;
	margin-top: 0;
}
.card_franchiser .card-body{
	padding: 1rem;
}
.card_franchiser .card-info{
	align-items: flex-start;
	margin-bottom: 0;
}
.card_franchiser .card-info .iconsvg{
	display: block;
	margin-top: 3px;
}
.card_franchiser .card-info{
	font-size: 0.875rem;
}










/*------------------------------------------------------------------------------------------- */
/*---- 484_時間記事 #timeline */
.timeline-event{
    position:relative;
}

@media (min-width:992px){
	.timeline-event{
		padding-bottom:30px;
		margin:30px 0;
	}

	/*中間線*/
	.timeline-event:before{
		position:absolute; top:0; left:50%; content:"";
		width:2px; height:100%;
		
		background:var(--color-one);
		
		transform:translate(-50%, 0);
	}
	
	/*中間線底的圓圈*/
	.timeline-event:after{
		position:absolute; bottom:0; left:50%; content:"";
		width:12px; height:12px;
		
		background:var(--color-one);
		
		border-radius:50%;
		transform:translate(-50%, 0);
	}
}

/*年份*/
.timeline-year{
    position: relative; z-index: 2;
    width: 100%;
    margin: 3rem 0 2rem 0;
    text-align: center;
}

.timeline-year-text{
	position: relative;
	display:inline-block;
	background:#fff;
	border-radius:1rem / 1rem;
	border:3px solid var(--color-one);
	color:var(--color-dark-one);
	font-size:1rem; font-weight:600; line-height:1;
	padding:0.4rem 2rem;
	margin-left:-1px;
}
/*.timeline-year-text:after{
	position:absolute; top:100%; left:50%; content:"";
	width:0; height:0;
	margin-left:-10px;
	
	border-width:10px 10px 0 10px;
	border-style:solid;
	border-color:#ccc transparent transparent transparent;
}
@media (min-width:992px){
	.timeline-year-text:after{
		display:none;
	}
}*/

.timeline-box{
    margin-bottom:1rem;
}

.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: 0.5rem;
	transition: box-shadow 0.3s ease;
}

.card_timeline .card_row{
    align-items:center;
}
.card_timeline .card-left{
    order:2;
    width: 120px;
    padding-left: 1rem;
}
.card_timeline .card-right{
    order:1;
    flex:1 1 auto;
	width:1%; min-width:0;
}

/*項目-header */
.card_timeline .card-header{
	margin-bottom:1rem;
	/*border-bottom:1px dashed #ccc;*/
}
.card_timeline .card-header_row{
    display:flex; flex-wrap:wrap;
    align-items:center;
}
.card_timeline .card-header-left{
	width:80px;
	margin-right:20px;
}
.card_timeline .card-header-right{
	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 .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:0.875rem; line-height:1;
    font-family:Helvetica;
    padding:3px 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:hover .card-date-box{
	background:var(--color-accent);
}





/*行數限制*/
.card_timeline .card-name{
	margin:0;
	
	display:-webkit-box;
	text-overflow:ellipsis;
	overflow:hidden;
	
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	white-space:normal;
}

/*.card_timeline .card-body{
	padding-left:0.5rem;
}*/

@media (min-width:992px){

    /*消除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:1rem;
    }
    .timeline-year:nth-child(1){ margin-top:0; }
        
    .timeline-box{
        float:left;
        width:55%;
        padding-right:calc(5% + 60px);
        margin-bottom: 3rem;
        margin-top: -80px;
    }
    
    /*中間年份 與 漂浮項目之設定 */
    .timeline-year + .timeline-box{ margin-top:0; }
    
    /*項目-延伸至中間的線條 */
    .card_timeline{
        /*padding: 1rem 1rem 1rem 0;*/
		padding: 1rem;
    }
	/*.card_timeline .card-body{
		padding-left:1rem;
	}*/

    .card_timeline .card-left{
        width: 150px;
    }
    .card_timeline:before{
        position:absolute; top:15px; right:-60px; content:"";
        width:60px; height:1px;
		border-top:2px dashed var(--color-one);
    }
    .card_timeline:hover:before{ border-top:1px solid var(--color-accent); }
    
    /*項目-延伸至中間的圓圈 */
    .card_timeline:after{
        position:absolute; top:16px; right:-60px; content:"";
        width:14px; height:14px;
        background:#fff;
        border-radius:50%;
        border:2px solid var(--color-one);
		transform:translate(50%, -50%);
    }
    .card_timeline:hover:after{ border-color:var(--color-accent); }
    
    
    .timeline-box:nth-of-type(2n){
        float:right;
        padding-left:calc(5% + 60px);
        padding-right:0;
    }
    .timeline-box:nth-of-type(2n) .card_timeline:before{
        left:-60px; right:auto;
    }
    .timeline-box:nth-of-type(2n) .card_timeline:after{
        left:-60px; right:auto;
		transform:translate(-50%, -50%);
    }
 
    
}
















/*------------------------------------------------------------------------------------------- */
/*---- 490_人物介紹 #people */
.card_people .card-photo{
	max-width:220px;
	border-radius:50%;
	overflow:hidden;
	margin:0 auto 1rem auto; 
}

.card_people .card-slogan{
	color:var(--color-dark-two);
	font-size:1.125rem; font-weight:600;
	margin:1rem 0;
}
.card_people:hover .card-slogan{
	color:#fff;
}

.card_people .card-infolist{
	margin:0;
	padding:0.2rem 0;
}















/*------------------------------------------------------------------------------------------- */
/*---- 491_在地新聞 #uninews */



/*------------------------------------------------------------------------------------------- */
/*---- 492_在地生活 #life */










/*------------------------------------------------------------------------------------------- */
/*---- 512_推薦店家 #store */
.card_store{
	text-align:left;
}
.card_store .card-body{
	padding:1rem 0 0.5rem 0;
}
.card_store .card-name{
	text-align:center;
}

.card_store .card-text{
	font-weight:600;
}



/* ===== card_store_summary [in store_view] ===== */
.card_store_summary{
	max-width:400px;
	border-bottom:1px dashed var(--color-light-one);
	padding-bottom:1rem;
	margin-bottom:2rem;
}

.card_store_summary .card-photo{
	border-color:#ccc;
	border-radius:10px;
	overflow:hidden;
}

.card_store_summary .card-map{
	height:200px;
}
.card_store_summary .card-map iframe{
	width:100%; height:100%;
}
@media (min-width:992px){
	.card_store_summary{
		max-width:100%;
		padding:2rem;
	}
	.card_store_summary .card-map{
		height:100%;
	}
}


.card_store_summary .card-infolist{
	padding:1rem 0;
}
.card_store_summary .card-infolist > li{
	margin-bottom:10px;
}
@media (min-width:992px){
	.card_store_summary .card-infolist{
		display:flex; flex-wrap:wrap;
		padding:0;
	}
	.card_store_summary .card-infolist > li{
		width:50%;
	}
}


.card_store_summary .card-info{
	font-size:1rem;
}
.card_store_summary .card-info,
.card_store_summary .card-info a{
	color:#333;
}
.card_store_summary .card-info a:hover{
	color:var(--color-accent);
}
.card_store_summary .card-info .iconsvg{
	display:block;
	width:30px; height:30px;
	
    background:var(--color-one);
	
	border-radius:50%;
	margin-right:4px;
}
.card_store_summary .card-info .iconsvg:before{
	background-color:#fff;
	
	-webkit-mask-size:65% 65%;
	mask-size:65% 65%;
}

.card_store_summary .card-info .card-info-title{
	position:relative;
	width:86px;
	font-weight:600;
	margin-right:0;
	padding-right:15px;
	

	/*文字左右對齊*/
	text-align:justify;
	text-align-last:justify;
	text-justify:inter-word;
}
.card_store_summary .card-info .card-info-title:after{
	position:absolute; top:0; right:0; content:"：";
	color:#333;
}





/* ===== around-map [in store_map]：地圖檢視 ===== */
.around-map{
	text-align:center;
	margin:4rem 0;
}
.around-map-item{
	display:inline-block;
	border:1px solid #ccc;
}












/*------------------------------------------------------------------------------------------- */
/*---- 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-image: url(../images/icon/icon_god_frame.svg);
    mask-image: url(../images/icon/icon_god_frame.svg);

    -webkit-mask-position: center;
    mask-position: center;
    
    -webkit-mask-repeat: repeat-x;
    mask-repeat: repeat-x;
    
    -webkit-mask-size: auto 100%;
    mask-size: auto 100%;
	
	opacity:0.7;
}




/* ===== card_god_summary [in god_view] ===== */
.card_god_summary{
	margin:0 auto 4rem auto;
	text-align:center;
}
.card_god_summary .card_row{
	align-items:center;
}
.card_god_summary .heading_submain{
	margin:0;
}
@media (min-width:768px){
	.card_god_summary{
		max-width:240px;
	}
}


.card_god_summary .card-photo{
	border:8px solid #fff;
	border-radius:50%;
	overflow:hidden;
	box-shadow:2px 2px 5px rgba(0,0,0,0.2);
}
.card_god_summary .card-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}
	
.card_god_summary .card-name{
	color:#990000;
	font-size:1.4rem;
}

.card_god_summary .card-name:before{
    position:absolute; z-index:-1; content:attr(data-storke);
    
    -webkit-text-stroke:5px #F6DB82;
    text-stroke:5px #F6DB82;
}









/*------------------------------------------------------------------------------------------- */
/*---- 523_陳情案件 #case */

/* ===== card_case[in case]：案件 ===== */
.card_case{
	position:relative;
	background:rgba(255,255,255,1);
	border-radius:1rem/1rem;
	border:0.3rem solid #fff;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	padding-left:1rem;
	margin-bottom:1rem;
	transition: box-shadow 0.5s ease;
}

.card_case:before{
	position:absolute; z-index:1; top:10%; left:0; content:"";
	width:14px; height:80%;
	background:#333;
	border-radius:10px;
	border:5px solid #fff;
}
.card_case.case-goon:before{
	background:var(--color-case-goon);
}
.card_case.case-finish:before{
	background:var(--color-case-finish);
}

.card_case .card-header,
.card_case .card-body{
	padding:7px 15px;
	border-bottom:1px solid #ccc;
}
.card_case .card-footer{
	padding:10px 15px;
}

.card_case .card-infolist{
	display:flex; flex-wrap:wrap;
	align-items:center;
	margin:0;
}
.card_case .card-body .card-infolist li{
	width:100%;
	margin:3px 0;
}
.card_case .card-info{
	font-size:1rem; font-weight:600;
	color:#333;
}
.card_case .card-info .card-info-title{
	position:relative;
	font-size:0.875rem; font-weight:600;
	color:#666;
	padding-right:16px;
}
.card_case .card-info .card-info-title:after{
	position:absolute; top:0; right:0; content:"：";
	font-size:0.875rem; font-weight:600;
	color:#666;
}

.card_case .card-info_cate .card-info-title{
	display:none;
}

.card_case .card-infolist .card-btnbar{
	margin:0;
	padding:0;
}

.card_case .card-btn{
	display:block;
	width:100%;
}

.card_case .card-info_case_goon,
.card_case .card-info_case_finish{
	font-size:1.3rem;
}
.card_case .card-info_case_goon .iconsvg,
.card_case .card-info_case_finish .iconsvg{
	width:30px; height:30px;
}

.card_case .card-name-text{
	color:#000;
}

.card_case .card-text{
	font-size:1rem;
	color:#333;
}


/*進行中*/
.card-info_case_goon .card-info-text{
	color:var(--color-case-goon);
}
.card-info_case_goon .iconsvg:before{
	background-color:var(--color-case-goon);
}

/*完成*/
.card-info_case_finish .card-info-text{
	color:var(--color-case-finish);
}
.card-info_case_finish .iconsvg:before{
	background-color:var(--color-case-finish);
}


.card_case .card-body .card-btnbar{
	display:none;
}
.card_case .card-footer .card-btnbar{
	margin:1rem 0 0 0;
}

@media (min-width:992px){
	.card_case .card-body .card-infolist li{
		width:30%;
		margin:0;
	}
	.card_case .card-body .card-infolist li:nth-child(4){
		width:10%;
	}
	
	.card_case .card-body .card-btnbar{
		display:block;
	}
	.card_case .card-footer .card-btnbar{
		display:none;
	}
}




/* ===== case-result-list[in case-result]：案件-成果 ===== */
.card_case_result{
	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_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{
	padding:5px;
	border-radius:2rem/2rem;
	margin:0;
}

.card_case_result .card-name-text{
	position:relative; z-index:1;
	display:block;
	color:#fff;
	font-size:1.1rem;
	text-align:center;
	
	text-shadow: black 0.1em 0.1em 0.2em;
}

.card_case_result .card-progress{ margin-top:1rem; }
.card_case_result .card-progress-inner{ padding:1rem; }

.card_case_result .card-info{
	align-items:flex-end;
	font-size:1rem; font-weight:600;
	margin:5px 0;
}
.card_case_result .card-info .card-info-mark{
	display:inline-block;
	font-size:1.1rem;
	margin:0 3px;
}

/*結案率*/
.card_case_result .card-info_percentage{
	justify-content:center;
	font-size:1.2rem;
	color:#F6781D;
}
.card_case_result .card-info_percentage .card-info-mark{
	font-size:1.5rem;
}
@media (min-width:992px){
	.card_case_result .card-name-text{
		font-size:1.4rem;
	}
	
	.card_case_result .card-info .card-info-mark{
		font-size:1.4rem;
	}
	
	.card_case_result .card-info_percentage{
		font-size:1.5rem;
	}
	.card_case_result .card-info_percentage .card-info-mark{
		font-size:2rem;
	}
}

/*陳情數*/
.card_case_result .card-info_total{
	justify-content:flex-end;
	color:#2D556D;
}

/*結案數*/
.card_case_result .card-info_finish{
	color:#ea662a;
}


.card_case_result .progress{
	position:relative; z-index:0;
	width:100%; height:20px;
	background:#2D556D;
	border-radius:20px;
	overflow:hidden;
}
.card_case_result .progress .progress-bar{
	position:absolute; z-index:1; top:-30px; left:0;
	height:80px;
	transform:skewX(-12deg);
}

.card_case_result .progress .progress-bar:before{
	position:absolute; top:0; left:0; content:"";
	width:0; height:100%;
	background:#F5A517;
	border-right:5px solid #fff;
	
	transition:width 5s ease;
}
.card_case_result .progress .progress-bar.is-show:before{
	width:100%;
}






/* ===== card_case_track[in case-track]：案件追蹤 ===== */




/* ===== petition-success[in case_petition_c]：完成陳情 ===== */
.petition-success{
	text-align:center;
	color:var(--color-one);
	font-size:1.25rem; font-weight:600;
}

















/*------------------------------------------------------------------------------------------- */
/*---- D1_自訂選單 #define */










/*------------------------------------------------------------------------------------------- */
/*---- D2_聯絡我們 #contact */
.contact-info-right{
	margin-top:3rem;
}

.contact-mapbox{ height:300px; }
.contact-mapbox iframe{ height:100%; }





/*------------------------------------------------------------------------------------------- */
/*---- 分店資訊 #branch */
.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-name{
	margin-bottom:1.25rem;
	text-align:left;
}

.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-infolist > li{
	margin-bottom:1rem;
}
.card_branch .card-infolist > li:last-child{
	margin-bottom:0;
}
.card_branch .card-info{
	align-items:flex-start;
	font-size:1rem;
}

.card_branch .card-info .iconsvg{
	width:20px; height:20px;
	margin-right:4px;
}

.card_branch .card-info,
.card_branch .card-info a{
	color:#333;
}
.card_branch .card-info a{
	color:var(--color-dark-one);
}
.card_branch .card-info a:hover{
	color:var(--color-accent);
}

.card_branch .card-info-title{
	width:100px;
	border-bottom:1px dashed rgba(0,0,0,0.3);
	color:#333;
	font-weight:600;
}











/*------------------------------------------------------------------------------------------- */
/*---- 問題諮詢 #consult */
.consult{
	margin:2rem 0;
}

.consult_view{
}
.consult_view .consult_inner{
	padding:20px;
}

.consult_view .page{
	margin-bottom:0;
}


.consult .btnbar_consult{
	position:relative; z-index:2;
	text-align:center;
}

.consult_list > li{ margin-bottom:20px; }


.card_consult .card-header,
.card_consult .card-body{
	position:relative;
	padding:10px 2px 6px 50px;
}

.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-info_sign{
	justify-content: center;
	position:absolute; top:0; left:0;
	width:40px; height:40px;
	font-size:0.875rem; font-weight:600; line-height:40px;
    font-family:Helvetica, sans-serif;
	
	color:#fff;
	padding:0;
	text-align:center;
}
.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-body .card-info_sign{ display:none; }
	
.card_consult .card-info-title{
	display:none;
}
.card_consult .card-info-text{
	position:relative; z-index:2;
	margin:0;
}

.card_consult .card-name{
	color:var(--color-one);
	font-weight:600;
	margin:0;
}

.card_consult .card-text{
	color:#333;
	font-size:1rem;
	margin:0;
}










/*------------------------------------------------------------------------------------------- */
/*---- 母子新聞 #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:0.875rem;
}










/*------------------------------------------------------------------------------------------- */
/*---- 609_知識庫 #card_uniarticle_sub */

/*.card_uniarticle .card-photo{
	overflow:hidden;
}*/
.card_uniarticle .card-photo .item-fitimg:before{
    padding-bottom: 75%;
}



/* ===== [in page]：card_uniarticle */
.card_uniarticle{
}

/*取消將連結擴展至整個card*/
.card_uniarticle .card-name a:before{
	display:none;
}


.card_uniarticle .card-infolist{
	display:flex; flex-wrap:wrap;
	margin-top:1rem;
}

.card_uniarticle .card-infolist > li{
	margin-right:1rem;
}
.card_uniarticle .card-infolist > li:last-child{
	margin-right:0;
}

.card_uniarticle .card-info .iconsvg:before{
	background-color:#333;
}
.card_uniarticle .card-info-text,
.card_uniarticle .card-info-text a{
	color:#333;
	font-weight:600;
}

.card_uniarticle:hover .card-info-text a,
.card_uniarticle .card-info-text a:hover{
	color:#fff;
}



/* ===== [at side]：card_uniarticle_sub */
.card_uniarticle_sub{
	background:transparent;
	border-width:0;
}

.card_uniarticle_sub .card-photo{
	border-radius:50%;
	overflow:hidden;
}

.card_uniarticle_sub .card-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}

.card_uniarticle_sub .card-name-text{
	display:-webkit-box;
	text-overflow:ellipsis;
	overflow:hidden;
	
	-webkit-box-orient:vertical;
	white-space:normal;
	-webkit-line-clamp:2;
}



/* ===== [in view]：知識庫詳細-標籤 */
/* .infolist_view_tag{
	display:flex; flex-wrap:wrap;
	margin-top:1rem;
}

.infolist_view_tag > li{
	margin-right:1rem;
}
.infolist_view_tag > li:last-child{
	margin-right:0;
}


.info_view_tag{
	color:#666;
	font-size:0.875rem;
	margin:0;
	padding:2px 0;
}
.info_view_tag .iconsvg,
.info_view_tag .info-text{
	position:relative;
	display:inline-block; vertical-align:middle;
}

.info_view_tag .iconsvg{
	width:18px;
	margin-left:0;
} */



/* ===== [in view]：知識庫詳細-延伸閱讀 */
.card_uniarticle_extended{
	background:transparent;
	border-width:0;
	padding-left:25px;
}
.card_uniarticle_extended:before {
    position: absolute; top: 12px; left: 5px; content: "";
    width: 8px; height: 8px;
    background: var(--color-dark);
    transform: rotate(45deg);
}

.card_uniarticle_extended .card-name{
	margin:0;
}




/* ===== [in view]：知識庫詳細-有興趣 */
/*.card_uniarticle_extended{}*/











/*------------------------------------------------------------------------------------------- */
/*---- 電子名片 #card_namecard (in idx & contact ) */

/*首次使用商務夥伴APP(in idx)*/
.btnbar_appdownload{
	text-align:right;
	margin:10px 0;
}
@media (min-width:992px){
	.btnbar_appdownload{
		margin-top:-2rem;
	}
}

.appdownload-list{
    max-width:500px;
    margin:0 auto;
    text-align:center;
}

.appdownload-list > li{
    display:inline-block;
    width:160px;
    margin:20px 20px 0 20px;
}


.card-app{
	background:transparent;
	border-width:0;
}
.card-app .card-name{ margin-top:10px; }
.card-app .card-name, 
.card-app .card-name a{
    color:#fff;
}



.card_namecard{
	background:#fff;
	border:3px solid var(--color-light-one);
	border-radius:1rem/1rem;
	transition: box-shadow 0.3s ease;
}
.card_namecard:hover{
	box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, 
				rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}

.card_namecard > .card_row{
	margin-right:0;
	margin-left:0;
}
.card_namecard > .card_row > *{
	padding-right:0;
	padding-left:0;
}

.card_qrcode{
	background:transparent;

	border-width:0; border-top-width:1px;
	border-style:solid;
	border-color:#eee;
	
	padding:0.5rem;
}
.card_namecard > .card_row > .col:first-child .card_qrcode{
	border-top-width:0;
}

@media (min-width:992px){
	.card_namecard > .card_row > .col:nth-child(2) .card_qrcode{
		border-top-width:0;
	}
	.card_namecard > .card_row > .col:nth-child(2) .card_qrcode,
	.card_namecard > .card_row > .col:nth-child(4) .card_qrcode{
		border-left-width:1px;
	}

}


.card_qrcode .card-photo{
	max-width:110px;
	margin:0 auto;
	border-width:0;
}

.card_qrcode .card-name{
	font-size:0.875rem;
}
.card_qrcode .card-name-text,
.card_qrcode .card-info_jobtitle{
	display:inline-block; vertical-align:middle;
	padding:0;
	margin:0;
}
.card_qrcode .card-name-text{
	color:var(--color-dark);
}


.card_qrcode .card-btnbar{
	text-align:right;
	/*padding-left:25%;*/
}
.card_qrcode .card-btn{
	border-width:1px;
	padding:0.4rem 1rem;
	margin:0.3rem;
}
@media (min-width:992px){
	.card_qrcode .card-name{
		margin:0;
	}
	.card_qrcode .card-name-text{
		font-size:1.125rem;
	}
	
	.card_qrcode .card-btnbar{
		text-align:right;
		padding-left:0; padding-right:10px;
	}
	.card_qrcode .card-btn{
		width:100%;
		margin:5px 0;
	}
}


/* 加line好友(in idx namecard) */
.card_qrcode .card-info{
	justify-content: flex-start;
    font-weight:600;
}

.card_qrcode .card-info,
.card_qrcode .card-info a{
	color:#333;
}
.card_qrcode .card-info a:hover{
	color:var(--color-one);
}

.card_qrcode .card-info .card-info-text{
	flex:none;
	width:auto;
}

.card_qrcode .card-info_phone{ margin-bottom:0; }
.card_qrcode .card-info_phone .card-info-title{
    display:none;
}

.card_qrcode .card-info_add span,
.card_qrcode .card-info_linecard span{
    display:inline-block;
    vertical-align:middle;
    margin:1px 0;
}
.card_qrcode .card-info_add .iconsvg,
.card_qrcode .card-info_linecard .iconsvg{
    width:26px; height:26px;
}

.card_qrcode .card-info_lineadd,
.card_qrcode .card-info_lineadd a,
.card_qrcode .card-info_linecard,
.card_qrcode .card-info_linecard a{
   color:#06C152;
}
.card_qrcode .card-info_lineadd .iconsvg:before,
.card_qrcode .card-info_linecard .iconsvg:before{
    background-color:#06C152;
}

.card_qrcode .card-info_lineadd a:hover span,
.card_qrcode .card-info_linecard a:hover span{
	color:var(--color-accent);
}
.card_qrcode .card-info_lineadd a:hover .iconsvg:before,
.card_qrcode .card-info_linecard a:hover .iconsvg:before{
	background-color:var(--color-accent);
}










/*------------------------------------------------------------------------------------------- 相片集 #card_figure */
/*---- 相片集 #card_figure */
.card_figure,
.card_about_figure{
	background:transparent;
	border-width:0;
}
.card_figure:hover,
.card_about_figure:hover{
	background:transparent;
}

.card_figure .card-photo,
.card_about_figure .card-photo{
	border:1px solid transparent;
	transition:transform 0.3s ease;
}
/* .card_figure .card-photo .item-fitimg:before,
.card_about_figure .card-photo .item-fitimg:before{
    padding-bottom: 80%;
} */

.card_figure:hover .card-photo,
.card_about_figure:hover .card-photo{
	transform: translateY(-5px);
}

.card_figure .card-text,
.card_about_figure .card-text{
	color:#666;
	font-size:0.875rem;
	text-align:center;
	margin-top:5px;
}


