@charset "UTF-8";
:root {  --color1: #f57c00;
 --color2: #111b51;
 --blue: #f57c00;
 --light: #464646;
}
* { box-sizing: border-box; list-style: none; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; }
body { font-family: "Arial", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; color: #000; position: relative; }
.main-nav { position: fixed; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background: #fff; z-index: 999; opacity: 1; visibility: visible; transition: all .6s ease 0s; padding: 25px 50px; }
.nav-tab { cursor: pointer; padding: 17px 15px; margin: 0; background: #fff; display: block; color: #000; border-bottom: 1px solid rgb(11 3 3 / 15%); border-top: 1px solid transparent; font-size: 1.2rem; }
.nav-panels { background: #fff; padding-left: 70px; }
.nav-panel { display: none; animation: fadein .8s; flex-wrap: wrap; column-gap: 4%; overflow: hidden; position: relative; }
.nav-bg1 { position: absolute; right: -50px; bottom: -45px; }
@keyframes fadein {  from {
 opacity:0;
}
to { opacity: 1; }
}
.radio { display: none; }
#nav-1:checked ~ .nav-panels #nav-panel1, #nav-2:checked ~ .nav-panels #nav-panel2, #nav-3:checked ~ .nav-panels #nav-panel3, #nav-4:checked ~ .nav-panels #nav-panel4, #nav-5:checked ~ .nav-panels #nav-panel5, #nav-6:checked ~ .nav-panels #nav-panel6 { display: flex }
#nav-1:checked ~ .tabs #nav-lb1, #nav-2:checked ~ .tabs #nav-lb2, #nav-3:checked ~ .tabs #nav-lb3, #nav-4:checked ~ .tabs #nav-lb4, #nav-5:checked ~ .tabs #nav-lb5, #nav-6:checked ~ .tabs #nav-lb6 { background: rgb(11 3 3 / 6%); color: #f57c00; }
#nav-1:checked ~ .tabs #nav-lb1 { border-color: rgb(11 3 3 / 15%) }
.close-button { position: absolute; right: 15px; top: 22px; z-index: 99; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 0; border-radius: 50%; transition: all .3s ease 0s; cursor: pointer; background: #fff; }
.close-button img { width: 100%; height: auto; }
.nav-top { margin-bottom: 30px; padding-right: 150px; position: relative; border-bottom: 1px solid #ddd; padding-bottom: 15px; }
.nav-top ul { display: flex; align-items: center; justify-content: space-between; column-gap: 20px; }
.nav-top ul a { font-size: 1.1rem; color: #000; text-decoration: none; letter-spacing: 1px; }
.nav-top ul a:hover { color: #f57c00; text-decoration: none; }
.nav-top:after { content: ""; background: #f57c00; height: 1px; width: 50px; position: absolute; right: 0; bottom: -1px; border-left: 15px solid #fff; }
.nav-top:before { content: ""; background: #f57c00; height: 1px; width: 50px; position: absolute; left: 0; bottom: -1px; border-right: 15px solid #fff; }
.nav-sec { display: flex; flex-wrap: wrap; position: relative; }
.nav-sec-l { width: 325px; }
.nav-sec-r { width: calc(100% - 325px); }
.nav-col { width: 30%; margin-bottom: 20px; border-top: 1px solid rgb(11 3 3 / 15%); margin-top: -1px; }
.pt-3 { padding-top: 20px; }
.nav-col h3 { color: #f57c00; font-weight: 400; font-size: 1.2rem; margin: 0 0 10px; }
.nav-col li { margin: 0 0 10px; }
.nav-col li a { color: #000; text-decoration: none; font-size: 15px; }
.nav-col li a:hover { color: #f57c00; text-decoration: none; }
.o-work { background: #121820; padding: 35px 30px; border-radius: 30px; margin: 30px 0; max-width: 250px; position: relative; }
.o-work h3 { color: #fff; letter-spacing: 1px; margin: 0 0 15px; font-size: 1.3rem; position: relative; }
.o-work p { color: #fff; font-size: 1.1rem; line-height: 1.6; margin: 0 0 25px; position: relative; }
.btn-org { background: #f57c00; color: #fff; font-weight: 700; display: inline-block; padding: 7px 20px; border-radius: 30px; font-size: 1rem; letter-spacing: 1px; position: relative; z-index: 1; text-decoration: none; }
.btn-org:hover { background: #e17200; text-decoration: none; color: #fff; }
.nav-bg2 { position: absolute; width: 100%; height: auto; right: 0; bottom: 0; }
.main-nav-b { display: flex; flex-wrap: wrap; column-gap: 2%; justify-content: space-between; align-items: center; border-top: 1px solid #ddd; position: relative; padding-top: 25px; background: #fff; }
.nav-b-col { display: flex; align-items: center; column-gap: 20px; padding: 25px 30px; width: 23%; border-radius: 20px; justify-content: center; }
.nav-b1 { background: #ffe2e5; }
.nav-b2 { background: rgb(255 191 49 / 20%); }
.nav-b3 { background: rgb(12 109 255 / 13%); }
.nav-b4 { background: rgb(65 184 131 / 22%); }
.nav-b-col p { margin: 0; font-size: 2rem; font-weight: 700; line-height: 1.2; }
.nav-b-col span { font-size: 1rem; color: #000; font-weight: 400; display: block; }
.nav-b1 p { color: #cc767e; }
.nav-b2 p { color: #e3ad31; }
.nav-b3 p { color: #5a7eb3; }
.nav-b4 p { color: #3b936e; }
.main-nav-b:after { content: ""; background: #f57c00; height: 1px; width: 50px; position: absolute; right: 0; top: -1px; border-left: 15px solid #fff; }
.main-nav-b:before { content: ""; background: #f57c00; height: 1px; width: 50px; position: absolute; left: 0; top: -1px; border-right: 18px solid #fff; }
.nav-col li a img { vertical-align: middle; margin-right: 10px; width: 25px; height: auto; }

.nav-top ul a img {
  vertical-align: middle;
  margin-right: 8px;
  max-width: 22px;
  height: auto;
}
.nav-br { background: rgb(225 185 185 / 20%); border: 1px solid rgb(0 0 0 / 18%); text-align: center; border-radius: 18px; padding: 25px; position: relative; margin: 50px 0 0; width: 22%; max-width: 260px; margin-bottom: 10px; }
.nav-br:hover { background: rgb(225 185 185 / 30%); }
.nav-br:after { position: absolute; content: ""; border: 1px solid rgb(0 0 0 / 15%); border-radius: 18px; width: 100%; height: 100%; left: 7px; top: 7px; }
.nav-br img { display: block; margin: 0 auto; }
.nav-br a { color: #000; text-decoration: none; font-size: 1.1rem; position: relative; z-index: 1; }
.cluch-box { background: #fff; margin: 15px; padding: 0; border: 1px solid #ededee; }
.cluch-top-box { background: #f5f4f6; padding: 10px 15px; text-align: center; max-height: 70px; margin-bottom: 25px; min-height: 70px; position: relative; }
.cluch-top-box img { max-height: 45px; margin: 0; transform: translate(0, -50%); position: absolute; top: 50%; }
.cluch-box .text-box { padding: 0 20px 25px; }
.cluch-box .text-box h4 { font-size: 20px; }
.cluch-box .text-box p { margin-bottom: 30px; font-size: 15px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; height: 50px; color: #525252; line-height: 1.6; }
.cluch-box .text-box h4 { font-size: 20px; }
.clc-cl { display: flex; align-items: center; margin-bottom: 25px; padding-top: 15px; }
.clc-cl>p { margin: 0 !important; font-size: 14px !important; }
.clc-rev { display: flex; align-items: center; margin-bottom: 10px; }
.clc-rev>img { height: 22px; width: auto; }
.clc-rev span { font-size: 18px; margin-left: 15px; }
.clc-rev span:last-child img { width: 90px; height: auto; }
.about-col-box { display: flex; align-items: stretch; flex-wrap: wrap; margin-left: 0; width: 100%; }
.cluch-top-box { background: #f5f4f6; padding: 10px 15px; text-align: center; max-height: 70px; margin-bottom: 25px; min-height: 70px; position: relative; }
.cluch-top-box img { max-height: 40px; margin: 0; transform: translate(0, -50%); position: absolute; top: 50%; left: 15px; width: auto; }
.clc-rev span:last-child img { width: 90px; }
.clc-rev span { font-size: 18px; margin-left: 15px; }
.btn1 { background-color: #f57c00; border: 1px solid #f57c00; padding: 12px 28px; border-radius: 4px; text-decoration: none; color: #fff; font-size: 16px; font-weight: 500; line-height: normal; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: all 0.3s ease; }
.btn1:hover { background: #e17200; text-decoration: none; color: #fff; }
.flex-center { display: flex; justify-content: center; width: 100%; }
.cluchSwiper .swiper-button-next { background: #f57c00; border: 1px solid #ddd; right: 0; }
.cluchSwiper .swiper-button-prev { background: #f57c00; border: 1px solid #ddd; left: 0; }
.cluchSwiper .swiper-button-next:after, .cluchSwiper .swiper-button-prev:after { font-size: 20px; color: #fff; }
#Reviews .cluchSwiper .swiper-button-next:after, #Reviews .cluchSwiper .swiper-button-prev:after { font-size: 18px; }
.cluchSwiper .swiper-button-next:hover, .cluchSwiper .swiper-button-prev:hover { background: #f57c00; border: 1px solid #f57c00; }
#Reviews .cluchSwiper .swiper-button-prev, #Reviews .cluchSwiper .swiper-button-prev:hover, #Reviews .cluchSwiper .swiper-button-next, #Reviews .cluchSwiper .swiper-button-next:hover { width: 24px; height: 40px; }
.w-sm { width: 30.3%; max-width: 100%; }
.w-md { width: 47.3%; max-width: 100%; }
.d-flex { display: flex; }
.brand-logo { text-align: left; padding-left: 10px; }
.w-lg { width: 70%; padding-left: 10px; }
.brand-logo > img { margin: 0 0 15px; }
.brand-logo.w-md { width: 45%; }
.brand-img.w-lg { width: 55%; }
.brand-img img { margin: 0 auto; max-width: 100%; height: auto; }
.brand-img.w-xl { width: 70%; }
.o-brand { height: 100%; }
.brand-img { display: flex; align-items: flex-end; justify-content: center; }
.nav-tab:hover { color: #f57c00; }
.nav-panels .nav-tab { display: none; }
nav.nav-col a {
    text-decoration: none !important;
}

 @media (max-width:1599px) {
.brand-logo { padding-left: 0; }
.brand-img.w-xl { width: 60%; padding-left: 20px; }
.brand-logo.w-sm { width: 40%; }
.nav-panels { padding-left: 40px; }
.nav-sec-l { width: 280px; }
.nav-sec-r { width: calc(100% - 280px); }
.nav-panel { column-gap: 3%; }
.nav-br { padding: 20px; }
.nav-top ul a {
  font-size: 1rem;

}
}
 @media (max-width:1399px) {
.brand-logo p { font-size: 16px; }
.nav-col { width: 32%; }
.nav-br a { font-size: 1rem; }
.nav-panel { column-gap: 2%; }
.nav-col li a img { margin-right: 5px; }
.nav-br { padding: 20px; margin: 30px 0 0; }
}
@media (max-width:1299px) {
.nav-col li a { font-size: 15px; }
.nav-sec-l { width: 250px; }
.nav-sec-r { width: calc(100% - 250px); }
.w-sm { width: 31%; }
.main-nav { padding: 20px; }
.nav-br { width: 23%; max-width: 250px; }
.w-sm { width: 31%; max-width: 100%; }
.w-md { width: 47.5%; max-width: 100%; }
.nav-bg1 { right: -20px; bottom: -45px; }
.close-button { right: 15px; top: 20px; width: 32px; height: 32px; }
.nav-top { margin-bottom: 30px; padding-right: 100px; }

}
@media (max-width:1199px) {
.nav-top ul { column-gap: 10px; }
.nav-top { margin-bottom: 30px; padding-right: 35px; }
.nav-top ul a img { margin-right: 2px; }
.nav-top ul a { font-size: 15px; }
.close-button { right: 15px; top: 20px; width: 26px; height: 26px; }
.o-work { display: none; }
.nav-sec-l { width: 100%; display: flex; align-items: center; border-bottom: 1px solid rgb(11 3 3 / 15%); margin-bottom: 20px; }
.nav-tab { padding: 15px; border-bottom: none; }
.nav-sec-r { width: 100%; padding-left: 0; }
.nav-b-col { column-gap: 10px; padding: 15px 15px; width: 24%; }
.main-nav-b { column-gap: 1%; padding-top: 20px; margin-top: 30px; }
.nav-tab { padding: 12px; border-bottom: none; font-size: 16px; }
.nav-bg1 { display: none; }
.brand-logo > img { margin: 0 0 15px; max-height: 50px; width: auto; max-width: 100px; height: auto; }
.brand-img img { margin: 0 auto; max-width: 100%; height: auto; width: 100%; }
}
@media (max-width:991px) {
.nav-top ul { column-gap: 15px; flex-wrap: wrap; justify-content: flex-start; }
.nav-top ul li { margin-bottom: 10px; }
.nav-b-col { column-gap: 10px; padding: 15px 15px; width: 49%; margin-bottom: 15px; }
.nav-br { width: 23%; max-width: inherit; }
.nav-br img { width: 100px; height: auto; }
.w-sm { width: 31.5%; max-width: 100%; }
.w-md { width: 48%; max-width: 100%; }
.brand-logo > img { margin: 0 0 15px; max-height: 50px; width: auto; max-width: 120px; }
.brand-img img { margin: 0 auto; max-width: 100%; height: auto; width: 100%; }
.brand-logo p { font-size: 15px; }
  .main-nav {
    padding: 20px 10px;
  }

}
@media (max-width:767px) {
.nav-top ul a { font-size: 14px; }
.nav-top { margin-bottom: 10px; padding-right: 25px; }
.nav-sec-l { margin-bottom: 20px; flex-wrap: wrap; display: none; }
.nav-tab { padding: 10px 15px; border-bottom: none; font-size: 16px; border: none; background: #f5f5f5; margin-bottom: 2px; font-weight: bold; }
.nav-col { width: 100%; padding-top: 15px; }
.nav-panel { column-gap: 4%; }
.nav-br { width: 30%; max-width: inherit; margin: 10px 0; }
.about-col-box { margin-bottom: 20px; }
.w-sm { width: 47%; max-width: 100%; }
.w-md { width: 47%; max-width: 100%; }
.main-nav { padding: 15px; }
#nav-1:checked ~ .nav-panels #nav-lb1, #nav-2:checked ~ .nav-panels #nav-lb2, #nav-3:checked ~ .nav-panels #nav-lb3, #nav-4:checked ~ .nav-panels #nav-lb4, #nav-5:checked ~ .nav-panels #nav-lb5, #nav-6:checked ~ .nav-panels #nav-lb6 { background: rgb(11 3 3 / 6%); color: #f57c00; }
.nav-panels .nav-tab { display: block; }

}
@media (max-width:567px) {
.nav-b-col { column-gap: 10px; padding: 15px 15px; width: 100%; margin-bottom: 15px; }
.nav-br { width: 47%; max-width: inherit; }
.nav-panel { column-gap: 4%; }
.nav-br:after { display: none }
.w-sm { width: 100%; max-width: 100%; margin-top: 20px; }
.w-md { width: 100%; max-width: 100%; margin-top: 20px; }
.brand-logo.w-sm, .brand-logo.w-md { margin: 0; }
}