.itopplus-background {

}
body {
  font-size: 16px;
  overflow-x: hidden;
  color: #010101;
  font-family: "LINE Seed Sans TH";
}

a {
    color: #010101;
}
a:hover {
    color: #ec1f26;
}
b, strong {
    font-weight: 600;
}
.itopplus-bg a {
    color: #fff;
}
.navbar-default .navbar-nav > li > a {
  color: #444;
  margin: 0 15px;
  padding: 8px 15px;
  border-radius: none;
}


.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:active,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover {
  color: #444 !important;
  box-shadow: none;
  background: transparent;
  background-color: transparent;
}

.dropdown-menu > li > a {
  color: #444;
}

.no-js .dropdown-menu > li > a:focus,
.no-js .dropdown-menu > li > a:hover {
  color: #444;
  background: transparent;
}

@media screen and (max-width: 992px) {
  #controlBanner img {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
    width: 40px !important;
    z-index: 10000;
  }

  #nav-menu,
  #ItopplusMainSidebar > div {
    background: #fff !important;
  }

  #itpMenuSideBar span {
    background-color: #000 !important;
  }

  #controlMenu * {
    color: #000 !important;
    border: none;
  }

  #controlBanner {
    margin-top: 0;
    top: 0;
    position: fixed;
    background: #ffffff;
    height: 50px;
    width: 100vw;
    margin: 0 -15px;
    z-index: 110;
  }

  .itopplus-slide {
    margin-top: 50px;
  }
}

@media screen and (min-width: 1024px) {
  .itopplus-banner {
    background: #fff;
    transition: 0.3s;
  }

  #controlBanner {
    object-fit: contain;
    padding: 15px;
    width: clamp(110px, 12vw, 130px);
    margin: 0 auto;
  }

  #nav-menu {
    display: grid;
    justify-content: center;
    background: transparent;
    min-height: auto;
  }
}




/**/
.h1, h1 {
    font-size: 4em;
    font-weight: 600;
}
.h2, h2 {
    font-size: 3.2em;
    font-weight: 600;
}
.h3, h3 {
    font-size: 2em;
    font-weight: 600;
}
.h4, h4 {
    font-size: 1.2em;
    font-weight: 600;
}
.h5, h5 {
    font-size: 1.1em;
}
.boderedlayoutClient {
    border-top: 0px dashed transparent;
    border-left: 0px dashed transparent;
    border-right: 0px dashed transparent;
    border-bottom: 0px dashed transparent;
}
ol, ul {
    margin-top: 10px;
    margin-bottom: 10px;
}
/**/




/*footer*/
.itopplus-footer {
    font-size: 14px;
}
.itopplus-footer h4 {
    margin: 0px 0 20px;
    font-weight: 600;
    font-size: 1.1em;
}
.itopplus-footer a {
    color: #fff;
}
.itopplus-footer a:hover {
    color: #ee1d24;
}
.footer-icon-img {
    width: 19%;
    display: flex;
    gap: 30px;
    justify-content: center;
    margin: 4% auto;
}
.icon-img {
    transition: 0.5s;
}
.icon-img:hover {
    transform: scale(1.1);
}
.copy-right {
    font-size: 0.9em;
    text-align: center;
}
.ITPcookiebar {
    width: 100% !important;
}
.buttonExampleSite {
    border: 1px solid #000 !important;
    color: #000 !important;
    font-family: "LINE Seed Sans TH" !important;
}
.buttonExampleSite:hover {
    background: #000 !important;
    color: #ffffff !important;
}
.ITP-pdpa-template-titleFont {
    font-size: 1.2em !important;
    padding-bottom: 0rem !important;
    font-weight: 600 !important;
}
.ITP-pdpa-template-contentFont {
    font-size: 1em !important;
}
.itpPDPALandingPage {
    padding: 6% 2% 2%;
}
/*footer*/



/**/
.menu-align {
    text-align: center;
    padding: 5% 0 1%;
}
.menu-align h2 {
    margin: 0 0 40px;
}
.menu-align h3 {
    margin: 0;
}
figure.effect-jazz {
    background: transparent;
}
figure.effect-jazz figcaption::after {
    border-top: 0px solid #fff;
    border-bottom: 0px solid #fff;
}
figure.effect-oscar figcaption {
    padding: 1em;
    background-color: rgba(58, 52, 42, .0);
}
figure.effect-oscar figcaption::before {
    border: 0px solid #fff;
}
.grid figure h2 {
    word-spacing: normal;
    font-weight: 600;
}
figure.effect-oscar h2 {
    margin: 23% 0 !IMPORTANT;
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
    font-size: 2em;
}
.menu-align2 {
    padding: 5% 0 1%;
}
.menu-align2 h2 , .menu-align2 h3 {
    margin: 0;
}
.menu-align2 h3 {
    white-space: pre-line;
}
#background678f538abedc3500130fb326 .bootstrap-collum div , #background678f543a2571af0013bd2637 .bootstrap-collum div {
    justify-content: center;
}
.contact-block {
    text-align: center;
    padding: 8% 0;
}
.contact-block h4 {
    font-size: 1em;
    margin: 15px 0 10px;
}
.line-qr {
    width: 32%;
    margin: 20px auto;
}
.btn-contact {
    background: #fff;
    color: #000;
    border: none;
    padding: 5px 15px;
    border-radius: 50px;
}
.btn-line {
    display: grid;
    grid-template-columns: 25px auto;
    gap: 10px;
    background: #06c755;
    color: #fff;
    border: none;
    padding: 7px 20px;
    border-radius: 50px;
    font-weight: 600;
    margin: 20px auto 0;
    align-items: center;
    transition: 0.5s;
}
.btn-line:hover {
    background: #ee1d24;
    color: #fff;
}
/**/


/*pagination*/
.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {
    background-color: #000;
    border-color: #000;
}
.pagination>li>a, .pagination>li>span {
    color: #000;
}
.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus {
    color: #000;
    background-color: #f7f7f7;
}
/*pagination*/



/* Large Devices, Wide Screens */
@media only screen and (min-width : 1900px) {
body {
    font-size: 20px;
}
    .container {
        width: 1440px;
    }
  .ITPcookiebar , .buttonExampleSite {
    font-size: 16px !important;
}
  .contact-block {
    padding: 12% 0;
}
  .footer-icon-img {
    width: 15%;
}
}




/* Large Devices, Wide Screens */
@media only screen and (max-width:1191px) {
figure.effect-oscar h2 {
    margin: 22% 0 !IMPORTANT;
}
  .contact-block {
    padding: 0% 0;
    font-size: 0.8em;
}
}



/* Large Devices, Wide Screens */
@media only screen and (max-width:900px) {
    figure.effect-oscar h2 {
        margin: 21% 0 !IMPORTANT;
    }
   
}


/* Large Devices, Wide Screens */
@media only screen and (max-width:480px) {
#imagesControl678f1e96f197b10013bddd56 {
    padding: 0 !important;
}
  .h2, h2 {
    font-size: 2em;
}
.h3, h3 {
    font-size: 1.4em;
}
      figure.effect-oscar h2 {
        margin: 17% 0 !IMPORTANT;
        font-size: 1.4em;
    }
  .menu-align2 {
    padding: 5% 10px 1%;
}
      .contact-block {
        padding: 5% 0;
        font-size: 1em;
    }
  .footer-icon-img {
    width: 40%;
    gap: 15px;
}
  .copy-right {
    font-size: 0.7em;
}
  .menu-align2 h3 {
    white-space: inherit;
}
      #controlBanner img {
        top: 5px;
        width: 30px !important;
    }
}

