/*========= Thai =========*/
/*========= Eng =========*/
/* ========= */
/* ==== Helvetica ==== */
@font-face { font-family: 'HelveticaThin'; src: url("../fonts/HelveticaNeueThin.eot"); src: url("../fonts/HelveticaNeueThin.eot") format("embedded-opentype"), url("../fonts/HelveticaNeueThin.woff2") format("woff2"), url("../fonts/HelveticaNeueThin.woff") format("woff"), url("../fonts/HelveticaNeueThin.ttf") format("truetype"), url("../fonts/HelveticaNeueThin.svg#HelveticaNeueThin") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'HelveticaBold'; src: url("../fonts/HelveticaBold.eot"); src: url("../fonts/HelveticaBold.eot") format("embedded-opentype"), url("../fonts/HelveticaBold.woff2") format("woff2"), url("../fonts/HelveticaBold.woff") format("woff"), url("../fonts/HelveticaBold.ttf") format("truetype"), url("../fonts/HelveticaBold.svg#HelveticaBold") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Helvetica'; src: url("../fonts/helveticanormal.eot"); src: url("../fonts/helveticanormal.eot") format("embedded-opentype"), url("../fonts/helveticanormal.woff2") format("woff2"), url("../fonts/helveticanormal.woff") format("woff"), url("../fonts/helveticanormal.ttf") format("truetype"), url("../fonts/helveticanormal.svg#helveticanormal") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'HelveticaLight'; src: url("../fonts/HelveticaNeueLight.eot"); src: url("../fonts/HelveticaNeueLight.eot") format("embedded-opentype"), url("../fonts/HelveticaNeueLight.woff2") format("woff2"), url("../fonts/HelveticaNeueLight.woff") format("woff"), url("../fonts/HelveticaNeueLight.ttf") format("truetype"), url("../fonts/HelveticaNeueLight.svg#HelveticaNeueLight") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'HelveticaLightOblique'; src: url("../fonts/HelveticaLightOblique.eot"); src: url("../fonts/HelveticaLightOblique.eot") format("embedded-opentype"), url("../fonts/HelveticaLightOblique.woff2") format("woff2"), url("../fonts/HelveticaLightOblique.woff") format("woff"), url("../fonts/HelveticaLightOblique.ttf") format("truetype"), url("../fonts/HelveticaLightOblique.svg#HelveticaLightOblique") format("svg"); font-weight: normal; font-style: normal; }
/* ==== Kanit ==== */
@font-face { font-family: 'KanitLight'; src: url("../fonts/kanit-light.eot"); src: url("../fonts/kanit-light.eot") format("embedded-opentype"), url("../fonts/kanit-light.woff") format("woff"), url("../fonts/kanit-light.ttf") format("truetype"), url("../fonts/kanit-light.svg#KanitLight") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Kanit'; src: url("../fonts/kanit-regular.eot"); src: url("../fonts/kanit-regular.eot") format("embedded-opentype"), url("../fonts/kanit-regular.woff") format("woff"), url("../fonts/kanit-regular.ttf") format("truetype"), url("../fonts/kanit-regular.svg#Kanit") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'KanitMedium'; src: url("../fonts/kanit-medium.eot"); src: url("../fonts/kanit-medium.eot") format("embedded-opentype"), url("../fonts/kanit-medium.woff") format("woff"), url("../fonts/kanit-medium.ttf") format("truetype"), url("../fonts/kanit-medium.svg#KanitMedium") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'KanitBold'; src: url("../fonts/kanit-bold.eot"); src: url("../fonts/kanit-bold.eot") format("embedded-opentype"), url("../fonts/kanit-bold.woff") format("woff"), url("../fonts/kanit-bold.ttf") format("truetype"), url("../fonts/kanit-bold.svg#KanitBold") format("svg"); font-weight: normal; font-style: normal; }
.page-container { padding: 0 10%; }
@media (max-width: 1779px) { .page-container { padding: 0 8%; } }
@media (max-width: 1440px) { .page-container { padding: 0 50px; } }
@media (max-width: 640px) { .page-container { padding: 0 30px; } }

a { background: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
a:hover { background: none; text-decoration: none; }

.nav li a { background: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
.nav li a:hover, .nav li a:focus { background: none; text-decoration: none; }

img { max-width: 100%; height: auto; }

body { background-color: transparent; font-size: 14px; font-family: "Helvetica", "Kanit", Arial, sans-serif; color: #878A9D; line-height: 25px; font-weight: normal; }

h1, h2, h3, h4, h5 { /* @font-family: $font_poppins_Bold; */ font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; }

b, strong { font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; }

button:hover, button:focus { outline: none; }

a, a:hover, a:focus { text-decoration: none; }

article .section { padding: 10% 0 50px; }

/*TH*/
.page_th { /*h1{ 
	font-size: 58px !important; 
	@media(max-width: 1440px){
		font-size: 48px !important; 
	}
	@media(max-width: 990px){
		font-size: 36px !important; 
	}
	@media(max-width: 640px){
		font-size: 28px !important; 
	}
}*/ }
.page_th body, .page_th a, .page_th p, .page_th li { font-size: 16px !important; }

/*Success Page*/
.success-page { padding: 5pc 0; }
.success-page .success-wrap { border: 1px solid #eeeeee; padding: 50px; max-width: 900px; margin: 0 auto; text-align: center; }
.success-page .icon { text-align: center; font-size: 80px; margin-bottom: 40px; color: #960014; display: inline-block; border: 3px solid; border-radius: 100%; padding: 10px; }
.success-page h3 { font-size: 24px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; text-transform: uppercase; margin: 0; }
@media (max-width: 990px) { .success-page h3 { font-size: 16px; } }
.success-page .button-order { margin-top: 50px; display: flex; justify-content: center; }
.success-page .button-order a { display: inline-block; padding: 12px 40px; background: #004a79; border: 1px solid #004a79; color: #FFF; text-transform: uppercase; }
.success-page .button-order a:hover { background: #FFFFFF; color: #004a79; }

.page-title h1 { font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; margin: 0 0 20px; }
@media (max-width: 1366px) { .page-title h1 { font-size: 36px; } }
@media (max-width: 990px) { .page-title h1 { font-size: 25px; } }

/* ======= Body Load ======= */
/* ======= Title Block ======= */
.title-block { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; margin: 0 0 50px; position: relative; }
@media (max-width: 768px) { .title-block { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; } }
.title-block .title-link { border-right: 1px solid #979797; padding-right: 30px; margin: 0; padding: 5px 30px 5px 0; margin-right: 25px; position: relative; }
@media (max-width: 640px) { .title-block .title-link { text-align: center; padding: 5px 20px 5px 0; margin-right: 20px; } }
.title-block .title-link h4 { margin: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; font-size: 20px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #878A9D; text-transform: uppercase; }
@media (max-width: 1366px) { .title-block .title-link h4 { font-size: 18px; } }
@media (max-width: 990px) { .title-block .title-link h4 { font-size: 16px; } }
.title-block .title-link a { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.title-block .title-link:hover h4, .title-block .title-link.active h4 { color: #005382; }
.title-block .title-link:last-child { border: 0; margin: 0; padding-right: 0; }

.popup-block { background-color: transparent; width: 100%; padding: 0; }
.popup-block .page-container { padding-top: 50px; padding-bottom: 50px; }
.popup-block .img-cover { background-size: cover; background-repeat: no-repeat; background-position: center; }
.popup-block .img-cover img { visibility: hidden; }
.popup-block .content-cover { padding: 40px; background-color: #FFF; }
.popup-block .content-cover h4 { font-size: 20px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; }
@media (max-width: 1366px) { .popup-block .content-cover h4 { font-size: 18px; } }
@media (max-width: 990px) { .popup-block .content-cover h4 { font-size: 16px; } }

.fancybox-close-small { top: 0; right: 40px; background-image: url("../images/close-b.svg"); background-size: contain; background-repeat: no-repeat; background-position: center; }
.fancybox-close-small:after { content: initial; }

/* ======= About Sub ======= */
.no-edit .page-sub-wrapper .sub-nav { position: absolute; left: 0; top: -64px; }
@media (max-width: 890px) { .no-edit .page-sub-wrapper .sub-nav { position: relative; top: 0; width: 100%; } }

.page-sub-wrapper { position: relative; display: flex; display: -webkit-flex; flex-wrap: wrap; justify-content: flex-end; -webkit-justify-content: flex-end; /*sub-content*/ }
.page-sub-wrapper .sub-nav { width: 20%; }
@media (max-width: 1680px) { .page-sub-wrapper .sub-nav { width: 25%; } }
.page-sub-wrapper .sub-nav .sub-nav-wrap { width: 80%; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
@media (max-width: 1100px) { .page-sub-wrapper .sub-nav .sub-nav-wrap { width: 100%; } }
.page-sub-wrapper .sub-nav .sub-nav-wrap .title-nav { background-color: #003B5A; padding: 20px 0; }
.page-sub-wrapper .sub-nav .sub-nav-wrap .title-nav h4 { margin: 0; text-align: center; font-size: 20px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #FFFFFF; text-transform: uppercase; }
@media (max-width: 1366px) { .page-sub-wrapper .sub-nav .sub-nav-wrap .title-nav h4 { font-size: 18px; } }
@media (max-width: 990px) { .page-sub-wrapper .sub-nav .sub-nav-wrap .title-nav h4 { font-size: 16px; } }
.page-sub-wrapper .sub-nav .sub-nav-wrap .nav-section { background-color: #005480; padding: 20px 50px; }
@media (max-width: 1680px) { .page-sub-wrapper .sub-nav .sub-nav-wrap .nav-section { padding: 20px; } }
@media (max-width: 890px) { .page-sub-wrapper .sub-nav .sub-nav-wrap .nav-section { padding: 20px 5%; } }
.page-sub-wrapper .sub-nav .sub-nav-wrap a { font-size: 16px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #FFFFFF; padding: 10px 0; display: block; }
.page-sub-wrapper .sub-nav .sub-nav-wrap a:hover, .page-sub-wrapper .sub-nav .sub-nav-wrap a.nav-selected, .page-sub-wrapper .sub-nav .sub-nav-wrap a.nav-path-selected { color: #2FA3E0; }
.page-sub-wrapper .sub-content { width: 80%; padding-right: 10%; /*Icon*/ /*main-icon-wrap*/ }
@media (max-width: 1680px) { .page-sub-wrapper .sub-content { padding-left: 5%; padding-right: 5%; width: 75%; } }
@media (max-width: 890px) { .page-sub-wrapper .sub-content { width: 100%; padding-left: 5%; } }
.page-sub-wrapper .sub-content--top { padding-top: 100px; }
@media (max-width: 1680px) { .page-sub-wrapper .sub-content--top { padding-top: 50px; } }
.page-sub-wrapper .sub-content--bottom { margin-top: 0; }
.page-sub-wrapper .sub-content--bottom--bg { width: 100%; padding: 0; background-color: rgba(109, 144, 164, 0.14); padding: 100px 0; display: flex; display: -webkit-flex; flex-wrap: wrap; justify-content: flex-end; -webkit-justify-content: flex-end; }
.page-sub-wrapper .sub-content--bottom--bg .sub-content-wrap { width: 80%; padding-right: 10%; }
@media (max-width: 890px) { .page-sub-wrapper .sub-content--bottom--bg .sub-content-wrap { width: 100%; padding: 0 50px; } }
.page-sub-wrapper .sub-content h1 { font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #951B1E; margin: 0 0 30px; }
@media (max-width: 1366px) { .page-sub-wrapper .sub-content h1 { font-size: 36px; } }
@media (max-width: 990px) { .page-sub-wrapper .sub-content h1 { font-size: 25px; } }
.page-sub-wrapper .sub-content h1 strong { color: #005382; }
.page-sub-wrapper .sub-content h2 { font-size: 36px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #878A9D; letter-spacing: 0.69px; margin: 0 0 30px; }
@media (max-width: 1366px) { .page-sub-wrapper .sub-content h2 { font-size: 25px; } }
@media (max-width: 990px) { .page-sub-wrapper .sub-content h2 { font-size: 18px; } }
.page-sub-wrapper .sub-content h4 { font-size: 18px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; margin: 20px 0 10px; }
.page-sub-wrapper .sub-content p { margin: 0 0 20px; letter-spacing: 0.69px; }
.page-sub-wrapper .sub-content .block-row { margin-bottom: 120px; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .block-row { margin-bottom: 50px; } }
.page-sub-wrapper .sub-content .main-icon-wrap { display: inline-block; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap { width: 100%; } }
.page-sub-wrapper .sub-content .main-icon-wrap.in-view .main-icon .main-icon-inner .main-title.front, .page-sub-wrapper .sub-content .main-icon-wrap:hover .main-icon .main-icon-inner .main-title.front { z-index: 900; -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); }
.page-sub-wrapper .sub-content .main-icon-wrap.in-view .main-icon .main-icon-inner .main-title.back, .page-sub-wrapper .sub-content .main-icon-wrap:hover .main-icon .main-icon-inner .main-title.back { z-index: 996; -webkit-transform: rotateX(0deg) rotateY(0deg); -moz-transform: rotateX(0deg) rotateY(0deg); }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon { display: inline-block; position: relative; /*Main*/ /*iCon*/ }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon { width: 100%; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; padding: 230px 230px 230px 0; position: relative; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner { padding: 0; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner svg { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -ms-transform: rotate(-90deg); position: absolute; left: 0; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner svg { display: none; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title { width: 250px; height: 250px; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; background-color: #005382; border-radius: 100%; /*front & back*/ }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title { border-radius: 0; width: 100%; height: auto; padding: 20px 0; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title h1 { margin: 0; font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #FFFFFF; text-transform: capitalize; }
@media (max-width: 1366px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title h1 { font-size: 36px; } }
@media (max-width: 990px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title h1 { font-size: 25px; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title:before, .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title:after { content: ''; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title:before, .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title:after { content: initial; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title:before, .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title .main-title-after { width: 345px; height: 345px; border-radius: 100%; position: absolute; border: 4px solid #005382; background-color: #FFFFFF; z-index: -1; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title:before, .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title .main-title-after { border-radius: 0; width: 100%; height: auto; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title:after { width: 270px; height: 270px; border-radius: 100%; position: absolute; /*background-color: #EBF0F3;*/ border: 16px solid #EBF0F3; z-index: -1; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title.front {     	/*height: inherit;
		position: absolute;
		top: 0;
		z-index: 900;
		text-align: center;
		-webkit-transform: rotateX(0deg) rotateY(0deg);
		   -moz-transform: rotateX(0deg) rotateY(0deg);
		-webkit-transform-style: preserve-3d;
		   -moz-transform-style: preserve-3d;
		-webkit-backface-visibility: hidden;
		   -moz-backface-visibility: hidden;
		-webkit-transition: all .4s ease-in-out;
		   -moz-transition: all .4s ease-in-out;
			-ms-transition: all .4s ease-in-out;
			 -o-transition: all .4s ease-in-out;
				transition: all .4s ease-in-out;*/ }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title.back { position: absolute; z-index: 1000; -webkit-transform: rotateY(-180deg); -moz-transform: rotateY(-180deg); -o-transform: rotateY(-180deg); transform: rotateY(-180deg); -ms-transform: rotateY(-180deg); -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; -ms-transition: all 0.6s ease-in-out; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title.back:before, .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner .main-title.back:after { content: initial; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .main-icon-inner:after { content: ''; width: 372px; height: 590px; border-bottom-right-radius: 590px; position: absolute; left: 31%; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list { margin-top: 20px; display: flex; display: -webkit-flex; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list { flex-wrap: wrap; flex-direction: column; margin-top: 50px; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; position: absolute; position: absolute; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item { position: relative; top: initial !important; left: initial !important; right: initial !important; bottom: initial !important; margin-bottom: 20px; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-inner { padding: 10px; border: 3px solid #225c8a; border-radius: 100%; background-color: #FFFFFF; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-inner .icon-img { width: 80px; height: 80px; background-color: #FFFFFF; border-radius: 100%; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; -webkit-box-shadow: 0 2px 2px 0 rgba(212, 212, 212, 0.5); -moz-box-shadow: 0 2px 2px 0 rgba(212, 212, 212, 0.5); box-shadow: 0 2px 2px 0 rgba(212, 212, 212, 0.5); padding: 10px; position: relative; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-inner .icon-img img { position: relative; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-inner .icon-img svg { width: 50px; height: 50px; position: relative; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-inner .icon-img > div { width: 100%; height: 100%; border-radius: 100%; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-inner .icon-img .back { position: absolute; -webkit-transform: rotate3d(0, 1, 0, 180deg); -moz-transform: rotate3d(0, 1, 0, 180deg); -o-transform: rotate3d(0, 1, 0, 180deg); transform: rotate3d(0, 1, 0, 180deg); -ms-transform: rotate3d(0, 1, 0, 180deg); }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-inner .icon-img .back .bg-color-hover { width: 100%; height: 100%; position: absolute; border-radius: 100%; opacity: 0; border: 1px solid #eff1f4; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-inner:before { content: ''; width: 90px; height: 90px; /*background-color: #ebf0f3;*/ border: 5px solid #ebf0f3; display: block; border-radius: 100%; position: absolute; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-desc { position: absolute; width: 500px; }
@media (max-width: 1440px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-desc { width: 300px; } }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-desc { position: relative; left: 0; width: 100%; padding-left: 40px; } }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-desc h4 { font-size: 18px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #878A9D; text-transform: uppercase; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item .icon-item-desc p { line-height: normal; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item:hover { cursor: pointer; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item:hover .icon-item-inner .icon-img { -webkit-transform: rotate3d(0, 1, 0, -180deg); -moz-transform: rotate3d(0, 1, 0, -180deg); -o-transform: rotate3d(0, 1, 0, -180deg); transform: rotate3d(0, 1, 0, -180deg); -ms-transform: rotate3d(0, 1, 0, -180deg);     	/*-webkit-transform: rotate3d(0,1,0,-180deg);
	    -moz-transform: rotate3d(0,1,0,-180deg);
	    -o-transform: rotate3d(0,1,0,-180deg);
	    -ms-transform: rotate3d(0,1,0,-180deg);
	    transform: rotate3d(0,1,0,-180deg);*/ }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item:hover .icon-item-inner .icon-img .bg-color-hover { opacity: 1; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item:hover .icon-item-inner .icon-img svg #MCC_About_us { fill: #FFF !important; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item:hover .icon-item-inner .icon-img .back .bg-color-hover { opacity: 1; }
.page-sub-wrapper .sub-content .main-icon-wrap .main-icon .icon-list .icon-item:hover .icon-item-desc h4 { color: #005382; }
@media (min-width: 1201px) { .page-sub-wrapper .sub-content .main-icon-wrap.right-side .main-icon .icon-list .icon-item .icon-item-desc { left: 150px; }
  .page-sub-wrapper .sub-content .main-icon-wrap.right-side .main-icon .icon-list .icon-item:first-child { top: -4%; left: 36%; }
  .page-sub-wrapper .sub-content .main-icon-wrap.right-side .main-icon .icon-list .icon-item:nth-child(2) { top: 13%; right: 3%; }
  .page-sub-wrapper .sub-content .main-icon-wrap.right-side .main-icon .icon-list .icon-item:nth-child(3) { top: 42.5%; right: -10%; }
  .page-sub-wrapper .sub-content .main-icon-wrap.right-side .main-icon .icon-list .icon-item:nth-child(4) { bottom: 13%; right: 3%; }
  .page-sub-wrapper .sub-content .main-icon-wrap.right-side .main-icon .icon-list .icon-item:last-child { bottom: -4%; left: 36%; } }
.page-sub-wrapper .sub-content .main-icon-wrap.left-side { width: 100%; }
.page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon { display: flex; /*Main*/ /*IconList*/ }
.page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .main-icon-inner { padding: 230px 230px 230px 0; width: 100%; justify-content: flex-end; }
.page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .main-icon-inner svg { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -ms-transform: rotate(90deg); right: 26%; left: initial; }
.page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .main-icon-inner .main-title { background-color: #951B1E; }
.page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .main-icon-inner .main-title:before { border-color: #951B1E; }
.page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .icon-list .icon-item { flex-flow: row-reverse; }
.page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .icon-list .icon-item .icon-item-inner { border: 3px solid #951B1E; }
@media (min-width: 1201px) { .page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .icon-list .icon-item .icon-item-desc { right: 150px; text-align: right; }
  .page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .icon-list .icon-item:first-child { top: -6%; right: 29%; }
  .page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .icon-list .icon-item:nth-child(2) { top: 13%; right: 43%; }
  .page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .icon-list .icon-item:nth-child(3) { top: 42.5%; right: 48%; }
  .page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .icon-list .icon-item:nth-child(4) { bottom: 13%; right: 43%; }
  .page-sub-wrapper .sub-content .main-icon-wrap.left-side .main-icon .icon-list .icon-item:last-child { bottom: -6%; right: 29%; } }
@media (max-width: 890px) { .page-sub-wrapper .sub-content.new-design { padding-right: 5% !important; } }
.page-sub-wrapper .sub-content.new-design .block-row { margin-bottom: 0; }
.page-sub-wrapper .sub-content.new-design .content-page .content { padding-right: 10%; padding-bottom: 30px; }
@media (max-width: 1779px) { .page-sub-wrapper .sub-content.new-design .content-page .content { padding-right: 8%; } }
@media (max-width: 1440px) { .page-sub-wrapper .sub-content.new-design .content-page .content { padding-right: 50px; } }
@media (max-width: 890px) { .page-sub-wrapper .sub-content.new-design .content-page .content { padding-right: 0; } }
.page-sub-wrapper .sub-content.new-design .content-page .content .content-wrap { padding-right: 100px; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content.new-design .content-page .content .content-wrap { padding-right: 0; } }
.page-sub-wrapper .sub-content.new-design .content-page .img .cover-img { background-size: cover; background-repeat: no-repeat; background-position: center; padding-top: 30%; }
.page-sub-wrapper .sub-content.new-design .content-page .img .cover-img img { display: none; }
.page-sub-wrapper .sub-content-new { background-color: rgba(109, 144, 164, 0.14); width: 100%; display: flex; display: -webkit-flex; flex-wrap: wrap; justify-content: flex-end; -webkit-justify-content: flex-end; }
.page-sub-wrapper .sub-content-new__content { width: 80%; padding: 80px 10% 80px 0; }
.page-sub-wrapper .sub-content-new__content > * { margin-bottom: 50px; }
.page-sub-wrapper .sub-content-new__content .style-image { margin: 50px 0; }
.page-sub-wrapper .sub-content-new__content .timeline-block { margin-bottom: 0; }
@media (max-width: 640px) { .page-sub-wrapper .sub-content-new__content .ccm-layout-column { width: 100% !important; }
  .page-sub-wrapper .sub-content-new__content .ccm-layout-column .ccm-layout-column-inner { margin: 0 !important; } }
@media (max-width: 1680px) { .page-sub-wrapper .sub-content-new__content { width: 75%; padding: 50px 10% 50px 0; padding-left: 5%; } }
@media (max-width: 890px) { .page-sub-wrapper .sub-content-new__content { width: 100%; padding: 50px 5%; } }
.page-sub-wrapper .sub-content-new__content .content-wrap h1 { margin: 0 0 20px; font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; }
@media (max-width: 1366px) { .page-sub-wrapper .sub-content-new__content .content-wrap h1 { font-size: 36px; } }
@media (max-width: 990px) { .page-sub-wrapper .sub-content-new__content .content-wrap h1 { font-size: 25px; } }
.page-sub-wrapper .sub-content-new__content .content-wrap p { margin-bottom: 10px; }
.page-sub-wrapper .sub-content-new__content .content-wrap p strong { font-size: 14px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; }
.page-sub-wrapper .sub-content-new__content .timeline-block { display: flex; display: -webkit-flex; padding-right: 100px; }
@media (max-width: 1200px) { .page-sub-wrapper .sub-content-new__content .timeline-block { padding-right: 0; } }
.page-sub-wrapper .sub-content-new__content .timeline-block__year { padding-right: 30px; }
@media (max-width: 480px) { .page-sub-wrapper .sub-content-new__content .timeline-block__year { padding-right: 20px; } }
.page-sub-wrapper .sub-content-new__content .timeline-block__year h1 { font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #951B1E; }
@media (max-width: 1366px) { .page-sub-wrapper .sub-content-new__content .timeline-block__year h1 { font-size: 36px; } }
@media (max-width: 990px) { .page-sub-wrapper .sub-content-new__content .timeline-block__year h1 { font-size: 25px; } }
.page-sub-wrapper .sub-content-new__content .timeline-block__content { position: relative; }
.page-sub-wrapper .sub-content-new__content .timeline-block__content:before, .page-sub-wrapper .sub-content-new__content .timeline-block__content:after { content: ''; position: absolute; border-radius: 100%; }
.page-sub-wrapper .sub-content-new__content .timeline-block__content:before { width: 9px; height: 9px; top: 18px; left: 0; background-color: #951B1E; z-index: 1; }
@media (max-width: 890px) { .page-sub-wrapper .sub-content-new__content .timeline-block__content:before { top: 8px; } }
.page-sub-wrapper .sub-content-new__content .timeline-block__content:after { width: 15px; height: 15px; top: 15px; left: -3px; border: 1px solid #951B1E; background-color: #ecf0f3; }
@media (max-width: 890px) { .page-sub-wrapper .sub-content-new__content .timeline-block__content:after { top: 5px; } }
.page-sub-wrapper .sub-content-new__content .timeline-block__content .wrap { position: relative; padding: 10px 0 40px 35px; }
@media (max-width: 890px) { .page-sub-wrapper .sub-content-new__content .timeline-block__content .wrap { padding-top: 0; } }
@media (max-width: 480px) { .page-sub-wrapper .sub-content-new__content .timeline-block__content .wrap { padding-right: 25px; } }
.page-sub-wrapper .sub-content-new__content .timeline-block__content .wrap:before { content: ''; width: 1px; height: 100%; background-color: #951B1E; position: absolute; top: 26px; left: 4px; z-index: -1; }
@media (max-width: 890px) { .page-sub-wrapper .sub-content-new__content .timeline-block__content .wrap:before { top: 5px; } }
.page-sub-wrapper .sub-content-new__content .timeline-block__content .wrap p { margin: 0 0 5px; }
.page-sub-wrapper .sub-content-new__content .timeline-block__content .wrap p strong, .page-sub-wrapper .sub-content-new__content .timeline-block__content .wrap p b { font-size: 18px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; }
.page-sub-wrapper .sub-content-new__content .timeline-block:last-child .timeline-block__content .wrap:before { content: initial; }

/*page-sub-wrapper*/
/* ======= About Sub ======= */
/* === Hover BG === */
.fill-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 83, 130, 0.7); opacity: 0; }

/* === Style Image === */
.style-image { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; }
@media (max-width: 890px) { .style-image { flex-direction: column; } }
.style-image .bg-img { background-size: cover; background-repeat: no-repeat; background-position: center; width: 100%; height: 100%; }
@media (max-width: 890px) { .style-image .bg-img { background: none; } }
.style-image .bg-img img { visibility: hidden; }
@media (max-width: 890px) { .style-image .bg-img img { visibility: visible; } }
.style-image .content-img { max-width: 800px; position: absolute; }
@media (max-width: 890px) { .style-image .content-img { position: relative; background-color: #005382; padding: 30px; } }
.style-image .content-img h1 { font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #FFFFFF; font-size: 64px; }
@media (max-width: 1366px) { .style-image .content-img h1 { font-size: 36px; } }
@media (max-width: 990px) { .style-image .content-img h1 { font-size: 25px; } }
.style-image .content-img p { color: #FFFFFF; letter-spacing: 0.6px; line-height: 25px; text-align: center; }
.style-image.with-text .content-img { max-width: 600px; right: 10pc; }
@media (max-width: 1440px) { .style-image.with-text .content-img { right: 3pc; } }
@media (max-width: 1100px) { .style-image.with-text .content-img { max-width: 300px; right: 30px; } }
@media (max-width: 890px) { .style-image.with-text .content-img { max-width: 100%; right: 0; } }
.style-image.with-text .content-img h2 { color: #FFF; margin-bottom: 0; }

/* === Banner === */
.section-sub-banner .banner-block { display: flex; display: -webkit-flex; flex-wrap: wrap; align-items: center; -webkit-align-items: center; }
.section-sub-banner .banner-block .banner-img { background-size: cover; background-repeat: no-repeat; background-position: center; width: 100%; position: relative;     /*&:before{ 	content: '';
	    width: 100%;
	    height: 100%;
	    background-color: rgba(0, 0, 0, .45);
	    position: absolute;
	    top: 0;
	    left: 0; }*/ }
.section-sub-banner .banner-block .banner-img img { visibility: hidden; }
.section-sub-banner .banner-block .banner-content { position: absolute; width: 35%; left: 10%; opacity: 0; visibility: hidden; transition: all .5s; -webkit-transform: translateY(-60px); -moz-transform: translateY(-60px); -o-transform: translateY(-60px); transform: translateY(-60px); -ms-transform: translateY(-60px); }
.section-sub-banner .banner-block .banner-content h1 { font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #FFFFFF; font-size: 59px; margin: 0 0 20px; }
@media (max-width: 1366px) { .section-sub-banner .banner-block .banner-content h1 { font-size: 36px; } }
@media (max-width: 990px) { .section-sub-banner .banner-block .banner-content h1 { font-size: 25px; } }
.section-sub-banner .banner-block .banner-content p { font-size: 20px; font-family: "Helvetica", "Kanit", Arial, sans-serif; color: #FFFFFF; letter-spacing: 0.86px; line-height: 34px; }
@media (max-width: 1366px) { .section-sub-banner .banner-block .banner-content p { font-size: 18px; } }
@media (max-width: 990px) { .section-sub-banner .banner-block .banner-content p { font-size: 16px; } }
@media (max-width: 640px) { .section-sub-banner .banner-block .banner-content p { line-height: 22px; } }
@media (max-width: 1779px) { .section-sub-banner .banner-block .banner-content { position: absolute; left: 8%; } }
@media (max-width: 1440px) { .section-sub-banner .banner-block .banner-content { position: absolute; width: 100%; left: 0%; padding: 0 50px; } }
@media (max-width: 640px) { .section-sub-banner .banner-block .banner-content { position: relative; background-color: #015e8b; padding: 20px 5%; }
  .section-sub-banner .banner-block .banner-content h1 { margin-bottom: 0; } }

.load .section-sub-banner .banner-block .banner-content { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -moz-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); -ms-transform: translateY(0); webkit-transition-delay: 0.5s; -moz-transition-delay: 0.5s; transition-delay: 0.5s; }

/* === Product Thumb === */
.section-projects { padding: 80px 0; }
.section-projects .title h1 { font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; margin: 0 0 40px; }
@media (max-width: 1366px) { .section-projects .title h1 { font-size: 36px; } }
@media (max-width: 990px) { .section-projects .title h1 { font-size: 25px; } }
.section-projects .project-list { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; }
.section-projects .project-list .project-item { background: #005382; -webkit-box-shadow: 0 16px 32px 0 rgba(205, 204, 216, 0.52); -moz-box-shadow: 0 16px 32px 0 rgba(205, 204, 216, 0.52); box-shadow: 0 16px 32px 0 rgba(205, 204, 216, 0.52); position: relative; border: 10px solid #FFF; }
.section-projects .project-list .project-item .item-img { background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; }
.section-projects .project-list .project-item .item-img:before { content: ''; width: 100%; height: 100%; background-color: rgba(13, 53, 98, 0.7); opacity: 0; position: absolute; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
.section-projects .project-list .project-item .item-img img { visibility: hidden; }
.section-projects .project-list .project-item .item-content { padding: 40px 20px; opacity: 0; position: absolute; bottom: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
.section-projects .project-list .project-item .item-content h4 { font-size: 20px; color: #FFFFFF; }
@media (max-width: 1366px) { .section-projects .project-list .project-item .item-content h4 { font-size: 18px; } }
@media (max-width: 990px) { .section-projects .project-list .project-item .item-content h4 { font-size: 16px; } }
.section-projects .project-list .project-item .item-content p { font-size: 12px; color: #FFFFFF; line-height: 17px; }
.section-projects .slick-slider button { position: absolute; z-index: 1; text-indent: -9999px; border: 0; background-color: transparent; background-image: url("../images/nav.svg"); background-size: contain; width: 68px; height: 68px; }
.section-projects .slick-slider button.slick-prev { left: 0; display: none !important; }
.section-projects .slick-slider button.slick-next { right: 50px; }
.section-projects .slick-slider .slick-list { padding-top: 50px !important; padding-bottom: 50px !important; }
.section-projects .slick-slider .slick-list .slick-slide { margin: 0 10px; }
.section-projects .slick-slider .slick-list .slick-slide.slick-current .project-item { -webkit-box-shadow: 0px 0px 32px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 0px 32px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 32px 1px rgba(0, 0, 0, 0.2); }
.section-projects .slick-slider .slick-list .slick-slide.slick-current .project-item .item-img:before { opacity: 1; }
.section-projects .slick-slider .slick-list .slick-slide.slick-current .project-item .item-content { opacity: 1; }
.section-projects .project-content { margin-top: 20px; }
.section-projects .project-content a { font-size: 12px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #951B1E; letter-spacing: 1.75px; text-transform: uppercase; display: inline-block; position: relative; }
.section-projects .project-content a:after { content: ''; width: 100px; height: 1px; background-color: #951B1E; display: block; margin: 5px auto 0; }

/* === Services === */
.section-services { padding: 80px 0; background-color: rgba(109, 144, 164, 0.14); }
.section-services .title h1 { font-size: 48px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; margin: 0 0 40px; }
@media (max-width: 1366px) { .section-services .title h1 { font-size: 36px; } }
@media (max-width: 990px) { .section-services .title h1 { font-size: 25px; } }
.section-services .services-list { padding-top: 50px; position: relative; }
.section-services .services-list #service-list-wp { display: flex; display: -webkit-flex; flex-wrap: wrap; }
.section-services .services-list #service-list-wp .service-item { -webkit-flex-basis: 33.33%; flex-basis: 33.33%; flex: 0 0 33.33%; padding: 80px; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; flex-direction: column; height: 350px; cursor: pointer; position: relative; }
@media (max-width: 890px) { .section-services .services-list #service-list-wp .service-item { -webkit-flex-basis: 50%; flex-basis: 50%; flex: 0 0 50%; } }
@media (max-width: 480px) { .section-services .services-list #service-list-wp .service-item { -webkit-flex-basis: 100%; flex-basis: 100%; flex: 0 0 100%; } }
@media (max-width: 1366px) { .section-services .services-list #service-list-wp .service-item { padding: 20px; } }
.section-services .services-list #service-list-wp .service-item .service-image { padding-bottom: 30px; }
.section-services .services-list #service-list-wp .service-item .service-image img { max-width: 120px; }
.section-services .services-list #service-list-wp .service-item .service-image svg { width: auto; max-width: 120px; height: 60px; fill: #005382 !important; }
@media (min-width: 891px) { .section-services .services-list #service-list-wp .service-item .service-image svg { fill: #005382 !important; }
  .section-services .services-list #service-list-wp .service-item .service-image svg g { fill: #005382 !important; }
  .section-services .services-list #service-list-wp .service-item .service-image svg g path { fill: #005382 !important; }
  .section-services .services-list #service-list-wp .service-item .service-image svg path { /*stroke: $mainColor !important;*/ }
  .section-services .services-list #service-list-wp .service-item .service-image svg polygon { /*fill: $mainColor !important;*/ } }
@media (max-width: 890px) { .section-services .services-list #service-list-wp .service-item .service-image svg { fill: #005382 !important; }
  .section-services .services-list #service-list-wp .service-item .service-image svg g { fill: #005382 !important; }
  .section-services .services-list #service-list-wp .service-item .service-image svg g path { fill: #005382 !important; } }
@media (max-width: 480px) { .section-services .services-list #service-list-wp .service-item .service-image svg { max-width: 80px; } }
.section-services .services-list #service-list-wp .service-item .service-desc h5 { font-size: 16px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; margin: 0 0 30px; text-align: center; }
@media (max-width: 890px) { .section-services .services-list #service-list-wp .service-item .service-desc h5 { color: #005382; } }
.section-services .services-list #service-list-wp .service-item .service-desc p { text-align: center; font-size: 14px; font-family: "Helvetica", "Kanit", Arial, sans-serif; color: #878A9D; line-height: 17px; padding: 0 10%; }
@media (max-width: 1366px) { .section-services .services-list #service-list-wp .service-item .service-desc p { padding: 0; } }
@media (max-width: 890px) { .section-services .services-list #service-list-wp .service-item .service-desc p { color: #878A9D; } }
.section-services .services-list #service-list-wp .service-item a { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 9; }
.section-services .services-list #service-list-wp .service-item a:hover, .section-services .services-list #service-list-wp .service-item a:focus { outline: none; box-shadow: none; }
@media (min-width: 891px) { .section-services .services-list #service-list-wp .service-item:nth-child(odd) { background-color: #005382; /*Odd SVG*/ }
  .section-services .services-list #service-list-wp .service-item:nth-child(odd) .service-image img { filter: brightness(0) invert(1); }
  .section-services .services-list #service-list-wp .service-item:nth-child(odd) .service-image svg { fill: #FFFFFF !important; }
  .section-services .services-list #service-list-wp .service-item:nth-child(odd) .service-image svg g, .section-services .services-list #service-list-wp .service-item:nth-child(odd) .service-image svg path { fill: #FFFFFF !important; }
  .section-services .services-list #service-list-wp .service-item:nth-child(odd) .service-desc h5 { color: #FFFFFF; }
  .section-services .services-list #service-list-wp .service-item:nth-child(odd) .service-desc p { color: #FFFFFF; } }
@media (max-width: 890px) { .section-services .services-list #service-list-wp .service-item:nth-child(4n), .section-services .services-list #service-list-wp .service-item:nth-child(4n-3) { background-color: #005382; }
  .section-services .services-list #service-list-wp .service-item:nth-child(4n) .service-image img, .section-services .services-list #service-list-wp .service-item:nth-child(4n-3) .service-image img { filter: brightness(0) invert(1); }
  .section-services .services-list #service-list-wp .service-item:nth-child(4n) .service-image svg, .section-services .services-list #service-list-wp .service-item:nth-child(4n-3) .service-image svg { fill: #FFFFFF !important; }
  .section-services .services-list #service-list-wp .service-item:nth-child(4n) .service-image svg g path, .section-services .services-list #service-list-wp .service-item:nth-child(4n-3) .service-image svg g path { fill: #FFFFFF !important; }
  .section-services .services-list #service-list-wp .service-item:nth-child(4n) .service-image svg path, .section-services .services-list #service-list-wp .service-item:nth-child(4n-3) .service-image svg path { /*stroke: $whiteColor !important;*/ }
  .section-services .services-list #service-list-wp .service-item:nth-child(4n) .service-image svg polygon, .section-services .services-list #service-list-wp .service-item:nth-child(4n-3) .service-image svg polygon { fill: #FFFFFF !important; }
  .section-services .services-list #service-list-wp .service-item:nth-child(4n) .service-desc h5, .section-services .services-list #service-list-wp .service-item:nth-child(4n) .service-desc p, .section-services .services-list #service-list-wp .service-item:nth-child(4n-3) .service-desc h5, .section-services .services-list #service-list-wp .service-item:nth-child(4n-3) .service-desc p { color: #FFFFFF; } }
.section-services .services-list .service-pager .pager-wrapper { padding: 80px 0 0; text-align: center; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; }
.section-services .services-list .service-pager .pager-wrapper a.pager-item { width: 8px; height: 8px; border: 1px solid #951B1E; border-radius: 100%; color: transparent; display: inline-block; text-indent: -9999px; margin: 0 20px; position: relative; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; }
.section-services .services-list .service-pager .pager-wrapper a.pager-item:before { content: ''; width: 42px; height: 42px; border: 1px solid #951B1E; display: block; border-radius: 100%; opacity: 0; position: absolute; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
.section-services .services-list .service-pager .pager-wrapper a.pager-item.jp-current { background-color: #951B1E; }
.section-services .services-list .service-pager .pager-wrapper a.pager-item.jp-current:before { opacity: 1; }
.section-services .services-list .other-service { background-color: #951B1E; height: 350px; width: 33.33%; position: absolute; right: 0; bottom: 88px; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; flex-direction: column; }
@media (max-width: 890px) { .section-services .services-list .other-service { display: none; } }
.section-services .services-list .other-service .service-image { padding-bottom: 30px; }
.section-services .services-list .other-service .service-desc h5 { font-size: 16px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #FFFFFF; margin: 0 0 30px; text-align: center; }
.section-services .services-list .other-service .service-desc p { text-align: center; font-size: 14px; font-family: "Helvetica", "Kanit", Arial, sans-serif; color: #878A9D; line-height: 17px; padding: 0 10%; }

/* ==== Service Popup ==== */
.pop-up-wrap-stp1 { width: 100%; background-color: transparent; padding: 0; }
.pop-up-wrap-stp1 .pop-up-wrap-col { background-color: #FFF; display: flex; align-items: center; }
@media (max-width: 890px) { .pop-up-wrap-stp1 .pop-up-wrap-col { flex-direction: column; } }
.pop-up-wrap-stp1 .pop-up-wrap-col .col-left { background-size: cover; background-repeat: no-repeat; background-position: center; padding: 15pc 0; flex-basis: 35%; }
@media (max-width: 890px) { .pop-up-wrap-stp1 .pop-up-wrap-col .col-left { background: none; padding: 0; } }
.pop-up-wrap-stp1 .pop-up-wrap-col .col-left img { display: none; }
@media (max-width: 890px) { .pop-up-wrap-stp1 .pop-up-wrap-col .col-left img { display: block; } }
.pop-up-wrap-stp1 .pop-up-wrap-col .col-right { padding: 40px; background-color: #FFF; flex-basis: 65%; }
.pop-up-wrap-stp1 .pop-up-wrap-col .col-right h3 { font-size: 24px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; margin: 0 0 20px; }
@media (max-width: 990px) { .pop-up-wrap-stp1 .pop-up-wrap-col .col-right h3 { font-size: 16px; } }
.pop-up-wrap-stp1 .pop-up-wrap-col .col-right p { font-size: 16px; font-family: "Helvetica", "Kanit", Arial, sans-serif; color: #878A9D; letter-spacing: 0.69px; line-height: 25px; }
.pop-up-wrap-stp1 .fancybox-close-small { top: 5%; right: 12%; }
@media (max-width: 1779px) { .pop-up-wrap-stp1 .fancybox-close-small { right: 10%; } }
@media (max-width: 890px) { .pop-up-wrap-stp1 .fancybox-close-small { top: 20px; right: 70px; } }

.pop-up-wrap { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 999; display: flex; align-items: center; }
.pop-up-wrap .pop-up-wrap-stp1 { width: 100%; background-color: transparent; padding: 0; }
.pop-up-wrap .pop-up-wrap-stp1 .pop-up-wrap-col { position: relative; }
.pop-up-wrap .pop-up-wrap-stp1 .pop-up-wrap-col .close-btn { background-image: url(../images/close-b.svg); background-size: contain; background-repeat: no-repeat; background-position: center; width: 50px; height: 50px; position: absolute; right: 20px; top: 20px; z-index: 9999; cursor: pointer; }

.fancybox-navigation .fancybox-button--arrow_left { display: none; }
.fancybox-navigation .fancybox-navigation { display: block; }
.fancybox-navigation .fancybox-button--arrow_right { right: 10%; top: initial; bottom: 25%; width: 250px; display: flex; display: -webkit-flex; justify-content: flex-end; -webkit-justify-content: flex-end; align-items: center; -webkit-align-items: center; opacity: 1; }
@media (max-width: 890px) { .fancybox-navigation .fancybox-button--arrow_right { bottom: 17%; } }
.fancybox-navigation .fancybox-button--arrow_right:before { content: initial; }
.fancybox-navigation .fancybox-button--arrow_right span.icon { background-image: url("../images/Arrow.svg"); width: 15px; height: 27px; display: block; background-size: contain; background-repeat: no-repeat; background-position: center; }
.fancybox-navigation .fancybox-button--arrow_right span.text { padding-left: 20px; font-size: 14px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #822933; letter-spacing: 0.6px; line-height: 25px; text-transform: uppercase; }

/* === Header === */
header { position: relative; }
header .header-bar-top { position: relative; }
header .header-bar-top .header-bar-top-wrap { padding: 40px 0; position: relative; overflow: hidden; background-color: #FFFFFF; z-index: 99996; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
@media (max-width: 990px) { header .header-bar-top .header-bar-top-wrap { padding: 30px 0; } }
header .header-bar-top .header-bar-wrap { background-color: #FFFFFF; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
header .header-bar-top .header-bar-wrap .col-left { display: flex; display: -webkit-flex; justify-content: flex-start; -webkit-justify-content: flex-start; }
header .header-bar-top .header-bar-wrap .col-left > div { padding-right: 40px; }
@media (max-width: 680px) { header .header-bar-top .header-bar-wrap .col-left > div { padding-right: 20px; } }
header .header-bar-top .header-bar-wrap .col-left .logo-grid a#logo-mobile { display: none; }
@media (max-width: 640px) { header .header-bar-top .header-bar-wrap .col-left .logo-grid a#logo { display: none; }
  header .header-bar-top .header-bar-wrap .col-left .logo-grid a#logo-mobile { display: block; } }
@media (max-width: 1200px) { header .header-bar-top .header-bar-wrap .col-left .logo-grid a { width: 200px; display: block; } }
@media (max-width: 990px) { header .header-bar-top .header-bar-wrap .col-left .logo-grid a { width: 150px; } }
header .header-bar-top .header-bar-wrap .col-left .lang-grid { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; padding: 0 40px; position: relative; }
@media (max-width: 990px) { header .header-bar-top .header-bar-wrap .col-left .lang-grid { display: none; } }
@media (max-width: 680px) { header .header-bar-top .header-bar-wrap .col-left .lang-grid { display: none; } }
header .header-bar-top .header-bar-wrap .col-left .lang-grid .icon { background-image: url("../images/grid-world.svg"); width: 20px; height: 20px; display: block; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid .ccm-block-switch-language-text .language-switch span.ccm-block-switch-language-active-flag i.flag, header .header-bar-top .header-bar-wrap .col-left .lang-grid ul li a i.flag { width: 20px; height: 20px; position: absolute; left: 0; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid .ccm-block-switch-language-text .language-switch { display: flex; display: -webkit-flex; justify-content: flex-end; -webkit-justify-content: flex-end; align-items: center; -webkit-align-items: center; padding-right: 20px; position: relative; cursor: pointer; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid .ccm-block-switch-language-text .language-switch span { display: none; font-size: 14px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid .ccm-block-switch-language-text .language-switch span.ccm-block-switch-language-active-flag { display: block; padding-left: 30px; position: relative; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid .ccm-block-switch-language-text .language-switch:after { content: ''; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #245d88; position: absolute; right: 0; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid .ccm-block-switch-language-text ul { position: absolute; display: none; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid .ccm-block-switch-language-text ul li.active { display: none; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid ul { list-style: none; margin: 0; padding: 10px 0 0 10px; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid ul li a { font-size: 14px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; padding-left: 20px; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid:before, header .header-bar-top .header-bar-wrap .col-left .lang-grid:after { content: ''; width: 1px; height: 40px; background-color: #DADADA; position: absolute; }
@media (max-width: 990px) { header .header-bar-top .header-bar-wrap .col-left .lang-grid:before, header .header-bar-top .header-bar-wrap .col-left .lang-grid:after { height: 20px; } }
header .header-bar-top .header-bar-wrap .col-left .lang-grid:before { left: 0; }
header .header-bar-top .header-bar-wrap .col-left .lang-grid:after { right: 0; }
header .header-bar-top .header-bar-wrap .col-left .search-grid { padding: 0; padding-left: 30px; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; }
@media (max-width: 990px) { header .header-bar-top .header-bar-wrap .col-left .search-grid { padding-left: 20px; border-left: 1px solid #dcdcdc; } }
@media (max-width: 680px) { header .header-bar-top .header-bar-wrap .col-left .search-grid { display: none; } }
header .header-bar-top .header-bar-wrap .col-left .search-grid .icon { background-image: url("../images/Search.svg"); width: 11px; height: 11px; display: block; }
header .header-bar-top .header-bar-wrap .col-left .search-grid .text { padding-left: 10px; }
header .header-bar-top .header-bar-wrap .col-left .search-grid .form-search button { background-color: none; color: #9295a7; border: none; }
header .header-bar-top .header-bar-wrap .col-left .search-grid .form-search input { border: none; color: #000; border-bottom: 1px solid transparent; }
header .header-bar-top .header-bar-wrap .col-left .search-grid .form-search input:focus { outline: none; border: none; box-shadow: none; border-bottom: 1px solid #eee; }
header .header-bar-top .header-bar-wrap .col-left .search-grid .form-search ::-webkit-input-placeholder { color: #9295a7; }
header .header-bar-top .header-bar-wrap .col-left .search-grid .form-search :-moz-placeholder { color: #9295a7; }
header .header-bar-top .header-bar-wrap .col-left .search-grid .form-search ::-moz-placeholder { color: #9295a7; }
header .header-bar-top .header-bar-wrap .col-left .search-grid .form-search :-ms-input-placeholder { color: #9295a7; }
header .header-bar-top .header-bar-wrap .col-right { display: flex; display: -webkit-flex; justify-content: flex-end; -webkit-justify-content: flex-end; align-items: center; -webkit-align-items: center; }
header .header-bar-top .header-bar-wrap .col-right .contact-grid { padding-right: 20px; margin-right: 20px; position: relative; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; }
@media (max-width: 890px) { header .header-bar-top .header-bar-wrap .col-right .contact-grid { display: none; } }
header .header-bar-top .header-bar-wrap .col-right .contact-grid p, header .header-bar-top .header-bar-wrap .col-right .contact-grid a { color: #005382; margin: 0; }
header .header-bar-top .header-bar-wrap .col-right .contact-grid:after { content: ''; width: 1px; height: 40px; background-color: #DADADA; position: absolute; right: 0; }
header .header-bar-top .header-bar-wrap .col-right .menu-icon { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; }
header .header-bar-top .header-bar-wrap .col-right .menu-icon .icon { position: relative; width: 25px; height: 3px; background-color: #005382; cursor: pointer; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
header .header-bar-top .header-bar-wrap .col-right .menu-icon .icon:before, header .header-bar-top .header-bar-wrap .col-right .menu-icon .icon:after { content: ''; width: 100%; height: 100%; background-color: #005382; border-radius: 3px; position: absolute; right: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
header .header-bar-top .header-bar-wrap .col-right .menu-icon .icon:before { top: -6px; }
header .header-bar-top .header-bar-wrap .col-right .menu-icon .icon:after { top: 6px; }
header .header-bar-top .header-bar-wrap .col-right .menu-icon .text { font-size: 14px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #000000; text-transform: uppercase; padding-left: 10px; }
header .header-bar-top .header-bar-wrap .col-right .menu-icon.active .icon { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -ms-transform: rotate(-90deg); }
header .header-bar-top .menu-bar-main { background-color: #005480; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; position: absolute; visibility: hidden; width: 100%; z-index: 9999; }
@media (min-width: 991px) { header .header-bar-top .menu-bar-main { -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); -ms-transform: translateY(-100%); } }
@media (max-width: 990px) { header .header-bar-top .menu-bar-main { -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); -ms-transform: translateX(100%); position: fixed; top: 86px; right: 0; width: 350px; height: 100%; overflow: auto; } }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap { padding: 40px 10%; }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .lang-grid .language-switch { display: none; }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .lang-grid ul { display: flex; list-style: none; padding: 0; margin: 0 0 30px; }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .lang-grid ul li { -webkit-flex-basis: 50%; flex-basis: 50%; text-align: center; }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .lang-grid ul li a { display: block; padding: 5px 0; background-color: #FFF; font-size: 14px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #005382; letter-spacing: 1.5px; text-transform: uppercase; border: 1px solid #FFF; }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .lang-grid ul li a.ccm-block-switch-language-active-flag { background-color: transparent; color: #FFF; }
@media (min-width: 991px) { header .header-bar-top .menu-bar-main .menu-bar-main-wrap .lang-grid { display: none; } }
@media (max-width: 1779px) { header .header-bar-top .menu-bar-main .menu-bar-main-wrap { padding: 40px 5%; } }
@media (max-width: 1440px) { header .header-bar-top .menu-bar-main .menu-bar-main-wrap { padding: 40px 50px; } }
@media (max-width: 990px) { header .header-bar-top .menu-bar-main .menu-bar-main-wrap { padding: 30px; max-height: 100%; overflow: auto; padding-bottom: 100px; } }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap > ul { list-style: none; padding: 0; margin: 0; display: flex; display: -webkit-flex; flex-wrap: wrap; justify-content: flex-start; -webkit-justify-content: flex-start; }
@media (max-width: 990px) { header .header-bar-top .menu-bar-main .menu-bar-main-wrap > ul { flex-direction: column; } }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap > ul > li { -webkit-flex-basis: 20%; flex-basis: 20%; flex: 0 0 20%; padding-bottom: 40px; opacity: 0; -webkit-transform: translateY(80px); -moz-transform: translateY(80px); -o-transform: translateY(80px); transform: translateY(80px); -ms-transform: translateY(80px); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; }
@media (max-width: 990px) { header .header-bar-top .menu-bar-main .menu-bar-main-wrap > ul > li { padding-bottom: 20px; } }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap > ul > li > a { padding: 0 0 30px 0; display: block; font-size: 12px; font-family: "HelveticaBold", "KanitMedium", Arial, sans-serif; color: #FFFFFF; letter-spacing: 1.5px; text-transform: uppercase; }
@media (max-width: 990px) { header .header-bar-top .menu-bar-main .menu-bar-main-wrap > ul > li > a { padding: 0 0 5px 0; } }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .sub-menu { list-style: none; padding: 0; margin: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .sub-menu li { display: block; }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .sub-menu li a { font-size: 12px; font-family: "Helvetica", "Kanit", Arial, sans-serif; color: #FFFFFF; letter-spacing: 1px; line-height: 22px; opacity: 0.56; }
header .header-bar-top .menu-bar-main .menu-bar-main-wrap .sub-menu li a:hover, header .header-bar-top .menu-bar-main .menu-bar-main-wrap .sub-menu li a.nav-selected, header .header-bar-top .menu-bar-main .menu-bar-main-wrap .sub-menu li a.nav-path-selected { color: #951B1E; opacity: 1; }
header .header-bar-top .menu-bar-main.active { visibility: visible; }
@media (min-width: 991px) { header .header-bar-top .menu-bar-main.active { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); -ms-transform: translateY(0%); } }
@media (max-width: 990px) { header .header-bar-top .menu-bar-main.active { -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); -ms-transform: translateX(0%); } }
header .header-bar-top .menu-bar-main.active .menu-bar-main-wrap > ul > li { opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); -ms-transform: translateY(0px); }
header .header-bar-top .menu-bar-sub { position: absolute; left: 0; width: 100%; background-color: rgba(0, 0, 0, 0.4); z-index: 999; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
@media (max-width: 990px) { header .header-bar-top .menu-bar-sub { -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); -ms-transform: translateY(-100%); display: none; } }
header .header-bar-top .menu-bar-sub .menu-icon-sub span { position: relative; width: 25px; height: 3px; background-color: #005382; cursor: pointer; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
header .header-bar-top .menu-bar-sub .menu-icon-sub span:before, header .header-bar-top .menu-bar-sub .menu-icon-sub span:after { content: ''; width: 100%; height: 100%; background-color: #005382; border-radius: 3px; position: absolute; right: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
header .header-bar-top .menu-bar-sub .menu-icon-sub span:before { top: -6px; }
header .header-bar-top .menu-bar-sub .menu-icon-sub span:after { top: 6px; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap { padding: 0 10%; }
@media (max-width: 1779px) { header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap { padding: 0 13% 0 8%; } }
@media (max-width: 1440px) { header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap { padding: 0 13% 0 50px; } }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap > ul { padding: 0; margin: 0; list-style: none; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li { position: relative; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu { display: none; padding: 10px 20px 20px; margin: 0; list-style: none; position: absolute; width: 250px; top: 75px; background-color: rgba(0, 0, 0, 0.4); }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu a { display: inline-block; position: relative; padding: 0; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu a:after { content: ''; width: 0; height: 2px; background-color: #942d29; position: absolute; left: 0; bottom: 2px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu a:hover, header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu a.nav-selected, header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu a.nav-path-selected { color: #FFFFFF; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu a:hover:after, header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu a.nav-selected:after, header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu a.nav-path-selected:after { width: 30px; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li.show-sub > a { padding-right: 30px; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li.show-sub > a:after { content: ''; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #FFFFFF; position: absolute; right: 0; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li.show-sub .sub-menu { opacity: 0; visibility: hidden; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; display: block; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li.show-sub:hover .sub-menu { opacity: 1; visibility: visible; }
header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap a { font-size: 12px; font-family: "Helvetica", "Kanit", Arial, sans-serif; color: #E5E5E5; letter-spacing: 1.5px; text-transform: uppercase; padding: 0; padding-top: 25px; padding-bottom: 25px; }
header .header-bar-top .menu-bar-sub .phone-icon { position: absolute; right: 0; top: 0; padding: 0 30px; height: 100%; background-color: #951B1E; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; flex-direction: column; }
header .header-bar-top .menu-bar-sub .phone-icon .icon { background-image: url(../images/icon-phone.svg); width: 27px; height: 35px; display: block; }
header .header-bar-top .menu-bar-sub .phone-icon .text { padding-top: 5px; }
header .header-bar-top .menu-bar-sub .phone-icon .text p, header .header-bar-top .menu-bar-sub .phone-icon .text a { margin: 0; font-size: 12px; font-family: "Helvetica", "Kanit", Arial, sans-serif; color: #FFFFFF; line-height: 17px; }
@media (max-width: 990px) { header.shrink .header-bar-top .header-bar-top-wrap { padding: 20px 0; position: fixed; top: 0; left: 0; width: 100%; -webkit-box-shadow: 0px 1px 1px #f1f1f1; -moz-box-shadow: 0px 1px 1px #f1f1f1; box-shadow: 0px 1px 1px #f1f1f1; }
  header.shrink .header-bar-top .menu-bar-main { top: 66px; } }
header.shrink .header-bar-top .menu-bar-sub { position: fixed; top: 0; background-color: rgba(0, 0, 0, 0.8); }
.u-login header.shrink .header-bar-top .menu-bar-sub { top: 48px; }
header.shrink .header-bar-top .menu-bar-sub .menu-bar-sub-wrap li .sub-menu { background-color: rgba(0, 0, 0, 0.8); top: 65px; }
header.shrink .header-bar-top .menu-bar-sub .menu-bar-sub-wrap a { padding-top: 20px; padding-bottom: 20px; }

.edit header .header-bar-top { z-index: initial; }
.edit header .header-bar-top .header-bar-top-wrap { z-index: initial; }
.edit header .header-bar-top .menu-bar-sub { position: relative; }
.edit header .header-bar-top .phone-icon { position: relative; top: auto; right: auto; }

/*Footer*/
footer { background-color: #005382; }
footer .footer { padding: 50px 10% 3%; }
@media (max-width: 1779px) { footer .footer { padding: 50px 8% 3%; } }
@media (max-width: 1440px) { footer .footer { padding: 50px 50px 3%; } }
@media (max-width: 890px) { footer .footer { padding: 50px 5% 3%; } }
footer .footer .footer-top { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: flex-start; -webkit-align-items: flex-start; }
@media (max-width: 850px) { footer .footer .footer-top { flex-wrap: wrap; } }
footer .footer .footer-top .col-left { -webkit-flex-basis: 50%; flex-basis: 50%; }
@media (max-width: 850px) { footer .footer .footer-top .col-left { -webkit-flex-basis: 100%; flex-basis: 100%; } }
footer .footer .footer-top .col-left > p { color: #FFFFFF; letter-spacing: 1px; line-height: 22px; text-transform: uppercase; margin-bottom: 20px; }
footer .footer .footer-top .col-left p { color: #FFFFFF; }
footer .footer .footer-top .col-left table td { padding-right: 80px; }
@media (max-width: 1440px) { footer .footer .footer-top .col-left table td { padding-right: 40px; } }
@media (max-width: 1200px) { footer .footer .footer-top .col-left table td { padding-right: 0; width: 100%; display: block; } }
footer .footer .footer-top .col-left table td p { line-height: 22px; color: #FFFFFF; letter-spacing: 1px; line-height: 22px; }
footer .footer .footer-top .col-right { display: flex; display: -webkit-flex; justify-content: flex-end; -webkit-justify-content: flex-end; -webkit-flex-basis: 30%; flex-basis: 30%; }
@media (max-width: 1440px) { footer .footer .footer-top .col-right { -webkit-flex-basis: 40%; flex-basis: 40%; } }
@media (max-width: 1100px) { footer .footer .footer-top .col-right { -webkit-flex-basis: 50%; flex-basis: 50%; } }
@media (max-width: 850px) { footer .footer .footer-top .col-right { -webkit-flex-basis: 100%; flex-basis: 100%; margin-top: 20px; } }
footer .footer .footer-top .col-right .col { padding: 0; padding-left: 50px; }
@media (max-width: 850px) { footer .footer .footer-top .col-right .col { padding-left: 0; padding-right: 20px; } }
footer .footer .footer-top .col-right .col > p { color: #FFFFFF; letter-spacing: 1px; line-height: 22px; text-transform: uppercase; margin-bottom: 20px; }
footer .footer .footer-top .col-right .col a { color: #FFFFFF; letter-spacing: 1px; line-height: 22px; }
footer .footer .footer-top .col-right .col ul { list-style: none; padding: 0; margin: 0; }
footer .footer .footer-bottom { padding-top: 80px; }
@media (max-width: 640px) { footer .footer .footer-bottom { padding-top: 50px; } }
footer .footer .footer-bottom a { color: #FFFFFF; letter-spacing: 1.5px; }
footer .footer .footer-bottom .row-top { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
@media (max-width: 990px) { footer .footer .footer-bottom .row-top { flex-direction: column; } }
footer .footer .footer-bottom .row-top .col-left .menu ul { list-style: none; padding: 0; margin: 0; display: flex; display: -webkit-flex; }
@media (max-width: 990px) { footer .footer .footer-bottom .row-top .col-left .menu ul { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; } }
@media (max-width: 640px) { footer .footer .footer-bottom .row-top .col-left .menu ul { flex-direction: column; align-items: center; } }
footer .footer .footer-bottom .row-top .col-left .menu ul li { padding-right: 80px; }
@media (max-width: 1279px) { footer .footer .footer-bottom .row-top .col-left .menu ul li { padding-right: 20px; } }
@media (max-width: 640px) { footer .footer .footer-bottom .row-top .col-left .menu ul li { padding-right: 0; padding: 10px 0; } }
footer .footer .footer-bottom .row-top .col-right { /* == Social == */ }
footer .footer .footer-bottom .row-bottom { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-flow: row-reverse; padding-top: 20px; margin-top: 20px; border-top: 1px solid #979797; }
@media (max-width: 1279px) { footer .footer .footer-bottom .row-bottom { flex-direction: column; justify-content: center; } }
@media (max-width: 1279px) { footer .footer .footer-bottom .row-bottom .copyright { text-align: center; margin-top: 10px; } }
@media (max-width: 640px) { footer .footer .footer-bottom .row-bottom .copyright { margin-top: 20px; } }
footer .footer .footer-bottom .row-bottom .copyright p { color: #FFFFFF; letter-spacing: 1.5px; }
@media (max-width: 1279px) { footer .footer .footer-bottom .row-bottom .menu-bottom { text-align: center; } }
footer .footer .footer-bottom .row-bottom .menu-bottom ul { padding: 0; margin: 0; list-style: none; display: flex; display: -webkit-flex; }
@media (max-width: 1279px) { footer .footer .footer-bottom .row-bottom .menu-bottom ul { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; } }
footer .footer .footer-bottom .row-bottom .menu-bottom ul li { padding-left: 20px; }
@media (max-width: 1279px) { footer .footer .footer-bottom .row-bottom .menu-bottom ul li { padding: 0 10px; } }

@media (max-width: 990px) { .social { margin-top: 20px; } }
.social ul { list-style: none; padding: 0; margin: 0; display: flex; display: -webkit-flex; }
@media (max-width: 990px) { .social ul { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; } }
.social ul li { padding-left: 30px; }
.social ul li a { font-size: 18px; }
.social ul li a i { background-size: contain; background-repeat: no-repeat; background-position: center; }
.social ul li a i.fa-message { background-image: url(../images/FM.svg); width: 20px; height: 21px; display: block; }
.social ul li a i.fa-line { background-image: url(../images/line.svg); width: 26px; height: 24px; display: block; }

.social-fix { position: fixed; bottom: 50px; right: 35px; z-index: 99; }
@media (max-width: 640px) { .social-fix { display: none; } }
.social-fix .social ul { flex-direction: column; align-items: center; }
.social-fix .social ul li { padding-left: 0; margin-bottom: 10px; }
.social-fix .social ul li a { width: 35px; height: 35px; display: block; text-align: center; background-color: #FFF; border-radius: 100%; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.05); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
.social-fix .social ul li a i { color: #000; font-size: 15px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -ms-transition: all 0.3s; }
.social-fix .social ul li a i.fa-message { background-image: url(../images/social/ms-icon.svg); width: 20px; height: 21px; }
.social-fix .social ul li a i.fa-line { background-image: url(../images/social/line-icon.svg); width: 26px; height: 24px; }
.social-fix .social ul li a:hover { background-color: #951B1E; }
.social-fix .social ul li a:hover i { color: #FFF; }
.social-fix .social ul li a:hover i.fa-message { background-image: url(../images/social/ms-icon-wh.svg); }
.social-fix .social ul li a:hover i.fa-line { background-image: url(../images/social/line-icon-wh.svg); }

/* == Language == */
.page_th header .header-bar-top .menu-bar-main .menu-bar-main-wrap > ul > li:first-child { display: none; }
.page_th header .header-bar-top .menu-bar-sub .menu-bar-sub-wrap > ul > li:first-child { display: none; }

/*# sourceMappingURL=global.css.map */