.font-icon{
	position: relative;
	display: inline-block;
	width: 100%;
	//margin: 4px;
	margin-left: 8px;
	right: 0px;
	//background: $c-w;

	@include font(subtitle2, $c-b); 
	text-align: center;	
	//border: 1px solid green;/**********************/	

	& span{
		position: relative;
		display: inline-block;
		
		//border: .5px solid blue;               //←←←←←←←←←←←←←←←←←←←←

		& span:nth-child(1){

			top: 4px;
			height: 20px;
			width: 20px;
			border-radius: 4px;
			background: $c-p;
			//border: 1px solid green;/**********************/	

			& svg {
				position: absolute;
				display: inline-block;
				height: 16px;
				width: 16px;
				left:2px;
				top: 2px;
				fill: $c-w;
				//border: .5px solid red;               //←←←←←←←←←←←←←←←←←←←←
			}	


		}

		& span:nth-child(2){
			color: $c-p;
			font-weight: 500;
		}
	}	


	&-link{
		
		& span{ 
			& span:nth-child(1){ 
				& svg {@include selectNo(); }	
			}


			& span:nth-child(2){ 
				cursor: pointer;
				//border: .5px solid red;               //←←←←←←←←←←←←←←←←←←←←
			}


			& span:nth-child(3){ 
				@include selectNo(); 
				@include font(body2, $c-b);
				//font-weight: 300;
				opacity: 0.54;

			}
		}	

	}
}


.font-icon-title{ @include font(title, $c-b);  }
.font-icon-h6{ @include font(h6, $c-b);  }
.font-icon-h5{ @include font(h5, $c-b);  }




.font-icon-green{ & span{
	& span:nth-child(1){ background: $cs-greend; }
	& span:nth-child(2){ color: $cs-greend;      } }	}

.font-icon-red{  & span{
	& span:nth-child(1){ background: $cs-redd; }
	& span:nth-child(2){ color: $cs-redd;      } } }

.font-icon-purple{ & span{
	& span:nth-child(1){ background: $cs-purple; }
	& span:nth-child(2){ color: $cs-purple;      } } }

.font-icon-orange{ & span{
	& span:nth-child(1){ background: $cs-orange; }
	& span:nth-child(2){ color: $cs-orange;      } } }


.font-icon-cpa{ & span{
	& span:nth-child(1){ background: $cpa; }
	& span:nth-child(2){ color: $cpa;      } } }

.font-icon-cpb{ & span{
	& span:nth-child(1){ background: $cpb; }
	& span:nth-child(2){ color: $cpb;      } } }

.font-icon-cpc{ & span{
	& span:nth-child(1){ background: $cpc; }
	& span:nth-child(2){ color: $cpc;      } } }

.font-icon-cpd{ & span{
	& span:nth-child(1){ background: $cpd; }
	& span:nth-child(2){ color: $cpd;      } } }

.font-icon-cpe{ & span{
	& span:nth-child(1){ background: $cpe; }
	& span:nth-child(2){ color: $cpe;      } } }