
/*@import url(animations.css);*/
@import url(bootstrap-grid.css);
@import url(fonts.css);

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
html {
    font-family: sans-serif;
    font-size: 10px;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
    margin: 0;
    padding: 0;
    font-family: Arial, Thonburi, sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 1.5;
    color: #565656;
    background-color: #FFF;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
button,
input,
select,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition: border-color ease-in-out .2s;
    -o-transition: border-color ease-in-out .2s;
    transition: border-color ease-in-out .2s;
}
textarea { resize: vertical;}
button:focus,
textarea,
button { outline: 0;}
button:focus { outline: 0;}
input:focus { outline:0;}
textarea.form-control {
    height: auto;
    padding: 15px;
    text-align: left;
}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    background-color: transparent;
}
input[type="text"]:disabled {
    background: #ddd;
}

input[type="search"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

img {
    border: 0;
    max-width: 100%;
    vertical-align: middle;
}
a {
    color: inherit;
    text-decoration: none;
    -webkit-transition: color ease-in-out .2s;
    -o-transition: color ease-in-out .2s;
    transition: color ease-in-out .2s;
}
a:hover,
a:focus {
    color: inherit;
    text-decoration:none;
}
a:focus {
    outline:0;
    outline-offset:0;
}
p { margin: 0; padding:0; line-height: 1.4;}

a[href^=tel] { 
    outline: none;
    text-decoration: none;
    color: inherit;
    white-space: nowrap;
}
ul, ol, li {
    list-style: none;
    margin: 0;
    padding: 0;
}
h1,.h1,
h2,.h2,
h3,.h3,
h4,.h4 { 
    padding: 0;
    margin: 0;
    line-height:1;
    font-weight: normal;
}
.a-center { text-align:center;}
.a-right {  text-align: right;}


.vertical-center {
    display: table;
    width:100%;
    height: 100%;
}
.content-vertical-top {
    display: table-cell;
    vertical-align: top;
}
.content-vertical-center {
    display: table-cell;
    vertical-align: middle;
}
.content-vertical-bottom {
    display: table-cell;
    vertical-align: bottom;
}
.container {
    max-width: 1140px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 20px;
    padding-left: 20px;
}
/* Header */
.header {
    width: 100%;
    height: 90px;
    overflow: hidden;
    position: relative;
    background-color: #FFF;
    border-bottom: 1px solid #e7e7e7;
    -moz-box-shadow: 0 0 5px #e7e7e7;
    -webkit-box-shadow: 0 0 5px #e7e7e7;
    box-shadow: 0 0 5px #e7e7e7;
}
.header .container {
    position: relative;
}
.header .logo-main { position: absolute; top: 17px; left: 0; z-index: 500; display: block; text-align: center;}
.header .logo-main img { width: 75px; display: block; margin: 0 auto;}
.header .logo-l { width: 20%;}

.nav-main { 
    width: 100%;
    position: absolute;
    left: 0;
    text-align: center;
}
.nav-main ul li { position: relative; padding: 0 15px; display: inline-block;}
.nav-main ul li a {
    position: relative;
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    line-height: 90px; 
    color: #111;
    display: block;
    font-size: 20px;
    overflow: hidden;
}
.nav-main ul li a:after {
    content: '';
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    bottom: -2px;
    left: 0;
    z-index: 100;
    background-color: #5d0e11;
    -webkit-transition: opacity .3s ease,bottom .3s ease;
    -moz-transition: opacity .3s ease,bottom .3s ease;
    -o-transition: opacity .3s ease,bottom .3s ease;
    transition: opacity .3s ease,bottom .3s ease;
}
.nav-main ul li a:hover {
    color: #5d0e11;
}
.nav-main ul li a:hover:after { bottom: 1px;}

/* Footer */
.footer {
    background-color: #f9f9f9;
    border-top: 1px solid #eee;
    border-bottom: 4px solid #868d03;
    padding: 50px 0 30px;
}
.footer .container { max-width: 1140px; margin: 0 auto;}
.navfooter h3 {
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    color: #111;
    margin-bottom: 10px;
}
.navfooter ul li { margin-bottom: 0px;}
.navfooter ul li a {
    color: #999;
    font-size: 13px;
}
.navfooter ul li a:hover { color: #111;}

.footer-bottom { position: relative;}
.footer-bottom .copyright {
    font-size: 12px;
    color: #111;
    text-align: right;
}
.footer-right { text-align: right;}
.footer .logo-footer { text-align: right;}
.footer .logo-footer-center { text-align: center; }
.footer .logo-footer img { width: 75px; display: block; margin: 5px 0 0 auto;}
.link-language {
    white-space: nowrap;
    display: inline-block;
    padding: 3px 10px;
    border: 1px solid #999;
    border-radius: 3px;
    font-size: 11px;
    margin-bottom: 10px;
}
.link-language:hover { color: #333;}

.footer .link-language {
    position: absolute;
    top: -35px;
    right: 15px;
}

.list-social a { color: #111; font-size: 15px; vertical-align: middle; margin-right: 15px;}

/* Section */

.section {
    position: relative;
    overflow: hidden;
    padding-top: 60px;
    padding-bottom: 60px;
}

/* Article Content */
.section-art-detail { padding-top: 30px; padding-bottom: 40px;}
.art-content { 
    max-width: 800px;
    margin: 0 auto;
}
.art-content .shareall { color: #999;}
.art-content .shareall .share-title {
    font-size: 12px;
    color: #111;
    font-weight: bold;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
}
.art-content .shareall a { 
    display: inline-block;
    vertical-align: middle;
    color: #111; 
    font-size: 15px;
    margin-right: 5px;
}
.art-content .shareall .ic-facebook {
    color: #3b5998;
}
.art-content .shareall .ic-twitter { color: #1dcaff;}
.art-content .entry-image { max-width: 800px; margin: 0 auto; text-align: center; margin-bottom: 50px;}
.art-content .entry-image img { display: block; margin: 0 auto;}
.art-content .entry-header { margin-bottom: 15px;}
.art-content .entry-header h1 { 
    font-size: 35px;
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    line-height: 1.1;
    color: #111;
}
.art-content .entry-date { 
    font-weight: bold;
    font-size: 12px; 
    color: #aaa;
    margin-bottom: 25px;
}
.art-content .entry-content { 
    color:#777;
    font-size: 14px;
    line-height: 1.6;
}
.art-content .entry-content h2,
.art-content .entry-content h3,
.art-content .entry-content h4 { color: #333;}
.art-content .entry-content h2 strong,
.art-content .entry-content h3 strong { 
    font-weight: normal; 
    font-family: 'montserratmedium','promptmedium';
}
.art-content .entry-content h2 { margin-top: 25px;}
.art-content .entry-content h3 { 
    font-family: 'montserratmedium','promptmedium';
    font-size:18px; 
    margin-top:25px;
}
.art-content .entry-content img { max-width: 100%;}
.art-content .entry-content ol { display: block; margin:10px 0 20px 20px;}
.art-content .entry-content ol li { list-style: decimal; margin-bottom:8px; line-height: 1.6;}
.art-content .entry-content ul { display: block; margin:10px 0 20px 20px;}
.art-content .entry-content ul li { list-style: disc; margin-bottom:8px; line-height: 1.6;}
.art-content .entry-content a { text-decoration: underline; word-break: break-all; color: #007dde;}
.art-content .entry-content p { margin-top: 20px; line-height: 1.6;}
.art-content .entry-tag-o { margin-top: 30px; margin-bottom: 30px;}
.art-content .link-back {
    display: block;
    margin-bottom: 20px;
}

.entry-tag-o a {
    height: 25px;
    line-height: 22px;
    color: #5d0e11;
    font-size: 12px;
    display: inline-block;
    padding: 0 15px;
    border-radius: 5px;
    margin-right: 5px;
    border: 1px solid #5d0e11;
}

.section-headline { 
    position: relative;
    margin-bottom: 40px; 
}
.section-headline .headline-md {
    font-size: 45px;
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    line-height: 1.2;
    color: #111;
}
.section-headline .headline-sm {
    font-size: 35px;
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    color: #111;
}
.section-headline:after {
    content: '';
    display: block;
    width: 50px;
    height: 3px;
    margin-top: 18px;
    background-color: #5d0e11;
}
.section-headline.noline:after {
    display: none;
}
.section-subheadline { margin-bottom: 35px;}
.section-headline-center { text-align: center;}
.section-headline-center:after {
    margin: 20px auto 0;
    display: block;
}
.section-headline .linkmore { position: absolute; top: 5px; right: 0;}
.section-headline .entry-desc {
    font-family: 'rsubold', Helvetica Neue, Arial, sans-serif;
    font-size: 22px;
    color: #777;
    line-height: 1.3;
}
.section-headline .action-button { margin-top: 40px;}
.section-headline-line {
    border-bottom: 1px solid #eee;
    padding-bottom: 12px;
}

.list-items-news { 
    margin-bottom: 35px;
    position: relative;
    -webkit-transition: ease-in-out .2s;
    -moz-transition: ease-in-out .2s;
    -o-transition: ease-in-out .2s;
    transition: ease-in-out .2s;
}
.list-items-news .entry-img { 
    position: relative;
    overflow: hidden;
    margin-bottom: 18px;
}
.list-items-news .entry-img img {    
    display: block;
    -webkit-transform: translateZ(0);
    -webkit-perspective: 1000;
    -webkit-backface-visibility: hidden;
    -webkit-transition: -webkit-transform .3s;
    -moz-transition: -moz-transform .3s;
    transition: transform .3s;
}
.list-items-news:hover .entry-img img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transform: scale(1.05);
}
.list-items-news.no-action:hover .entry-img img {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    transform: scale(1);
}
.list-items-news .entry-caption {
    color: #5a5a5a;
}
.list-items-news .entry-caption h3 { 
    min-height:55px;
    overflow: hidden;
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    font-size: 17px;
    line-height: 1.4;
    color: #111;
    margin-bottom: 8px;
    white-space: normal;
}
.list-items-news .entry-date { font-size: 12px; font-weight: bold; color: #aaa;}

.box-vision {
    position: relative;
    display: block; 
    margin: 30px 0 0 auto;
}
.box-vision .img-cover {
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    background-image: url(../home/img/bg-vision.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.box-vision .img-cover img { width: 100%;}
.box-vision .inner-box {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 100;
    padding: 45px;
}
.box-vision h3 {
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    color: #5d0e11;
    font-size: 30px;
    line-height: 1.1;
    margin: 10px 0 30px;
}
.box-vision p {
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    font-size: 14px;
    color: #999;
}

.lineend {
    width: 100%;
    display: block;
    height: 1px;
    background-color: #eee;
}

.section-bggray {
    background-color: #fafafa;
}

.swiper-slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.swiper-slide img { width: 100%;}
.swiper-slide .boxes-grid { position: relative; padding: 1px;}
.swiper-slide .boxes-grid a { display: block;}
.swiper-slide .boxes-grid:hover { opacity: 0.9;}
.swiper-slide .boxes-grid .caption {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: #FFF;
    padding:30px;
}
.swiper-slide .boxes-grid .caption h3 { font-size:35px; margin-bottom: 5px;}
.swiper-slide .boxes-grid .caption p { font-size: 16px;}
.swiper-slide .col-2 { 
    width:25%;
    float: left; 
}
.swiper-slide .col-2 .caption h3 { font-size:25px; }
.swiper-slide .col-2 .caption p { font-size:14px; }
.swiper-slide .col-4 { float: left; width:50%;}
.swiper-slide .col-4 .boxes-grid { 
    border-left: 0;
    border-right: 0;
}

.swiper-pagination { z-index: 10000;}
.swiper-pagination-bullet {
    width:35px;
    height:3px;
    border-radius:1px;
    opacity: 1;
    background: rgba(119, 119, 119, 0.50);
}
.swiper-pagination-bullet-active { background: #5d0e11;}
.swiper-container-horizontal>.swiper-pagination { bottom: 20px;}

.hero-img { width: 100%; display: block; }
.hero-slider { position: relative;}
.hero-slider .hero-content { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    top: 0; 
    left: 0;
    z-index: 510;
}
.hero-slider .hero-content .container { 
    height: 100%;
}
.hero-slider .hero-content .content-area { max-width: 600px; color: #111;}
.hero-slider .hero-content .content-area.area-center { margin: 0 auto; text-align: center;}
.hero-slider .hero-content .content-area.area-right { margin: 0 0 0 auto}
.hero-slider .hero-content .content-area .heading-h1 { 
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    font-size: 45px;
    margin-bottom: 15px;
    line-height: 1.1;
    color: #5d0e11;
}
.hero-slider .hero-content .content-area p, .hero-slider .hero-content .content-area .desc { 
    margin-bottom: 25px;
    font-family: Helvetica Neue, Arial, sans-serif;
    font-size: 18px;
    line-height: 1.6;
}
.hero-slider .hero-content .content-area.c-white,
.hero-slider .hero-content .content-area.c-white p,
.hero-slider .hero-content .content-area.c-white h1,
.hero-slider .hero-content .content-area.c-white h2,
.hero-slider .hero-content .content-area.c-white .heading-h1,
.hero-slider .hero-content .content-area.c-white .headline-lg { color:#FFF;}
.hero-slider .hero-content .content-area.c-black { color: #333;}
.hero-slider .a-action { margin-top: 40px;}
.hero-slider .a-action a { margin: 0 6px;}
.hero-slider a.button {
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    font-size: 15px;
    line-height: 1;
    padding: 10px 25px;
    border-radius: 4px;
    background-color: #5d0e11;
    font-weight: bold;
    color: #FFF;
}
.hero-content .content-area { 
    display: block;
    position: relative;
}
.swiper-container-horizontal>.swiper-pagination-progressbar, .swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { bottom:0; top: inherit;}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    top: inherit;
    bottom: 0;
    background: #e1171d;
}

.section-solutions .item-solutions-container { max-width: 1024px; margin-left: auto; margin-right: auto;}
.section-solutions .item-solutions {
    background-color: #f9f9f9;
    border: 1px solid #ededed;
    border-radius: 5px;
    padding: 45px 35px;
    overflow: hidden;
    margin-bottom: 20px;
    display: block;
    transition: all .5s ease-in-out;
}
.section-solutions .item-solutions .icon { width: 50px; min-height: 60px;}
.section-solutions .item-solutions .icon svg {
    fill: #5d0e11;
    width: 35px;
    height: 35px;
}
.section-solutions .item-solutions h3 {
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    font-size: 22px;
    line-height: 1.2;
    color: #111;
    min-height: 70px;
}
.section-solutions .item-solutions .desc { 
    min-height: 115px; 
    color: #999; 
    font-size: 14px;
}
.section-solutions .item-solutions .link-more { 
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    font-size: 14px; 
    color: #5d0e11; 
}
.section-solutions .item-solutions:hover {
    background: rgba(248,80,50,1);
    background: -moz-linear-gradient(-45deg, rgba(248,80,50,1) 0%, rgba(241,20,42,1) 33%, rgba(246,41,12,1) 51%, rgba(241,20,42,1) 72%, rgba(240,47,23,1) 84%, rgba(231,56,39,1) 100%);
    background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(248,80,50,1)), color-stop(33%, rgba(241,20,42,1)), color-stop(51%, rgba(246,41,12,1)), color-stop(72%, rgba(241,20,42,1)), color-stop(84%, rgba(240,47,23,1)), color-stop(100%, rgba(231,56,39,1)));
    background: -webkit-linear-gradient(-45deg, rgba(248,80,50,1) 0%, rgba(241,20,42,1) 33%, rgba(246,41,12,1) 51%, rgba(241,20,42,1) 72%, rgba(240,47,23,1) 84%, rgba(231,56,39,1) 100%);
    background: -o-linear-gradient(-45deg, rgba(248,80,50,1) 0%, rgba(241,20,42,1) 33%, rgba(246,41,12,1) 51%, rgba(241,20,42,1) 72%, rgba(240,47,23,1) 84%, rgba(231,56,39,1) 100%);
    background: -ms-linear-gradient(-45deg, rgba(248,80,50,1) 0%, rgba(241,20,42,1) 33%, rgba(246,41,12,1) 51%, rgba(241,20,42,1) 72%, rgba(240,47,23,1) 84%, rgba(231,56,39,1) 100%);
    background: linear-gradient(135deg, rgba(248,80,50,1) 0%, rgba(241,20,42,1) 33%, rgba(246,41,12,1) 51%, rgba(241,20,42,1) 72%, rgba(240,47,23,1) 84%, rgba(231,56,39,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827', GradientType=1 );
}
.section-solutions .item-solutions:hover h3 { color: #FFF;}
.section-solutions .item-solutions:hover .desc { color: #FFF;}
.section-solutions .item-solutions:hover .link-more { color: #FFF; text-decoration: underline;}
.section-solutions .item-solutions:hover .icon svg { fill: #FFF;}

.link-more { 
    font-weight: bold;
    font-size: 14px; 
    color: #5d0e11; 
}
.link-more:after {
    content: "\e901";
    font-family: 'iconfont';
    display: inline-block;
    vertical-align: middle;
    font-size: 11px;
    margin-left: 5px;
}
.link-more:hover { color: #5d0e11; text-decoration: underline;}

.link-back { 
    font-weight: bold;
    font-size: 14px; 
    color: #5d0e11; 
}
.link-back:before {
    content: "\e908";
    font-family: 'iconfont';
    display: inline-block;
    vertical-align: middle;
    font-size: 11px;
    margin-right: 5px;
}
.link-back:hover { color: #5d0e11; text-decoration: underline;}

.row-logo {
    max-width: 740px;
    margin: 0 auto;
    display: block;
    text-align: center;
}
.logo-item { display: inline-block; padding: 20px 30px;}

.button-ouline {
    font-size: 14px;
    font-weight: bold;
    padding: 8px 22px;
    color: #5d0e11;
    display: inline-block;
    border-radius: 5px;
    border: 1px solid #5d0e11;
}
.button-ouline:hover { background-color:#5d0e11; color: #FFF; }

.item-service {
    width: 100%;
    position: relative;
    font-size: 0;
    overflow: hidden;
    border: 1px solid #ececec;
    margin-bottom: 25px;
    border-radius: 6px;
}
.item-service .td-col { 
    position: relative; width: 50%; 
    display: inline-block;
    vertical-align: middle;
}
.item-service .td-col:last-child:before {
    content: '';
    display: block;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    background-color: #5d0e11;
}
.col-md-6:nth-child(3n) .td-col:first-child:before {
   content: '';
    display: block;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: inherit;
    right: 0;
    z-index: 100;
    background-color: #5d0e11;
}
.col-md-6:nth-child(3n) .td-col:last-child:before {
    display: none;
}
.col-md-6:nth-child(4n) .td-col:first-child:before {
   content: '';
    display: block;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: inherit;
    right: 0;
    z-index: 100;
    background-color: #5d0e11;
}
.col-md-6:nth-child(4n) .td-col:last-child:before {
    display: none;
}
.item-service .item-content { color: #999; font-size: 14px; padding: 40px;}
.item-service .item-content h3 {
    font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
    font-size: 20px;
    margin-bottom: 10px;
    line-height: 1.1;
    color: #111;
}

.visible-w767 { display: none!important;}

.header .list-social, .header .link-language {
    display: none;
}

.address-footer { font-size: 12px;}
.address-footer strong { font-size: 13px;}
.address-footer p { margin-bottom: 5px;}
.address-footer a:hover { text-decoration: underline;}

.section-service-m { display: none;}

.gallery-news { margin-top: 40px;}
.gallery-news .row {
    margin-left: -4px; margin-right: -4px;
}
.gallery-news .col-gallery { overflow: hidden; position: relative; padding-left: 4px; padding-right: 4px;}
.gallery-news .col-gallery a { overflow: hidden;  position: relative; display: block; margin-bottom: 8px;}
.gallery-news .col-gallery a:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    left: 0;
    transition: all .2s ease-in-out;
}
.gallery-news .col-gallery:hover a:after {
    background-color: rgba(0, 0, 0, 0.12);
}
.gallery-news .col-gallery img {
    display: block;
    -webkit-transform: translateZ(0);
    -webkit-perspective: 1000;
    -webkit-backface-visibility: hidden;
    -webkit-transition: -webkit-transform .3s;
    -moz-transition: -moz-transform .3s;
    transition: transform .3s;
}
.gallery-news .col-gallery:hover img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transform: scale(1.05);
}

.slbArrow { opacity: 1;}
.slbCloseBtn { color: #FFF;}

.section-career { position: relative;}
.section-photo {
    background-position: center;
    background-repeat: no-repeat;
}
.section-career .container { position: relative; height: 100%;}
.section-career .section-inner { 
    width: 100%; 
    height: 100%;
    position: absolute; 
    top: 0; 
    z-index: 105;
}
.section-career .section-headline { margin-bottom: 30px;}
.section-career .area-content {
    max-width: 55%;
    padding: 15px 0;
    margin: 0 auto;
    text-align: center;
}
.section-career .area-content p { margin-top: 15px;}

a.button {
    display: inline-block;
    padding: 14px 40px;
    color: #FFF;
    line-height: 1;
    border-radius: 6px;
    text-decoration: none;
    background-color: #5d0e11;
}

/* Media Queries */

@media screen and (min-width:1366px) {
    
    .hero-slider .hero-content .content-area { max-width:50%;}
    .hero-slider .hero-content .content-area .heading-h1 { font-size: 60px;}
    
}

@media screen and (max-width:1024px) {
    
    .section-headline .headline-md { font-size: 40px;}

    .hero-slider .hero-content .content-area .heading-h1 { font-size:40px;}
    
    .section-solutions .item-solutions { padding: 25px;}
    .section-solutions .item-solutions h3 { font-size: 20px;}
    
    .item-service .item-content { padding: 30px;}
}

@media screen and (max-width:980px) {

    .header .logo-l { width: 30%;}
    
    .nav-main ul li a { font-size: 18px;}
    
    .section-headline .headline-md { font-size: 35px;}
    .section-headline { text-align: center;}
    .section-headline:after { margin-top: 15px; margin-left: auto; margin-right: auto;}
    
    .section { padding: 50px 0;}
    
    .hero-slider .hero-content .content-area .heading-h1 { font-size:30px;}
    
    .box-vision { max-width: 500px; margin: 60px auto;}

    .item-service .item-content { padding: 10px 15px;}
    .item-service .item-content h3 { font-size: 18px;}
    
    .section-career .section-headline { margin-bottom: 20px;}
}

@media screen and (max-width:767px) {
    
    .main { padding-top: 55px;}
    
    .header { width: 100%; height: 55px; position: fixed; top: 0; z-index: 90000;}
    .header .logo-main { top: 10px;}
    .header .logo-main img { width: 35px;}
    .header .logo-l { width: 20%;}
    
    .header .list-social { display: block;}
    .header .link-language {
        display: inline-block;
    }
    
    .section-headline span { display: block;}
    
    .mnu-btn {
        position: fixed;
        top: 18px;
        right: 20px;
        height: 27px;
        width: 30px;
        cursor: pointer;
        z-index: 1500;
        display: block;
        -webkit-transition: opacity .25s ease;
        transition: opacity .25s ease;
    }
    .mnu-btn span {
        width: 100%;
        height: 3px;
        position: absolute;
        top: 0;
        left: 0;
        border: none;
        background: #111;
        -webkit-transition: all .35s ease;
        transition: all .35s ease;
        cursor: pointer;
    }
    .mnu-btn span:nth-of-type(2) { top: 8px; }
    .mnu-btn span:nth-of-type(3) { top: 16px; }
    .mnu-btn.active .top {
        -webkit-transform: translateY(9px) translateX(0) rotate(45deg);
        transform: translateY(9px) translateX(0) rotate(45deg);
        background: #111;
    }
    .mnu-btn.active .middle {
        opacity: 0;
        background: #111;
    }
    .mnu-btn.active .bottom {
        -webkit-transform: translateY(-7px) translateX(0) rotate(-45deg);
        transform: translateY(-7px) translateX(0) rotate(-45deg);
        background: #111;
    }
    .overlay {
        position: fixed;
        background: #FFF;
        top: 0px;
        left: 0;
        width: 100%;
        height: 0%;
        opacity: 0;
        padding-top: 80px;
        z-index: 5000;
        visibility: hidden;
        -webkit-transition: opacity .5s, visibility .5s, height .5s;
        transition: opacity .5s, visibility .5s, height .5s;
        overflow: hidden;
    }

    .header.open .overlay {
        opacity: 1;
        visibility: visible;
        height: 100%;
        pointer-events: all;
    }
    .header.open .logo-main { position: fixed; z-index: 6000; display: block;}
    .header.open .mnu-btn {
        z-index: 9000;
    }
    
    .nav-main {  position: relative; text-align: left;}
    .nav-main ul li { display: block; padding: 0; padding: 6px 0;}
    .nav-main ul li a { color: #111; font-size: 22px; line-height: inherit;}
    .nav-main ul li a:after { display: none;}
    
    .group-menu { padding: 6px 50px;}
    
    .header .list-social { padding: 20px 0;}
    .header .list-social a { font-size: 20px;}
    
    .footer { padding: 20px 0;}
    .footernav { display: none;}
    .footer-right { text-align: center;}
    .list-social a { font-size: 18px;}
    .footer .link-language { display: none;}
    .footer-bottom { margin-top: 0;}
    
    .footer .logo-footer { display: none;}
    
    .section { padding: 40px 0;}
    
    .section-headline .headline-md {
        font-size: 30px;
    }
    .section-headline .headline-sm {
        font-size: 28px;
    }
    .section-headline { text-align: center;}
    .section-headline:after { margin-top: 15px; margin-left: auto; margin-right: auto;}
    
    .swiper-slide { display: inline-block; }
    .swiper-pagination-bullet  { width: 25px;}
    .swiper-slide .boxes-grid .caption { display: none;}
    
    .hero-slider .hero-content { position: relative; border-bottom: 2px solid #eee; padding-bottom: 20px;}
    .hero-slider .hero-content .container { height:inherit;}
    .hero-slider .hero-content .content-area { max-width: 100%; top: 0; padding: 25px 0 40px; }
    .hero-slider .hero-content .content-area .desc { color: #111!important;}
    .hero-slider .hero-content .content-area p, .hero-slider .hero-content .content-area .desc { 
        font-size: 16px;
    }
    .hero-slider .hero-content a.button-outline,
    .hero-slider .hero-content .button-outline { padding: 0 22px;}
    .hero-slider  a.button-outline-w, .button-outline-w { 
        color: #111; border-color: #111;
    }

    .section-solutions { padding-bottom: 20px;}
    .section-solutions .item-solutions-container{ margin-left: -30px; margin-right: -30px;}
    .section-solutions .item-solutions-container .row { margin: 0;}
    .section-solutions .item-solutions  { 
        border-right: 0;
        border-left: 0;
        border-radius: 0; 
        margin-bottom: 1px;
        padding: 20px;
    }
    .section-solutions .item-solutions { width: 100%; display: table;}
    .section-solutions .item-solutions .icon,
    .section-solutions .item-solutions .entry-desc { display: table-cell; vertical-align: middle;}
    .section-solutions .item-solutions .entry-desc { padding-left: 20px;}
    .section-solutions .item-solutions h3 { min-height: inherit; margin-bottom: 5px;}
    .section-solutions .item-solutions h3 { font-size: 20px;}
    .section-solutions .item-solutions .desc { display: none;}
    .section-solutions .item-solutions .a-action { 
        font-family: 'noto_sansbold','NotoSansThaiUIBold', Arial, sans-serif;
        font-size: 14px;}
    
    .row-logo { font-size: 0;}
    .logo-item { width: 33.333336%; padding: 20px 0;}
    
    .ac-action-m-center { text-align: center;}
    
    .section-feednews { padding-bottom: 0;}
    .feednews-container .row { margin-left: -15px; margin-right: -15px;}
    .list-items-news { display: table; margin-bottom: 20px;}
    .list-items-news .entry-img,
    .list-items-news .entry-caption { display: table-cell; vertical-align: top;}
    .list-items-news .entry-img { width: 40%}
    .list-items-news .entry-caption { width: 60%; padding-left: 20px;}
    .list-items-news .entry-caption h3 { font-size: 13px; line-height: 1.4;}
    
    .box-vision { margin-left: -22px; margin-right: -22px; margin-bottom: 0;}
    .box-vision .inner-box { padding: 40px 20px;}
    .box-vision .img-cover { border-radius: 0; border: 0;}
    .box-vision h3 { font-size: 25px;}
    
    .section-art-detail { padding-top: 0;}
    .art-content .entry-image { margin-left: -20px; margin-right: -20px; margin-bottom: 30px;}
    .art-content .shareall a { font-size: 18px;}
    .art-content .entry-header h1 { font-size: 25px;}
    
    .hidden-w767 { display: none!important;}
    .visible-w767 { display: block!important;}
    
    .section-service-desktop { display: none;}
    .section-service-m .item-service .td-col {
        width: 100%;
        display: block;
    }
    .section-service-m .item-service .td-col:last-child:after {
        width: 100%;
        height: 4px;
    }
    .section-service-m { display: block;}
    .section-service-m .item-service .item-content { min-height: 160px; padding: 30px 20px;}
    .item-service .item-content h3 { font-size: 22px;}

    .address-footer { margin-bottom: 20px;}
    .footer-bottom .copyright { padding-top: 4px;}
    
    /* Career */
    .section-career .section-inner { position: relative; width: 100%;}
    .section-career .area-content { max-width: 100%; padding: 30px 0;}
}
@media screen and (max-width:766px) {
    .header .logo-l { width: 40%;}
    .feednews-container .row { margin-left: 30px; margin-right: -15px;}
    .box-vision { margin-left: -22px; margin-right: -22px; margin-bottom: 0;}
    .box-vision .inner-box { padding: 20px 20px;}
    .box-vision .img-cover { border-radius: 0; border: 0;}
    .box-vision h3 { font-size: 25px;}
}
