@charset "utf-8";
/* CSS Document */
*{ margin:0; padding:0;}

@font-face {
    font-family: 'kit55f-webfont';
    src: url('fonts/kit55f-webfont.eot');
    src: url('fonts/kit55f-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/kit55f-webfont.woff') format('woff'),
         url('fonts/kit55f-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'kit75f';
    src: url('fonts/kit75f.eot');
    src: url('fonts/kit75f.eot?#iefix') format('embedded-opentype'),
         url('fonts/kit75f.woff') format('woff'),
         url('fonts/kit75f.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'kit56f';
    src: url('fonts/kit56f.eot');
    src: url('fonts/kit56f.eot?#iefix') format('embedded-opentype'),
         url('fonts/kit56f.woff') format('woff'),
         url('fonts/kit56f.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'kittithada_roman_55_pregular';
    src: url('fonts/kit55p_0-webfont.woff2') format('woff2'),
         url('fonts/kit55p_0-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

/** Generated by FG **/
@font-face {
	font-family: 'Conv_Maledpan-Regular';
	src: url('fonts/Maledpan-Regular.eot');
	src: local('☺'), url('fonts/Maledpan-Regular.woff') format('woff'), url('fonts/Maledpan-Regular.ttf') format('truetype'), url('fonts/Maledpan-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

body{
    font-family: 'kit55f-webfont';
	font-size:18px;
	line-height:normal;
	cursor: default;
}
a{text-decoration:none;color:inherit;}
a:hover{color:inherit;}
.green{color:#00cb2b;}
.orange{color:#ff9933;}

#back-to-top {
    width: 35px;
    height: 35px;
	position: fixed;
	z-index: 10;
	bottom:10%;
	right: 35px;
	text-align: center;
	display: none;
	transform: translate(50%,0);
	background:#222121;
	 
}
#back-to-top a{
	color:#FFF;
	font-size: 18px;
	line-height:0;
    text-transform: uppercase;
}
.arrow-color{
	color: #FFF;
	font-size:30px;
	line-height: 1;
}
#back-to-top a:hover{
	color: #FFF;
}
/*-----All-----//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

img{ border:0; margin:auto;}
a{ text-decoration:none;}
a:hover{ text-decoration: none;}

.cleaner {clear:both; width:100%; height:0px;}
.h30{clear:both; width:100%; height:30px;}
.h20{clear:both; width:100%; height:20px;}
.h10{clear:both; width:100%; height:10px;}

/*-----Header-----//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.pull-left{
	float:left !important;
}
.navbar-brand{
	width:80%;
	float:left;
	margin-right:0;
	margin-top:4%;
}
.navbar-brand img{
	height:110px;
    width: auto;
}
.navbar-collapse{
	margin-top:7%;
}
.navbar-collapse ul li {
	line-height:1;
	padding:10px 15px 10px;
	-moz-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
.navbar-collapse ul li a{
	color:#363636;
}
 
.navbar-collapse ul li p{
	margin-bottom:0;
}
.navbar-headtop {
    width: 100%;
	padding:0;
    background-color: #FFF  !important;
}
.navbar-headtop .navbar-toggler {
    color:rgb(130, 130, 130);
    border-color: transparent;
    font-size: 35px;
    padding: 0.25rem 5px;
	margin-top:5%;
}
.navbar-toggler:focus {
    outline:  none !important;
}
.navbar-nav{
	 text-transform: uppercase;
}
.logo-phone{
	text-align:center;
}
/*****************************************************/
 .menu-list  >a{
	color:#363636;
	padding: 10px 20px;
}
 
 /*****************************************************/
.slide .carousel-indicators{
	display:none;
}
 /*****************************************************/
 
.head-socail a{
	align-self: center;
}
.head-socail a img{
	margin: auto 2px;
	border: solid 1px  #696969;
	border-radius: 3px;
	max-width:100%;
}
 
.head-socail a:hover:nth-child(1) img{
	-webkit-filter: opacity(.5) drop-shadow(0 0 0 #06F);
  	filter: opacity(.5) drop-shadow(0 0 0 #06F);
}
.head-socail a:hover:nth-child(2) img{
	-webkit-filter: opacity(.5) drop-shadow(0 0 0 #02be01);
  	filter: opacity(.5) drop-shadow(0 0 0 #02be01);
 
}
.head-socail a:hover:nth-child(3) img{
	-webkit-filter: opacity(.5) drop-shadow(0 0 0 #FF6);
  	filter: opacity(.5) drop-shadow(0 0 0 #FF6);
}
.head-socail a:hover:nth-child(4) img{
	-webkit-filter: opacity(.5) drop-shadow(0 0 0 #F00);
  	filter: opacity(.5) drop-shadow(0 0 0 #F00);
}
.head-socail a:hover:nth-child(6) img{
	background: #d70a14;
}
.head-socail a:hover:nth-child(7) img{
	background: #f4c817;
}
/***********************************************************/
.followus-head{
	font-size:2rem;
}
.followus-head span{
	color:#F00;
}
/*-----Content-----//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.slider .bx-wrapper .bx-next {
    right: 0;
    background: url(../images/bt-next.png) no-repeat 0;
    background-size: 65%;
}
.slider .bx-wrapper .bx-prev {
    left: 10px;
    background: url(../images/bt-prev.png) no-repeat  0;
    background-size: 65%;
}
.slider .bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 50%;
    width: 43px;
    height: 43px;
}
      
.contact-phone{
	text-align:center;
 	padding-top:5%;
	margin:10% 15px 0;
}
.contact-phone img{
	width: 30px;
}
.contact-phone-xs {
	margin-top:10px;
	text-align:center;
}
.contact-phone-xs img{
	width: 30px;
}
/*.carousel-control-next-icon {
	background-size: 50%;
	width: 50px;
	height: 50px;
    background-image:  url(../images/bt-next.png);
}
.carousel-control-prev-icon{
	background-size: 50%;
	width: 50px;
	height: 50px;
    background-image:  url(../images/bt-prev.png);
}*/
/********************************************/
.title-index {
    font-size: 1.4rem;
    text-align: center;
    margin: 10px auto 30px auto;
	padding-top:20px;
	background-image:url(../images/ba-title.png) ;
	background-repeat: no-repeat;
	padding-bottom:4%;
	background-position: center; 
	 text-transform: uppercase;
}
.title-index3 {
    font-size:2.4rem;
    text-align: center;
    margin: 10px auto 30px auto;
	text-transform: uppercase; 
}
.title-index3 hr {
    width: 25%;
    border-bottom: 3.5px solid #ff9933;
    margin: auto;
}
.title-index strong,.title-index3 strong{
   font-size: 1.1em;
}

.title-index2{
	font-size: 1.5rem;
	text-align:center;
	margin:40px auto auto auto;
	color:#ff9933;
}
.title-index2 img{
     vertical-align: bottom ; 
} 
.title-index2 p{
	color:#333;
	font-size:1.4rem;
	margin-bottom: inherit;
 } 
.title-index2 hr{
	width:10%;
	border-bottom: 3.5px solid #00cb2b;
	margin:auto;
}
/**************************/
.text-index{
	font-size:1.3rem;
} 
.text-index p{
	font-size:1.4rem;
	color:#ff9933;
	margin-bottom: 0;
	font-weight:bold;
} 
.text-index p:hover{
	color:#252525;
} 
/********************************************/
.contact-footer{
	font-size:1.3rem;
	line-height:normal;
}
.contact-footer a:hover{
	color:#ff9933;
}
.contact-footer p{
	font-size:1.5rem;
	line-height:normal;
	margin-bottom: 0.5rem;
}
.bt-more{
	display:inline-block;
	text-align:center;
	padding:5px 35px;
	color:#666;
	font-size:1.8rem;
	border: solid 1px #666;
	border-radius: 25px;
	margin: 30px auto  40px auto ;	
}
 .bt-more:hover{
	background:#666;
	color:#FFF;
}
/************container***********************************/
.textcenter{
	text-align:center;
}
.content-index{
	background: #ff9933;
	/*margin-top:5%;*/
}

.bg-title{
	background: url(../images/bg-container.png) bottom right;
    background-repeat: no-repeat;
    background-size: 100% ;
	padding-bottom: 20%;
}
.box-title-home{
	margin: 10% auto 6% auto;
	position:relative;
	text-align:center;
	/*display:inline-block;*/
}
 
.all-text-home{
	text-align:left;
	 
	display:flex;height:100%;
	background:#FFF;
	padding:   5% ;
	-webkit-box-shadow: 0px 0px 3px -1px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 3px -1px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 3px -1px rgba(0,0,0,0.75);	
}
.text-home{
	font-size:1.3rem;	
	margin:auto;	
 }
.all-content-service >.row:not(:last-child){
	border-bottom: solid 1px #666;
}
.topic-pd{
	font-size: 2rem;
	border-bottom: solid 1px #CCC;
	line-height: 45px;
	margin: 30px auto  ;
}
.topic-pd  svg:not(:root).svg-inline--fa {
		font-size: 1.3rem;
}
.topic-pd  span{
	position:absolute;
	right:0;
	bottom:0;
	font-size: 1.2rem;
	line-height:normal;
}
.topic-pd  span:hover{
	color:#00a652;
}
.box-service {
    font-size: 1.5rem;
    padding: 5% 5% 10% 5%;
    position: relative;
    margin:   auto;
}
 
.text-service{
	margin-top:20px;
}
.all-content-service  .row .col-sm-12:nth-child(1) .box-service,.all-content-service  .row .col-sm-12:nth-child(2) .box-service{
	border-bottom: solid 1px #FFF; 
}
.bt-view{
	display:inline-block;
	text-align:center;
	padding:5px 35px;
	color:#FFF;
	border: solid 2px #FFF;
	border-radius: 25px;
	margin: 10px auto auto  ;	 
 }
.bt-view:hover{
	color:#333;
	background:#FFF; 
}
 
.icon-cate img{
 	margin:auto;
	-moz-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
} 
.icon-cate img:hover{
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transform: scale(1.1)
}
/************************************/
.box-pd,.box-solutions{
	margin: 30px auto;
	padding:5px 10px;
	-webkit-box-shadow: 0px 0px 81px -31px rgba(0,0,0,1);
	-moz-box-shadow: 0px 0px 81px -31px rgba(0,0,0,1);
	box-shadow: 0px 0px 81px -31px rgba(0,0,0,1);
}
.box-img-pd a,.box-img-solutions a {
	height:100%;
	overflow:hidden;
	display:flex;
}	
.box-img-pd img{
	align-self: center;
	margin: auto;
}	
.box-pd img ,.box-solutions img{
	max-width:100%;
	max-height:100%;
	margin:auto;
	-moz-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
.box-pd img:hover ,.box-solutions img:hover{
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transform: scale(1.1)
}
.name-pd,.title-pd{
	font-size:1.3rem;
	 display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height:normal;
	padding: 5px 0;
	min-height:56px;
}
.name-pd,.name-solutions{
	margin: 5px auto;
	border-bottom: solid 1px #f5f5f5;
	font-weight:bold;	
 }
.name-pd:hover,.name-solutions:hover {
	 color:#036;
 } 
.title-pd{
	font-size:1.2rem;
	line-height: 1.3;
 }
 /********************************/
.name-solutions {
	font-size:1.3rem;	
 } 
.title-solutions{
	font-size:1.2rem;	
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height:normal;
	padding: 5px 0;
 }  
.box-solutions{
	padding:15px 5px;	 
}
 /*********************************/
 
.text-title-pd,.box-detail{
	font-size:1.4rem;	
	line-height:1.5;
}

/*********************************/
.box-detail ul li{
	list-style:none;
}
.box-listpage{
	height:60px;
	width:80px;
 	 border: solid 1px #666;
	overflow:hidden;
	margin: 20px auto;
}
.box-listpage img{
	/*height:80px;*/
	width:auto ;
	max-width:100% ;	
	position: relative;
	transform: translate(0px, -50%);
	top: 50%;
	/*border: solid 1px #666;*/
}
.download-doc{
	margin: 5px auto;
	display:inline-block;
	background:#d8d8d8;
	border: solid 1px #c7c7c7;
	padding: 5px 10px;
	font-size:0.9em;
}
.download-doc:hover{
	background:#c7c7c7;
}
.box-vdo-pd{
	margin: 25px auto;
	text-align:center;	
	width:90%;
}
.box-vdo-pd iframe{
	width:100%;
	height:200px;
	border: solid 1px #333
}
.box_sliderpd .bx-wrapper {
	z-index:0;
}
/****************************************************/
.event-img {
    position: relative;
    overflow: hidden;
    padding-bottom: 75%;
    background: #FFFFFF;
    /* margin: 10px 0; 
	border: 1px solid #e5e5e5;*/
}
.event-img img{
	height: auto;
    /* height: 100%; */
    width: 100%;
    /* width: auto; */
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.event {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
	position:relative;
	overflow:hidden;
}
.event-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 0.5rem;
	background:rgba(255, 255, 255,0.8);
	/*background:rgb(255, 255, 255);*/
	position:absolute;
	bottom:-5px;
	transition: all 0.5s ;
	width:100%;
	font-size:1.3rem;
}
.event:hover .event-body {
	/*padding-bottom:3rem;*/
	background:rgb(255, 255, 255);
	bottom:0;
	transition: all 0.8s ;
}

.readmore{
	float:right;
	font-size: 1.2rem;
    color: rgb(255, 255, 255);
	margin-top:0.5rem;
    display: inline-block;
    background:rgb(12, 101, 164);
    border-radius: 5rem;
    padding: 0rem 0.75rem ;
	display:none;
	transition: all 0.8s ;
	border:2px solid #ffffff;
}
.event:hover .readmore {
	transition: all 0.8s ;
	display:block;
}
.readmore:hover {
    background: rgb(255, 255, 255);
    color:rgb(12, 101, 164);
	border:2px solid rgb(12, 101, 164);
}

.font-gray{ color:#999; }
.event-text {
    -webkit-line-clamp: 3;
    height: calc(2em);
}
.event-text{
	display: -webkit-box;
    -webkit-box-orient: vertical;
    position: relative;
    line-height: normal;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 0px !important;
}
/********************************************************/
.contact-title-1{
    font-weight: bold;
    font-size: 1.5rem;
    color: #373737
}
.box-contact a{color:inherit;}
.box-contact a:hover{color:#069;}
.box-contact{
	font-size:1.4rem;
	line-height:normal;
}
.font-title{
	font-size:1.8rem;
	font-weight:bold;
 	margin-bottom:10px;
}
.textTitle-contact{
	font-size:1.37rem;
 	margin-bottom:30px;	
	text-indent:30px;
	text-align:justify;
}
.box-contact .btn,
.box-contact .form-control{
	font-size:0.8em;
	border-radius: 0; 
}
.box-contact .btn {
	background:#585858;
	border: solid 1px #333;
	border-radius: 0; 
	padding: 5px 20px;
}
.map{
	width:100%;
 	min-height:320px !important;
}
.box-contact svg:not(:root).svg-inline--fa {
    overflow: visible;
    font-size: 1.2rem;
}
.box-contact .form-horizontal svg:not(:root).svg-inline--fa {
    font-size: 1em;
}
textarea{
    resize: vertical;
}
.box-map iframe{
	height:40rem;
	width:100%;
}
.large-map iframe{
	height:25rem;
	width:100%;
}
.btn-contact{ color:#fff;}
.btn-contact:hover{
	background:#e60013;
	color:#fff;
	border:1px solid #fff;
	transition: all 0.3s;
}
/************************************/
 /*-----List Page-----///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

div.badoo {
	width:100%;
	margin-top:20px;
	padding:10px 0px;
	margin-right:20px;
	font-size:14px; 
	color: #FFF; 
	font-family:Arial, Helvetica, sans-serif;
	text-align:right;text-decoration:none;
	text-align:center;
	float:right;
}


div.badoo a{
	border: #4E4A4C 1px solid;
	padding: 3px 8px;
	margin: 0px 4px;
	color: #181516;
	text-decoration: none;
	background: #FFFFFF;
}
div.badoo a:hover {
	border:#999 1px solid;
	color:#FFF;
	background: #9a9a9a; /* Old browsers */
}

div.badoo span.current {
	padding: 3px 8px;
	border: #75676E 1px solid;
	background: #7c7c7c;
	color: #FFFFFF;
	margin: 0px 4px;
}
div.badoo span.disabled {
	display:none;
}
.text-notfound{
	font-size:2.1rem;
}
/****************************/
/*-----Footer-----//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
#footer-zone{
	background: #363636;
    background-repeat: no-repeat;
    background-size: 100% ;
	padding-top:1%;
}

.footer{
	font-family: 'kittithada_roman_55_pregular';
	padding:30px 0;
	min-height:100px;
	color:#FFF;
}
 
 
 
.hotline-call-btn {
    right: 3%;
    width: 50px;
    height: 50px;
    z-index: 999;
    bottom: 11%;
    position: fixed;
    text-align: center;
    padding: 2% 1%;
    border-radius: 50%;
    display: inline-block;
    background: #8b4513;
    border: 2px solid #fc0;
    transform: rotateY(180deg);
    box-shadow: 0 0 5px rgba(0,0,0,.5);
}
.hotline-call-btn img{
	width:75%;
	margin-left:-10%;
}
.copyright {
	color:#FFF;
    font-size: 1rem;
    width: 100%;
    padding: 1% 0;
	background: #242424;
}
.social-footer{
	text-align:center; 
	margin:20px auto;
}
.social-footer img{
	height:30px;
	margin:auto 1px;
	-moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
	border: solid 1px #FFF;
	border-radius:3px;
}
.social-footer img:hover{
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transform: scale(1.1);	
}
.social-footer a:hover:nth-child(1) img{
	background: #3a569a;   
}
.social-footer a:hover:nth-child(2) img{
	background: #02be01;
}
.social-footer a:hover:nth-child(3) img{
	background: #f4c817;
}
.social-footer a:hover:nth-child(4) img{
	background: #d70a14;
}
/****************************************/
.logo-footer {
	text-align:center;
}
.logo-footer img{
	max-width:80px;
}
img.img-logo-f{
	max-width:60%;
	margin-bottom:10px;
}
 

/*-----End Product-----//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.slide-box .carousel-control-prev-icon {
  background: url(../images/icon-prev.png) no-repeat ;
}
.slide-box .carousel-control-next-icon {
  background: url(../images/icon-next.png) no-repeat ;
}
.slide-box .carousel-control-prev-icon, .carousel-control-next-icon {
    display: inline-block;
    width: 40px;
    height: 41px;
}

/*///////////////////////////////////////////////////////////////////////////media///////////////////////////////////////////////////////////////////////////*/
@media (max-width: 767px ) {
	body{
		max-width: 100% !important;
	}
	.navbar-collapse{
		position: fixed;
		width: 250px;
		background: #fff;
		height: 100% !important;
		max-height: none !important;
		top: 0;
		display: block;
		left: -250px;
		margin: 0 !important;
		z-index: 9999;
	}
	.navbar-collapse.in{
		left: 0 !important;
	}
	.navbar-collapse.show{
		display:block;
		left: 0 !important;
	}
	.all-container{
		width: 100%;
	}
	.all-container.-collapse{
		margin-left: 250px;
	}
	.navbar-headtop, .navbar-collapse, .navbar-collapse.collapsing, .all-container.all-container.all-container {
		transition: all 0.5s !important;
	}
	.navbar-headtop.-collapse {
		margin-left: 250px;
		width:100%;
	}
	.navbar-brand img {
		width: 50px;
	}
 	 li.nav-item a{
		border-bottom: solid 1px #f0f0f0;
	}
	.navbar-collapse ul li {
		padding:0 10px;
	}	
 	 .navbar-collapse ul li a{
		display: block;
		padding: 5px 15px;
		border-bottom: solid 1px #f7f7f7;
	}
	
	.navbar-brand{
		text-align:center;
	}
	.navbar-brand img{
		height: auto;
	}
	.logo-phone img{
		height: 50px;
		margin: 10px auto;
	}
	.bt-view { 
		line-height: normal;
		font-size: 0.9rem;
	}
	.topic-pd {
		font-size: 1.5rem;
	}
	 
	.head-socail{
		 text-align:center;
		 margin-top:10px;
	}
	.dropdown-menu{
		border:none;
	}
	.navbar-collapse ul li a {
		padding: 5px 0 5px  10px;
		margin-right:10px;
	}
	.dropdown-sub svg:not(:root).svg-inline--fa{
		position: absolute;
		right: 2px;
		top: 15px;
	    color: #5c5c5c;
	}
 
}
/*///////////////////////////////////////////////////////////////////////////media///////////////////////////////////////////////////////////////////////////*/




