.clearfix:before, .clearfix:after {
    content: " ";
    display:  block;
	 clear:  both;

}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
a{
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
	text-decoration:none !important;
  cursor:pointer;
}
a:hover{
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
	text-decoration:none !important;
  cursor:pointer;
}
a:focus{
outline:none !important;
}
.nopad{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
html,body {margin: 0; padding: 0; max-width: 100%; height:100%; font-family: 'Kanit', sans-serif; font-weight:400 !important; font-size:20px; line-height:1.42857143; color:#333; display:block; }
h1, h2, h3, h4, h5, h6 { margin:0; padding:0; font-weight:normal;}
h1{font-size:80px !important;}
h2{font-size:50px !important;}
h3{font-size:40px !important;}
h4{font-size:30px !important;}
h5{font-size:25px !important;}
h6{font-size:20px !important;}
ul{ list-style:none; padding:0; margin:0;}
li{ list-style:none; padding:0; margin:0;}
button, input, optgroup, select, textarea {
  margin: 0;
}
img {
  vertical-align: middle; border: 0;
}
fieldset{border:0;}
figure{margin:0;}
.fr{ float: right !important;}
.fl{ float: left !important;}
p{ padding:0; margin:0;}
.img-100{width:100%;}
.img-auto{width:auto;}
.no-pad{ padding:0 !important;}
.no-mar{margin:0 !important; }
.no-mar-b{ margin-bottom:0 !important;}
.no-border-b{ border-bottom:0 !important;}
.no-border{border:0 !important;}
.m-auto{ margin:auto !important;}
.space{ display:block;}
.text-center{ text-align:center !important;}
.text-right{ text-align:right !important;}
.desktop{display:block;}
.mobile{display:none;}
.relative{ position:relative;}
.absolute{ position:absolute !important;}
.kanit-t{font-weight:100; font-family: 'Kanit', sans-serif;}
.kanit-el{font-weight:200; font-family: 'Kanit', sans-serif;}
.kanit-l{font-weight:300; font-family: 'Kanit', sans-serif;}
.kanit-r{font-weight:400; font-family: 'Kanit', sans-serif;}
.kanit-m{font-weight:500; font-family: 'Kanit', sans-serif;}
.kanit-sb{font-weight:600; font-family: 'Kanit', sans-serif;}
.kanit-b{font-weight:700; font-family: 'Kanit', sans-serif;}

#mm-desktop{ display:inline-block !important;}
#mm-mobile{display:none !important;}



.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid \9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.btn-group > .btn, .btn-group-vertical > .btn {
  position: relative;
  float: left;
}
.btn-group > .btn:first-child {
  margin-left: 0;
}
.btn .caret {
  margin-left: 0;
}
.pull-left {
  float: left !important;
}


/*************** bootstrap ******************/

* {
  -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;
}

body {font-family: Tahoma, Arial, sans-serif; line-height: 1.42857143;}

.btn-group, .btn-group-vertical {position: relative; display: inline-block; vertical-align: middle;}

.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
  float: left; min-height:1px;
}
.col-md-12 {width:100%;}
.col-md-11 {width:91.66666667%;}
.col-md-10 {width:83.33333333%;}
.col-md-9 {width:75%;}
.col-md-8 {width:66.66666667%;}
.col-md-7 {width:58.33333333%;}
.col-md-6 {width:50%;}
.col-md-5 {width:41.66666667%;}
.col-md-4 {width:33.33333333%;}
.col-md-3 {width:25%;}
.col-md-2 {width:16.66666667%;}
.col-md-1 {width:8.33333333%;}

button {-webkit-appearance:button; text-transform:none; overflow:visible; cursor:pointer;}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block;
}

.btn-group > .btn:first-child { margin-left: 0;}
.btn-group > .btn, .btn-group-vertical > .btn {position:relative; float:left;}
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  white-space: nowrap;
  cursor: pointer;
}
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.btn .caret {margin-left:0; display:inline-block;}
.open > .dropdown-menu{display:block;}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 14px;
  text-align: left;
  list-style: none;
  background-color: #fff;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 4px;
  /* -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
          box-shadow: 0 6px 12px rgba(0, 0, 0, .175); */
}
.dropdown-menu > li > a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color: #262626;
  text-decoration: none;
  background-color: #f5f5f5;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color: #fff;
  text-decoration: none;
  background-color: #337ab7;
  outline: 0;
}
.dropdown-menu > .disabled > a,
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  color: #777;
}
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  text-decoration: none;
  cursor: not-allowed;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.bootstrap-select.btn-group .dropdown-menu li a {
    cursor: pointer;
}
.pull-left {float:left !important;}

.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
  -o-transition: opacity .15s linear;
  transition: opacity .15s linear;
}
.fade.in {
  opacity: 1;
}
.tab-content > .tab-pane {
  display: none;
}
.tab-content > .active {
  display: block;
}

/*************** bootstrap ******************/


.warp{width:100%; margin:auto; display:block;}
.main{width:1140px; margin:auto; display:block;}
main, header, footer{ width:100%; margin:auto; display:block; float:left;}

form .btn-group{margin:0; padding:10px 0; text-align:left; }
form .btn-group label.btn{ padding-right:25px !important; }
form .btn-group label.btn span { color:#FFF; padding:0 0 0 5px; font-size:17px; }
form .btn-group label input[type="radio"] ~ i.fa.fa-square{color:#CCC; font-size:22px; display:inline;}
/* form .btn-group label input[type="radio"] ~ i.fa.fa-dot-circle-o{display:none;} */
form .btn-group label input[type="radio"] ~ i.fa-check-square{display:none;}
form .btn-group label input[type="radio"]:checked ~ i.fa.fa-square{display:none;}
form .btn-group label input[type="radio"]:checked ~ i.fa.fa-check-square{ font-size:22px; color:#0BAC85; display:inline;}
form .btn-group label input[type="radio"]:checked ~ i.fa-check-square{ font-size:22px; color:#0BAC85; display:inline;}
form .btn-group label:hover input[type="radio"] ~ i.fa-check-square {color:#FFF; background:#FFF; }
form .btn-group label:hover input[type="radio"]:checked ~ i.fa-check-square{  color:#0BAC85; background:none; display:inline;}

form .gcode{width:100%; display:inline-block;}

.main17{width:1700px; margin:auto; display:block;}
.main14{width:1400px; margin:auto; display:block;}

header{width:100%; text-align:center; display:block; float:left;}
header .main14{margin:20px auto;}
header .logo{width:222px; margin:0; display:inline-block;}
header .logo img{width:100%;}
header .farme{width:100%; display:block; position:relative;}
header .social{width:auto; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%);}
header .social p{line-height:50px; font-size:17px; color:#666; display:block; float:left;}
header .social a{width:50px; margin-left:16px; display:block; float:left;}
/* header .social:hover{color:#000; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;} */
header .social img{width:100%;}

header .lang{width:auto; color:#666; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
header .lang a{ line-height:30px; padding:0 12px; font-size:20px; color:#666; display:block; float:left; position:relative;
  transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
header .lang a:hover, header .lang a.active{color:#D90000; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
header .lang a::after{content:""; width:1px; height:12px; background:#666; display:block; float:left; position:absolute; right:0; top:50%; transform:translateY(-50%);}
header .lang a:last-child::after{display:none;}

header nav{width:100%; height:70px; text-align:center; background:#D90000; display:block; overflow:hidden;}
header nav a{width:auto; line-height:70px; margin:0 22px; color:#FFF; display:inline-block; position:relative;}
header nav a::after{content:""; width:100%; height:4px; background:#FFF; position:absolute; bottom:-4px; left:0; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
header nav a:hover::after, header nav a.active::after{bottom:0; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

main{width:100%; display:block; float:left;}

.m-topic{width:100%; height:200px; position:relative; background:url(../images/bg-mtopic.jpg) no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
display:block; float:left;}
.m-topic h2{width:100%; line-height:60px; color:#FFF; font-style:italic; text-align:center; display:block; position:absolute; z-index:50; left:50%; top:50%; transform:translate(-50%, -50%);}

.h-topic{width:100%; padding:0 0 46px 0; margin-bottom:33px; color:#000; text-align:center; font-style:italic; display:block; position:relative;}
.h-topic::after{content:""; width:40px; height:2px; background:#D90000; display:block; position:absolute; bottom:0; left:50%; transform:translateX(-50%);}

.h-banner{width:100%; position:relative; display:block; float:left;}
.h-banner li{position:relative;}
.h-banner .pic{width:100%; height:600px; display:block; float:left; position:relative;
background-position:center;
background-repeat:no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.h-banner .pic.banner1{background-image:url(../images/banner-Medical-Staff.jpg);}
.h-banner .pic.banner2{background-image:url(../images/banner-Ambulance-Standard.jpg);}
.h-banner .pic.banner3{background-image:url(../images/banner-Ambulance-Premium.jpg);}
.h-banner .pic.banner4{background-image:url(../images/banner-Covid-19_ATK.jpg);}
.h-banner .pic.banner5{background-image:url(../images/banner-Covid-19_RT-PCR.jpg);}
.h-banner .pic.banner6{background-image:url(../images/banner-Sanitizer_Sterilizer.jpg);}
.h-banner .pic.banner7{background-image:url(../images/banner-Medical-Mask.jpg);}
.h-banner .pic.banner8{background-image:url(../images/banner-Alcohol-Hand-Sanitizer.jpg);}
.h-banner .pic img{width:100%;}
.h-banner span{width:auto; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:99;}
.h-banner span h1{width:100%; padding:0; color:#FFF; line-height:84px; text-align:center; display:block; float:left;}
.h-banner span h3{ line-height:52px; padding:0 0 30px 0; margin-bottom:25px !important; color:#FFF !important; float:left;}
.h-banner span h3::after{background:#D90000;}
.h-banner .content .v-desktop{display:block;}
.h-banner .content .v-mobile{display:none;}
.h-banner .lSSlideOuter .lSPager { text-align:center; display:inline-block; position:absolute; bottom:38px; z-index:51;}
.h-banner .lSSlideOuter .lSPager.lSpg{width:100%; text-align:center; display:inline-block;}
.h-banner .lSSlideOuter .lSPager.lSpg > li a{border:2px #CCC solid; }
.h-banner .lSSlideOuter .lSPager.lSpg > li:hover a, .h-banner .lSSlideOuter .lSPager.lSpg > li.active a {
    background:#D90000;
    border:2px #FFF solid;
}
.h-banner .lSAction > a {
width: 60px;
height: 60px;
display: block;
top: 50%;
transform:translateY(-50%);
cursor: pointer;
position: absolute;
z-index: 99;
opacity: 1;
-webkit-transition: opacity 0.35s linear 0s;
transition: opacity 0.35s linear 0s;
background:rgba(0,0,0,0.6);
text-align:center;
line-height:60px;
border-radius:50%;
}
.h-banner .lSAction > a:hover {
    opacity: 1;background:rgba(0,0,0,1);
}
.h-banner .lSAction > .lSPrev{left:40px; position:absolute;}
.h-banner .lSAction > .lSPrev::before{content:""; width:60px; height:60px; background:url(../images/arrow-prev.png) no-repeat center center; display:block;}
.h-banner .lSAction > .lSNext{right:40px; position:absolute;}
.h-banner .lSAction > .lSNext::before{content:""; width:60px; height:60px; background:url(../images/arrow-next.png) no-repeat center center; display:block;}

.h-ourservice{width:100%; padding:52px 0 85px 0; display:block; float:left;}
.h-ourservice ul{width:100%; display:block; float:left;}
.h-ourservice ul li{width:25%; padding:15px; display:block; float:left;}
.h-ourservice ul li a{width:100%; border:1px #CCC solid; display:block; float:left;
 transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s;}
.h-ourservice ul li a:hover{border:1px #AAA solid; transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s;
-webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.32);
-moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.32);
box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.32);}
.h-ourservice ul li a .topic{width:100%; padding:15px; text-align:center; display:block; float:left;}
.h-ourservice ul li a .topic em{width:116px; margin:18px; display:inline-block;}
.h-ourservice ul li a .topic em img{width:100%;}
.h-ourservice ul li a .topic h5{width:100%; line-height:35px; color:#000; text-align:center; display:block;}
.h-ourservice ul li a .topic h5.two{
  height:70px; position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
}
.h-ourservice ul li a .content{width:100%; height:180px; padding:15px; color:#333; text-align:center; display:block; float:left; background:rgba(244, 244, 244, 1);
  transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s;}
.h-ourservice ul li a:hover .content{color:#FFF; background:rgba(217, 0, 0, 1); transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s;}
.h-ourservice .btu{width:200px; line-height:52px; color:#000; text-align:center; border:4px solid #D90000; border-radius:3px; display: inline-block;
  transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.h-ourservice .btu:hover{transform:scale(1.1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

#ourservice{width:100%; display:block; float:left;}
#ourservice h5{margin-top:40px !important; text-align:center;}
#ourservice .sslide{width:100%; margin:50px 0 0 0; padding:0 100px; display:block; float:left; position:relative;}
#ourservice .sslide h1{width:auto; padding-top:140px; color:#FFF; display:block; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); z-index:50;}
#ourservice .sslide h1::before{content:""; width:116px; height:103px; display:block; position:absolute; left:50%; top:0; transform: translateX(-50%); background-repeat:no-repeat; background-size:100%;}
#ourservice .sslide .staff::before{background-image:url(../images/icon-Medical-Staff_w.png);}
#ourservice .sslide .am-standard::before{background-image:url(../images/icon-Ambulance-Standard_w.png);}
#ourservice .sslide .am-premium::before{background-image:url(../images/icon-Ambulance-Premium_w.png);}
#ourservice .sslide .covid-atk::before{background-image:url(../images/icon-Covid-19-ATK_w.png);}
#ourservice .sslide .covid-rt::before{background-image:url(../images/icon-Covid-19_RT-PCR_w.png);}
#ourservice .sslide .sterilizer::before{background-image:url(../images/icon-Sanitizer-Sterilizer_w.png);}
#ourservice .sslide .mask::before{background-image:url(../images/icon-Medical-Mask_w.png);}
#ourservice .sslide .alcohol::before{background-image:url(../images/icon-Alcohol-Hand-Sanitizer_w.png);}
#ourservice .sslide li img{width:100%;}
#ourservice .sslide li .pic{width:100%; height:600px; display:block; float:left; position:relative;
background-position:center;
background-repeat:no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#ourservice .sslide li .pic.staff1{background-image:url(../images/pic-Medical-Staff1.jpg);}
#ourservice .sslide li .pic.staff2{background-image:url(../images/pic-Medical-Staff2.jpg);}
#ourservice .sslide li .pic.standard1{background-image:url(../images/pic-Ambulance-Standard1.jpg);}
#ourservice .sslide li .pic.standard2{background-image:url(../images/pic-Ambulance-Standard2.jpg);}
#ourservice .sslide li .pic.premium1{background-image:url(../images/pic-Ambulance-Premium1.jpg);}
#ourservice .sslide li .pic.premium2{background-image:url(../images/pic-Ambulance-Premium2.jpg);}
#ourservice .sslide li .pic.ATK1{background-image:url(../images/pic-Covid-19-ATK1.jpg);}
#ourservice .sslide li .pic.ATK2{background-image:url(../images/pic-Covid-19-ATK2.jpg);}
#ourservice .sslide li .pic.RT-PCR1{background-image:url(../images/pic-Covid-19_RT-PCR1.jpg);}
#ourservice .sslide li .pic.RT-PCR2{background-image:url(../images/pic-Covid-19_RT-PCR2.jpg);}
#ourservice .sslide li .pic.sanitizer1{background-image:url(../images/pic-Sanitizer-Sterilizer1.jpg);}
#ourservice .sslide li .pic.sanitizer2{background-image:url(../images/pic-Sanitizer-Sterilizer2.jpg);}
#ourservice .sslide li .pic.mask1{background-image:url(../images/pic-Medical-Mask1.jpg);}
#ourservice .sslide li .pic.mask2{background-image:url(../images/pic-Medical-Mask2.jpg);}
#ourservice .sslide li .pic.alcohol1{background-image:url(../images/pic-Alcohol-Hand-Sanitizer1.jpg);}
#ourservice .sslide li .pic.alcohol2{background-image:url(../images/pic-Alcohol-Hand-Sanitizer2.jpg);}
#ourservice .sslide li .pic img{width:100%;}
#ourservice .sslide .s-prev{left:20px;}
#ourservice .sslide .s-next{right:20px;}
#ourservice .sslide .s-prev, #ourservice .sslide .s-next{width:60px; height:60px; line-height:60px; text-align:center; cursor:pointer; display:inline-block;
 position:absolute; top:50%;  margin-top:-30px; z-index:99; background:rgba(0,0,0,0.6); border-radius:50%;
 transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;
}
#ourservice .sslide .s-prev:hover, #ourservice .sslide .s-next:hover{ background:rgba(0,0,0,1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#ourservice .sslide .s-prev::after{content:""; width:60px; height:60px; background:url(../images/arrow-prev.png) no-repeat center; display:block;}
#ourservice .sslide .s-next::after{content:""; width:60px; height:60px; background:url(../images/arrow-next.png) no-repeat center; display:block;}
#ourservice .lSSlideOuter .lSPager { text-align:center; display:inline-block; position:absolute; bottom:10px; z-index:51;}
#ourservice .lSSlideOuter .lSPager.lSpg{width:100%; text-align:center; display:inline-block;}
#ourservice .lSSlideOuter .lSPager.lSpg > li a{border:2px #CCC solid; }
#ourservice .lSSlideOuter .lSPager.lSpg > li:hover a, #ourservice .lSSlideOuter .lSPager.lSpg > li.active a {
    background:#D90000;
    border:2px #FFF solid;
}
#ourservice .h-ourservice .btu{margin-top:50px;}


.h-about{width:100%; padding:52px 5px 85px 5px; text-align:center; background:#D90000; display:block; float:left;}
.h-about .main10{width:1024px; margin:auto; display:block;}
.h-about h1{width:100%; color:#FFF; line-height:84px; margin-bottom:45px !important;}
.h-about h3{color:#FFF;}
.h-about h3::after{background:#FFF;}
.h-about h5{width:1024px; color:#FFF; line-height:30px; margin:45px 0 55px 0 !important; display:inline-block;}
.h-about ul{width:100%; display:block; float:left;}
.h-about ul li{width:20%; padding:5px; display:block; float:left;}
.h-about ul li img{width:100%;}
.h-about .btu{width:200px; line-height:52px; color:#FFF; text-align:center; border:4px solid #FFF; border-radius:3px; display: inline-block;
  transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.h-about .btu:hover{transform:scale(1.1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

#about{width:100%; display:block; float:left;}
#about .h-about{padding:0 0 50px 0; background:#FFF;}
#about h1{color:#000; margin:48px 0 !important;}
#about .h-about h5{color:#000; margin:45px 0 50px 0 !important;}
#about ul{padding:5px;}
.vision{width:100%; padding:50px 0; text-align:center; background:#F4F4F4; display:block; float:left;}
.vision .main12{width:1280px; margin:auto; display:block;}
.vision .italic{font-style:italic;}
.vision ul{width:100%; margin:50px 0; display:block; float:left;}
.vision ul li{width:33.33333333%; padding:0 7%; text-align:center; display:block; float:left;}

.h-why {width:100%; height:auto; padding:52px 0 85px 0; margin:0; text-align:center; display:block; float:left;
  background-image: url("../images/bg-why.jpg");
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.h-why h1{width:100%; color:#FFF; line-height:84px; margin-bottom:25px !important;}
.h-why h3{color:#FFF;}
.h-why h3::after{background:#D90000;}
.h-why h5{width:1024px; color:#FFF; line-height:30px; margin:45px 0 55px 0 !important; display:inline-block;}
.h-why .btu{width:200px; line-height:52px; color:#FFF; text-align:center; border:4px solid #D90000; border-radius:3px; display:inline-block;
  transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.h-why .btu:hover{transform:scale(1.1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

#why{width:100%; margin:40px 0; display:block; float:left;}
#why h3{width:100%; color:#000; line-height:55px;}
#why h5{width:100%; line-height:30px; padding:0 15px; margin:0 0 55px 0 !important; color:#333; text-align:center; display:inline-block;}
#why ul{width:100%; display:block; float:left;}
#why ul li{width:50%; padding:15px; display:block; float:left;}
#why ul li figure{width:100%; border:1px solid #CCC; display:block; float:left; position:relative;}
#why ul li figure span{width: calc(100% - 113px); padding-right:100px; background:#F4F4F4; display:block; float:left;}
#why ul li figure h1{width:90px; line-height:80px; color:#DDD; font-style:italic; text-align:right; display:block; position:absolute; right:25px; bottom:0;}
#why ul li figure em{width:113px; height:118px; background:#FFF; display:block; float:left; position:relative;}
#why ul li figure em img{width:74px; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);}
#why ul li figure p{width:100%; height:118px; padding:0 30px; line-height:25px; float:left;
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: left;
}
#why .pic{width:100%; margin:55px 0; display:block; float:left;}
#why .pic li{width:20%; padding:5px; display:block; float:left;}
#why .pic li img{width:100%;}

.h-contact{width:100%; padding:52px 0 85px 0; text-align:center; display:block; float:left;}
.h-contact h4{width:100%; margin:35px 0 65px 0 !important; text-align:center; display:block; float:left;}
.h-contact ul{width:1296px; display:inline-block;}
.h-contact ul li{width:33.33333333%; padding:15px; display:block; float:left;}
.h-contact ul li span{width:100%; height:250px; padding:30px; border:1px solid #CCC; text-align:center; display:block; position:relative; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.h-contact ul li span:hover{border:1px solid #D90000; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.h-contact ul li span em, .h-contact ul li span .icon{width:50px; height:50px; margin-bottom:36px; display:inline-block;}
.h-contact ul li span .icon{margin:0 7px 36px 7px;}
.h-contact ul li span em img, .h-contact ul li span .icon img{width:100%;}
.h-contact ul li span a, .h-contact ul li span p{width:100%; line-height:33px; font-size:25px; color:#000; text-align:center; display:block; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.h-contact ul li span a:hover{color:#D90000; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

#contact{width:100%; display:block; float:left;}
#contact h3{line-height:46px;}
#contact .gmap{width:100%; display:block; float:left;}
#contact .gmap iframe{width:100%; height:600px;}
#contact .w-form{width:1296px; margin:auto; display:block;}
#contact form{width: calc(100% - 30px); margin:35px 15px 0 15px; padding:22px 10% 85px 10%; border:1px solid #CCC; text-align:center; position:relative; background:#F4F4F4; display:block; float:left;}
#contact form h4{width:100%; margin:35px 0 !important; line-height:42px; color:#000; font-style:italic; text-align:center; display:block; float:left;}
#contact form fieldset{width:100%; margin:15px 0; padding:0; display:block; float:left;}
#contact form label{width:25%; height:50px; line-height:50px; padding:0 0 0 24px; color:#FFF; text-align:left; background:#000; display:block; float:left;}
#contact form label.message{height:200px;}
#contact form input::-moz-placeholder{color:#000; opacity:1}
#contact form input:-ms-input-placeholder{color:#000;}
#contact form input::-webkit-input-placeholder{color:#000;}
#contact form textarea::-webkit-input-placeholder {color:#000 !important; opacity:1}
#contact form textarea:-moz-placeholder {color:#000 !important; opacity:1}
#contact form textarea::-moz-placeholder {color:#000 !important; opacity:1}
#contact form textarea:-ms-input-placeholder {color:#000 !important; opacity:1}
#contact form input[type="text"]{width:75%; line-height:48px; padding:0 20px; color:#000; font-size:20px; text-align:left; border:1px solid #CCC; border-left:0;
display:block; background:#FFF; font-weight:500; font-family: 'Kanit', sans-serif;}
#contact form input[type="submit"]{width:200px; line-height:42px; color:#000; font-size:20px; border:4px solid #D90000; border-radius:3px; background:#F4F4F4; display:inline-block;}
#contact form input[type="submit"]:hover{transform:scale(1.1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#contact form .gg-captcha {width:auto; margin:15px auto; text-align:center; display:inline-block;}
#contact form textarea{width:75%; height:200px; line-height:20px; padding:15px; color:#000; font-size:20px; text-align:left; border:1px solid #CCC; font-weight:500; font-family: 'Kanit', sans-serif;
  border-left:0; resize:none; float:left; background:#FFF;}


.cookies{width:100%; line-height:24px; font-size:18px !important; margin:50px 0 60px 0; color:#000; display:block; float:left;}
.cookies h4{width:100%; line-height:30px; margin-bottom:24px !important; font-size:27px !important; color:#000; display:block; float:left;}
.cookies h5{width:100%; line-height:30px; margin-bottom:24px !important; font-size:21px !important; color:#000; display:block; float:left;}
.cookies h6{width:100%; line-height:25px; margin:25px 0 10px 0 !important; font-size:20px !important; color:#000; display:block; float:left;}
.cookies h6.noma{margin-top:0 !important;}
.cookies p{width:100%; padding:0 0 0 16px; line-height:24px; display:block; float:left; position:relative;}
.cookies p::before{content:"-"; width:16px; height:24px; line-height:24px; text-align:left; display:block; float:left; position:absolute; left:0; top:0;}
.cookies p.last{margin-bottom:25px;}

.cookies-submit{width:100%; left:0; bottom:0; display:block; position:fixed; background:#D90000; z-index:999;
opacity:0;
animation:cookies-alert cubic-bezier(0,1,1,1);
animation-fill-mode:forwards;
animation-duration:0.6s;
animation-delay: 1s
}
@keyframes cookies-alert {
  from {
    opacity:1;
    -ms-transform: translateX(0) translateY(100px);
    -webkit-transform: translateX(0) translateY(100px);
    transform: translateX(0) translateY(100px);
  }
  to {
    opacity:1;
    -ms-transform: translateX(0) translateY(0);
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}
.cookies-submit span{width:100%; padding:30px 25% 30px 0; display:block; float:left; position:relative;}
/* .cookies-submit b{width:auto; line-height:28px; color:#FFF; font-size:18px; font-style:normal; text-decoration:underline; display:block; float:left;} */
.cookies-submit p{width:auto; line-height:24px; color:#FFF; font-size:17px; display:block; float:left;}
.cookies-submit p a{color:#FFF; font-size:17px; font-style:normal; text-decoration:underline !important; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.cookies-submit p a:hover{color:#000; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.cookies-submit .accept{width:150px; height:40px; line-height:40px; color:#FFF; font-size:17px; text-align:center; font-style:normal; display:block;
 position:absolute; right:0; top:50%; transform: translate(0, -50%); background:#000; }
.cookies-submit .close-cookies{width:24px; height:24px; display:block; position:absolute; top:7px; right:7px; z-index:99;}
.cookies-submit .close-cookies::before{content:""; width:24px; height:24px; display:block; position:absolute; background:url(../images/btu-close-circle.png);}

footer{width:100%; text-align:center; display:block; float:left;}
footer h4{line-height:40px; padding:0 0 38px 0; margin:33px 0 28px 0; color:#FFF !important; font-style:normal !important;}
footer .logo{width:206px; display:inline-block;}
footer .logo img{width:100%;}
footer nav{width:100%; margin:15px 0; text-align:center; display:block; float:left;}
footer nav a{line-height:28px; padding:0 17px; font-size:20px; color:#FFF; display:inline-block; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
footer nav a:hover{color:#D90000; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
footer .copyriight{width:100%; height:70px; line-height:70px; font-size:17px; color:#FFF; display:block; float:left; background:#D90000;}
footer .content{width:100%; padding:30px 0; text-align:center; display:block; float:left; background:#333;}
footer ul{width:900px; margin:30px 0; border:1px solid #666; display:inline-block; position:relative;}
footer ul i{width:1px; height:100%; background:#666; display:block; position:absolute; top:0;}
footer ul i:nth-child(2){left:33.33333333%;}
footer ul i:nth-child(4){left:66.66666666%;}
footer ul li{width:33.33333333%; display:block; float:left;}
footer ul li span{width:100%; padding:20px; text-align:center; display:block; position:relative; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
footer ul li span em, footer ul li span .icon{width:40px; height:40px; margin-bottom:36px; display:inline-block;}
footer ul li span .icon{margin:0 8px 36px 8px;}
footer ul li span em img, footer ul li span .icon img{width:100%;}
footer ul li span a, footer ul li span p{width:100%; line-height:26px; font-size:20px; color:#FFF; text-align:center; display:block; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
footer ul li span a:hover{color:#D90000; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

.mmassager{width:100px; display:flex; bottom:30px; right:30px;}
.mmassager img{width:100%;}


/************************ MENU MOBILE ****************************/

.htop-logo{width:100%; padding:24px 40px; position:fixed; top:0; left:0; z-index:1000; background:rgba(0, 0, 0, 0.7); display:none;}
.htop-logo a{width:auto; display:block; float:left; position:relative; z-index:1000;}
/* .htop-logo::after{content:""; width:100%; height:100%; display:block; position:absolute; left:0; top:0; background:rgba(0, 0, 0, 0.35); z-index:950;} */

#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
  display: none;
  position: absolute;
  height: 50px;
  width: 50px;
  z-index: 3000;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

/* Icon 2 */

#nav-icon2 {
  height:26px;
  top:15px;
  right:10px;
  width: 34px;
  padding:0;
  background:transparent;
}

#nav-icon2.mopen {

}

#nav-icon2 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 17px;
  background:#FFF;
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon2.mopen span{background:#FFF;}

#nav-icon2 span:nth-child(even) {
  left: 50%;
  border-radius:0;
}

#nav-icon2 span:nth-child(odd) {
  left:0px;
  border-radius:0;
}

#nav-icon2 span:nth-child(1), #nav-icon2 span:nth-child(2) {
  top: 0px;
}

#nav-icon2 span:nth-child(3), #nav-icon2 span:nth-child(4) {
  top: 9px;
}

#nav-icon2 span:nth-child(5), #nav-icon2 span:nth-child(6) {
  top: 18px;
}
#nav-icon2.mopen span:nth-child(1), #nav-icon2.mopen span:nth-child(6) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon2.mopen span:nth-child(2), #nav-icon2.mopen span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon2.mopen span:nth-child(1) {
  left: 4px;
  top: 6px;
}

#nav-icon2.mopen span:nth-child(2) {
  left: calc(50% - 5px);
  top: 6px;
}

#nav-icon2.mopen span:nth-child(3) {
  left: -50%;
  opacity: 0;
}

#nav-icon2.mopen span:nth-child(4) {
  left: 100%;
  opacity: 0;
}

#nav-icon2.mopen span:nth-child(5) {
  left: 4px;
  top: 14px;
}

#nav-icon2.mopen span:nth-child(6) {
  left: calc(50% - 5px);
  top: 14px;
}

#nav-icon2.mclose span:nth-child(even) {
  left: 50%;
  border-radius:0;
}

#nav-icon2.mclose span:nth-child(odd) {
  left:0;
  border-radius:0;
}
.m-warp{z-index:600; background:#FFF; }
.menu-mobile{width:100%; height:50px; padding:0; background:#D90000; position:relative; display:none; float:left; z-index:999; overflow:hidden;
transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;
}
.menu-mobile.mopen{height:380px; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.menu-mobile.mclose{height:50px; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.menu-mobile .mlang{width:auto; height:50px; display:block; float:left;}
.menu-mobile .mlang a{ line-height:50px; padding:0 15px; font-size:20px; color:#FFF; display:block; float:left; position:relative;
background:rgba(217, 0, 0, 0); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.menu-mobile .mlang a:hover, .menu-mobile .mlang a.active{color:#FFF; background:rgba(0, 0, 0, 1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.menu-mobile .mlang a::after{content:""; width:1px; height:12px; background:#666; display:block; float:left; position:absolute; right:0; top:50%; transform:translateY(-50%);}
.menu-mobile .mlang a:last-child::after{display:none;}
.menu-mobile .mlang a:first-child.active::after{display:none}
.menu-mobile .mlang a:nth-child(2).active::after{display:none}

.menu-mobile .mmenu{width:100%; height:auto; display:block; float:left; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
/* .menu-mobile .mmenu.mopen{ height:301px; visibility:visible; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.menu-mobile .mmenu.mclose{ height:0px; visibility:hidden; transition: all 0.2s ease 0s; -webkit-transition: all 0.2s ease 0s;} */
.menu-mobile .mmenu .mm{width:100%; line-height:50px; margin:0; padding:0 15px; border-top:1px solid rgba(255, 255, 255, .5); font-size:20px;
  color:#FFF; text-align:left; display:block; float:left; position:relative;}
/* .menu-mobile .mmenu.mopen a:first-child{border-top:1px solid #FFF;}
.menu-mobile .mmenu a:last-child{border-bottom:0;} */
.menu-mobile .mmenu .mm::after{content:""; width:15px; height:20px; background:url(../images/arrow-next.png); opacity:0; display:block;
position:absolute; right:20px; top:17px; transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s;}
.menu-mobile .mmenu .mm:hover::after{opacity:1; transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s;}

.menu-mobile .mmenu span{width:100%; margin:0; padding:15px 0; border-top:1px solid rgba(255, 255, 255, .5); text-align:center; display:block; float:left; position:relative;}
.menu-mobile .mmenu span a{width:45px; margin:0 5px; display:inline-block; position:relative;}
.menu-mobile .mmenu span a img{width:100%;}
/*************************************PRELOAD**************************************/

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  /* change if the mask should have another color then white */
  z-index: 999999;
  /* makes sure it stays on top */
}

#status {
  width:300px;
  height:175px;
  background:url(../images/logo-b.jpg) no-repeat;
  background-repeat: no-repeat;
  background-position: center;
  background-size:100%;
  position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);
}
.ball {
	background-color: rgba(0,0,0,0);

	opacity:.9;
	border-top:5px solid rgba(0,0,0,0);
	border-left:5px solid rgba(0,0,0,0);
	border-radius:206px;
	/*box-shadow: 0 0 35px #2187e7;*/
  width:300px;
  height:175px;
	margin:0 auto;
}

/*************************** CAPTCHA *******************************/

#rc-imageselect {transform:scale(0.77) !important; -webkit-transform:scale(0.77) !important; transform-origin:0 0 !important; -webkit-transform-origin:0 0;}