:root {
	--var-lh: 1.35;
	--var-fs-sm: 0.8;
	--var-lh-sm: 1.0;
}

/* ---------------------------------------------- line-height */

.lh-10 {
	line-height: 0.625em !important;    /* 10 px ; */
}

.lh-12 {
	line-height: 0.75em !important;    /* 12 px ; */
}

.lh-14 {
	line-height: 0.875em !important;    /* 14 px ; */
}

.lh-16 {
	line-height: 1em !important;    /* 16 px ; */
}

.lh-18 {
	line-height: 1.125em !important;    /* 18 px ; */
}

.lh-20 {
	line-height: 1.25em !important;    /* 20 px ; */
}

.lh-22 {
	line-height: 1.375em !important;    /* 22 px ; */
}

.lh-24 {
	line-height: 1.5em !important;    /* 24 px ; */
}

.lh-26 {
	line-height: 1.625em !important;    /* 26 px ; */
}

.lh-28 {
	line-height: 1.75em !important;    /* 28 px ; */
}

.lh-30 {
	line-height: 1.875em !important;    /* 30 px ; */
}

.lh-32 {
	line-height: 2em !important;    /* 32 px ; */
}

.lh-34 {
	line-height: 2.125em !important;    /* 34 px ; */
}

.lh-36 {
	line-height: 2.25em !important;    /* 36 px ; */
}

.lh-38 {
	line-height: 2.375em !important;    /* 38 px ; */
}

.lh-40 {
	line-height: 2.5em !important;    /* 40 px ; */
}

.lh-42 {
	line-height: 2.625em !important;    /* 42 px ; */
}

.lh-45 {
	line-height: 2.8125em !important;    /* 45 px ; */
}

.lh-46 {
	line-height: 2.875em !important;    /* 46 px ; */
}

.lh-48 {
	line-height: 3em !important;    /* 48 px ; */
}

.lh-50 {
	line-height: 3.125em !important;    /* 50 px ; */
}

/* ---------------------------------------------- */ line-height */

.i-fs-16 {
	width: 16px;
	height: 16px;
}

.i-fs-18 {
	width: 18px;
	height: 18px;
}

.i-fs-20 {
	width: 20px;
	height: 20px;
}

.i-fs-22 {
	width: 22px;
	height: 22px;
}

.ff-notosansthai {
	font-family: 'Noto Sans Thai' !important;
}

.ff-kanit {
	font-family: 'Kanit' !important;
}

.ff-poppins {
	font-family: 'Poppins' !important;
}

/* ---------------------------------------------- font-size */

.fs-10 {
	font-size: 0.625em; /* font-size: 10px; */
	line-height: 1em;    /* 16 px ; */
}

.fs-12 {
	font-size: 0.75em; /* font-size: 12px; */
	line-height: 1.125em;    /* 18 px ; */
}

.fs-14 {
	font-size: 0.875em; /* font-size: 14px; */
	line-height: 1.25em;    /* 20 px ; */
}

.fs-16 {
	font-size: 1em; /* font-size: 16px; */
	line-height: 1.375em;    /* 22 px ; */
}

.fs-18 {
	font-size: 1.125em; /* font-size: 18px; */
	line-height: 1.5em;    /* 24 px ; */
}

.fs-20 {
	font-size: 1.25em; /* font-size: 20px; */
	line-height: 1.625em;    /* 26 px ; */
}

.fs-22 {
	font-size: 1.375em; /* font-size: 22px; */
	line-height: 1.375em; /* font-size: 22px; */
}

.fs-25 {
	font-size: 1.5625em; /* font-size: 25px; */
	line-height: 1.875em;    /* 30 px ; */
}

.fs-28 {
	font-size: 1.75em; /* font-size: 28px; */
	line-height: 1.25em;    /* 20 px ; */
}

.fs-30 {
	font-size: 1.875em; /* font-size: 30px; */
	line-height: 2.1875em;    /* 35 px ; */
}

.fs-35 {
	font-size: 2.1875em; /* font-size: 35px; */
	line-height: 2.5em;    /* 40 px ; */
}

.fs-40 {
	font-size: 2.5em; /* font-size: 40px; */
}

.fs-45 {
	font-size: 2.8125em; /* font-size: 45px; */
}

.fs-60 {
	font-size: 3.75em; /* font-size: 60px; */
}

.fs-70 {
	font-size: 4.375em; /* font-size: 70px; */
}

.fs-breadcrumb-header-70 {
	font-size: 4.375em; /* font-size: 70px; */
	line-height: 1em;    /* 16 px ; */
}

.fs-breadcrumb-subheader-22 {
	font-size: 1.375em; /* font-size: 22px; */
	line-height: 1.375em; /* font-size: 22px; */
}

.fs-news-header-25 {
	font-size: 1.5625em; /* font-size: 25px; */
	line-height: 1.875em;    /* 30 px ; */
	font-weight: 500;
}

.fs-news-subheader-18 {
	font-size: 1.125em; /* font-size: 18px; */
	line-height: 1.5em;    /* 24 px ; */
	font-weight: 400;
}

.fs-news-subheader-16 {
	font-size: 1em; /* font-size: 16 px ; */
	line-height: 1.5em;    /* 24 px ; */
	font-weight: 400;
}

@media (max-width: 992px) {

	.fs-news-header-25 {
		font-size: 1.5625em; /* font-size: 25px; */
		line-height: 1.875em;    /* 30 px ; */
	}
	
	.fs-news-subheader-18 {
		font-size: 1.125em; /* font-size: 18px; */
		line-height: 1.5em;    /* 24 px ; */
	}

	.fs-breadcrumb-header-70 {
		font-size: 1.625em;    /* 26 px ; */
		line-height: 1em; /* font-size: 22px; */
	}
	
	.fs-breadcrumb-subheader-22 {
		font-size: 0.75em;    /* 12 px ; */
		line-height: 1.25em;    /* 20 px ; */
	}

	.fs-10 {
		font-size: 0.5em; /* font-size: 8px; */
		line-height: 0.75em;    /* 12 px ; */
	}
	
	.fs-12 {
		font-size: 0.625em; /* font-size: 10px; */
		line-height: 0.875em;    /* 14 px ; */
	}
	
	.fs-14, .fs-16 {
		font-size: 0.875em !important;    /* 14 px ; */
		line-height: 1.25em;    /* 20 px ; */
	}

 	.fs-18 {
		font-size: 1em;    /* 16 px ; */
		line-height: 1.25em;    /* 20 px ; */
	}

	.fs-20, .fs-22, .fs-25,.fs-28 {
		font-size: 1.125em;    /* 18 px ; */
		line-height: 1.125em;    /* 18 px ; */
	}
	
	.fs-30, .fs-35, .fs-40, .fs-45 {
		font-size: 1.25em; /* font-size: 20px; */
		line-height: 1.5625em;    /* 25 px ; */
	}
	
	.fs-60, .fs-70 {
		font-size: 1.625em;    /* 26 px ; */
	}
}


/* ---------------------------------------------- font-size */
.fw-100 {
	font-weight: 100;
}

.fw-200 {
	font-weight: 200;
}

.fw-300 {
	font-weight: 300;
}

.fw-400 {
	font-weight: 400;
}

.fw-500 {
	font-weight: 500;
}

.fw-600 {
	font-weight: 600;
}

.fw-700 {
	font-weight: 700;
}

.fw-800 {
	font-weight: 800;
}

.fw-900 {
	font-weight: 900;
}