@import url(https://fonts.googleapis.com/css?family=Kanit:300);

@import url(animate.css);
body,html{font-family:Kanit,sans-serif;overflow-x:hidden}a,li,p,span,strong,div,input,button{font-family:Kanit,sans-serif;}a{color:#000;text-decoration:none;background:0 0}a:hover{color:#000;text-decoration:none}a,li,p,span,strong{font-size:21px}p{margin-top:0;margin-bottom:1rem}.pagetitleRow{background:red;text-align:center;border-bottom:0 solid #d3d3d3;padding:12px 0}span.pagetitle{color:#fff;background:0 0;padding:15px 15px}a.flaglang:link img,a.flaglang:link span,a.flaglang:visited img,a.flaglang:visited span{filter:Alpha(Opacity=50);opacity:.5}a.flaglang:hover img,a.flaglang:hover span{filter:Alpha(Opacity=100);opacity:1}a.nonflag img,a.nonflag span{filter:Alpha(Opacity=100);opacity:1;font-weight:bolder}headpc{background:#2b2b2b}headmb{background:#2b2b2b}.dropdown:hover>.dropdown-menu{display:block}.dropdown-item{display:block;width:100%;padding:.25rem 1.5rem;clear:both;text-align:inherit;white-space:nowrap;background:0 0;border-bottom:1px solid #ccc}.dropdown-item:focus,.dropdown-item:hover{text-decoration:none;background:#ccc}.dropdown-border{border-bottom:1px solid #ccc}.dropdown-noborder{border-bottom:0 solid #ccc}.navbar-light .navbar-nav .nav-link{color:#fff}.navbar-light .navbar-nav .nav-link:focus,.navbar-light .navbar-nav .nav-link:hover{color:#fff;font-weight:700;opacity:.7}.nav-link a,.nav-link a:hover{color:#fff}.navbar-light .navbar-nav .active>.nav-link,.navbar-light .navbar-nav .nav-link.active,.navbar-light .navbar-nav .nav-link.show,.navbar-light .navbar-nav .show>.nav-link{color:#fff}.list-group-item{position:relative;display:block;padding:.75rem 1.25rem;background:nene;border-bottom:1px solid rgba(0,0,0,.125)}.navbar-light .navbar-toggler{color:#fff;border-color:#fff}.navbar-dark .navbar-toggler{color:#fff;border-color:none}.navbar-light .navbar-toggler-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}.navbar-dark .navbar-toggler-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}li.Bcuad2,li.Bcuad3,li.Bcuad4,li.Tcuad2,li.Tcuad3,li.Tcuad4,li.cuad2,li.cuad3,li.cuad4,li.cuad6,li.cuadM2{display:block;overflow:hidden;text-align:center;float:none;margin:0 auto}.Bcuad2 img,.Bcuad3 img,.Bcuad4 img,.Tcuad2 img,.Tcuad3 img,.Tcuad4 img,.cuad2 img,.cuad3 img,.cuad4 img,.cuad6 img,li.cuadM2 img{-moz-transition:all .7s;-webkit-transition:all .7s;transition:all .7s}.Bcuad2:hover img,.Bcuad3:hover img,.Bcuad4:hover img,.Tcuad2:hover img,.Tcuad3:hover img,.Tcuad4:hover img,.cuad2:hover img,.cuad3:hover img,.cuad4:hover img,.cuad6:hover img,.cuadM2:hover img{-moz-transform:scale(1.05);-webkit-transform:scale(1.05);transform:scale(1.05);opacity:.7},.regular2>li.cuad4 img,.regular2>li.cuad6 img,.regular3>li.cuadM2 img,.regular>li.cuad4 img,.regular>li.cuad6 img{border-radius:50%}
footer a,footer a:hover{color:#fff}.Qtel>a,.Qtel>a:hover{color:#fbcd28}.count-box,.feature-box{padding:10px;-webkit-box-shadow:0 0 0 0 rgba(31,69,113,.4);box-shadow:0 0 0 0 rgba(31,69,113,.4);margin-bottom:20px;border-radius:5px;-webkit-transition:.3s;transition:.3s}.count-box:hover,.feature-box:hover{-webkit-box-shadow:0 0 20px 0 rgba(31,69,113,.2);box-shadow:0 0 20px 0 rgba(31,69,113,.2);background:#fefdfc}.hr{position:relative}.hr:before{content:'';position:absolute;width:100%;background:#ed1c24;height:1px;left:0;top:100%}.hr:after{content:'';display:block;height:20px}.title h2{text-transform:uppercase;font-weight:700;font-size:38px;color:#231f20}.color{color:#ed1c24}.border{border:0 solid #dee2e6}.border{border:0 solid #dee2e6!important;border-top:1px solid #ed1c24!important;height:1px;margin:15px auto 0;position:relative;width:50%;padding-bottom:2%}.title h2{text-transform:uppercase;font-weight:700;font-size:38px;color:#231f20}.title span{text-transform:uppercase;font-weight:700;font-size:38px}.border:before{background-color:#231f20;border:1px ridge #231f20;content:"";height:10px;left:50%;margin-left:-20px;position:absolute;top:-5px;width:40px}#Contact .title h2,#FAQ .title h2,#Portfolio .title h2{color:#fff}#Contact .border:before,#FAQ .border:before,#Portfolio .border:before{background-color:#fff;border:1px ridge #fff}.navbar-expand-sm .navbar-nav .nav-link{padding-right:1.5rem;padding-left:1.5rem}div#FAQ,div#Portfolio,div#Service{padding-top:80px;padding-bottom:80px}ul.social-icon>li,ul.social-icon>li>a{list-style:none;display:inline-block}#icon-line{position:fixed;bottom:20px;right:20px;max-height:64px;z-index: 9999;}#icon-tel{position:fixed;bottom:100px;right:20px;max-height:64px; z-index: 9999;}#icon-tips{position:fixed;bottom:180px;right:20px;max-height:64px;z-index: 9999;}.contact-form{margin-bottom:40px}.contact-form .form-control{background-color:transparent;border:1px solid #4e595f;height:38px}#contact-submit:hover,.contact-form input:hover,.contact-form textarea:hover{border-color:#6cb670}#contact-submit{border:1px solid #4e595f;padding:12px 0;width:100%;margin:0}.contact-form textarea.form-control{padding:10px;height:120px}.contact-info p{margin-bottom:25px}.con-info{margin-bottom:20px}.con-info i,.con-info span{float:left}.con-info span{margin:-5px 0 0 15px}.contact-detail a:visited,.contact-details a:link{color:red}.contact-details a:hover{color:#fff}.error{display:none;padding:10px;color:#d8000c;border-radius:4px;font-size:13px;background-color:#ffbaba}.success{background-color:#6cb670;border-radius:4px;color:#fff;display:none;font-size:13px;padding:10px}.btn-outline-light a{color:#f8f9fa}.btn-outline-light a:hover{color:#343a40}#Service{background:url(../images/parallax/service.webp) fixed center no-repeat;background-size:cover}#Portfolio{background:url(../images/parallax/portfolio.webp) fixed center no-repeat;background-size:cover}#FAQ{background:#494949}#Contact{background:url(../images/parallax/contact.webp) fixed center no-repeat;background-size:cover;color:#fff}#LOGOCUST{background:#fff}


div#Contact{padding-top:10px;padding-bottom:10px}

.font-bold{
      font-weight: bold;
  }


.article-box {
  border-style: solid;
  border-width: 2px;
  border-image: linear-gradient(180deg, rgb(255,0,0), rgb(0,0,0)) 1;
  -webkit-transition: 0.3s;
    transition: 0.3s;
}

.article-box:hover{
  -webkit-box-shadow: 10px 10px 20px 2px rgba(0,0,0,0.3);
-moz-box-shadow: 10px 10px 20px 2px rgba(0,0,0,0.3);
box-shadow: 10px 10px 20px 2px rgba(0,0,0,0.3);
transform:translate3d(0,-7px,-30px);
  transition: 0.7s;}



.text-white,.text-white:hover {
color:#fff;
}
.text-red ,.text-red:hover {
color:#ff0000;
}


headpc{background:#2b2b2b;}
headmb{background:#2b2b2b;}

.btn-more{
  background: transparent;
  border: 1px #fff solid;
  border-radius: 5px;
  color: #fff;
  padding: 7px 15px;
  cursor: pointer;
}


.btn-more:hover{
  background: #fff;
  border: 1px #fff solid;
  border-radius: 5px;
  color: #000;
  padding: 7px 15px;

}


.btn-more-red{
  background: #ff0000;
  border: 1px #ff0000 solid;
  border-radius: 5px;
  color: #fff;
  padding: 7px 15px;
  cursor: pointer;
}


.btn-more-red:hover{
  background: transparent;
  border: 1px #ff0000 solid;
  border-radius: 5px;
  color: #ff0000;
  padding: 7px 15px;

}


#icon-screen {
    position: fixed;
    width: 50px;
    bottom: 20px;
    right: 0px;
    height: auto;
}
#icon-box {
    width: 50px;
    height: 50px;
    margin: 10px 0;
}

#return-to-top{position:fixed;color:#b2d6ff}
#return-to-top {color:#b2d6ff;margin:0;position:relative;right:0;top:0;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
#return-to-top:hover{color:#2e2f2e}




.carousel-caption {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: center;

 display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}




.stroke-red { 

/*  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #f00;
  -webkit-text-fill-color: #fff;*/
  text-shadow: -2px 0 #fff, 0 2px #fff, 2px 0 #fff, 0 -2px #fff;

}





.skdslider { 
   width:100%;
  border: red 1px solid;
    display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;

    }
                
    
.slide-desc {
    
    width:100%;
    text-align:center;

    /*position:absolute;
    left:0;
    bottom: 50%;
    width: 750px;*/


    

    
    
}   
.slide-desc{
    color: #ffffff;
    margin-bottom: 10px;
    margin-top: 10px;
    text-transform: uppercase;
}

/*.slide-desc > p {
    color: #FFFFFF;
    text-align:center;
}
.slide-desc > p a.more {
    color:#990000;
    font-size:20px;
    text-decoration:none;
}
.slide-desc > p a.more:hover {
text-decoration:underline;
}*/




.img-slide{

}






    .slide-desc .h1, .slide-desc p.h1{font-size:3.25rem}
    .slide-desc .h2, .slide-desc p.h2{font-size:3rem}
    .slide-desc .h3, .slide-desc p.h3{font-size:2rem}
    .slide-desc .h4, .slide-desc p.h4{font-size:1.5rem}
    .slide-desc .h5, .slide-desc p.h5{font-size:1rem}
    .slide-desc .h6, .slide-desc p.h6{font-size:0.5rem}


    .slide-desc .h1, .slide-desc .h2, .slide-desc .h3, .slide-desc .h4, .slide-desc .h5, .slide-desc .h6, 
    .slide-desc h1, .slide-desc h2, .slide-desc h3, .slide-desc h4, .slide-desc h5, .slide-desc h6, .slide-desc p,.slide-desc span,.slide-desc td,.slide-desc a{
    
        margin-bottom:auto;
        font-weight: 600;
        line-height: 1.25;
    }
    
        
        
@media (min-width: 320px) and (max-width: 575px) {
    
    .slide-desc img{min-width: 50px; max-width: 120px; margin: 0.15em;}
    .slide-desc img#logo {min-width: 500px; margin: 0.5em;}
    
    .slide-desc p,.slide-desc span,.slide-desc td,.slide-desc a{font-size:0.25rem;}

    .slide-desc .h1, .slide-desc p.h1{font-size:1.5rem}
    .slide-desc .h2, .slide-desc p.h2{font-size:1rem}
    .slide-desc .h3, .slide-desc p.h3{font-size:0.5rem}
    .slide-desc .h4, .slide-desc p.h4{font-size:0.25rem}
    .slide-desc .h5, .slide-desc p.h5{font-size:0.15rem}
    .slide-desc .h6, .slide-desc p.h6{font-size:0.1rem}


    .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    
        margin-bottom:auto;
        font-weight: 500;
        line-height: 1.25;
    }
    
}











@media only screen and (min-width: 1200px){
  #BN1{ min-height: 570px; background-size: cover; background: url('../images/index/BG1.jpg') #000 no-repeat center; }
  #BN2{ min-height: 570px; background-size: cover; background: url('../images/index/BG2.jpg') #000 no-repeat right ; }
  #BN3{ min-height: 570px; background-size: cover; background: url('../images/index/BG3.jpg') #000 no-repeat center ; }
}

@media (min-width: 992px) and (max-width: 1199px) {
  #BN1{ min-height: 445px; background-size: cover; background: url('../images/index/BG1-md.jpg') #000 no-repeat center ;  }
  #BN2{ min-height: 445px; background-size: cover; background: url('../images/index/BG2-md.jpg') #000 no-repeat  right;  }
  #BN3{ min-height: 445px; background-size: cover; background: url('../images/index/BG3-md.jpg') #000 no-repeat center ;  }
}

@media (min-width: 768px) and (max-width: 991px) {
  #BN1{ min-height: 445px; background-size: cover; background: url('../images/index/BG1-md.jpg') #000 no-repeat center ; }
  #BN2{ min-height: 445px; background-size: cover; background: url('../images/index/BG2-md.jpg') #000 no-repeat right ; }
  #BN3{ min-height: 445px; background-size: cover; background: url('../images/index/BG3-md.jpg') #000 no-repeat center ; }
}

@media (min-width: 576px) and (max-width: 767px) {
  #BN1{ min-height: 445px; background-size: cover; background: url('../images/index/BG1-xs.jpg') #000 no-repeat center ;   }
  #BN2{ min-height: 445px; background-size: cover; background: url('../images/index/BG2-xs.jpg') #000 no-repeat right ;   }
  #BN3{ min-height: 445px; background-size: cover; background: url('../images/index/BG3-xs.jpg') #000 no-repeat center ;   }
}

@media (min-width: 320px) and (max-width: 575px) {
  #BN1{ min-height: 400px; background-size: cover; background: url('../images/index/BG1-xs.jpg') #000 no-repeat center ;  }
  #BN2{ min-height: 400px; background-size: cover; background: url('../images/index/BG2-xs.jpg') #000 no-repeat right ;  }
  #BN3{ min-height: 400px; background-size: cover; background: url('../images/index/BG3-xs.jpg') #000 no-repeat center ;  }
}