
.pro-square .alert.alert-default { 
	*padding: 10px;
}	
.addCart{
	cursor: pointer;
}
.Prod { 
	text-align: left; margin: 0 auto; padding: 0; font-family: var(--d71);  *font-family: 'Noto Sans TC', Helvetica, Arial, sans-serif;
}
.rightBox .Prod { 
	padding-top: 0px; max-width: 100%;
}	
.pro-square {	
	text-align:center;	padding: 0px 10px 30px 10px;
}
.pro-square .pic{ 
	display: none; width: 100% 
}
.pro-square .pic img{ 
	width: 100% 
}
.pro-square .colour { 
	color: var(--NavColor); 
}


.pro-square {  position: relative; display: inline-block; vertical-align: top; } 
.pro-square .btn {  color: --NavColor!important; } 
.pro-square .text-muted1 {  font-size: 1.2rem; *color: red; display:inline-block} 
.pro-square i.bi { padding-left: 5px; font-size: 1.2rem; } 


.pro-square.Col-1 { width: 100%; }
.pro-square.Col-2 { width: 50%; }
.pro-square.Col-3 { width: 33.3333%; }
.pro-square.Col-4 { width: 25%;}
.pro-square.Col-5 { width: 20%; }
.pro-square.Col-6 { width: 16.6667%; }
.pro-square.Col-7 { width: 14.2857%; }
.pro-square.Col-8 { width: 12.5%; }
.pro-square.Col-9 { width: 11.1111%; }
.pro-square.Col-10 { width: 10%; }



.slide {
	margin-bottom: 0!important; cursor: pointer;
}
.slide .slick-dots {
	bottom: 3px !important;
}
.slick-dots li button:before{
	color: transparent;
	opacity: 1;
	background-color: rgba(255,255,255,.5);
	border: 0px solid rgba(0,0,0,.35);
	border-radius: 50%;
	display: inline-block;
}
.classname5_1{  
	margin: 0 !important; 
	overflow: hidden;
}
.classname5_1 .Name {
	padding: 0 0 5px 0; text-align: left;
}
.classname5_1 .Name >div{ 
	display: inline-block; 	
	padding: 6px 0 0 0;
	font-weight: 500; 
	text-align: left;
	cursor: pointer;
}


.classname5_1 .Name:hover { 
	text-decoration: underline
}

.classname5_1 .ContentTXT  { 
	font-weight: thin;
	letter-spacing:.1rem; 
	line-height: 1.3;
	padding: 0 0 0 0; 
	text-align: left;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.divBBB {
	margin: 0 auto; 
	text-align: center;
	width: 100%;
}
.divBBB img{
	margin: 0 auto;
	max-width:100%;
}
.pro-square.Col-1 .classname5_1 .Name >div,
.pro-square.Col-2 .classname5_1 .Name >div,
.pro-square.Col-3 .classname5_1 .Name >div { font-size: 1.3rem;   }

.pro-square.Col-4 .classname5_1 .Name >div,
.pro-square.Col-5 .classname5_1 .Name >div { font-size: 1.2rem;   }

.pro-square.Col-6 .classname5_1 .Name >div,
.pro-square.Col-7 .classname5_1 .Name >div { font-size: 1.1rem;   }

.pro-square.Col-8 .classname5_1 .Name >div,
.pro-square.Col-9 .classname5_1 .Name >div,
.pro-square.Col-10 .classname5_1 .Name >div { font-size: 1.0rem;   }


.pro-square.Col-1 .classname5_1 .ContentTXT,
.pro-square.Col-2 .classname5_1 .ContentTXT,
.pro-square.Col-3 .classname5_1 .ContentTXT { font-size: .87rem;;   }

.pro-square.Col-4 .classname5_1 .ContentTXT,
.pro-square.Col-5 .classname5_1 .ContentTXT { font-size: .8rem;   }

.pro-square.Col-6 .classname5_1 .ContentTXT,
.pro-square.Col-7 .classname5_1 .ContentTXT { font-size: .75rem;   }

.pro-square.Col-8 .classname5_1 .ContentTXT,
.pro-square.Col-9 .classname5_1 .ContentTXT,
.pro-square.Col-10 .classname5_1 .ContentTXT { font-size: .7rem;   }
.btn-detail { font-size: .7rem !important; margin-left: 5px;}

.Prod .bi-heart, .Prod .bi-heart-fill {
	float: left;
}
@media only screen and (max-width: 992px) {

	.pro-square.Col-5 { width: 25%; }
	.pro-square.Col-6 { width: 25%; }
	.pro-square.Col-7 { width: 25%; }
	.pro-square.Col-8 { width: 25%; }
	.pro-square.Col-9 { width: 25%; }
	.pro-square.Col-10 { width: 25%; }
	.classname5_1{ height: auto;}
	.classname5_1 .Name { font-size: 15pt;}
	.classname5_1 .ContentTXT  { font-size: .87rem; }
	.pro-square { padding: 0px 5px}	
	.pro-square .alert.alert-default { padding: 10px;}	
	.pro-square .alert.alert-default div input{ display: none;} 
	.Prod { width:95%; }	
}
@media (max-width: 575.98px) {
	.single .pro-square.Col-1,
	.single .pro-square.Col-2,
	.single .pro-square.Col-3,
	.single .pro-square.Col-4,
	.single .pro-square.Col-5,
	.single .pro-square.Col-6,
	.single .pro-square.Col-7,
	.single .pro-square.Col-8,
	.single .pro-square.Col-9,
	.single .pro-square.Col-10 {  width: 100%; margin: 0}

	.pro-square .pic { display: block ; margin: 0 0 18px 0}
	.single .pro-square .classname5_1 .ContentTXT  { -webkit-line-clamp: 3 !important; letter-spacing:.1rem; }

	
	.single .pro-square.Col-1 .classname5_1 .Name >div,
	.single .pro-square.Col-2 .classname5_1 .Name >div,
	.single .pro-square.Col-3 .classname5_1 .Name >div,
	.single .pro-square.Col-4 .classname5_1 .Name >div,
	.single .pro-square.Col-5 .classname5_1 .Name >div,
	.single .pro-square.Col-6 .classname5_1 .Name >div,
	.single .pro-square.Col-7 .classname5_1 .Name >div,
	.single .pro-square.Col-8 .classname5_1 .Name >div,
	.single .pro-square.Col-9 .classname5_1 .Name >div,
	.single .pro-square.Col-10 .classname5_1 .Name >div { font-size: 1.5rem;   }


	.double .pro-square.Col-1,
	.double .pro-square.Col-2,
	.double .pro-square.Col-3,
	.double .pro-square.Col-4,
	.double .pro-square.Col-5,
	.double .pro-square.Col-6,
	.double .pro-square.Col-7,
	.double .pro-square.Col-8,
	.double .pro-square.Col-9,
	.double .pro-square.Col-10 {  width: 50%; margin: 0}
	.double .pro-square .classname5_1 .Name >div { font-size: 1rem;}
	.Prod.double  { width: 100% !important; }
	.Prod.double .pro-square .classname5_1 .ContentTXT  {font-size: .68rem !important; opacity:.9}

}