@charset "utf-8";
/* CSS Document */
/* RESPONSIVE CSS */
/* ---------------------------------------------------****  ****--------------------------------------------------- */
@media only screen and (min-width: 768px){}
/* ---------------------------------------------------****  ****--------------------------------------------------- */
@media (max-width: 992px) {}
/* ---------------------------------------------------**** Tablet ****--------------------------------------------------- */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.page-top::before, .page-top::after, .page-inside::before, .page-inside::after { display: none; }
.logo img, .scroll-header .logo img { height: 40px; }
.header-contact { position: relative; top: unset; right: unset; justify-content: flex-end; padding: 5px; background-color: var(--color-green4); }
.contact-number { font-size: var(--text-14); line-height: normal; letter-spacing: 1px; }
.navbar-toggler { padding: 5px; background-color: var(--color-green3); border: unset; border-radius: unset; box-shadow: unset; }
.navbar-toggler:focus { box-shadow: unset; }
.offcanvas.offcanvas-end { border-left: unset; }
.offcanvas-header { box-shadow: var(--box-shadow); }
.offcanvas-title img { height: 40px; }
.offcanvas-body { background-color: var(--color-green3); }
.navbar-nav { padding-top: 0; }
.scroll-header::before, .scroll-header::after { display: none; }
.scroll-header .navbar { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.scroll-header .header-contact { display: none; height: 40px; }
.main { padding-bottom: 120px; }
.footer { padding: 15px 0; height: 120px; }
.footer-logo { text-align: center; }
.footer-logo img { height: 40px; }
.footer-link { display: none; }
.copyright { font-size: var(--text-12); }
.section-main { padding: 30px 0; }
.main-banner-top { padding: 20px 0; }
.blog-news { width: 75%; }
.section-message { padding: 20px 0 0 0; background-color: var(--color-green1); }
.section-message::before { position: absolute; top: 0; left: 0; right: 0; content: ""; width: 100%; height: 150px; background-color: var(--color-white);  }
.section-message .section-title { align-items: center; }
.img-message { margin: 0 15%; width: 70%; }
.bg-main-message { position: relative; top: 0; left: auto; right: auto; margin: 0 -2em; padding: 20px 40px 10px 40px; width: auto; height: auto; font-size: var(--text-14); }
.bg-main-message::before { right: 15px; font-size: 60px; line-height: 60px; }
.bg-main-message p .btn1 { margin-right: auto; }
}
/* ---------------------------------------------------**** Mobile ****--------------------------------------------------- */
@media only screen and (min-width: 320px) and (max-width: 767px) {
.page-top::before, .page-top::after, .page-inside::before, .page-inside::after { display: none; }
.logo img, .scroll-header .logo img { height: 40px; }
.header-bg::before { display: none; }
.header-contact { position: relative; top: unset; right: unset; justify-content: flex-end; padding: 5px; background-color: var(--color-green4); }
.contact-number { font-size: var(--text-14); line-height: normal; letter-spacing: 1px; }
.navbar-toggler { padding: 5px; background-color: var(--color-green3); border: unset; border-radius: unset; box-shadow: unset; }
.navbar-toggler:focus { box-shadow: unset; }
.offcanvas.offcanvas-end { border-left: unset; }
.offcanvas-header { box-shadow: var(--box-shadow); }
.offcanvas-title img { height: 40px; }
.offcanvas-body { background-color: var(--color-green3); }
.navbar-nav { padding-top: 0; }
.scroll-header::before, .scroll-header::after { display: none; }
.scroll-header .navbar { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.scroll-header .header-contact { display: none; height: 40px; }
.main { padding-bottom: 120px; }
.footer { padding: 15px 0; height: 120px; }
.footer-logo { text-align: center; }
.footer-logo img { height: 40px; }
.footer-link { display: none; }
.copyright { font-size: var(--text-12); }
.section-main { padding: 30px 0; }
.main-banner-top { padding: 0 0 10px 0; }
.main-banner-top .container { padding-left: 0; padding-right: 0; }
.main-banner-top .row { margin-left: 0; margin-right: 0; }
.main-banner-top .row>* { padding-left: 0; padding-right: 0; }
.main-banner { padding: 0; }
.section-title { margin-bottom: 20px; }
.title { font-size: var(--text-18); }
.blog-news { position: relative; bottom: unset; left: unset; width: 100%; border-radius: unset; }
.header-news { padding: 5px 7px; width: 100px; }
.title-news { font-size: var(--text-16); font-weight: 400; }
.news-list { padding: 0 10px; width: calc(100vw - 100px); }
.news-item { font-size: var(--text-12); }
.news-item .news-date { margin-right: 10px; width: 65px; }
.news-list a.btn1 { min-width: 36px; }
.news-list a.btn1 span { display: none; }
.news-list a.btn1::after, .news-list a.btn1:hover::after { right: auto; }
.section-message { padding: 20px 0 0 0; background-color: var(--color-green1); }
.section-message::before { position: absolute; top: 0; left: 0; right: 0; content: ""; width: 100%; height: 150px; background-color: var(--color-white);  }
.section-message .section-title { align-items: center; }
.main-message { padding: 0; }
.img-message { margin: 0; }
.bg-main-message { position: relative; top: 0; left: auto; right: auto; margin: 0 -2em; padding: 20px 40px 10px 40px; width: auto; height: auto; font-size: var(--text-14); }
.bg-main-message::before { right: 15px; font-size: 60px; line-height: 60px; }
.bg-main-message p .btn1 { margin-right: auto; }
.contact-info p { font-size: var(--text-14); }
.company-profile { margin-bottom: 0; }
.company-profile ul { font-size: var(--text-14); border-bottom: solid 1px var(--color-border);}
.company-profile ul li { border-top: solid 1px var(--color-border); }
.company-profile ul li span { flex: 100%; padding: 5px 10px; border-bottom: none; }
.company-profile ul li span+span { flex: 100%; border-bottom: none; }
.company-profile ul li:first-child span { border-top: none; }
.company-profile ul li:first-child span+span { border-top: none; }
.blog-news-list .news-item .news-date { width: 75px; }
.blog-news-detail { padding: 0 10px; }
.news-topic { font-size: var(--text-18); line-height: 48px; }
.bloc-qa { padding: 0; }
.business-content-detail .img-img { margin: 0 0 20px 0; }
.business-content-detail dl { padding: 0; font-size: var(--text-14); }
.business-content-detail dl dt { width: 130px; }
}
/* ---------------------------------------------------**** Large Mobile ****--------------------------------------------------- */
@media only screen and (min-width: 480px) and (max-width: 767px) {}
/* ---------------------------------------------------**** Slider ****--------------------------------------------------- */
@media screen and (max-width: 1200px) {
.page-top::before, .page-top::after, .page-inside::before, .page-inside::after { display: none; }
.logo img, .scroll-header .logo img { height: 40px; }
.header-contact { position: relative; top: unset; right: unset; justify-content: flex-end; padding: 5px; background-color: var(--color-green4); }
.contact-number { font-size: var(--text-14); line-height: normal; letter-spacing: 1px; }
.navbar-toggler { padding: 5px; background-color: var(--color-green3); border: unset; border-radius: unset; box-shadow: unset; }
.navbar-toggler:focus { box-shadow: unset; }
.offcanvas.offcanvas-end { border-left: unset; }
.offcanvas-header { box-shadow: var(--box-shadow); }
.offcanvas-title img { height: 40px; }
.offcanvas-body { background-color: var(--color-green3); }
.navbar-nav { padding-top: 0; }
.scroll-header::before, .scroll-header::after { display: none; }
.scroll-header .navbar { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.scroll-header .header-contact { display: none; height: 40px; }
.main { padding-bottom: 120px; }
.footer { padding: 15px 0; height: 120px; }
.footer-logo { text-align: center; }
.footer-logo img { height: 40px; }
.footer-link { display: none; }
.copyright { font-size: var(--text-12); }
.section-main { padding: 30px 0; }
.main-banner-top { padding: 20px 0; }
.blog-news { width: 75%; }
.section-message { padding: 20px 0 0 0; background-color: var(--color-green1); }
.section-message::before { position: absolute; top: 0; left: 0; right: 0; content: ""; width: 100%; height: 150px; background-color: var(--color-white);  }
.section-message .section-title { align-items: center; }
.img-message { margin: 0 15%; width: 70%; }
.bg-main-message { position: relative; top: 0; left: auto; right: auto; margin: 0 -2em; padding: 20px 40px 10px 40px; width: auto; height: auto; font-size: var(--text-14); }
.bg-main-message::before { right: 15px; font-size: 60px; line-height: 60px; }
.bg-main-message p .btn1 { margin-right: auto; }
}
@media screen and (max-width: 1400px) {
.section-message { padding: 20px 0 0 0; background-color: var(--color-green1); }
.section-message::before { position: absolute; top: 0; left: 0; right: 0; content: ""; width: 100%; height: 150px; background-color: var(--color-white);  }
.section-message .section-title { align-items: center; }
.img-message { margin: 0 15%; width: 70%; }
.bg-main-message { position: relative; top: 0; left: auto; right: auto; margin: 0 -2em; padding: 20px 40px 10px 40px; width: auto; height: auto; font-size: var(--text-14); }
.bg-main-message::before { right: 15px; font-size: 60px; line-height: 60px; }
.bg-main-message p .btn1 { margin-right: auto; }	
}
@media screen and (max-width: 1024px) {}
@media screen and (max-width: 1023px) {}
@media screen and (max-width: 800px) {}
@media screen and (max-width: 768px) {}
@media screen and (max-width: 767px) {}
@media screen and (max-width: 640px) {}
@media screen and (max-width: 360px) {}