body,
html {
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
}

body {
	font-family: 'Open Sans', 'Kanit', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #444444;
	line-height: 25px;
}

body.home {
	background-color: #56565a;
}

/* LINK */
a {
	color: #444;
	text-decoration: none;
}

a:hover {
	color: #7fb42e;
}

/* FONT */
body>header>div>nav,
[id^=container] section header>h2,
#content>header>h3,
.hdr-text,
.biz-grid,
.hdr-text,
#nature-biz-bottom>header>h4,
[class^=swith-tab]>li>a,
body>header>div>#nav-home,
.menu-career--top {
	font-size: 18px;
	font-weight: 600;
	
}

/* CLEAR */
.clear {
	clear: both;
}

header:after,
section:after,
article:after,
nav:after,
[id^=container]:after,
footer:after,
#content [id^=home] article:after,
body>#banner:after,
body>#business-bar:after,
footer>div>nav:after,
footer>div>div:after,
[class*=default-btn]:after,
.pagination:before,
.pagination:after,
.pagination>.filter:after,
.pagination>.filter>div:after,
[id^="container-inside"]>#content>article:after {
	content: "";
	clear: both;
	display: block;
	visibility: hidden;
	height: 0;
}

/* ICON */

/* FORM */
input,
textarea {
	border: 1px solid #d3d3d3;
	border-radius: 3px;
	-webkit-box-shadow: inset 0px 1px 1px 0px #d3d3d3;
	-moz-box-shadow: inset 0px 1px 1px 0px #d3d3d3;
	box-shadow: inset 0px 1px 1px 0px #d3d3d3;
	
}

/* BUTTON */
a.link-icon {
	display: block;
	width: 148px;
	height: 32px;
	padding: 5px;
	background-color: #8ac73f;
	color: #fff;
	border-radius: 3px;
}

a.link-icon>i {
	float: left;
	padding: 0px 7px;
	height: 30px;
	line-height: 30px;
	border-right: 1px solid #a7d570;
}

a.link-icon>span {
	float: left;
	padding: 0 10px;
	height: 30px;
	line-height: 30px;
	border-left: 1px solid #7cbb2b;
}

a.link-icon:hover {
	background-color: #177334;
}

a.link-icon:hover>i {
	border-right: 1px solid #5b8b6a;
}

[class*=btn-zoom] {
	max-width: 194px;
}

[class*=default-btn] {
	display: block;
	padding: 5px 10px;
	height: 32px;
	line-height: 32px;
	margin: 0 auto;
	color: #fff;
	background-color: #8ac73f;
	border-radius: 3px;
	max-width: 194px;
	border: 0px;
}

[class*=default-btn]:hover {
	background-color: #7cbb2b;
	color: #fff;
}

[class*=default-btn] i {
	float: left;
	border-right: 1px solid #a7d470;
	padding: 0 10px 0 5px;
}

[class*=default-btn] i.fa {
	padding: 5px 15px 5px 5px;
}

[class*=default-btn] span {
	float: left;
	width: 135px;
	border-left: 1px solid #7cbb2b;
	padding: 0 5px 0 10px;
	text-align: center;
}

[class*=default-btn-small] {
	max-width: 175px;
}

[class*=default-btn-small] span {
	width: 110px;
	padding: 0px 5px;
}

[class*=default-btn-download] span {
	width: 123px;
}

button[class*=default-btn] {
	width: 158px;
	display: inline-block;
	height: auto;
}

button[class*=default-btn-dark] {
	background-color: #436c2e;
}
button.default-btn-dark.disabled{
	background-color: #959595 !important;
	cursor: default;
}

/* IMG*/
.img-res {
	width: 100%;
	max-width: inherit;
}

/* COLOR */
.text-green {
	color: #79be21;
}

/* HDR */
.hight-gap {
	line-height: 28px;
}

p.hl-text {
	color: #4a4a49;
	font-weight: 600;
}

[id^=container-inside]>#content article h1,
[id^=container-inside]>#content article h4 {
	color: #79be21;
}

/* FIXED */
.fixed {
	position: fixed;
}

/* ================================== STRUCTURE ==================================  */
body>header {
	width: 100%;
	height: 80px;
	background: url(../images/bg/bg-header.png) repeat-x bottom;
	position: fixed;
	z-index: 6;
}

body>header>div {
	max-width: 1280px;
	width: 100%;
	margin: 0 auto;
}

/* Logo */
body>header>div>p {
	float: left;
	padding: 0px 55px;
	margin: 10px 0 5px 0;
}

/* body>header>div>p img {
	width: 100%;
} */

/* LANG */
body>header>div>div:before {
	content: "|";
	float: left;
	text-align: left;
	height: 95px;
	line-height: 95px;
	padding: 0 7px 0 0;
}

/*
#switch-lang:before{ content: ""; }
body > header > div > div > span{ display: none; }
*/
body>header>div>div {
	float: right;
	padding: 0 55px 0 0;
}

body>header>div>div>span {
	height: 95px;
	line-height: 95px;
	padding: 0 5px;
}

body>header>div>div>span>a {
	font-weight: 600;
}

body>header>div>div>span>a:hover,
body>header>div>div>span.active>a {
	color: #177334;
}

body>header>div>div:before,
body>header>div>div>span,
body>header>div>nav#main-nav>ul>li,
body>header>div>nav#main-nav>ul>li>a {
	height: 60px;
	line-height: 60px;
}

body>header>div>#nav-home {
	display: none;
}

/* TOP NAV */
body>header>div>nav#main-nav {
	float: right;
}

body>header>div>nav#main-nav>ul {
	padding: 0px;
	margin: 0px;
	list-style: none;
}

body>header>div>nav#main-nav>ul>li {
	display: block;
	float: left;
	padding: 0 17px;
}

body>header>div>nav#main-nav>ul>li>a {
	display: block;
}

body>header>div>nav#main-nav>ul>li.active>a {
	color: #7fb42e;
}

/* DROPDOWN NAV */
nav#dd-nav {
	width: 100%;
	height: 600px;
    background-color: #fafafa;
	position: fixed;
	left: 0;
	top: 60px;
	z-index: 5;
	display: none;
}

@media (min-width: 768px){
    nav#dd-nav {
        height: 700px;
    }
}

nav#dd-nav>section {
	max-width: 1280px;
	width: 100%;
	height: 100%;
	margin: 0 auto;
}

nav#dd-nav>section>ul {
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	position: relative;
	background-color: #59595d;
}

nav#dd-nav>section>ul>li {
	display: block;
	width: 250px;
}

nav#dd-nav>section>ul>li>a {
	display: block;
	width: 205px;
	padding: 0 0 0 45px;
	height: 60px;
	line-height: 60px;
	color: #fff;
	border-bottom: 1px solid #67676b;
	background-color: #8dc73f;
}
nav#dd-nav>section>ul>li.brochure>a {
    background: none;
}
nav#dd-nav>section>ul>li.brochure:hover>a {
    background-color: #8dc73f;
}

nav#dd-nav>section>ul>li>div {
	position: absolute;
	width: calc(100% - 310px);
	height: calc(100% - 60px);
	padding: 30px;
	left: 250px;
	top: 0px;
	background-color: #fafafa;
}

nav#dd-nav>section>ul>li>div>div {
	float: left;
	width: calc(25% - 15px);
	margin: 0 15px 0 0;
}

nav#dd-nav>section#investor>ul>li>div>div:nth-child(5) {
	clear: both;
}

nav#dd-nav>section>ul>li>div>div>h4 {
	margin: 0px 0px 7px 0px;
	padding: 0px;
	width: 100%;
}

nav#dd-nav>section>ul>li>div>div>h4>a {
	display: block;
	height: 30px;
	line-height: 30px;
	padding: 0 0 0 15px;
	background-color: #8cc53f;
	color: #fff;
}

nav#dd-nav>section>ul>li>div>div>h4.active>a,
nav#dd-nav>section>ul>li>div>div>h4>a:hover {
	background-color: #177334;
}

nav#dd-nav>section>ul>li>div>div>ul {
	padding: 0;
  margin-top: 0;
}

nav#dd-nav>section>ul>li>div>div>ul>li>a {
	display: block;
	padding: 4px 15px;
}

@media (min-width:768px) {
	nav#dd-nav>section>ul>li>div>div>ul>li>a {
			border-top: 1px #444 solid;
	}
}

nav#dd-nav>section>ul>li>div>div>ul>li:first-child>a {
	border-top: 0;
}


nav#dd-nav>section>ul>li>div>div>ul>li.active>a {
	color: #177334;
}

nav#dd-nav>section>ul>li>div>div>ul>li>ul {
	padding: 0 0 0 15px;
	list-style-type: disc;
	font-size: 10px;
	margin: 0;
}

nav#dd-nav>section>ul>li>div>div>ul>li>ul>li>a {
	font-size: 14px;
}

nav#dd-nav>section>ul>li>div>div>ul>li>ul>li.active>a {
	color: #177334;
}

nav#dd-nav>section>ul>li>div>div>span {
	display: block;
	width: auto;
	padding: 0 0 0 15px;
}

nav#dd-nav>section>ul>li>div>div>span>a:hover {
	text-decoration: underline;
}

nav#dd-nav>section>ul>li>div>div>span.active>a {
	color: #177334;
}

nav#dd-nav>section>ul>li>div {
	display: none;
}

nav#dd-nav>section>ul>li:hover>div,
nav#dd-nav>section>ul>li:first-child>div {
	display: block;
}

nav#dd-nav>section#what-we-do>ul>li>div>div:last-child {
    float: right;
}

nav#dd-nav>section#what-we-do>ul>li>div>div {
	/* height: 230px; */
}

nav#dd-nav>section#who-we-are>ul>li>div>div {
	min-height: 120px;
	margin: 0 15px 0 0;
}

/* BANNER */
body>#banner {
	max-width: 1170px;
	width: 100%;
	margin: 0 auto;
	padding: 66px 0 0 0;
	position: relative;
}

body>#banner ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

body>#banner [id^=ribbon] {
	top: 66px;
}

body>#banner ul li img {
	height: 309px;
}

/* CONTAINER */
[id^=container] {
	width: 100%;
	margin: 0 auto;
}

.privilege-side {
	padding: 15px 0 0 0;
	background-color: #ededed;
}

/* RIBBON */
[id^=ribbon] {
	height: 288px;
	position: absolute;
	top: 64px;
	right: 0;
	z-index: 4;
	display: block;
}

#ribbon-home {
	background: url(../images/item/ribbon.png) no-repeat;
	background-size: 100%;
}

#ribbon-inside {
	background: url(../images/item/ribbon.png) no-repeat;
	background-size: 100%;
}

/*#ribbon-inside{ width: 562px; background: url(../images/item/ribbon-inside.png) no-repeat; }*/

/* CONTENT - HOME */
[id^=container-home]>#content {
	position: relative;
	width: 100%;
}

[id^=container-home]>#content [id^=home]>header {
	width: 1170px;
	margin: 0 auto;
	text-align: center;
}

[id^=container-home]>#content [id^=home]>header>h2>span {
	color: #7fb42e;
}

[id^=container-home]>#content [id^=home]>article {
	width: 1170px;
	margin: 0 auto;
}

[id^=container-home]>#content [id^=home] article.full-width {
	width: 100% !important;
	position: relative !important;
}

[id^=container-home]>#content [id^=home]>header:first-child,
[id^=container-home]>#content [id^=home]>article:first-child {
	padding: 110px 0 0 0;
	text-align: center;
}

[id^=container-home] footer {
	position: absolute;
	bottom: 0;
}

/* CONTENT - INSIDE */
[id^=container-inside]>#content {
	position: relative;
	width: 1170px;
	margin: 0 auto;
	padding: 10px 0;
	clear: both;
}

[id^=container-inside]>#content>header {
	position: relative;
	padding: 0 0 0;
}

[id^=container-inside]>#content>header>h3 {
	padding: 21px 0 30px 0;
	margin: 0px;
	border-bottom: 1px solid #DADADA;
}

[id^=container-inside]>#content>header>span {
	display: block;
	width: 20px;
	height: 12px;
	background: url(../images/icon/arr-down.png) no-repeat;
	position: absolute;
	bottom: -11px;
	left: 30px;
}

[id^=container-inside]>#content>article {
	padding: 20px 0 30px 0;
}

[id^=container-inside]>#content article p a {
	color: #8bc63f;
	font-weight: 600;
}

[id^=container-inside]>#content article p a:hover {
	color: #7fb42e;
}

[id^=container-inside]>#content article h4 {
	margin: 20px 0px;
	padding: 0px;
}

[id^=container-inside]>#content article h2 {
	color: #8bc63f;
	font-weight: 600;
}

[id^=container-inside]>#content article ol {
	margin: 0px;
	padding: 0px 15px;
}

[id^=container-inside]>#content article ol ol {
	margin: 0px;
	padding: 15px 15px;
}

[lang=th] [id^=container-inside]>#content article ol ol>li {
	padding-bottom: 15px;
}

[lang=en] [id^=container-inside]>#content article ol ol>li {
	padding-bottom: 0;
}

[id^=container-inside]>#content article ol ol>li:last-child {
	padding-bottom: 0;
}

[id^=container-inside]>#content article ul[class^=custom] {
	list-style: none;
	padding: 0px 20px;
	margin: 0px;
}

[id^=container-inside]>#content article ul[class^=custom]>li {
	text-indent: -0.9em;
	padding: 0px 0px;
}

[id^=container-inside]>#content article ul[class^=custom]>li:before {
	content: "â€¢";
	font-size: 32px;
	vertical-align: bottom;
	padding: 0px 7px 0 0;
	font-weight: normal;
}

[id^=container-inside]>#content article ul[class^=custom-dash]>li {
	text-indent: -0.9em;
	padding: 5px 0;
}

[id^=container-inside]>#content article ul[class^=custom-dash]>li:before {
	content: "-";
	padding: 0 11px 0 0;
}

[id^=container-inside]>#content article header.box-green {
	background-color: #8bc63f;
}

[id^=container-inside]>#content article header.box-green>* {
	margin: 10px;
	padding: 20px 0;
	text-align: center;
	color: #fff;
}

[id^=container-inside]>#content article figure {
	width: 100%;
}

[id^=container-inside]>#content article figure img {
	width: 100%;
}

[id^=container].biz-landing {
	padding: 0 0 0 0;
}

[id^=container][class^=biz]>#content>header>h3 {
	border-bottom: 0;
	padding: 20px 0 0 0;
}

[id^=container][class^=biz]>#content>header>span {
	display: none;
}

/* SMALL */
[id^=container-home]>#content [id^=home]>header:first-child,
[id^=container-home]>#content [id^=home]>article:first-child {
	padding: 65px 0 0 0;
	text-align: center;
}

/* FOOTER */
body.home>footer {
	display: none;
}

footer {
	width: 100%;
	min-height: 250px;
	border-top: 5px solid #8bc63f;
	background-color: #56565a;
	font-size: 14px;
}

footer>div {
	max-width: 1170px;
	width: 100%;
	margin: 0 auto;
}

footer>div>nav {
	padding: 20px 0px;
	border-bottom: 1px solid #67676b;
	text-align: center;
}

footer>div>nav>span:before {
	content: "|";
	padding: 0 10px;
	color: #939395;
}

footer>div>nav>span:first-child:before {
	content: "";
}

footer>div>nav>span>a {
	color: #9ce442;
}

footer>div>div {
	padding: 0px 0px;
	border-bottom: 1px solid #67676b;
	color: #e7e7e7;
}

footer>div>div>section {
	float: left;
	max-width: 584px;
	width: calc(49% - 1px);
	height: 100%;
	padding: 20px 0;
}

footer>div>div>section:first-child {
	border-right: 1px solid #67676b;
}

footer>div>div>section>h3 {
	float: left;
	width: calc(100% - 354px);
	text-align: right;
	padding: 0px;
	margin: 0px;
}

footer>div>div>section>article {
	float: left;
	width: 304px;
	padding: 0 25px;
}

footer>div>div>section>article>p {
	padding: 0px;
	margin: 0px;
}

footer>div>div>section>article a {
	color: #9ce442;
	display: block;
	padding: 10px 0px;
}

footer>div>div>section>article a>i {
	padding: 2px 0 0 5px;
}

footer>div>p {
	color: #8bc63f;
	padding: 20px 0px;
	margin: 0px;
	float: left;
	width: 100%;
}

footer>div>p>span {
	float: left;
	padding-top: 10px;
	text-align: right;
	width: 66%;
}

footer>div>p>a {
	margin: 0 0 0px 15px;
}

@media screen and (max-width: 767px) {
	footer>div>p>span {
		text-align: center;
		padding: 0;
	}

	.menu-career--top {
		float: right;
		height: 60px;
		line-height: 60px;
		padding: 0px 15px 0px 0px;
	}

	.menu-career--top:before {
		content: "|";
		float: left;
		text-align: left;
		height: 56px;
		line-height: 56px;
		padding: 0 7px 0 0;
		display: none;
	}

	.menu-career--second {
		display: none !important;
	}
}

@media screen and (min-width: 768px) {
	.menu-career--top {
		display: none;
	}

	.menu-career--second {
		display: block;
	}
}



/* ANIMATION */

/* 0.5 */

#content-home .slider-accordion .slide-open>img,
.slider-accordian .slide-open>div {
	-moz-transition: all 2.0s ease-out;
	/* WebKit */
	-webkit-transition: all 2.0s ease-out;
	/* Opera */
	-o-transition: all 2.0s ease-out;
	/* Standard */
	transition: all 2.0s ease-out;
}

#content-home .slider-accordion .slide-closed>img,
.slider-accordian .slide-closed>div {
	-moz-transition: all 2.0s ease-in;
	/* WebKit */
	-webkit-transition: all 2.0s ease-in;
	/* Opera */
	-o-transition: all 2.0s ease-in;
	/* Standard */
	transition: all 2.0s ease-in;
}

/* OVERLAY */
[id^=overlay] {
	position: fixed;
	display: none;
	width: 100%;
	height: 100%;
	background: url('../images/bg/bg-overlay.png');
	top: 60px;
	left: 0px;
	z-index: 1000;
}

[id^=overlay]>section {
	position: relative;
	margin: 0 auto;
	top: 20px;
	padding: 10px;
}

[id^=overlay]>section {
	background: #ffffff;
	-webkit-box-shadow: 0px 0px 12px 0px #000;
	-moz-box-shadow: 0px 0px 12px 0px #000;
	box-shadow: 0px 0px 12px 0px #000;
}

[id^=overlay]>section figure img {
	width: 100%;
}

[id^=overlay]>section small {
	width: 30px;
	height: 30px;
	display: block;
	font-weight: 600;
	position: absolute;
	top: 18px;
	right: 18px;
	font-size: 28px;
	color: #8bc63f;
	cursor: pointer;
	z-index: 2;
	border: 2px solid #8BC63F;
	border-radius: 20px;
	text-align: center;
	line-height: 28px;
}

/* PAGINATION */
.pagination {
	clear: both;
	padding: 40px 0;
}

.pagination .filter {
	width: 395px;
	margin: 0 auto;
	text-align: center;
}

.pagination .filter>a {
	float: left;
	width: 48px;
	height: 48px;
	line-height: 42px;
	background-color: #f8f8f8;
	display: block;
	border: 1px solid #dbdbdb;
	border-radius: 3px;
}

.pagination .filter>a:hover {
	background-color: #8ac73f;
	color: #fff;
	border: 1px solid #7fbc34;
}

.pagination .filter>a.prev,
.pagination .filter>a.first {
	width: 33px;
	padding: 0 0 0 15px;
	margin: 0 8px 0 0;
}

.pagination .filter>a.next,
.pagination .filter>a.last {
	width: 28px;
	padding: 0 0 0 20px;
	margin: 0 0 0 8px;
}

.pagination .filter>a i {
	font-size: 28px;
	vertical-align: middle;
}

.pagination .filter>div {
	float: left;
	width: 135px;
	height: 48px;
	display: block;
	margin: 0 8px;
	border: 1px solid #dbdbdb;
	font-weight: 600;
	border-radius: 3px;
}

.pagination .filter>div input {
	line-height: 48px;
	border: 0px;
	width: 20px;
	background: none;
	text-align: center;
	box-shadow: 0px 0px 0px 0px #fff inset !important;
	font-weight: 600;
	color: #8ac73f;
}

.pagination .filter>div span {
	line-height: 48px;
}

.d-flex {
	display: flex;
}

.w-50{
	width: 50%;
}