/**reset css**/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
body {
  line-height: 1;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
nav ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: none;
}
a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}
input,
select {
  vertical-align: middle;
}

/**font-face**/
@font-face {
  font-family: "sarabun-light";
  src: url("../font/sarabun-light.eot");
  src: url("../font/sarabun-light.eot?#iefix") format("embedded-opentype"),
    url("../font/sarabun-light.woff2") format("woff2"),
    url("../font/sarabun-light.woff") format("woff"),
    url("../font/sarabun-light.ttf") format("truetype"),
    url("../font/sarabun-light.svg#sarabun-light") format("svg");
}

@font-face {
  font-family: "sarabun-lightitalic";
  src: url("../font/sarabun-lightitalic.eot");
  src: url("../font/sarabun-lightitalic.eot?#iefix") format("embedded-opentype"),
    url("../font/sarabun-lightitalic.woff2") format("woff2"),
    url("../font/sarabun-lightitalic.woff") format("woff"),
    url("../font/sarabun-lightitalic.ttf") format("truetype"),
    url("../font/sarabun-lightitalic.svg#sarabun-light") format("svg");
}

@font-face {
  font-family: "sarabun-regular";
  src: url("../font/sarabun-regular.eot");
  src: url("../font/sarabun-regular.eot?#iefix") format("embedded-opentype"),
    url("../font/sarabun-regular.woff2") format("woff2"),
    url("../font/sarabun-regular.woff") format("woff"),
    url("../font/sarabun-regular.ttf") format("truetype"),
    url("../font/sarabun-regular.svg#sarabun-light") format("svg");
}

@font-face {
  font-family: "sarabun-regular";
  src: url("../font/sarabun-regular.eot");
  src: url("../font/sarabun-regular.eot?#iefix") format("embedded-opentype"),
    url("../font/sarabun-regular.woff2") format("woff2"),
    url("../font/sarabun-regular.woff") format("woff"),
    url("../font/sarabun-regular.ttf") format("truetype"),
    url("../font/sarabun-regular.svg#sarabun-regular") format("svg");
}

@font-face {
  font-family: "sarabun-bold";
  src: url("../font/sarabun-bold.eot");
  src: url("../font/sarabun-bold.eot?#iefix") format("embedded-opentype"),
    url("../font/sarabun-bold.woff2") format("woff2"),
    url("../font/sarabun-bold.woff") format("woff"),
    url("../font/sarabun-bold.ttf") format("truetype"),
    url("../font/sarabun-bold.svg#sarabun-bold") format("svg");
}

@font-face {
  font-family: "sarabun-semibold";
  src: url("../font/sarabun-semibold.eot");
  src: url("../font/sarabun-semibold.eot?#iefix") format("embedded-opentype"),
    url("../font/sarabun-semibold.woff2") format("woff2"),
    url("../font/sarabun-semibold.woff") format("woff"),
    url("../font/sarabun-semibold.ttf") format("truetype"),
    url("../font/sarabun-semibold.svg#sarabun-semibold") format("svg");
}

/***defult***/
* {
  outline: 0 !important;
}
body {
  font: 14px/24px "sarabun-light";
  color: #666666;
}
h1 {
}
h2 {
  font: 38px/38px "sarabun-bold";
  color: #0d89ce;
  text-transform: uppercase;
}
h3 {
  font: 19px/27px "sarabun-regular";
  color: #fff;
}
a,
a:hover,
a:focus {
  text-decoration: none;
}
img {
  max-width: 100%;
}
input,
.select,
textarea,
.fileContainer {
  width: 100%;
  height: 55px;
  border: 1px solid #cccccc;
  background-color: #fff;
  color: #333333;
  padding: 14px 17px;
  margin: 0 0 20px 0;
  font: 13px/23px "sarabun-light";
  color: #333333;
  position: relative;
}
input:focus,
textarea:focus {
  border-color: #0379c5;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  font: 13px/20px "sarabun-light";
  color: #333333;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
  font: 13px/20px "sarabun-light";
  color: #333333;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  font: 13px/20px "sarabun-light";
  color: #333333;
}
input:-moz-placeholder,
textarea:-moz-placeholder {
  font: 13px/20px "sarabun-light";
  color: #333333;
}
input[type="file"] {
  /* filter: alpha(opacity=0);
  opacity: 0;
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
  margin: 0; */
}
.fileContainer {
  cursor: pointer;
  word-wrap: break-word;
  overflow: hidden;
  position: relative;
  border: none;
  padding: 13px 25px 13px 70px;
  font: 12px/16px "sarabun-light";
  background-color: #0379c5;
  color: #fff;
}
.fileContainer:before {
  content: "";
  width: 22px;
  height: 30px;
  position: absolute;
  top: 12px;
  left: 27px;
  color: #fff;
}
.fileContainer i {
  position: absolute;
  top: 14px;
  left: 25px;
  font-size: 24px;
}
.fileContainer span {
  display: none;
}
.fileContainer .name-file {
  width: 136px;
  max-height: 31px;
  overflow: hidden;
  color: #fff !important;
}
.fileContainer_pic:before {
  content: "";
  width: 31px;
  height: 30px;
}
.fileContainer_pic i {
  font-size: 27px;
}

.select {
  border: none;
}
.select .select-hidden {
  display: none;
}
.select .select-styled {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 14px 17px;
  cursor: pointer;
  border: 1px solid #cccccc;
}
.select .icon-arrow-down:before {
  width: 18px;
  height: 18px;
  font-size: 8px;
  text-align: center;
  color: #fff;
  padding: 5px 0;
  position: absolute;
  right: 13px;
  top: 0;
  bottom: 0;
  margin: auto;
  background-color: #0066cc;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.select .select-styled:active,
.select .select-styled.active {
  border: 1px solid #0379c5;
}
.select .select-styled:active:before,
.select .select-styled.active:before {
  content: "\6f";
  padding: 4px 0;
}
.select .select-options {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 99;
  margin: 0;
  padding: 0;
  list-style: none;
}
.select .select-options li {
  border: 1px solid #cccccc;
  border-top: none;
  padding: 12px 0;
  cursor: pointer;
  margin: 0;
  text-indent: 15px;
  background-color: #fff;
}
.select .select-options li:last-child {
  border-top: none !important;
}
.select .select-options li[rel="hide"] {
  display: none;
}
.select .select-options li:hover {
  background-color: #0379c5;
  color: #fff;
  border-color: #0379c5;
}
.wrapper {
  margin-top: 88px;
  /* background-color: #f3f0f0;  */
}
.container_lg {
  width: 100% !important;
  padding: 0 15px;
}
.container_lg.clear-padding {
  padding: 0;
}
.content {
  position: relative;
}
.topic .line {
  width: 43px;
  height: 3px;
  background-color: #fff;
  margin: 12px 0 10px 0;
}
.txt_error {
  margin: -15px 0 20px 0;
  color: #fff;
  font: 11px/15px "sarabun-light";
  padding-top: 5px;
}
.error {
  border: 1px solid #f22323 !important;
}
.clear {
  clear: both;
}
.colum_input {
  padding: 0 40px;
}
.colum_input-sm {
  padding: 0 10px;
}
.colum_input .row {
  margin: 0 -10px;
}
.hideDesk {
  display: none !important;
}
.graphic_mb {
  display: none;
}
#googlemap {
  width: 600px;
  height: 400px;
  display: none;
}

/***preload***/
#jprePercentage {
  color: transparent;
}
[class*="loader"] {
  width: 2.5em;
  height: 2.5em;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: inline-block;
  margin: auto;
  cursor: wait;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.loader-blow-up:before {
  content: "";
  display: block;
  position: absolute;
  left: 0.75em;
  top: 0.75em;
  border-radius: 50%;
  background-color: #f4fafd;
  width: 1em;
  height: 1em;
  z-index: 1;
  -webkit-animation: blow-grow 4s infinite cubic-bezier(0.45, -0.43, 0.63, 1.94);
  animation: blow-grow 4s infinite cubic-bezier(0.45, -0.43, 0.63, 1.94);
}
.loader-blow-up:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.5rem;
  height: 0.5rem;
  z-index: 0;
  border-radius: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-animation: blow-fade-in 1s infinite
      cubic-bezier(0.45, -0.43, 0.63, 1.94),
    blow-shadow 1s infinite cubic-bezier(0.45, -0.43, 0.63, 1.94);
  animation: blow-fade-in 1s infinite cubic-bezier(0.45, -0.43, 0.63, 1.94),
    blow-shadow 1s infinite cubic-bezier(0.45, -0.43, 0.63, 1.94);
}
.wp_preload #sect {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  background: #3da1d8;
  font-size: 30px;
}

/***btn-style***/
.btn-style1 {
  width: 25px;
  height: 19px;
  overflow: hidden;
  color: #0082ca;
  display: block;
  font-size: 22px;
  position: relative;
}
.btn-style1 .icon_inner {
  width: 25px;
  height: 19px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.btn-style1 .icon_inner i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.btn-style2 {
  width: 55px;
  height: 100%;
  position: absolute;
  top: 0;
  cursor: pointer;
  color: #0282c1;
  overflow: hidden;
}
.btn-style2.prv_btn {
  left: -65px;
}
.btn-style2.nxt_btn {
  right: -65px;
}
.btn-style2 .icon-diamond-bg {
  width: 78px;
  height: 78px;
  font-size: 78px;
  color: #fff;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.btn-style2 .icon-diamond-sm,
.btn-style2 .icon_inner {
  width: 55px;
  height: 55px;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.btn-style2 .icon-diamond-sm {
  width: 54px;
  height: 54px;
  font-size: 54px;
}
.btn-style2 .icon_inner {
  overflow: hidden;
}
.btn-style2 .icon_inner {
  width: 14px;
  height: 12px;
  background: #fff;
  font-size: 13px;
}
.btn-style2 .icon_inner i {
  position: absolute;
  top: -3px;
  left: 0;
}

.btn-style3 {
  width: 87px;
  height: 87px;
  color: #fff !important;
  position: relative;
  margin: auto;
  z-index: 2;
  display: block;
}
.btn-style3 .icon-diamond-sm {
  width: 87px;
  height: 87px;
  font-size: 85px;
  position: absolute;
  top: 0;
  left: 0;
}
.btn-style3 .icon_inner {
  width: 17px;
  height: 22px;
  font-size: 21px;
  position: absolute;
  top: 30px;
  left: 38px;
  overflow: hidden;
}
.btn-style3 .icon_inner i {
  position: absolute;
  top: 0;
  left: 0;
}

.btn-style4 {
  width: 28px;
  height: 28px;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
}
.btn-style4 .icon-diamond-bg {
  width: 26px;
  height: 26px;
  font-size: 25px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.btn-style4 .icon-2 {
  width: 12px;
  height: 12px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.btn-style5 {
  width: 100%;
  height: 100%;
  background-color: #005888;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
  font: 13px/15px "sarabun-regular";
  padding: 15px;
  border: none;
}
.btn-style5:hover {
  background: #9cdcff;
  color: #0083cb;
}

.btn-style6 {
  width: 54px;
  height: 54px;
  overflow: hidden;
  color: #0082ca;
  font-size: 54px;
  position: relative;
  float: left;
  margin: 10px 8px 0 0;
  display: block;
}
.btn-style6 .icon-diamond-sm {
  width: 54px;
  height: 54px;
  position: absolute;
  top: 0;
  left: 0;
}
.btn-style6 .icon_inner {
  width: 20px;
  height: 22px;
  font-size: 19px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  overflow: hidden;
}
.btn-style6 .icon_inner i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.btn-style6 .icon_inner .icon-play2 {
  left: 3px;
  right: auto;
}

.btn-style7 {
  width: 50px;
  height: 100%;
  position: relative;
  color: #fff !important;
  display: block;
  float: left;
}
.btn-style7 .icon_inner {
  width: 17px;
  height: 13px;
  font-size: 16px;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  overflow: hidden;
}
.btn-style7 .icon_inner i {
  position: absolute;
  top: -3px;
  bottom: 0;
  right: 1px;
  margin: auto;
}

.icon-vdo {
  font-size: 64px;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.backPage_btn {
  width: 70px;
  height: 70px;
  font-size: 70px;
  background-color: #0379c5;
  color: #fff;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}
.backPage_btn:hover {
  background-color: rgba(13, 137, 206, 0.8) !important;
  color: #fff;
}
.backPage_btn i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.wp_knowledge .backPage_btn i {
  width: 100%;
  height: 100%;
  background: url("../image/icons/arrow_left_white.svg") 50% 50%/45% no-repeat;
  top: -3px;
  left: -6px;
}

/***template***/
.box-table {
  width: 100%;
  height: 100%;
}
.row-table {
  display: table;
  width: 100%;
  height: 100%;
}
.row-cell {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
}

.wp_slide {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  margin: auto;
}
.wp_slide img {
  width: 100%;
}
.wp_slide .box-slide {
  position: absolute;
  top: 0;
  left: 0;
}
.wp_slide .box-slide .item {
  float: left;
  overflow: hidden;
}

.graphic {
  overflow: hidden;
}
.graphic img {
  width: 100%;
  position: absolute;
  top: -6%;
  left: 0;
}
.graphic .graphic_bottom {
  bottom: -399px;
  top: auto;
}
.graphic .graphic_right {
  width: auto;
  top: 22%;
  bottom: 0;
  right: 0;
  left: auto;
  margin: auto;
}

.wp_breadcrumb {
  width: 100%;
  padding: 15px 10px;
  position: absolute;
  top: 0;
  left: 0;
}
.wp_breadcrumb ul li {
  list-style-type: none;
  display: inline-block;
  margin: 0 10px 0 0;
}
.wp_breadcrumb ul li span {
  display: inline-block;
  margin: 0 0 0 10px;
}
.wp_breadcrumb ul li,
.wp_breadcrumb ul li a {
  color: #fff;
  font: 12px/17px "sarabun-light";
}
.wp_breadcrumb ul li a:hover,
.wp_breadcrumb ul li a:focus {
  color: #9cdcff;
}

.wp_breadcrumb.color_gray ul li,
.wp_breadcrumb.color_gray ul li a {
  color: #666;
}

.box-headTopic {
  width: 50%;
  padding: 140px 0 110px 60px;
  color: #fff;
  font: 14px/20px "sarabun-light";
}
.box-headTopic h1 {
  font-size: 53px;
  text-align: left;
  margin: 0 0 20px 0;
}
.box-headTopic .line {
  width: 49px;
  height: 3px;
  background-color: #fff;
  margin: 0 0 24px 0;
}
.box-headTopic .text {
  height: auto;
  max-height: 80px;
  font-size: 13px;
  overflow: hidden;
  padding: 0 55px 0 0;
}

.box-headTopic.light_style {
  color: #666;
}
.box-headTopic.light_style h1 {
  color: #0083cb;
}
.box-headTopic.light_style .line {
  background-color: #0083cb;
}

.box-paging {
  width: 100%;
  padding: 0 0 0 319px;
  margin: 58px 0 0 0;
}
.paging {
  height: 43px;
  text-align: center;
}
.paging a {
  height: 100%;
  color: #0083cb;
  font: 13px/16px "sarabun-regular";
  display: inline-block !important;
  padding: 13px 0;
}
.paging a span {
  display: inline-block;
  margin: 0 10px 0 0;
}
.paging a.next_btn span {
  margin: 0 0 0 10px;
}
.paging .back_btn:hover,
.paging a.next_btn:hover {
  color: #9cdcff;
}
.paging .page {
  height: 100%;
  display: inline-block;
  padding: 13px 58px;
}
.paging .page a {
  font: 13px/16px "sarabun-light";
  padding: 0 19px;
  position: relative;
}
.paging .page a:hover,
.paging .page a:focus,
.paging .page a.active {
  color: #fff;
}
.paging .page a.active {
  margin: 0 10px;
}
.paging .page a span {
  position: relative;
  z-index: 2;
  margin: 0;
  display: inline;
}
.paging .page a i {
  width: 43px;
  height: 43px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  margin-top: -14.5px;
  font-size: 43px;
  opacity: 0;
}
.paging .page a:hover i,
.paging .page a:focus i,
.paging .page a.active i {
  opacity: 1;
  color: #0083cb;
}
.paging .page a.point {
  font: 25px/16px "sarabun-light";
  padding: 0;
  color: #0083cb !important;
}

.wp_detail .box-detail {
  width: 100%;
  padding: 0;
  background-color: #fff;
  margin: 0 0 100px 0;
}
.wp_detail .box-detail .topic {
  margin: 0 0 35px 0;
  position: relative;
}
.wp_detail .box-detail .date_detail {
  font: 26px/30px "sarabun-light";
  color: #333333;
  margin: 0 0 20px 0;
  padding: 20px 0 0 0;
}
.wp_detail .box-detail .topic .box_head {
  position: relative;
  padding: 0 145px 0 0;
}
.wp_detail .box-detail .topic h2 {
  font: 23px/32px "sarabun-light";
  text-transform: none;
}
.wp_detail .box-detail .topic .social {
}
.wp_detail .box-detail .topic .social span {
  display: block;
  font: 12px/17px "sarabun-regular";
  color: #333333;
  margin: 0 0 5px 0;
}
.wp_detail .box-detail .topic .social a {
  display: block;
  width: 25px;
  height: 25px;
  float: left;
  margin: 0 2.5px;
  background: url(../image/tw.png) 0 0 no-repeat;
}
.wp_detail .box-detail .topic .social a.fb_btn {
  background: url(../image/fb.png) 0 0 no-repeat;
}
.wp_detail .box-detail .topic .social a.in_btn {
  background: url(../image/in.png) 0 0 no-repeat;
}
.wp_detail .box-detail .topic .social a.mail_btn {
  background: url(../image/mail.png) 0 0 no-repeat;
}
.wp_detail .box-detail .topic .backPage_btn {
  width: 58px;
  height: 58px;
  font-size: 67px;
  background-color: #0083cb;
  top: 7px;
  left: -80px;
}
.wp_detail .box-detail .topic .backPage_btn i {
  top: -3px;
  left: -6px;
  width: 100%;
  height: 100%;
  background: url(../image/icons/arrow_left_white.svg) 50% 50%/45% no-repeat;
}
.wp_detail .box-detail .detail {
  line-height: 30px;
  font-size: 16px !important;
} /* ปุ้ยแก้ อันเก่า line-height:24px;*/
.wp_detail .box-vdo {
  width: calc(100% + 264px);
  height: 540px;
  position: relative;
  margin: 50px 0 0 -132px;
  -webkit-box-shadow: 0px 6px 13px 0px rgba(0, 0, 0, 0.23);
  -moz-box-shadow: 0px 6px 13px 0px rgba(0, 0, 0, 0.23);
  box-shadow: 0px 6px 13px 0px rgba(0, 0, 0, 0.23);
  line-height: 0;
}
.wp_detail .box-vdo iframe {
  width: 100%;
  height: 100%;
}
.wp_detail .box-vdo .poster {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-repeat: no-repeat;
}
.wp_detail .box-vdo .poster img {
  width: 100%;
}
.wp_detail .box-vdo .poster .btn-style3 {
  width: 90px;
  height: 90px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.wp_detail .box-vdo .poster .btn-style3 .icon-vdo {
  font-size: 90px;
}
.wp_detail .wp_gallery {
  margin: 80px 0 0 0;
  text-align: center;
}
.wp_detail .wp_gallery h2 {
  font: 38px/44px "sarabun-regular";
  margin: 0 0 36px 0;
}
.wp_detail .wp_gallery .box-gallery {
  position: relative;
  margin: 0 -30px;
}
.wp_detail .wp_gallery .box-gallery .item {
  display: block;
  line-height: 0;
}
.wp_detail .wp_gallery .box-gallery .item div {
  padding: 0 7px;
}
.wp_detail .wp_gallery .box-gallery .btn-style2 {
  width: 78px;
}
.wp_detail .wp_gallery .box-gallery .btn-style2.prv_btn {
  left: -89px;
}
.wp_detail .wp_gallery .box-gallery .btn-style2.nxt_btn {
  right: -89px;
}
.wp_detail .box-relate h2 {
  font: 38px/44px "sarabun-regular";
  margin: 0 0 36px 0;
  text-align: center;
}
.wp_detail .box-relate h2 span {
  color: #333333;
}

.wp_formProduct {
  max-width: 700px;
  padding: 0 25px;
}
.wp_formProduct input,
.wp_formProduct .select,
.wp_formProduct textarea,
.wp_formProduct .fileContainer {
  height: 50px;
}
.wp_formProduct h2 {
  font: 28px/28px "sarabun-regular";
  margin: 10px 0 25px 0;
}
.wp_formProduct input,
.wp_formProduct .select,
.wp_formProduct textarea,
.wp_formProduct .fileContainer {
  margin: 0 0 10px 0;
}
.wp_formProduct textarea {
  height: 105px;
}
.wp_formProduct button {
  width: 100%;
  padding: 15px;
  margin: 0;
  background-color: #0378c5;
  color: #fff;
  border: none;
  text-align: center;
  text-transform: uppercase;
}
.wp_formProduct .txt_error {
  color: #f22323;
  text-align: right;
  font-style: italic;
}
.wp_formProduct .name_product {
  width: 100%;
  height: 50px;
  border: 1px solid #cccccc;
  background-color: #fff;
  color: #333333;
  padding: 14px 17px;
  margin: 0 0 10px 0;
  font: 13px/23px "sarabun-light";
  color: #333333;
  position: relative;
}

.wp_formDownload {
  max-width: 100%;
  width: 500px;
  padding: 0 25px;
}
.wp_formDownload h2 {
  font: 28px/28px "sarabun-regular";
  margin: 10px 0 25px 0;
}
.wp_formDownload input,
.wp_formDownload .fileContainer {
  height: 50px;
}
.wp_formDownload input,
.wp_formDownload .fileContainer {
  margin: 0 0 10px 0;
}
.wp_formDownload button {
  width: 140px;
  padding: 15px;
  margin: 10px auto 20px auto;
  display: block;
  background-color: #0378c5;
  color: #fff;
  border: none;
  text-align: center;
  text-transform: uppercase;
}
.wp_formDownload .txt_error {
  color: #f22323;
  text-align: center;
  font-style: italic;
  margin: 15px 0 5px 0;
}

/*****start content*****/
/***index page***/
.wp_index {
  background-color: #fff;
  padding: 0 0 60px 0;
}
.wp_index .main-banner {
  width: 100%;
  height: 100vh;
  position: relative;
  overflow: hidden;
  top: -88px;
  margin-bottom: -88px;
}
.wp_index .main-banner .wp_slide {
  height: 100% !important;
}
.wp_index .main-banner .box-slide {
  width: 20000px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.wp_index .main-banner .box-slide .item {
  width: calc(100vw - 17px);
  height: 100%;
  position: relative;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
}
.wp_index .main-banner .box-slide .item .box-vdo {
  width: 100%;
  height: 100%;
  position: relative;
}
.wp_index .main-banner .box-slide .item .box-vdo video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.wp_index .main-banner .box-slide .item .overlay_bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.2);
}
.wp_index .main-banner .box-slide .item .caption {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  text-align: center;
}
.wp_index .main-banner .box-slide .item .caption .text {
  max-width: 800px;
  padding: 35px;
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 30px;
  color: #fff;
  overflow: hidden;
  text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.28);
  font: 63px/58px "sarabun-semibold";
  text-transform: uppercase;
  background: rgba(0, 0, 0, 0.5);
}
.wp_index .main-banner .btn-style2 {
  z-index: 3;
  color: #fff;
}
.wp_index .main-banner .btn-style2.prv_btn {
  left: 20px;
}
.wp_index .main-banner .btn-style2.nxt_btn {
  left: auto;
  right: 20px;
}
.wp_index .main-banner .btn-style2 .icon_inner {
  background: transparent;
}

.wp_index .product-group {
  background: url(../image/index/graphic.jpg) center 0px repeat;
  padding: 21px 0;
  overflow: hidden;
  color: #fff;
}
.wp_index .product-group .box-title {
  overflow: hidden;
}
.wp_index .product-group .box-title h2 {
  color: #fff;
}
.wp_index .product-group .box-title .detail {
  height: 40px;
  overflow: hidden;
  font: 13px/18px "sarabun-light";
}
.wp_index .product-group .item-menu {
  overflow: hidden;
}
.wp_index .product-group .box-menu {
  text-align: center;
  display: block;
  color: #fff;
  text-decoration: none;
}
.wp_index .product-group .box-menu i {
  text-shadow: 0px 5px 0px rgba(0, 0, 0, 0.19);
  font-size: 84px;
}
.wp_index .product-group .box-menu i.noneshadow {
  text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.19);
}
.wp_index .product-group .box-menu i.lgshadow {
  text-shadow: 0px 10px 0px rgba(0, 0, 0, 0.19);
}
.wp_index .product-group .box-menu .icon-measuning {
  margin-left: 18px;
}
.wp_index .product-group .box-menu .title-menu {
  margin: 0 auto;
  display: block;
  font: 15px/20px "sarabun-regular";
  text-transform: uppercase;
}
.wp_index .product-group .box-menu .title-menu span {
  display: block;
}

.wp_index .product-heighlight {
  position: relative;
}
.wp_index .product-heighlight .box-img .wp_slide .box-slide .item {
  width: 100%;
  margin-top: 0;
  line-height: 0;
  position: relative;
}
.wp_index .product-heighlight .box-img .wp_slide .box-slide .item.active {
  margin-top: 0;
}
/* .wp_index .product-heighlight .box-img .wp_slide .overlay { width:100%; height:74px; position:absolute; bottom:0; left:0; background-color:rgba(0,131,203,0.7); } */

.wp_index .product-heighlight .box-order {
  width: 39%;
  height: 100%;
  position: relative;
  background-color: #fff;
  position: absolute;
  right: 0;
  top: 0;
  padding: 50px 30px;
  z-index: 13;
}
.wp_index .product-heighlight .box-order::after {
  content: "";
  display: block;
  width: 100%;
  height: 200px;
  background: url(../image/index/bg_slidelight.jpg) 0 bottom no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  position: absolute;
  bottom: 0;
  left: 0;
}
.wp_index .product-heighlight .box-order h2 a {
  background: url("../image/index/btn-box-order.png") 100% 50% no-repeat;
  position: relative;
  padding: 0 50px 3px 0;
  font-size: 33px;
  color: #0d89ce;
}
.wp_index .product-heighlight .box-order h2 a::after {
  content: "";
  width: 60px;
  height: 3px;
  display: block;
  background-color: #0d89ce;
  position: absolute;
  left: 0;
  bottom: -5px;
}

.wp_index .product-heighlight .box-order .order {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  margin-top: 15px;
  position: relative;
  z-index: 2;
}
.wp_index .product-heighlight .box-order .order .item {
  width: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  margin-top: 20px;
  cursor: pointer;
}
.wp_index .product-heighlight .box-order .order .item.active {
  display: none;
}

.wp_index .product-heighlight .box-order .order .item .img {
  min-width: 150px;
  margin-right: 22px;
}
.wp_index .product-heighlight .box-order .order .item .img img {
  width: 100%;
  display: block;
}
.wp_index .product-heighlight .box-order .order .item h3 {
  font-size: 16px;
  color: #0d89ce;
}
.wp_index .product-heighlight .box-order .order .item p {
  font-size: 12px;
  color: #666;
  max-height: 50px;
  overflow: hidden;
}

.wp_index .product-heighlight .box-detail {
  width: 61%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  background-color: rgba(255, 255, 255, 0.9);
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 0 0 0 40px;
}
.wp_index .product-heighlight .box-detail .order {
  margin: 25px 0;
  overflow: hidden;
}
.wp_index .product-heighlight .box-detail .order .item {
  width: 37px;
  height: 3px;
  background-color: #cccccc;
  float: left;
  margin: 0 1px 0 0;
  cursor: pointer;
}
.wp_index .product-heighlight .box-detail .order .item:hover,
.wp_index .product-heighlight .box-detail .order .item.active {
  background-color: #0d89ce;
}
.wp_index .product-heighlight .box-detail .box-text {
  width: 100%;
  height: 140px;
  position: relative;
}
.wp_index .product-heighlight .box-detail .box-text .item {
  width: 95%;
  position: absolute;
  top: 20px;
  left: 0;
  opacity: 0;
}
.wp_index .product-heighlight .box-detail .box-text .item.active {
  z-index: 3;
}
.wp_index .product-heighlight .box-detail .box-text .item a {
  display: block;
  position: relative;
  float: right;
  font: 12px/15px "sarabun-regular";
  color: #0d89ce;
  text-transform: uppercase;
  padding: 0 25px 18px 0;
  margin: 15px 0 0 0;
}
.wp_index .product-heighlight .box-detail .box-text .item a.more_btn {
  border-bottom: 1px solid #d7d7d7;
  margin: 21px 0 0 0;
}
.wp_index .product-heighlight .box-detail .box-text .item a .btn-style7 {
  width: 25px;
  position: absolute;
  top: -10px;
  left: 80px;
  color: #0d89ce !important;
}
.wp_index .product-heighlight .box-detail h3 {
  height: 31px;
  overflow: hidden;
  font: 19px/33px "sarabun-light";
  color: #0d89ce;
  margin: 0 0 13px 0;
  text-transform: uppercase;
  transform: translateY(0) !important;
}
.wp_index .product-heighlight .box-detail .detail {
  font: 12px/18px "sarabun-light";
  max-height: 40px;
  overflow: hidden;
  transform: translateY(0) !important;
}
.wp_index .product-heighlight .box-detail .box-menu {
  min-width: 305px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
}
.wp_index .product-heighlight .box-detail .box-menu .link_item {
  width: 140px;
  height: 100%;
  border-left: 1px solid rgba(167, 167, 167, 0.5);
  border-right: 1px solid rgba(167, 167, 167, 0.5);
  float: left;
  padding: 0;
  position: relative;
}
.wp_index .product-heighlight .box-detail .box-menu .link_item .item {
  height: 100%;
  position: absolute;
  top: 0;
  left: 22px;
  display: none;
}
.wp_index .product-heighlight .box-detail .box-menu .link_item .item.show {
  display: block;
}
.wp_index .product-heighlight .box-detail .box-menu .link_item .item a {
  width: 33px;
  height: 100%;
  margin: 0 25px 0 0;
  position: relative;
  overflow: hidden;
}
.wp_index .product-heighlight .box-detail .box-menu .link_item .item a:hover,
.wp_index .product-heighlight .box-detail .box-menu .link_item .item a:focus {
  color: #23527c;
}
.wp_index .product-heighlight .box-detail .box-menu .link_item .item a i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.wp_index
  .product-heighlight
  .box-detail
  .box-menu
  .link_item
  .item
  a
  .icon-vdo {
  height: 30px;
  font-size: 30px;
}
.wp_index
  .product-heighlight
  .box-detail
  .box-menu
  .link_item
  .item
  a
  .icon-download {
  height: 24px;
  font-size: 23px;
}
.wp_index .product-heighlight .box-detail .box-menu .btn-contact {
  width: 140px;
  align-content: center;
  float: left;
  color: #0082ca;
  margin: 0;
  padding: 0 0 0 30px;
  text-transform: uppercase;
  position: relative;
  font: 15px/18px "sarabun-regular";
}
.wp_index .product-heighlight .box-detail .box-menu .btn-contact:hover,
.wp_index .product-heighlight .box-detail .box-menu .btn-contact:focus {
  text-decoration: none;
}
.wp_index .product-heighlight .box-detail .box-menu .btn-contact .btn-style7 {
  width: 34px;
  position: absolute;
  right: 0;
  top: -2px;
  color: #0082ca !important;
}

.wp_index .service-highlight {
  background: rgba(0, 131, 203, 1);
  position: relative;
  padding: 120px 0;
  text-align: center;
}
.wp_index .service-highlight .container {
  width: 100%;
  max-width: 1366px;
}
.wp_index .service-highlight h2 {
  color: #fff;
  text-transform: none;
}
.wp_index .service-highlight .txt_caption {
  color: #fff;
  margin: 20px 0 0 0;
  padding: 0 10%;
  max-height: 48px;
  overflow: hidden;
}
.wp_index .service-highlight .list-content {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  margin-top: 40px;
}
.wp_index .service-highlight .list-content .item {
  width: 25%;
  padding: 0 15px;
}
.wp_index .service-highlight .list-content .item .img {
  height: 100px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.wp_index .service-highlight .list-content .item h3 {
  height: auto;
  position: relative;
  padding-bottom: 20px;
  margin-bottom: 25px;
}
.wp_index .service-highlight .list-content .item h3::after {
  content: "";
  width: 60px;
  height: 3px;
  display: block;
  background-color: #fff;
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}
.wp_index .service-highlight .list-content .item p {
  font-size: 14px;
  color: #ddedf6;
}

.wp_index .heighlight {
  width: 100%;
  line-height: 0;
  color: #fff;
}
.wp_index .heighlight .banner {
  position: relative;
  overflow: hidden;
}
.wp_index .heighlight .banner .pic_banner {
  width: 100%;
}
.wp_index .heighlight .banner .detail {
  width: 100%;
  height: 96px;
  position: absolute;
  bottom: 0;
  left: 0;
  overflow: hidden;
}
.wp_index .heighlight .banner .detail .box-left {
  width: 25%;
  height: 96px;
  background-color: rgba(255, 255, 255, 1);
  position: relative;
  float: left;
}
.wp_index .heighlight .banner .detail .box-left img {
  max-height: 62px;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}
.wp_index .heighlight .banner .detail .box-right {
  width: 75%;
  height: 96px;
  display: block;
  color: #fff;
  float: left;
  background-color: rgba(0, 131, 203, 0.7);
  padding: 25px 30px 30px 30px;
  overflow: hidden;
}
.wp_index .heighlight .banner .detail .box-right .col-left {
  width: 100px;
  margin: 0 35px 0 0px;
  float: left;
  overflow: hidden;
}
.wp_index .heighlight .banner .detail .box-right .col-center {
  width: calc(100% - 247px);
  float: left;
}
.wp_index .heighlight .banner .detail .box-right .col-right {
  width: 50px;
  height: 100%;
  position: relative;
  color: #fff;
  display: block;
  float: left;
}
.wp_index .heighlight .banner .detail .box-right .col-right i {
  width: 17px;
  height: 13px;
  background: #fff;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}
.wp_index .heighlight .banner .detail .box-right .col .topic h2 {
  font: 18px/24px "sarabun-semibold";
  color: #fff;
  text-transform: none;
}
.wp_index .heighlight .banner .detail .box-right .col .title {
  height: 25px;
  overflow: hidden;
  font: 17px/25px "sarabun-light";
}
.wp_index .heighlight .banner .detail .box-right .col .text {
  height: 20px;
  overflow: hidden;
  font: 13px/20px "sarabun-light";
}
.wp_index .heighlight .box-list {
  margin: 10px 0 0 0;
}
.wp_index .heighlight .box-list .container_lg {
  padding: 0 10px;
}
.wp_index .heighlight .box-list .row {
  margin: 0 -5px;
}
.wp_index .heighlight .box-list .col-sm-4 {
  padding: 0 5px;
}
.wp_index .heighlight .box-list .item {
  position: relative;
  overflow: hidden;
  display: block;
  color: #fff;
}
.wp_index .heighlight .box-list .item img {
  width: 100%;
}
.wp_index .heighlight .box-list .item .caption {
  width: 100%;
  height: 100%;
  padding: 13px 76px;
  position: absolute;
  top: calc(100% - 86px);
  left: 0;
  background-color: rgba(13, 137, 206, 0.7);
}
.wp_index .heighlight .box-list .item .caption.hoverText {
  top: 0;
}
.wp_index .heighlight .box-list .item .caption .row-cell {
  vertical-align: top;
}
.wp_index .heighlight .box-list .item .caption.hoverText .row-cell {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
}
.wp_index .heighlight .box-list .item .caption .topic h3 {
  height: 27px;
  overflow: hidden;
  position: relative;
  padding: 0 45px 0 0;
  display: inline-block;
}
.wp_index .heighlight .box-list .item .caption .topic h3 .btn-style4 .icon-2 {
  color: rgba(13, 137, 206, 0.7);
  font: 19px/8px "sarabun-light";
}
.wp_index .heighlight .box-list .item .caption .topic .line {
  margin: 5px 0;
}
.wp_index .heighlight .box-list .item .caption .text {
  margin: 5px 0 0 0;
  line-height: 19px;
}
.wp_index .heighlight .box-list .item .caption .btn-style1 {
  margin: 15px 0 0 0;
  color: #fff;
}
.wp_index .heighlight .box-list .item .caption .text strong {
  height: auto !important;
  display: block;
  font: 15px/28px "sarabun-light";
  color: #fff;
}
.wp_index .heighlight .box-list .item .caption .text span {
  max-height: 38px;
  overflow: hidden;
  display: none;
}

.wp_index .news {
  padding: 82px 0 0 0;
}
.wp_index .news .box-news {
  position: relative;
}
.wp_index .news .box-news .wp_slide {
  margin: 0 0 57px 0;
}
.wp_index .news .box-news .wp_slide .box-slide .item h2 {
  padding: 0 56px 0 0;
  position: relative;
  display: inline-block;
}
.wp_index .news .box-news .wp_slide .box-slide .item h2 i {
  width: 36px;
  height: 36px;
  position: absolute;
  top: 3px;
  right: 0;
  text-align: center;
  font-size: 35px;
}
.wp_index .news .box-news .wp_slide .box-slide .item h2 i span {
  font: 22px/8px "sarabun-light";
  color: #f2f6ff;
  font-style: normal;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 13px;
  height: 13px;
}
.wp_index .news .box-news .wp_slide .box-slide .item .line {
  width: 37px;
  background-color: #0082ca;
  margin: 13px 0 17px 0;
}
.wp_index .news .box-news .wp_slide .box-slide .item .date {
  color: #0082ca;
  overflow: hidden;
}
.wp_index .news .box-news .wp_slide .box-slide .item .date .day {
  float: left;
  font: 38.62px/33px "sarabun-light";
  margin: 0 6px 0 0;
}
.wp_index .news .box-news .wp_slide .box-slide .item .date .colum-right {
  float: left;
}
.wp_index .news .box-news .wp_slide .box-slide .item .date .colum-right .month {
  font: 15px/15px "sarabun-light";
  margin: 0 0 3px 0;
}
.wp_index .news .box-news .wp_slide .box-slide .item .date .colum-right .year {
  font: 16px/15px "sarabun-light";
}
.wp_index .news .box-news .wp_slide .box-slide .item h3 {
  height: 30px;
  overflow: hidden;
  font: 21px/33px "sarabun-light";
  color: #333333;
  margin: 15px 0 10px 0;
  text-transform: uppercase;
}
.wp_index .news .box-news .wp_slide .box-slide .item .detail {
  height: 73px;
  overflow: hidden;
  color: rgba(102, 102, 102, 0.7);
  padding: 0 70px 0 0;
  margin: 0 0 20px 0;
}
.wp_index .news .box-news .wp_slide .box-slide .item a.btn-style1 {
  width: auto;
  display: block;
  float: right;
  padding-right: 80px;
  color: #0082ca !important;
  font: 12px/15px "sarabun-regular";
  text-transform: uppercase;
}
.wp_index .news .box-news .wp_slide .box-slide .item a.btn-style1 .btn-style1 {
  width: 45px;
  position: absolute;
  font-size: 19px;
  top: -3px;
  left: 85px;
}

.wp_index .news .academy {
  width: 100%;
  position: relative;
  line-height: 0;
}
.wp_index .news .academy img {
  width: 100%;
}
.wp_index .news .academy .detail {
  width: 860px;
  height: 251px;
  background-color: rgba(0, 131, 203, 0.7);
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  padding: 35px 100px 30px 100px;
  text-align: center;
  color: #fff;
}
.wp_index .news .academy .detail .btn-style3 {
  width: 65px;
  height: 65px;
}
.wp_index .news .academy .detail .topic {
  height: 45px;
  overflow: hidden;
  font: 34px/47px "sarabun-bold";
  text-transform: uppercase;
  margin: 20px 0 10px 0;
}
.wp_index .news .academy .detail .text {
  height: 48px;
  overflow: hidden;
  color: #d9f2ff;
  line-height: 24px;
}

.wp_index .authorize {
  text-align: center;
  padding: 110px 0 0 0;
}
.wp_index .authorize h2 {
  margin: 0 0 30px 0;
}
.wp_index .authorize .detail {
  padding: 0 120px;
  margin: 0 0 55px 0;
}
.wp_index .authorize .row {
  margin: 0 -29px;
}
.wp_index .authorize .colum {
  width: 20%;
  padding: 0 29px;
  cursor: pointer;
}
.wp_index .authorize .colum img {
  display: block;
  margin: 0 auto 35px auto;
}
.wp_index .authorize .line {
  width: 100%;
  height: 8px;
  background: url(../image/index/bg-line.jpg) 0 0 repeat-x;
  margin: 0 0 35px 0;
}
.wp_index .authorize .box-authorize {
  position: relative;
}
.wp_index .authorize .box-authorize .wp_slide .box-slide .item img {
  display: block;
  margin: 0 0 30px 0;
  padding: 0 10px;
}
.wp_index .authorize .box-authorize .wp_slide .box-slide .item img:last-child {
  margin: 0;
}

/***news page***/
.wp_news {
  background-color: #fff;
  position: relative;
  padding: 0 0 120px 0;
  overflow: hidden;
}
.wp_news .box-headTopic {
  padding: 105px 0 65px 60px;
}
.wp_news .banner {
  margin: 0 0 90px 0;
  position: relative;
  display: block;
}
.wp_news .banner .wp_pic {
  line-height: 0;
}
.wp_news .banner .wp_pic img {
  width: 100%;
}
.wp_news .banner .caption {
  padding: 30px 80px 30px 40px;
  background-color: #0083cb;
  color: #fff;
  overflow: hidden;
  position: relative;
}
.wp_news .banner .caption .date {
  height: 50px;
  float: left;
  padding: 10px 40px 10px 0;
  border-right: 1px solid #80c1e5;
  margin: 0 33px 0 0;
}
.wp_news .banner .caption .date .day {
  font: 38px/30px "sarabun-light";
  margin: 0 5px 0 0;
  float: left;
}
.wp_news .banner .caption .date .colum-right {
  float: left;
  font: 14px/14px "sarabun-regular";
}
.wp_news .banner .caption .date .colum-right .month {
  margin: 0 0 3px 0;
}
.wp_news .banner .caption .col-c {
  width: calc(100% - 225px);
  float: left;
}
.wp_news .banner .caption .col-c h3 {
  font: 17px/24px "sarabun-light";
  margin: 0 0 5px 0;
  height: 23px;
  overflow: hidden;
}
.wp_news .banner .caption .col-c .text {
  height: 22px;
  overflow: hidden;
}
.wp_news .banner .caption .ani_right-btn {
  position: absolute;
  right: 80px;
  top: 0;
  bottom: 0;
  margin: auto;
}
.wp_news .wp_list {
  margin: 0 -10px;
}
.wp_news .wp_list .box-list {
  padding: 0 10px;
}
.wp_news .item-list {
  display: block;
  margin: 0 0 30px 0;
  overflow: hidden;
}
.wp_news .item-list .wp_pic {
  position: relative;
}
.wp_news .item-list .wp_pic img {
  display: block;
  width: 100%;
}
.wp_news .item-list .wp_pic .wp_date {
  position: absolute;
  bottom: 0;
  left: 30px;
  background-color: #0083cb;
  color: #fff;
  padding: 15px;
  font: 14px/15px "sarabun-semibold";
  overflow: hidden;
}
.wp_news .item-list .wp_pic .wp_date .col-l {
  float: left;
  font: 35px/30px "sarabun-light";
  margin: 0 5px 0 0;
}
.wp_news .item-list .wp_pic .wp_date .col-r {
  float: left;
}
.wp_news .item-list .wp_pic .wp_date .col-r span {
  display: block;
}
.wp_news .item-list .detail {
  height: 115px;
  position: relative;
  padding: 20px 30px;
  background-color: #fff;
  overflow: hidden;
}
.wp_news .item-list .detail h3 {
  height: 24px;
  overflow: hidden;
  color: #333333;
  font: 18px/26px "sarabun-regular";
  margin: 0 0 5px 0;
}
.wp_news .item-list .detail .text {
  color: #666666;
  height: 47px;
  overflow: hidden;
  word-wrap: break-word;
}
.wp_news .paging {
  margin: 50px 0 0 0;
}
.wp_news-detail .wp_detail .box-detail .topic .social {
  top: 6px;
  bottom: auto;
}

/***download***/
.wp_download {
  background-color: #fff;
  position: relative;
  padding: 0 0 120px 0;
  overflow: hidden;
}
.wp_download .box-search-keyword {
  background-color: #0083cb;
  margin-bottom: 90px;
}
.wp_download .box-search-keyword .inner {
  min-height: 147px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  padding: 0 65px;
}
.wp_download .box-search-keyword .inner .item {
  width: 60%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-content: center;
  margin-left: 48px;
}
.wp_download .box-search-keyword .inner .item:first-child {
  margin-left: 0;
}
.wp_download .box-search-keyword .inner .item:nth-of-type(3) {
  width: 20%;
  margin-left: 15px;
}
.wp_download .box-search-keyword .inner .item .select {
  background: none;
  margin: 0;
}
.wp_download .box-search-keyword .inner .item .select .select-styled,
.wp_download .box-search-keyword .inner .item input {
  background-color: transparent;
  border: 2px solid rgba(255, 255, 255, 0.3);
  margin: 0;
  color: #fff;
}
.wp_download .box-search-keyword .inner .item label {
  margin-right: 15px;
  font-weight: normal;
  font-size: 18px;
  line-height: 55px;
  color: #fff;
}
.wp_download .box-search-keyword .inner .item button {
  width: 100%;
  height: 55px;
  display: block;
  background-color: #005888;
  border: none;
  font-size: 22px;
  text-transform: uppercase;
  color: #fff;
}
.wp_download .box-search-keyword .inner .item .select .icon-arrow-down:before {
  background-color: #fff;
  color: #0083cb;
}
.wp_download .box-search-keyword .txt_error {
  display: none;
  padding: 0 0 20px;
  margin: 0;
  text-align: center;
}
.wp_download .box-list {
  margin-bottom: 60px;
}
.wp_download .box-list:nth-of-type(4n + 1) {
  clear: both;
}
.wp_download .box-list img {
  width: 100%;
  display: block;
}
.wp_download .box-list p {
  width: 100%;
  margin-top: 20px;
  font-size: 16px;
  color: #0083cb;
}
.wp_download .box-list .wp_pic {
  position: relative;
}
.wp_download .box-list .icon {
  width: 100%;
  height: 100%;
  display: block;
  background-color: rgba(0, 131, 203, 0.91);
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
  transition: 250ms ease;
}
.wp_download .box-list a:hover .icon {
  opacity: 1;
  visibility: visible;
}
.wp_download .box-list a .icon {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
}
.wp_download .box-list a .icon::before {
  content: "";
  width: 94px;
  height: 94px;
  display: block;
  background: url("../image/icons/download.svg") 50% 50%/43px no-repeat;
  border: 4px solid #fff;
  border-radius: 50%;
  margin-bottom: 28px;
  transition: 100ms ease;
}
.wp_download .box-list a .icon span {
  width: 100%;
  text-align: center;
  font-size: 25px;
  color: #fff;
  transition: 100ms ease;
}
.wp_download .box-list a:hover .icon::before {
  -webkit-transform: translateY(-15px);
  -ms-transform: translateY(-15px);
  -o-transform: translateY(-15px);
  transform: translateY(-15px);
  transition-duration: 200ms;
  transition-delay: 100ms;
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.wp_download .box-list a:hover .icon span {
  -webkit-transform: translateY(-15px);
  -ms-transform: translateY(-15px);
  -o-transform: translateY(-15px);
  transform: translateY(-15px);
  transition-duration: 200ms;
  transition-delay: 180ms;
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.wp_download .paging {
  margin-top: 50px;
}

/***knowledge page***/
.wp_knowledge {
  position: relative;
  overflow: hidden;
  background-color: #fff;
}
.wp_knowledge .graphic .graphic_bottom {
  display: none;
}
.wp_knowledge .logo {
  width: 429px;
  margin: 110px 0 65px;
}
.wp_knowledge .logo img {
  width: 100%;
  display: block;
  margin-bottom: 24px;
}
.wp_knowledge .logo p {
  font-size: 16px;
  line-height: 1.4em;
  color: #666;
}
.wp_knowledge .box_bannerKnow {
  position: relative;
  display: block;
}
.wp_knowledge .banner {
  position: relative;
  display: block;
}
.wp_knowledge .banner .wp_pic {
  overflow: hidden;
  line-height: 0;
}
.wp_knowledge .banner .wp_pic img {
  width: 100%;
}
.wp_knowledge .banner .caption {
  width: 100%;
  padding: 10px 70px 10px 50px;
  background-color: rgba(13, 137, 206, 0.7);
  color: #fff;
  overflow: hidden;
  position: absolute;
  bottom: 0;
  left: 0;
}
.wp_knowledge .banner .caption .col-l {
  float: left;
  padding: 5px 40px 5px 0;
  border-right: 1px solid #80c1e5;
  margin: 5px 33px 0 0;
}
.wp_knowledge .banner .caption .col-l span {
  display: block;
  font: 19px/25px "sarabun-bold";
}
.wp_knowledge .banner .caption .col-l .line {
  width: 37px;
  height: 3px;
  background-color: #fff;
  margin: 7px 0 0 0;
}
.wp_knowledge .banner .caption .col-l .colum-right {
  float: left;
  font: 14px/14px "sarabun-regular";
}
.wp_knowledge .banner .caption .col-l .colum-right .month {
  margin: 0 0 3px 0;
}
.wp_knowledge .banner .caption .col-c {
  width: calc(100% - 225px);
  float: left;
}
.wp_knowledge .banner .caption .col-c h3 {
  font: 14px/22px "sarabun-light";
  margin: 10px 0;
  padding: 0 30px 0 0;
}
.wp_knowledge .banner .caption .col-c .text {
  display: none;
}
.wp_knowledge .banner .caption .ani_right-btn {
  position: absolute;
  right: 80px;
  top: 0;
  bottom: 0;
  margin: auto;
}
.wp_knowledge .order {
  margin: 15px 0 0 0;
  text-align: center;
}
.wp_knowledge .order .item {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #666;
  margin: 0 4px;
  display: inline-block;
  cursor: pointer;
}
.wp_knowledge .order .item.active {
  background-color: #0d89ce;
}
.wp_knowledge .box_bannerKnow .btn-style2 .icon-diamond-bg {
  width: 54px;
  height: 54px;
  font-size: 54px;
}
.wp_knowledge .wp_type {
  margin: 100px 0 98px 0;
}
.wp_knowledge .wp_type .row {
  margin: 0 -10px;
}
.wp_knowledge .wp_type .row .col-sm-4 {
  padding: 0 10px;
}
.wp_knowledge .wp_type .box-type {
  margin: 0 0 95px 0;
}
.wp_knowledge .wp_type .topic {
  text-align: center;
  display: block;
}
.wp_knowledge .wp_type .topic h2 {
  margin: 0 0 48px 0;
  font: 38px/38px "sarabun-semibold";
  padding: 0 40px 0 0;
  position: relative;
  display: inline-block;
}
.wp_knowledge .wp_type .topic h2 .gray_txt {
  color: #333333;
}
.wp_knowledge .wp_type .topic h2 i {
  font-size: 30px;
  width: 30px;
  height: 30px;
  display: block;
  position: absolute;
  top: 5px;
  right: 0;
}
.wp_knowledge .wp_type .topic h2 i span {
  font: 23px/8px "sarabun-light";
  color: #f2f6ff;
  font-style: normal;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 13px;
  height: 13px;
}
.wp_knowledge .wp_type .item-list {
  position: relative;
  overflow: hidden;
  display: block;
  color: #fff;
  line-height: 0;
}
.wp_knowledge .wp_type .item-list:hover .caption {
  top: calc(90% - 73px);
}
.wp_knowledge .wp_type img {
  display: block;
  width: 100%;
  object-fit: cover;
  height: 232px;
}
.wp_knowledge .wp_type .caption {
  width: 100%;
  height: 100%;
  line-height: initial;
  padding: 13px 40px 13px 35px;
  position: absolute;
  top: calc(100% - 73px);
  left: 0;
  background-color: rgba(13, 137, 206, 0.7);
  transition: all 0.2s ease-in-out;
}
.wp_knowledge .wp_type .caption.hoverText {
  top: 0;
}
.wp_knowledge .wp_type .item-list .caption .row-cell {
  vertical-align: top;
}
.wp_knowledge .wp_type .item-list .caption.hoverText .row-cell {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
}
.wp_knowledge .wp_type .item-list .caption .topic h3 {
  position: relative;
  padding: 0 57px 0 0;
  display: inline-block;
}
.wp_knowledge .wp_type .item-list .caption .topic h3 .btn-style4 .icon-2 {
  color: rgba(13, 137, 206, 0.7);
  font: 23px/8px "sarabun-light";
}
.wp_knowledge .wp_type .item-list .caption .topic .line {
  margin: 15px 0 10px 0;
}
.wp_knowledge .wp_type .item-list .caption .btn-style1 {
  margin: 15px 0 0 0;
  color: #fff;
  font-size: 22px;
  display: none !important;
}
.wp_knowledge .wp_type .item-list .caption .text strong {
  height: 26px;
  overflow: hidden;
  display: block;
  font: 17px/26px "sarabun-light";
}
.wp_knowledge .wp_type .item-list .caption .text span {
  display: block;
  height: 40px;
  max-height: 40px;
  overflow: hidden;
  line-height: 21px;
}
.wp_knowledge .wp_type .item-list .caption.hoverText .text span {
  height: auto;
  max-height: none;
}

/***knowledge-list page***/
.wp_knowledge-list .banner {
  height: 219px;
  background: none;
}
.wp_knowledge-list .banner .detail-banner {
  height: 219px;
}
.wp_knowledge-list .wp_type {
  margin: 0 0 94px 0;
}
.wp_knowledge-list .wp_type .box-topic {
  width: 100%;
  height: 70px;
  background-color: #fff;
  margin: 0 0 40px 0;
  padding: 15px 0 15px 100px;
  position: relative;
}
.wp_knowledge-list .wp_type .box-topic h2 {
  font: 30px/40px "sarabun-bold";
}
.wp_knowledge-list .wp_type .box-topic .back_btn {
  width: 75px;
  height: 75px;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  background-color: #0379c5;
}
.wp_knowledge-list .wp_type .item-list {
  margin: 0 0 20px 0;
}
.wp_knowledge-list .paging {
  margin: 70px 0 20px 0;
}

/***knowledge-detail page***/
.wp_knowledge-detail .banner {
  height: 219px;
  background: none;
}
.wp_knowledge-detail .banner .detail-banner {
  height: 219px;
}
.wp_knowledge-detail .wp_detail .box-topic {
  width: 100%;
  height: 70px;
  background-color: #fff;
  margin: 0 0 40px 0;
  padding: 15px 0 15px 100px;
  position: relative;
}
.wp_knowledge-detail .wp_detail .box-topic h2 {
  font: 33px/38px "sarabun-bold";
}
.wp_knowledge-detail .wp_detail .box-detail .topic {
  padding: 0;
}
.wp_knowledge-detail .wp_detail .box-detail .detail .pic-detail {
  padding: 0;
}
.wp_knowledge-detail .box-relate .wp_type {
  margin: 0 0 80px 0;
}

/***product page***/
.wp_product {
  position: relative;
  overflow: hidden;
  background: url(../image/product/bg_product.jpg) center center no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  -ms-background-size: cover;
}
.wp_product .graphic .graphic_tool {
  width: auto;
  bottom: -48px;
  top: auto;
}
.wp_product .box-product {
  height: calc(100vh - 87px);
  text-align: center;
  color: #fff;
  overflow: hidden;
}
.wp_product .box-product h1 {
  font: 82px/65px "sarabun-semibold";
  margin: 0 0 8px 0;
}
.wp_product .box-product h2 {
  font: 43px/40px "sarabun-semibold";
  color: #fff;
  text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.28);
  margin: 0 0 45px 0;
}
.wp_product .box-product .box-menu {
  width: 960px;
  margin: auto;
  text-align: center;
}
.wp_product .box-product .box-menu .item-menu {
  width: 240px;
  float: left;
}
.wp_product .box-product .box-menu .item-menu a {
  height: 242px;
  display: block;
  color: #fff;
  position: relative;
  text-align: center;
}
.wp_product .box-product .box-menu .item-menu i {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  font-size: 240px;
}
.wp_product .box-product .box-menu .item-menu .icon-diamond-bg {
  top: -2px;
  font-size: 220px;
  color: rgba(13, 137, 206, 0.95);
}
.wp_product .box-product .box-menu .item-menu .title-menu {
  font: 12px/17px "sarabun-regular";
  text-transform: uppercase;
  position: relative;
}
.wp_product .box-product .box-menu .item-menu .title-menu span {
  display: block;
}
.wp_product .box-product .box-menu .item-menu .menu {
  height: 100%;
  padding: 50px 0 0 0;
}
.wp_product .box-product .box-menu .item-menu .menu .wp_hidden {
  overflow: hidden;
}
.wp_product .box-product .box-menu .item-menu .menu i {
  position: relative;
  font-size: 70px;
  text-shadow: 0px 5px 0px rgba(0, 0, 0, 0.19);
}
.wp_product .box-product .box-menu .item-menu .menu i.noneshadow {
  text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.19);
}
.wp_product .box-product .box-menu .item-menu .menu i.lgshadow {
  text-shadow: 0px 10px 0px rgba(0, 0, 0, 0.19);
}
.wp_product .box-product .box-menu .item-menu .menu .icon-measuning {
  margin: 0 0 0 10px;
}
.wp_product .box-head {
  margin: 130px 0 120px 0;
  color: #fff;
}
.wp_product .box-head .topic-brand {
  width: 46%;
  float: left;
}
.wp_product .box-head .topic-brand h1 {
  font: 40px/53px "sarabun-regular";
  text-align: left;
  margin: 0 0 20px 0;
}
.wp_product .box-head .topic-brand .line {
  width: 70px;
  height: 4px;
  background-color: #fff;
  margin: 0 0 20px 0;
}
.wp_product .box-head .topic-brand h2 {
  font: 36px/48px "sarabun-regular";
  color: #fff;
  margin: 0 0 7px 0;
}
.wp_product .box-head .topic-brand .text {
  height: auto;
  min-height: 40px;
  max-height: 67px;
  overflow: hidden;
  font: 13px/23px "sarabun-light";
  padding: 0 10px 0 0;
}
.wp_product .box-head .graphic-brand {
  width: 50%;
  float: left;
  position: relative;
}
.wp_product .box-head .graphic-brand img {
  position: absolute;
  width: 52%;
}
.wp_product .box-head .graphic-brand .tool1 {
  top: -90px;
  left: 0;
}
.wp_product .box-head .graphic-brand .tool2 {
  top: -70px;
  left: 250px;
}
.wp_product .box-brand {
  background-color: #fff;
  overflow: hidden;
}
.wp_product .box-brand .box-filter {
  width: 100%;
  min-height: 500px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  position: relative;
  background: #eff7fc;
}
.wp_product .box-brand .box-filter .left {
  width: 350px;
  max-width: 100%;
  color: #999999;
  position: relative;
  margin-left: -348px;
  transition: 250ms ease;
}
.wp_product .box-brand .box-filter.show-filter .left {
  margin-left: 0;
}
.wp_product .box-brand .box-filter .left .topic-filter {
  height: 90px;
  position: relative;
  color: #fff;
  background-color: #0083cb;
  padding: 0;
}
.wp_product .box-brand .box-filter .left .topic-filter .txt-type {
  font: 18px/18px "sarabun-regular";
  padding: 0 0 0 40px;
  margin: 0 0 5px 0;
}
.wp_product .box-brand .box-filter .left .topic-filter .txt-headFilter {
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  font: 24px/1em "sarabun-regular";
  text-transform: uppercase;
  padding: 0 0 0 20px;
  position: relative;
}
.wp_product .box-brand .box-filter .left .topic-filter .txt-headFilter i {
  font-size: 17px;
  position: absolute;
  top: 5px;
  left: 0;
}
.wp_product .box-brand .box-filter .left .topic-filter .closeFillter_btn {
  width: 80px;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-content: center;
  flex-wrap: wrap;
  cursor: pointer;
  text-align: center;
  position: absolute;
  right: 0;
  top: 0;
  border-left: 1px solid #80c1e5;
  color: #fff;
  font: 11px/16px "sarabun-regular";
  padding: 0;
}
.wp_product .box-brand .box-filter .left .topic-filter .closeFillter_btn i {
  width: 100%;
  display: block;
  font-size: 9px;
  margin: 0 0 3px 0;
}
.wp_product .box-brand .box-filter .left .topic-filter .closeFillter_btn span {
  width: 100%;
  display: block;
}
.wp_product .box-brand .box-filter .left .list-filter {
  padding: 38px 25px 50px 25px;
}
.wp_product .box-brand .box-filter .left .list-filter .item {
  padding: 0 0 0 35px;
  position: relative;
  margin: 0 0 15px 0;
}
.wp_product
  .box-brand
  .box-filter
  .left
  .list-filter
  .item
  input[type="checkbox"] {
  display: none;
}
.wp_product
  .box-brand
  .box-filter
  .left
  .list-filter
  .item
  input[type="checkbox"]
  + label {
  font: 13px/20px "sarabun-light";
  color: #999999;
  cursor: pointer;
}
.wp_product
  .box-brand
  .box-filter
  .left
  .list-filter
  .item
  input[type="checkbox"]
  + label:hover,
.wp_product
  .box-brand
  .box-filter
  .left
  .list-filter
  .item
  input[type="checkbox"]:checked
  + label {
  color: #333333;
}
.wp_product
  .box-brand
  .box-filter
  .left
  .list-filter
  .item
  input[type="checkbox"]
  + label
  i {
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  padding: 1px 4px;
  font-size: 11px;
  width: 22px;
  height: 22px;
  background-color: #fff;
  border: 1px solid #f3f0f0;
}
.wp_product
  .box-brand
  .box-filter
  .left
  .list-filter
  .item
  input[type="checkbox"]:checked
  + label
  i {
  color: #0083cb;
}
.wp_product .box-brand .box-filter .right {
  width: 100%;
  background: #fff url("../image/product/bg.png") 0 100% no-repeat;
  color: #999999;
  position: relative;
  transition: 250ms ease;
}
.wp_product .box-brand .box-filter .right .btn_filter {
  width: 78px;
  height: 90px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  background-color: #0083cb;
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0;
  opacity: 1;
  visibility: visible;
  transition: 250ms ease;
}
.wp_product .box-brand .box-filter.show-filter .right .btn_filter {
  left: -78px;
  opacity: 0;
  visibility: hidden;
}
.wp_product .box-brand .box-filter .right .btn_filter .box-line {
  width: 26px;
  height: 18px;
  margin: 0 auto 10px auto;
}
.wp_product .box-brand .box-filter .right .btn_filter span {
  width: 26px;
  height: 3px;
  display: block;
  background-color: #fff;
  margin: 0 0 3px 0;
}
.wp_product .box-brand .box-filter .right .btn_filter span.last_line {
  width: 16px;
}
.wp_product .box-brand .box-filter .right .btn_filter .text {
  width: 100%;
  font: 12px/11px "sarabun-light";
}
.wp_product .box-brand .box-filter .right a {
  display: block;
  text-align: center;
  cursor: pointer;
}
.wp_product .box-brand .box-filter .right .head-numBrand {
  height: 90px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  overflow: hidden;
  padding: 0 34px;
  font: 14px/18px "sarabun-regular";
  color: #333333;
  border-bottom: 1px solid #ebebeb;
}
.wp_product .box-brand .box-filter .right .head-numBrand .wp_numBrand {
  float: right;
}
.wp_product
  .box-brand
  .box-filter
  .right
  .head-numBrand
  .wp_numBrand
  .num-brand {
  font: 34px/30px "sarabun-regular";
}
.wp_product .box-brand .box-filter .right .list-band {
  position: relative;
}
.wp_product .box-brand .box-filter .right .box-heighlightBrand {
  margin: 70px 0 0 0;
  padding: 0 68px 30px 68px;
}
.wp_product .box-brand .box-filter .right .box-heighlightBrand a {
  margin: 0 0 30px 0;
}
.wp_product .box-brand .box-filter .right .box-normalBrand {
  margin: 70px 0;
  padding: 0 40px;
  overflow: hidden;
}
.wp_product .box-brand .box-filter .right .box-normalBrand .col-sm-2 {
  width: 20%;
}
.wp_product .box-brand .box-filter .right .wp_preload {
  width: 100%;
  height: 100%;
  background: #fff;
  position: absolute;
  top: 0px;
  left: 0px;
}
.wp_product .box-brand .box-filter .right .wp_preload #sect {
  height: auto;
  top: 20%;
  position: absolute;
  background-color: #fff;
  font-size: 13px;
}
.wp_product-main {
  padding-bottom: 0;
}
.wp_product-main .box-product h1 {
  font: 58px/55px "sarabun-semibold";
  margin: 0 0 35px 0;
}

/***product-brand page***/
.wp_product-brand {
  position: relative;
  overflow: hidden;
  padding: 0;
}
.wp_product-brand .content {
  padding: 0 !important;
}

/***product-detail page***/
.wp_product-detail {
  position: relative;
  overflow: hidden;
  padding: 0 !important;
}
.wp_product-detail .content {
  padding-bottom: 0;
}
.wp_product-detail .box-paging {
  padding: 0;
  margin-bottom: 125px;
}
.wp_product-detail .box-brand .box-filter .left {
  margin-left: -349px;
}
.wp_product-detail .box-brand .box-filter .right .head-numBrand {
  padding-left: 5px;
}
.wp_product-detail .box-brand .box-filter .right .head-numBrand .box-logo {
  height: 49px;
  float: left;
}
.wp_product-detail .box-brand .box-filter .right .head-numBrand .box-logo img {
  height: 100%;
}
.wp_product-detail .box-brand .box-filter .right .list-detail {
  padding: 36px 36px 0 36px;
  position: relative;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right.col-4-style
  .list-detail
  .col-sm-4 {
  width: 25%;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right.col-4-style
  .list-detail
  .col-sm-4:nth-of-type(3n + 1) {
  clear: none;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right.col-4-style
  .list-detail
  .col-sm-4:nth-of-type(4n + 1) {
  clear: both;
}
.wp_product-detail .box-brand .box-filter .right .list-detail .box-pic {
  margin: 0 0 30px 0;
}
.wp_product-detail .box-brand .box-filter .right .list-detail .box-pic img {
  width: 100%;
}
.wp_product-detail .box-brand .box-filter .right .list-detail h3 {
  height: 20px;
  overflow: hidden;
  font: 18px/20px "sarabun-regular";
  color: #0d89ce;
  margin: 0 0 20px 0;
}
.wp_product-detail .box-brand .box-filter .right .list-detail .text {
  height: 72px;
  overflow: hidden;
  font: 14px/18px "sarabun-light";
}
.wp_product-detail .box-brand .box-filter .right .list-detail .know_btn {
  display: block;
  text-align: left;
  position: relative;
  font: 12px/15px "sarabun-regular";
  color: #0d89ce;
  text-transform: uppercase;
  margin: 25px 0 30px 0;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .know_btn
  .btn-style7 {
  width: 25px;
  position: absolute;
  top: -1px;
  left: 80px;
  color: #0d89ce !important;
}
.wp_product-detail .box-brand .box-filter .right .list-detail .box-btn {
  margin: 30px 0 80px 0;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-left {
  width: 150px;
  height: 55px;
  padding: 14px 27px 14px 22px;
  float: left;
  background-color: #e5eff5;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-left
  a {
  width: 27px;
  height: 27px;
  display: block;
  float: left;
  color: #0d89ce;
  margin: 0;
  overflow: hidden;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-left
  a:first-child {
  margin: 0 35px 0 0;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-left
  a
  .icon-vdo {
  font-size: 26px;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-left
  a
  .icon-download {
  font-size: 22px;
  position: absolute;
  top: 2px;
  bottom: 0;
  margin: auto;
  left: 0;
  right: 0;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-left
  a
  .tooltip {
  top: -55px;
  transform: matrix(0, 0, 0, 0, 10, 0);
  -webkit-transform: matrix(0, 0, 0, 0, 10, 0);
  -moz-transform: matrix(0, 0, 0, 0, 10, 0);
  -ms-transform: matrix(0, 0, 0, 0, 10, 0);
  -o-transform: matrix(0, 0, 0, 0, 10, 0);
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-right {
  width: calc(100% - 150px);
  height: 55px;
  float: left;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-right
  a {
  text-align: left;
  color: #fff;
  background-color: #0d89ce;
  display: block;
  font: 16px/20px "sarabun-regular";
  padding: 18px 10px 18px 20px;
  margin: 0;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-right
  a:hover,
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-right
  a:focus {
  background-color: #3da1d8;
}
.wp_product-detail
  .box-brand
  .box-filter
  .right
  .list-detail
  .box-btn
  .box-right
  a
  .btn-style7 {
  width: auto;
  height: 18px;
  float: right;
}

.wp_product-type .graphic .graphic_bottom {
  top: 470px;
}
.wp_product-type .box-product-type {
  margin: 0 0 158px 0;
}
.wp_product-type .box-product-type .row {
  margin: 0 -0.5px;
}
.wp_product-type .box-product-type .item {
  padding: 0 0.5px;
}
.wp_product-type .box-product-type .item a {
  display: block;
  overflow: hidden;
  position: relative;
  text-align: center;
  color: #fff;
  line-height: 0;
  margin: 0 0 1px 0;
}
.wp_product-type .box-product-type .item a img {
  width: 100%;
}
.wp_product-type .box-product-type .item a .caption {
  width: 100%;
  height: 100%;
  line-height: initial;
  padding: 13px 40px 13px 35px;
  position: absolute;
  top: calc(100% - 50px);
  left: 0;
  background-color: rgba(13, 137, 206, 0.7);
}
.wp_product-type .box-product-type .item a .caption.hoverText {
  top: 0;
}
.wp_product-type .box-product-type .item a .caption .row-cell {
  vertical-align: top;
}
.wp_product-type .box-product-type .item a .caption.hoverText .row-cell {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
}
.wp_product-type .box-product-type .item a .caption .text {
  position: relative;
  padding: 0;
  display: inline-block;
}
.wp_product-type .box-product-type .item a .caption .text span {
  display: block;
  height: 23px;
  max-height: 23px;
  overflow: hidden;
  line-height: 26px;
}
.wp_product-type .box-product-type .item a .caption.hoverText .text span {
  height: auto;
  max-height: none;
}

/***career page***/
.wp_career {
  position: relative;
  overflow: hidden;
  padding: 0 0 77px 0;
}
.wp_career .box-headTopic .text {
  height: 80px;
}
.wp_career .box-accordian {
  color: #333333;
  font-size: 13px;
  line-height: 22px;
}
.wp_career .box-accordian .box-job {
  background-color: #fff;
  margin: 0 0 1px 0;
}
.wp_career .box-accordian .box-job .head-job {
  overflow: hidden;
  background-color: #0083cb;
  color: #fff;
  cursor: pointer;
  padding: 25px 0 25px 12px;
  position: relative;
}
.wp_career .box-accordian .box-job .head-job span {
  display: inline-block;
  padding: 0 10px;
}
.wp_career .box-accordian .box-job .head-job .btn_accordian {
  width: 70px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  border-left: 1px solid rgba(218, 239, 246, 0.4);
}
.wp_career .box-accordian .box-job .head-job .btn_accordian i {
  width: 11px;
  height: 15px;
  font-size: 10px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.wp_career .box-accordian .box-job.active .head-job .btn_accordian i:before {
  content: "\6f";
}
.wp_career .box-accordian .box-job .wp_body-form {
  display: none;
}
.wp_career .box-accordian .box-job .box-descript {
  padding: 52px 22px 37px 15px;
  overflow: hidden;
}
.wp_career .box-accordian .box-job .box-descript .colum {
  padding: 0 40px;
}
.wp_career .box-accordian .box-job .box-descript .colum .box-row {
  margin: 0 0 18px 0;
}
.wp_career .box-accordian .box-job .box-descript .colum .box-row:last-child {
  margin: 0;
}
.wp_career .box-accordian .box-job .box-descript .colum strong {
  display: block;
}
.wp_career .box-accordian .box-job .box-descript .colum ul li {
  margin: 0 0 0 20px;
}
.wp_career .box-accordian .box-job .box-descript .colum ol li {
  margin: 0 0 0 15px;
}
.wp_career .box-accordian .box-job .box-form {
  background-color: #e5f2fa;
  padding: 40px 22px 8px 40px;
  overflow: hidden;
  display: none;
}
.wp_career .box-accordian .box-job .box-form .wp_button {
  position: relative;
  height: 55px;
}
.wp_career .box-accordian .box-job .box-submit {
  padding: 40px 22px 35px 40px;
  background-color: #fff;
  overflow: hidden;
}
.wp_career .box-accordian .box-job .box-submit .wp_button {
  height: 55px;
  position: relative;
}
.wp_career .box-accordian .box-job .box-submit .wp_button button {
  width: 100%;
  height: 55px;
  position: absolute;
  top: 0;
  right: 0;
  border: none;
  background-color: #0379c5;
  color: #fff;
  text-align: center;
  font: 14px/23px "sarabun-regular";
  margin: 0 0 20px 0;
}
.wp_career .box-accordian .box-job .box-submit .wp_button .send_btn {
  display: none;
}
.wp_career .txt_error {
  color: #f22323;
  margin: 0 0 10px 0;
  text-align: center;
  font-style: italic;
}

/***contact page***/
.wp_contact {
  position: relative;
  overflow: hidden;
  background-color: #f3f0f0;
}
.wp_contact .box-location .wp_pic {
  height: 510px;
  position: relative;
  background-image: url(../image/contact/bg2.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
}
.wp_contact .box-location:nth-child(3) .wp_pic {
  background-image: url(../image/contact/bg3.jpg);
}
.wp_contact .box-location:nth-child(4) .wp_pic {
  background-image: url(../image/contact/bg4.jpg);
}
.wp_contact .box-location:first-child .wp_pic {
  height: calc(100vh - 87px);
  background-image: url(../image/contact/bg.jpg);
  background-position: center top;
}
.wp_contact .box-location .box-detail .box-text {
  position: relative;
  padding: 55px 60px 50px 60px;
  margin: -146px 0 92px 0;
  background-color: #fff;
}
.wp_contact .box-location .box-detail .box-text h2 {
  font: 23px/22px "sarabun-light";
  margin: 0 0 20px 0;
}
.wp_contact .box-location .box-detail .box-text h3 {
  font: 13px/20px "sarabun-light";
  color: #0d89ce;
  text-transform: uppercase;
}
.wp_contact .box-location .box-detail .box-text .line {
  width: 49px;
  height: 3px;
  margin: 0 0 23px 0;
  background-color: #0d89ce;
}
.wp_contact .box-location .box-detail .box-text .text {
  line-height: 20px;
  font-size: 13px;
}
.wp_contact .box-location .box-detail .box-text .col-cen .row {
  margin: 0 -25px;
}
.wp_contact .box-location .box-detail .box-text .col-cen .box-rowText {
  margin-bottom: 34px;
  padding: 0 25px;
}
.wp_contact .box-location .box-detail .box-text .col-r {
  position: absolute;
  right: 45px;
  top: 0;
  bottom: 0;
  margin: auto;
}
.wp_contact .box-location .box-detail .box-text .col-r a {
  width: calc(33.33% - 12px);
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  float: right;
  background-color: #0379c5;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  font: 11px/16px "sarabun-light";
  padding: 0;
  margin: 0 0 0 12px;
}
.wp_contact .box-form {
  background: url(../image/contact/bg_form.jpg) right top no-repeat;
  background-color: #fff;
  padding: 100px 58px 80px 58px;
  margin: 0 0 130px 0;
  overflow: hidden;
}
.wp_contact input,
.wp_contact .select,
.wp_contact textarea {
  margin: 0 0 10px 0;
}
.wp_contact textarea {
  height: 185px;
}
.wp_contact button {
  width: 240px;
  height: 55px;
  margin: 0 auto;
  display: block;
  border: none;
  background-color: #0379c5;
  color: #fff;
  text-align: center;
  font: 14px/23px "sarabun-regular";
}
.wp_contact .colum_input {
  padding: 0 30px;
}
.wp_contact .txt_error {
  color: #f22323;
  margin: 50px 0 10px 0;
  text-align: center;
  font-style: italic;
}

/***about page***/
.wp_about {
  position: relative;
  overflow: hidden;
  background-color: #fff;
}
.wp_about .graphic {
  display: none;
}
.wp_about .banner {
  height: calc(100vh - 87px);
  min-height: 638px;
  position: relative;
  background: url(../image/about/bg.jpg) 0 0 no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  -ms-background-size: cover;
}
.wp_about .banner .detail {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #fff;
}
.wp_about .banner .detail h1 {
  margin: 0 0 40px 0;
}
.wp_about .banner .detail .btn-style3,
.wp_about .banner .detail .btn-style3 .icon-vdo {
  width: 80px;
  height: 80px;
}
.wp_about .banner .detail .btn-style3 {
  margin: 0 auto 35px auto;
}
.wp_about .banner .detail .btn-style3 .icon-vdo {
  font-size: 80px;
}
.wp_about .banner .detail .text {
  height: auto;
  max-height: 82px;
  overflow: hidden;
  font: 14px/25px "sarabun-light";
  padding: 0 290px;
  margin: 0 0 55px 0;
}
.wp_about .banner .detail .box-menu {
  padding: 0 100px;
  margin: 0 0 220px 0;
}
.wp_about .banner .detail .box-menu .row {
  margin: 0 -40px;
}
.wp_about .banner .detail .box-menu .item {
  padding: 0 40px;
}
.wp_about .banner .detail .box-menu a {
  width: 100%;
  font: 14px/18px "sarabun-regular";
  color: #fff;
  text-transform: uppercase;
  position: relative;
  display: inline-block;
  padding: 15px;
}
.wp_about .banner .detail .box-menu .line {
  height: 2px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  background-color: #fff;
}
.wp_about .banner .detail .box-menu .line:last-child {
  bottom: 0;
  top: auto;
}

.wp_about .box-detail {
  background: url(../image/about/bg_content.jpg) right 0 no-repeat;
  background-color: #fff !important;
  margin: -220px 0 0 0;
  position: relative;
  overflow: hidden;
}
.wp_about .box-detail img {
  width: 100%;
}
.wp_about .box-detail .box-space {
  position: relative;
  padding: 0;
  margin: 0 auto;
  font: 14px/25px "sarabun-light";
}
.wp_about .box-detail .box-space h2 {
  font: 38px/45px "sarabun-regular";
  margin: 80px 0 50px 0;
  text-align: center;
}
.wp_about .box-detail .box-space h3 {
  font: 19px/25px "sarabun-regular";
  color: #0083cb;
  margin: 0 0 15px 0;
  text-transform: uppercase;
}
.wp_about .box-detail .banner-detail .txt_banner {
  margin: -82px 0 69px 0;
  padding: 45px 35px;
  overflow: hidden;
  color: #fff;
  background-color: #0083cb;
  overflow: hidden;
  position: relative;
}
.wp_about .box-detail .banner-detail .txt_banner .col-l {
  width: 165px;
  float: left;
  margin: 0 45px 0 0;
}
.wp_about .box-detail .banner-detail .txt_banner .col-r {
  width: calc(100% - 210px);
  float: left;
}
.wp_about .box-detail .banner-detail .txt_banner h2 {
  color: #fff;
  font: 28px/30px "sarabun-regular";
}
.wp_about .box-detail .box-normal {
  position: relative;
  padding: 0 0 66px 0;
  margin: 0 0 73px 0; /* border-bottom:1px solid #e0e0e0; */
}
.wp_about.wp_ourvalue .box-detail .box-normal::after {
  content: "";
  width: 1062px;
  max-width: calc(100% - 30px);
  height: 1px;
  display: block;
  background-color: #e0e0e0;
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}
.wp_about .box-detail .box-normal h2 {
  margin: 75px 0 20px 0;
}
.wp_about .box-detail .box-normal .text {
  padding: 0 15px 0 0;
}
.wp_about .box-detail .box-mission {
  margin: 0 0 100px 0;
}
.wp_about .box-detail .box-mission .text {
  padding-right: 150px;
}
.wp_about .box-detail .box-mission .item {
  margin: 30px 0 0 0;
  border: 2px solid #0083cb;
  padding: 28px 34px;
}
.wp_about .box-detail .box-mission .item .text {
  height: 70px;
  overflow: hidden;
  padding-right: 10px;
}
.wp_about .box-detail table tr td {
  vertical-align: middle;
  position: relative;
}

.wp_ourvalue .banner {
  height: calc(100vh - 87px);
  background: none;
  overflow: hidden;
}
.wp_ourvalue .banner .box-vdo {
  width: 100%;
  height: 100%;
  line-height: 0;
  position: relative;
}
.wp_ourvalue .banner .box-vdo video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.wp_ourvalue .banner .box-vdo .overlay_bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
}
.wp_ourvalue .banner .detail .box-menu {
  margin: 0 0 76px 0 !important;
}
.wp_ourvalue .box-detail {
  margin: -76px 0 0 0 !important;
  background-image: none;
}
.wp_ourvalue .box-detail .box-space {
  width: 1062px;
  max-width: calc(100% - 30px);
  margin: 0 auto;
  padding: 0 !important;
}
.wp_ourvalue .box-detail .box-space h2 {
  font: 26px/30px "sarabun-regular";
  margin: 0 0 15px 0;
  text-align: left;
}
.wp_ourvalue .box-detail .box-space .col-vision {
  height: 322px;
}
.wp_ourvalue .box-detail .box-why {
  margin: -17px 0 62px 0;
}
.wp_ourvalue .box-detail .box-why .row {
  margin: 0 -50px;
}
.wp_ourvalue .box-detail .box-why .item {
  margin: 20px 0;
  padding: 0 50px;
}
.wp_ourvalue .box-detail .box-why .item .txt_why {
  position: relative;
  margin: 0 0 12px 0;
  padding-left: 100px;
}
.wp_ourvalue .box-detail .box-why .item .txt_why .text {
  width: 100%;
  margin: 0 20px 0 0;
  padding: 0;
}
.wp_ourvalue .box-detail .box-why .item .txt_why .icon_why {
  width: 80px;
  height: 80px;
  background: 50% 50%/100% no-repeat;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 0;
  color: #007dc8;
  text-align: center;
}
.wp_ourvalue .box-detail .box-why .item .txt_why .icon_why {
  width: 70px;
  height: 100%;
  background: 50% 0/100% no-repeat;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 0;
  color: #007dc8;
  text-align: center;
}
.wp_ourvalue .box-detail .box-why .item .txt_why .icon_why.quality {
  background-image: url("../image/icons/quality.png");
}
.wp_ourvalue .box-detail .box-why .item .txt_why .icon_why.cost {
  background-image: url("../image/icons/cost.png");
}
.wp_ourvalue .box-detail .box-why .item .txt_why .icon_why.delivery {
  background-image: url("../image/icons/delivery.png");
}
.wp_ourvalue .box-detail .box-why .item .txt_why .icon_why.service {
  background-image: url("../image/icons/service.png");
}
.wp_ourvalue .box-detail .box-why .item ul {
  margin-top: 15px;
}
.wp_ourvalue .box-detail .box-why .item ul li {
  list-style-type: none;
  margin: 0 0 5px 0;
  padding: 0 0 0 20px;
  position: relative;
}
.wp_ourvalue .box-detail .box-why .item ul li::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 6px;
  margin: auto;
  background-color: #0083cb;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
}
.wp_ourvalue .box-detail .box-quality p span {
  color: #0d89ce;
}
.wp_ourvalue .box-detail .box-quality .row {
  margin-top: 40px;
}
.wp_ourvalue .box-detail .box-quality .item {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
}
.wp_ourvalue .box-detail .box-quality .item img {
  width: auto;
}
.wp_ourvalue .box-detail .box-quality .caption {
  margin-left: 40px;
}
.wp_ourvalue .box-detail .box-location h3 {
  margin-top: 30px;
}
.wp_ourvalue .box-detail .box-partner {
  background-color: #f3f0f0;
  position: relative;
  padding: 0 0 85px 0;
}
.wp_ourvalue .box-detail .box-partner::before {
  content: "";
  width: 100%;
  height: calc(100% - 46px);
  display: block;
  background-color: #fff;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  position: absolute;
  left: 0;
  top: 0;
}
.wp_ourvalue .box-detail .box-partner .row {
  margin: 0 -25px;
}
.wp_ourvalue .box-detail .box-partner .item {
  padding: 0 25px;
  margin: 0 0 15px 0;
}
.wp_ourvalue .box-detail .box-partner h2 {
  margin: 0 0 40px 0;
}
.wp_ourvalue .box-detail .box-partner .caption {
  color: #006dba;
  margin: 17px 0 0 0;
}
.wp_ourvalue .box-detail .box-pride {
  padding: 0 0 15px 0;
}
.wp_ourvalue .box-detail .box-pride h2 {
  margin: 50px 0 40px 0;
}
.wp_ourvalue .box-detail .box-pride .row {
  margin: 0 -25px;
}
.wp_ourvalue .box-detail .box-pride .item {
  padding: 0 25px;
  margin: 0 0 55px 0;
  text-align: center;
}
.wp_ourvalue .box-detail .box-pride .item .wp_pic {
  border: 1px solid #edebeb;
  margin: 0 0 14px 0;
  line-height: 0;
}
.wp_ourvalue .box-detail .box-pride .item .caption {
  height: 54px;
  overflow: hidden;
}

.wp_milestone {
  background-color: #fff;
}
.wp_milestone .container_lg {
  padding: 0;
}
.wp_milestone .box-detail {
  background-color: transparent;
  margin-bottom: 100px !important;
}
.wp_milestone .box-detail .box-space {
  width: 1062px;
  max-width: calc(100% - 30px);
  padding: 0 0;
  margin: 0 auto;
}
.wp_milestone .box-detail .box-space h2 {
  margin: 80px 0;
}
.wp_milestone .box-detail .table-milestone {
  width: 100%;
}
.wp_milestone .box-detail .table-milestone tr td {
  width: 50%;
  position: relative;
}
.wp_milestone .box-detail .table-milestone tr td .box-text {
  padding: 40px 60px;
}
.wp_milestone .box-detail .table-milestone tr td .txt_year {
  font: 28px/28px "sarabun-regular";
  color: #0083cb;
  margin: 0 0 3px 0;
}
.wp_milestone .box-detail .table-milestone tr td .txt_numYear {
  font: 43px/43px "sarabun-regular";
  color: #0083cb;
  margin: 0 0 18px 0;
}
.wp_milestone .box-detail .table-milestone tr td .text {
  font: 14px/25px "sarabun-light";
}
.wp_milestone .box-detail .table-milestone tr:nth-child(even) td {
  text-align: right;
}
.wp_milestone
  .box-detail
  .table-milestone
  tr:nth-child(odd)
  td:nth-child(even) {
  line-height: 0;
}
.wp_milestone
  .box-detail
  .table-milestone
  tr:nth-child(even)
  td:nth-child(odd) {
  line-height: 0;
  left: 50%;
}
.wp_milestone
  .box-detail
  .table-milestone
  tr:nth-child(even)
  td:nth-child(even) {
  line-height: 0;
  left: -50%;
}

.wp_partner {
  background-color: #fff;
}
.wp_partner .graphic {
  display: none;
}
.wp_partner .container_lg {
  padding: 0;
}
.wp_partner .box-detail {
  background-color: transparent;
  padding-bottom: 0;
  margin-bottom: 82px !important;
}
.wp_partner .box-detail .box-space {
  width: 1370px;
  max-width: calc(100% - 30px);
  padding: 0;
  margin: 0 auto;
}
.wp_partner .box-detail .box-space h3 {
  font: 17px/19px "sarabun-regular";
  margin: 0 0 10px 0;
}
.wp_partner .txt_partner {
  margin: -20px 0 55px 0;
  padding: 0 145px;
  text-align: center;
}
.wp_partner .txt_partner span {
  color: #0083cb;
}
.wp_partner .table-partner tr td {
  padding: 0 30px;
  padding-bottom: 40px;
}
.wp_partner .table-partner .col-l {
  width: 40%;
  line-height: 0;
  left: -20%;
}
.wp_partner .table-partner .col-c {
  width: 40%;
  left: -20%;
}
.wp_partner .table-partner .col-r {
  width: 20%;
  text-align: center;
  left: 80%;
}
.wp_partner .table-partner .col-r img {
  width: auto;
}

.wp_contribute .container_lg {
  padding: 0;
}
.wp_contribute .box-detail {
  background-color: transparent;
  padding-bottom: 100px;
  margin-bottom: 96px !important;
}
.wp_contribute .box-space {
  padding: 0 !important;
}
.wp_contribute .wp_pic {
  background-color: #fff;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  padding-bottom: 55px;
  margin: 0 0 3px;
  line-height: 0;
}
.wp_contribute .wp_pic .txt_banner {
  width: 1062px;
  max-width: calc(100% - 30px);
  margin: -82px auto 0;
  padding: 35px;
  overflow: hidden;
  color: #fff;
  background-color: #0083cb;
  overflow: hidden;
  position: relative;
}
.wp_contribute .box-contribute {
  background-color: #f3f0f0;
  position: relative;
  padding-top: 30px;
  margin: 0;
}
.wp_contribute .box-contribute img {
  width: 100%;
}
.wp_contribute .box-contribute table {
  width: 1062px;
  position: relative;
  margin: 0 auto 30px;
}
.wp_contribute .box-contribute table::before {
  content: "";
  width: 200vw;
  height: 100%;
  display: block;
  background-color: #fff;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  position: absolute;
  left: -100vw;
  top: 0;
}
.wp_contribute .box-contribute table:last-child::before {
  box-shadow: none;
}
.wp_contribute .box-contribute table tr td {
  vertical-align: middle;
  padding: 25px;
  padding-left: 0;
  transition: all 0.5s linear;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
}
.wp_contribute .box-contribute table tr .col-l {
  width: 193px;
}
.wp_contribute .box-contribute table tr .col-l img {
  display: block;
  margin: 0;
}
.wp_contribute .box-contribute table tr .col-r {
  width: calc(100% - 203px);
  padding-right: 149px;
  position: relative;
}
.wp_contribute .box-contribute table tr .col-r h3 {
  font: 20px/27px "sarabun-light";
  color: #006dba;
}
.wp_contribute .box-contribute table tr .col-r .text_contribute {
  padding: 20px 0 0 0;
  margin: 20px 0 0 0;
  border-top: 1px solid #cfcfcf;
  display: none;
}
.wp_contribute .box-contribute table tr .col-r .text_contribute strong {
  display: block;
  margin-top: 20px;
}
.wp_contribute .box-contribute table tr .col-r .text_contribute ul li {
  list-style-type: none;
  margin: 0 0 5px 0;
  padding: 0 0 0 20px;
  position: relative;
}
.wp_contribute .box-contribute table tr .col-r .text_contribute ul li::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 6px;
  margin: auto;
  background-color: #0083cb;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
}
.wp_contribute .box-contribute table tr .col-r .arrow_btn {
  width: 80px;
  height: 100%;
  padding: 0 25px 0 0;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  color: #007dc8;
}
.wp_contribute .box-contribute table tr .col-r .arrow_btn i {
  width: 15px;
  height: 20px;
  display: block;
  position: absolute;
  top: 0;
  right: 44px;
  bottom: 0;
  margin: auto;
}
.wp_contribute .box-contribute table.active .col-l {
  width: 400px;
  vertical-align: top;
}
.wp_contribute .box-contribute table.active .col-r {
  width: calc(100% - 410px);
}
.wp_contribute .box-contribute table.active .col-r i:before {
  content: "\44";
}
.wp_contribute .box-contribute .table-even tr td {
  background: #f3f0f0;
}

/***search page***/
.wp_search {
  position: relative;
  overflow: hidden;
  background-color: #f3f0f0;
}
.wp_search .banner {
  height: 420px;
  background: url(../image/search/bg.jpg) top center no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  -ms-background-size: cover;
}
.wp_search .banner h1 {
  margin: 0 0 55px 0;
  font-size: 53px;
}
.wp_search .banner .box-input {
  margin: 0 0 80px 0;
  position: relative;
}
.wp_search .banner .box-input input {
  height: 55px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: transparent;
  padding: 15px 137px 15px 20px;
  color: #fff;
  font: 16px/18px "sarabun-regular";
}
.wp_search .banner .box-input button {
  width: 117px;
  height: 53px;
  position: absolute;
  top: 1px;
  right: 1px;
  background-color: #005888;
  border: none;
  border-left: 1px solid rgba(255, 255, 255, 0.6);
  color: #fff;
  font: 15px/18px "sarabun-regular";
  text-transform: uppercase;
  text-align: center;
}
.wp_search .box-result {
  position: relative;
  margin: -80px 0 150px 0;
}
.wp_search .box-result table {
  width: 100%;
}
.wp_search .box-result tr td {
  background-color: #fff;
  vertical-align: middle;
}
.wp_search .box-result tr.line_table td {
  background-color: transparent;
  padding: 15px 0;
}
.wp_search .box-result tr td.col-l {
  width: 70%;
  padding: 40px 25px 50px 80px;
}
.wp_search .box-result tr td.col-l h3 {
  font: 20px/26px "sarabun-light";
  color: #0083cb;
}
.wp_search .box-result tr td.col-l .text {
  font: 13px/20px "sarabun-light";
  margin: 20px 0 0 0;
}
.wp_search .box-result tr td.col-l .txt_noresult {
  font: 20px/26px "sarabun-light";
  color: #0083cb;
  padding: 30px 0;
}
.wp_search .box-result tr td.col-r {
  width: 30%;
  padding: 40px 55px 40px 25px;
}
.wp_search .box-result tr td.col-r a {
  width: auto;
  padding: 0 32px 0 0;
  float: right;
  display: block;
  font: 12px/15px "sarabun-regular";
  color: #0083cb !important;
  text-transform: uppercase;
}
.wp_search .box-result tr td.col-r a .icon_inner {
  top: -3px;
}
.wp_search .box-result .paging {
  margin: 70px 0 0 0;
}

/***service page***/
.wp_service {
  position: relative;
  overflow: hidden;
  background-color: #fff;
}
.wp_service .container_lg {
  padding: 0;
}
.wp_service .banner {
  height: calc(100vh - 87px);
  min-height: 638px;
  position: relative;
  overflow: hidden;
}
.wp_service .banner .box-vdo {
  line-height: 0;
  width: 100%;
  height: 100%;
  position: relative;
}
.wp_service .banner .box-vdo video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.wp_service .banner .box-vdo .overlay_bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
}
.wp_service .banner .detail {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #fff;
}
.wp_service .banner .detail h1 {
  margin: 0 0 40px 0;
}
.wp_service .banner .detail .btn-style3,
.wp_service .banner .detail .btn-style3 .icon-vdo {
  width: 75px;
  height: 75px;
}
.wp_service .banner .detail .btn-style3 {
  margin: 0 auto 35px auto;
}
.wp_service .banner .detail .btn-style3 .icon-vdo {
  font-size: 75px;
}
.wp_service .banner .detail .text {
  height: auto;
  max-height: 90px;
  overflow: hidden;
  font: 13px/23px "sarabun-light";
  padding: 0 290px;
  margin: 0 0 55px 0;
}
.wp_service .banner .detail .box-menu {
  margin: 0 0 76px 0 !important;
}
.wp_service .banner .detail .box-menu .row {
  margin: 0 -5px;
}
.wp_service .banner .detail .box-menu .item {
  width: 25%;
  padding: 0 5px;
  float: left;
}
.wp_service .banner .detail .box-menu .item a {
  font: 13px/18px "sarabun-regular";
  color: #fff;
  text-transform: uppercase;
  position: relative;
  display: block;
  padding: 3px 0;
}
.wp_service .banner .detail .box-menu .item a .text_menu {
  height: 83px;
  display: block;
  padding: 15px 10px;
}
.wp_service .banner .detail .box-menu .item a .line {
  height: 2px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  background-color: #fff;
}
.wp_service .banner .detail .box-menu .item a .line:last-child {
  bottom: 0;
  top: auto;
}
.wp_service .box-service {
  background-color: #f3f0f0;
  position: relative;
  margin: -65px 0 150px 0;
}
.wp_service .box-service img {
  width: 100%;
}
.wp_service .box-service table {
  width: 1062px;
  position: relative;
  margin: 0 auto 30px;
}
.wp_service .box-service table::before {
  content: "";
  width: 200vw;
  height: 100%;
  display: block;
  background-color: #fff;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  position: absolute;
  left: -100vw;
  top: 0;
}
.wp_service .box-service table:last-child::before {
  box-shadow: none;
}

.wp_service .box-service table tr td {
  position: relative;
  vertical-align: middle;
  padding: 30px 25px;
  transition: all 0.5s linear;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
}
.wp_service .box-service table tr .col-l {
  width: 193px;
}
.wp_service .box-service table tr .col-l img {
  display: block;
  margin: 0 0 0 10px;
}
.wp_service .box-service table tr .col-r {
  width: calc(100% - 203px);
  padding-right: 149px;
  position: relative;
}
.wp_service .box-service table tr .col-r h3 {
  font: 20px/27px "sarabun-light";
  color: #006dba;
}
.wp_service .box-service table tr .col-r .text_service {
  padding: 20px 0 0 0;
  margin: 20px 0 0 0;
  border-top: 1px solid #cfcfcf;
  display: none;
}
.wp_service .box-service table tr .col-r .text_service strong {
  display: block;
  margin-top: 20px;
}
.wp_service .box-service table tr .col-r .text_service ul {
  margin-top: 15px;
}
.wp_service .box-service table tr .col-r .text_service ul li {
  list-style-type: none;
  margin: 0 0 5px 0;
  padding: 0 0 0 20px;
  position: relative;
}
.wp_service .box-service table tr .col-r .text_service ul li::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 6px;
  margin: auto;
  background-color: #0083cb;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
}
.wp_service .box-service table tr .col-r .arrow_btn {
  width: 80px;
  height: 100%;
  padding: 0 25px 0 0;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  color: #007dc8;
}
.wp_service .box-service table tr .col-r .arrow_btn i {
  width: 15px;
  height: 20px;
  display: block;
  position: absolute;
  top: 0;
  right: 44px;
  bottom: 0;
  margin: auto;
}
.wp_service .box-service table.active .col-l {
  width: 400px;
  vertical-align: top;
}
.wp_service .box-service table.active .col-r {
  width: calc(100% - 410px);
}
.wp_service .box-service table.active .col-r i:before {
  content: "\44";
}
.blog-h1 {
  font-size: 22px;
  color: #000;
  text-align: left;
}
.blog-h2 {
  font-size: 18px;
  color: #000;
}