@import url(reset.css);
@import url(common.css);
@import url(animate.min.css);




@import url(photoswipe.min.css);
/*@import url(default-skin.min.css);*/
@import url(default-skin.css);
/*@import url(https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.1/default-skin/default-skin.min.css);*/
@import url(swiper-bundle.css);
@import url(swiper_slider.css);

@import url(index.css);
@import url(contact.css);
@import url(https://annis.url.tw/mm/happy.css);
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond&family=Vazirmatn:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@1,700');
@import url('https://fonts.googleapis.com/css2?family=Baskervville&family=Quicksand&family=Raleway:wght@300&display=swap');


/*----------------------------------*\ 
  # about  & service            
\*----------------------------------*/
.wrap_inner {
	width: 82%;
	padding: 15px;
	font-size: var(--font-lg);
	margin-bottom: 5em;
}
.wrap_inner p {
	margin: 1em 0;
}
.wrap_inner.mrb {
	margin-bottom: 2em;
}
.service {
	width: 100%;
	margin-bottom: 6em;
}
.service_img {
	width: 1200px;
	max-width: 94%;
	display: block;
	margin: auto;
}
.license {
	width: 60%;
	display: flex;	
}
.license img {
	display: inline-block;
	width: 46%;	
	margin: 0 2%;
}
@media (max-width: 1199px){
	.wrap_inner {
		width: 100%;	
		font-size: var(--font-m);	
		margin-bottom: 2em;
	}
	.wrap_inner h2 {
		line-height: 1.4;		
	}	
	.service {		
		margin-bottom: 3em;
	}
	.license {
		width: 100%;		
	}	
} 
@media (max-width: 361px){
	.wrap_inner h2 {
		font-size: 1em;
	}
}

/*----------------------------------*\ 
	# 螢光筆             
\*----------------------------------*/
.highlighter_yellow {   
  background: -webkit-linear-gradient(transparent 70%, #ffd800 30%);
  background: -o-linear-gradient(transparent 70%, #ffd800 30%);
  background: linear-gradient(transparent 70%, #ffd800 30%);
  display: inline;
  padding-bottom: 1px;
}
.highlighter_pink {   
  background: -webkit-linear-gradient(transparent 70%, #ed60b9 30%);
  background: -o-linear-gradient(transparent 70%, #ed60b9 30%);
  background: linear-gradient(transparent 70%, #ed60b9 30%);
  display: inline;
  padding-bottom: 1px;
}
.circle_green {  
  border: 3px solid #50e92d;
  border-radius: 50%;
  border-width: medium thin thick 10px;  
}

/*----------------------------------*\ 
	# grid              
\*----------------------------------*/
.grid-container {
	/*margin:5.3em auto 2.8em;*/
	margin-bottom: 7em; 
	display: grid;
	grid-gap: 1em;  
	grid-template-columns: repeat(auto-fit, calc(100%/5));
	grid-auto-rows: 10em;
	grid-auto-flow: dense;
	justify-content: center;
	/*max-width: 72em;*/
}
.card {
	grid-row: auto / span 1;
	grid-column: auto / span 1;
	background-color: white;
	box-shadow: 1px 3px 3px rgba(0, 10, 20, 0.06);     
}
.card_img {
	height: 100%;	
	width: 100%;
	display: flex;
	overflow: hidden;	
}
.card_img img {	
	width: 100%;		
	object-fit: cover;
	transition: transform 1s ease;	
}
.card_img:hover img {
	cursor: pointer;
  transform: scale(1.4);
  -ms-transform: scale(1.4);
  -webkit-transform: scale(1.4);
}
.card a {
	display: block;
}
.card_twoSides {
	height: 100%;
	width: 100%;
	display: flex;
	flex-flow: row nowrap;	
}
.card_twoSections { 
	height: 100%; 
	width: 100%;
	display: flex;
	flex-flow: column nowrap;	
}
.card_twoSections img {  
	height:400px;   
}
.card_tx {	
	width:100%; 
	height:100%; 
	padding: .75em; 
	overflow: hidden; 
}
.card_mostBig {/*card的2倍寬,3倍高*/
	grid-row: auto / span 3;
	grid-column: auto / span 2; 
}
.card_2x {/*card的2倍*/
	grid-row: auto / span 2;
	grid-column: auto / span 2;
}
.card_vertical {
	grid-row: auto / span 2;
}
.card_horizontal {
	grid-column: auto / span 2;
}
.big-script { 	 
	font-size: 2.3em; 
	line-height: 1.3;   
	text-align: center;
}
.bigger-script { 	 
	font-size: 3.1em; 
	line-height: 1.3;   
	text-align: center;
	font-weight: 500;
	text-shadow: rgb(224, 224, 224) -2px 1px 0px;
}
@media (max-width: 1199px) {
	.big-script { 	 
		font-size: 1.6em; 
	}	
	.bigger-script { 	 
		font-size: 2.2em; 		 	 
	}
}
@media (max-width: 769px) {	
	.grid-container {
		grid-template-columns: 1fr 1fr;	
	}
	.big-script { 	 
		font-size: 1.3em; 		
	}
	.bigger-script { 	 
		font-size: 1.8em; 
	}	
	.card_2x_mo {
		grid-row: auto / span 1;	
	}
	.grid-container {		
		margin-bottom: 1em; 		
	}	
}