:root{
	--primary-color: #742029;
	--secondary-color: #ca3b4b;

	--bg-color: #f6f4f0;
	--red: #bc4d42;
	--dark: #231f20;
	
	--gradient: linear-gradient(60deg, rgba(21,40,81,1) 0%, rgba(14,60,157,1) 72%, rgba(21,40,81,1) 100%);
}
.text-grey{ color: #9a9a9a; }
.text-color{ color:var(--primary-color) !important; }

body,
p,
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
#mainMenu nav > ul > li > a,
#footer,
button.btn, .btn:not(.close):not(.mfp-close), a.btn:not([href]):not([tabindex]){
	font-family: "Lato", "Noto Sans Thai", serif;
	letter-spacing: 0;
	line-height: 1.5;
}
body, p{ font-size: 15px;}
.w100, .w-100{ width:100%; }
.italic{ font-style:italic; }
.font-custom,
.headbar .htitle{ 
	font-family: "PT Serif","Noto Sans Thai", serif;
}
.headbar .htitle{ color:var(--secondary-color); }
a:not(.btn):not(.badge):hover, a:not(.btn):not(.badge):focus, a:not(.btn):not(.badge):active{
	color: var(--secondary-color);
}
button.btn, .btn:not(.close):not(.mfp-close), a.btn:not([href]):not([tabindex]){
	color: #fff !important;
	border: none;
	line-height: 40px;
	border-radius: 50px;
	font-size: 16px;
	font-weight: normal;
	letter-spacing: 0.5px;
	text-decoration: none;
	outline: none;
	padding: 0 25px;
	text-transform: initial;
	background: var(--primary-color);
}
button.btn.btn-primary, .btn:not(.close):not(.mfp-close).btn-primary, a.btn:not([href]):not([tabindex]).btn-primary{
	background-color: var(--gradient);
	border: none;
}
button.btn.btn-primary:hover, button.btn.btn-primary:focus, button.btn.btn-primary:not(:disabled):not(.disabled):active, button.btn.btn-primary:not(:disabled):not(.disabled).active, .btn:not(.close):not(.mfp-close).btn-primary:hover, .btn:not(.close):not(.mfp-close).btn-primary:focus, .btn:not(.close):not(.mfp-close).btn-primary:not(:disabled):not(.disabled):active, .btn:not(.close):not(.mfp-close).btn-primary:not(:disabled):not(.disabled).active, a.btn:not([href]):not([tabindex]).btn-primary:hover, a.btn:not([href]):not([tabindex]).btn-primary:focus, a.btn:not([href]):not([tabindex]).btn-primary:not(:disabled):not(.disabled):active, a.btn:not([href]):not([tabindex]).btn-primary:not(:disabled):not(.disabled).active{
	background: #ede6de;
	color: var(--primary-color);
}
button.btn:hover, button.btn:focus, button.btn:not(:disabled):not(.disabled):active, button.btn:not(:disabled):not(.disabled).active, .btn:not(.close):not(.mfp-close):hover, .btn:not(.close):not(.mfp-close):focus, .btn:not(.close):not(.mfp-close):not(:disabled):not(.disabled):active, .btn:not(.close):not(.mfp-close):not(:disabled):not(.disabled).active, a.btn:not([href]):not([tabindex]):hover, a.btn:not([href]):not([tabindex]):focus, a.btn:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, a.btn:not([href]):not([tabindex]):not(:disabled):not(.disabled).active{
	color: #fff !important;
	background-color: var(--secondary-color);
	text-decoration: none;
	box-shadow: 0 10px 10px rgba(128, 52, 53, 0.19);
}
.flickity-button:hover{ background-color: var(--secondary-color); }

#scrollTop{ bottom:60px !important; }
#scrollTop:after, #scrollTop:before{ background:var(--secondary-color); }


@media(max-width:1024px){
	button.btn:not(.btn-creative):not(.btn-slide), .btn:not(.close):not(.mfp-close):not(.btn-creative):not(.btn-slide), a.btn:not([href]):not([tabindex]):not(.btn-creative):not(.btn-slide){
		font-size: 16px;
		height: auto;
		line-height: 40px;
		padding: 0 14px;
	}
}