@charset "UTF-8";

/* font-family: 'Sarabun', sans-serif; */
@import url('https://fonts.googleapis.com/css2?family=Sarabun:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

/* font-family: 'Kanit', sans-serif; */
@import url('https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

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, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}

body,
html {
	color: #666666;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    line-height: 1.2;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: 'Sarabun', sans-serif;
		background-color: #f2f2f2;
}
html {
    font-size: 62.5%;
	overflow-x: hidden;
	box-sizing: border-box
}

*,
*::after,
*::before {}

:focus  {
outline: none;
}

a {
  color: #666666;
  text-decoration: none;
  cursor: pointer;
	transition: all 0.5s ease;
	z-index: 1;
}
a:hover {
  color: #f77e21;
}

a:focus {
    outline: none;
    outline-offset: 0;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
	/*font-weight: bold;*/
}

h1, .h1 {font-size: 48px;}

h2, .h2 {font-size: 28px;margin: 0;}

h3, .h3 {font-size: 28px;}

h4, .h4 {font-size: 2.5em;margin: 0;}

p, .p { margin-bottom: 10px; }
p:last-child, .p:last-child { margin: 0; }

ul {margin: 0;}

strong { font-weight: bold }

em { font-style: italic }

sup {font-size: 13px; vertical-align: super;}

input,
textarea,
select { font-family: 'Sarabun', sans-serif;border: 0;max-width: 100%;padding: 10px 15px;outline: none;background: none;-webkit-border-radius: 0;-webkit-appearance: none;-moz-appearance: none;appearance: none;color: #3750a0;}

img { max-width: 100% }

button {border-radius: 0px;-webkit-border-radius: 0px;-moz-border-radius: 0px;background-color: transparent;color: #ffffff;cursor: pointer; font-size: 16px; font-weight: 400;border: 0;outline: none;text-decoration: none;cursor: pointer;transition: all 0.5s ease;z-index: 1;}

.clearfix::after {content: "";clear: both;display: table;}
.hide { display: none }
.stike { text-decoration: line-through }
.text-center { text-align: center !important;}

/*/ Padding - Margin /*/

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
	min-height: 1px;
	position: relative;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.col-1 { float: left; width: 8.3333%;}
.col-2 { float: left; width: 16.6666%;}
.col-3 { float: left; width: 25%;}
.col-4 { float: left; width: 33.3333%;}
.col-5 { float: left; width: 41.6665%; }
.col-6 { float: left; width: 50%; }
.col-7 { float: left; width: 58.3333%;}
.col-8 { float: left; width: 66.6666%; }
.col-9 { float: left; width: 74.997%; }
.col-10 { float: left; width: 83.3333%; }
.col-11 { float: left; width: 91.6663% }
.col-12 { float: left; width: 100% }

.container {
	position: relative;
  padding: 0;
	overflow: hidden;
	z-index: 1;
}

body {
	font-size: 17px;
	line-height: 1.7;
	letter-spacing: 0.2px;
	color:#666666;
	font-family: 'Sarabun', sans-serif;
}
.wrapper {
  max-width: 1300px;
	/* max-width: 1440px; */
  margin: 0 auto;
	position: relative;
	padding: 10px 0  60px 0;
	overflow: hidden;
}
.wrapper.wrap-footer-none { padding-bottom: 0; }

.wrapper .full {
    max-width: 100%;
}
.wrapper .padding {
    max-width: 100%;
    padding: 0 40px;
}

.wrapper-footer {
  max-width: 1300px;
	/* max-width: 1440px; */
  margin: 0 auto;
  position: relative;
  padding: 15px 0;
  overflow: hidden;
}

.container {
    width: 100%;
}
.container.full {
    max-width: 100%;
    padding: 0;
}

[class^='icon-'] {
/*	font-size: 32px;*/
}

.clearfix {
  overflow: auto;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}