/*
color #หลัก #สํารอง #สํารอง
สีครีม #f4eee5 #eaddcc
คราม #64c6c6 #7bbac0 #95c8cd
สีส้ม #f37d67 #f59785
สีเทา #333 #4d4d4d #6d6e70
รีวิว #f7baad #b0dedc
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }
html, body { font-size: 14px; font-family: "Kanit", "Prompt", 'Tahoma', sans-serif; color:#333; margin:0; padding:0; }
body { width:100%; overflow-x: hidden; }
h1 { font-size: 54px; }
h2 { font-size: 46px; }
h3 { font-size: 38px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 16px; }
h1, h2, h3, h4, h5, h6 { font-family: "Kanit", "Prompt", 'Tahoma', sans-serif; margin: 0 0 0.5em; font-weight: 400; }
h1.bold, h2.bold, h3.bold, h4.bold, h5.bold, h6.bold { font-weight: 700; }
a,a:active {color:#323130;transition:.5s all}
a:hover,a:focus,a.active {color:#64c6c6;text-decoration:none;transition:.3s all}
b {font-weight:700}
.fc-ora {color:#f37d67}
.fc-blu {color:#7bbac0}
.fs-11 {font-size:1.1em}
.fs-12 {font-size:1.2em}
.fs-14 {font-size:1.4em}
.fs-15 {font-size:1.5em}
.fs-16 {font-size:1.6em}
.fs-18 {font-size:1.8em}
.fs-20 {font-size:2.0em}
.hl {
	display: inline-block;
	padding-bottom: 0;
	border-bottom: 3px solid #f37d67;
}
.mainmenu {
	background: #fff;
	position: absolute;
	padding-top: 0;
	height: auto;
	top: 0; left:0; right: 0;
	margin: 0 auto;
	z-index: 8;
}
.menu-fixed {
	position: fixed;
	top: 0; right: 0;
	margin: 0 auto;
	width: 100%;
	z-index: 100;
	opacity: 1;
	background: #f4eee5;
	box-shadow: 3px 0 6px #666;
}
.sm-logo {
	position: relative;
	width: 100%;
}
.sm-logo img {
	width: 96%;
	max-width: 200px;
	margin: 8px auto;
}
.sm-nav {
	position: absolute;
	background: #f37d67;
	border-bottom-left-radius: 8px;
	top: 100%; right: 0;
	z-index: 101;
}
.sm-nav a {
	display: block;
	width: 64px; height: 48px;
	padding: 2px 0;
	color: #f4eee5;
	font-size: 28px;
}
.sm-menu {
	padding-top: 8px;
	padding-bottom: 8px;
	text-align: left;
	font-size: 22px;
	text-transform: uppercase;
}
.sm-sup {
	padding-top: 4px;
	padding-bottom: 4px;
	text-align: center;
	font-size: 18px;
	border-top: 2px solid #f4eee5;
}
.sm-sup a {
	display: inline-block;
	color: #333;
}
.sm-menu a {
	display: block;
	color: #333;
	padding: 2px 2px 2px 40px;
}
.sm-sup a:hover,.sm-menu a:hover{
	text-decoration: none;
	color: #64c6c6;
}
.sm-menu .visible-md {display:none !important;}
.minimenu {
	transition:.5s opacity;
	height: 0px;
	overflow-x: hidden;
	overflow-y: hidden;
	background: #fff;
	border-bottom: 0 solid #f4eee5;
	border-left: 2px solid #f4eee5;
	border-right: 2px solid #f4eee5;
	width: 100%;
	max-width: 384px;
	margin-right: 0;
	margin-left: auto;
	z-index: 102;
	opacity: 0;
}
.minimenu.open {
	transition:.5s opacity;
	height: auto;
	overflow-x: hidden;
	overflow-y: auto;
	border-bottom: 2px solid #f4eee5;
	opacity: 1;
}
@media (min-width: 992px) {
	.sm-nav {top:0;right:0}
	.menu-fixed {max-width:384px}
	.menu-fixed,.minimenu {border-bottom-left-radius:16px}
	.menu-fixed {transition:.5s all;top:-888px;opacity:0}
	.menu-fixed.active {transition:.5s all;top:0;opacity:1}
}
.bs-logo {
	background: #f4eee5;
	position: absolute;
	padding: 32px 48px;
	bottom: 0; left: 0;
	border-top-right-radius: 24px;
}
.bs-sup,.bs-menu {
	float: right;
	text-align: right;
	width: calc(100% - 450px);
}
.bs-sup a,.bs-menu a {
	display: inline-block;
	color: #333;
}
.bs-sup a:hover,.bs-menu a:hover{
	text-decoration: none;
	color: #64c6c6;
}
.bs-sup a {
	padding: 4px 0 4px 12px;
}
.bs-menu a {
	padding: 4px 2px 4px 12px;
}
/*.bs-sup a:last-child,.bs-menu a:last-child{
	padding-right: 0 !important;
}*/
.bs-sup {
	margin: 32px 48px 4px;
	font-size: 16px;
}
.bs-menu {
	margin: 8px 48px;
	font-size: 20px;
}
.bs-menu .eng {
	letter-spacing: -1px;
	font-size: 18px;
}
@media (max-width: 1199px) {
	.bs-menu .eng {
		font-size: 16px;
	}
}
.bs-bot {
	position: relative;
	height: 64px;
}
.bs-bot:after {
	content: '';
	display: block;
	width: 396px; height: 64px;
	background: #f4eee5;
	border-bottom-right-radius: 24px;
}
.bs-bot-2 {
	position: relative;
	height: 64px;
	text-align: right;
}
.bs-bot-2:after {
	content: '';
	display: inline-block;
	margin-right: 0;
	width: 396px; height: 64px;
	background: #f4eee5;
	border-bottom-left-radius: 24px;
}
.bs-top {
	position: relative;
	width: 100%;
	max-width: 396px;
	background: #f4eee5;
	border-top-right-radius: 24px;
	margin-right: auto;
	margin-left: 0;
	text-align: center;
	text-transform: uppercase;
	padding: 24px 0 16px;
	color:#6d6e70;
}
.bs-top:before {
	content: '';
	position: absolute;
	display: block;
	margin: 0 auto;
	width: calc(100vw - 480px); height: 3px;
	left: 480px; top: 80px;
	background: #f37d67;
}
.bs-top .bdot {
	position: absolute;
	margin: 0 auto;
	left: 480px; top: 70px;
	width: 21px; height: 21px;
	border-radius: 10px;
	background: #f37d67;
}
.bs-top-2 {
	position: relative;
	width: 100%;
	max-width: 396px;
	background: #f4eee5;
	border-top-left-radius: 24px;
	margin-right: 0;
	margin-left: auto;
	text-align: center;
	text-transform: uppercase;
	padding: 24px 0 16px;
	color:#6d6e70;
}
.bs-top-2:before {
	content: '';
	position: absolute;
	display: block;
	margin: 0 auto;
	width: calc(100vw - 480px); height: 3px;
	right: 480px; top: 80px;
	background: #f37d67;
}
.bs-top-2 .bdot {
	position: absolute;
	margin: 0 auto;
	right: 480px; top: 70px;
	width: 21px; height: 21px;
	border-radius: 10px;
	background: #f37d67;
}
.wl{
	position: relative;
	background: #fff;
	z-index: 2;
}
.wl:before,.wl:after{
	content: '';
	position: absolute;
	width: 100vw;
	height: 12px;
	z-index: 3;
	margin: 0 auto;
	left: 0; right: 0;
	background: rgba(255,255,255,.5);
}
.wl:before{top:-12px}
.wl:after{bottom:-12px}
.bdl{border-bottom-left-radius:16px;border-top-left-radius:16px}
.bdr{border-bottom-right-radius:16px;border-top-right-radius:16px}
.footbar{
	background:url(../imgs/footbar.jpg) center top no-repeat;
	background-size:cover;
	padding-top:24px;
	padding-bottom:24px;
	font-size:14px
}
.footbar p{color:#f6fcfc;text-shadow:1px 1px 2px #333}
.footbar a{color:#fff;display:inline-block;padding:4px 0}
.footbar .social a {
	display: inline-block;
	margin: 8px 4px;
}
.footbar .totop {
	display: inline-block;
	width: 40px; height: 40px;
	background: #eaddcc;
	color: #6d6e70;
	vertical-align: middle;
	line-height: normal;
	font-size: 26px;
	border-radius: 50%;
}
.bs-top .hl,.bs-top-2 .hl {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: calc(100% - 24px);
	margin-right: 12px;
	margin-left: 12px;
	font-size: 38px;
}
@media (max-width: 767px) {
	.bs-bot,.bs-bot-2,.bs-bot:after,.bs-bot-2:after {
		max-width: 767px;
		border-radius: 0;
		width: 100%;
		height: 16px;
	}
	.bs-top,.bs-top-2 {
		max-width: 767px;
		border-radius: 0;
		margin-top: 96px;
	}
	.bs-top:before,.bs-top-2:before,.bdot{display:none}
	.bs-top .hl,.bs-top-2 .hl {font-size:32px}
}
body.lang-th .eng,body.lang-en .tha{display:none !important;}
.common-cover{background:#64c6c6 url(../imgs/footbar.jpg) center top no-repeat;background-size:cover;padding:64px 6px;text-align:center;text-transform:uppercase;color:#fff;text-shadow:0 2px 8px #444}
.common-cover h1{margin:0 auto;font-weight:700}
