@media (max-width: 1499.9px){
  .ttl.xlg{font-size: 90px}
  .ttl.lg{font-size: 48px}
  .mb120{margin-bottom: 80px}
  .header .top {padding: 30px 0 20px;}
  .header .logo{width: 160px}
  .header-menu a {margin: 0 10px}
  .counter-section .item{width: calc(25% - 15px);}
  .main-about .text-box{width: calc(51.5% - 30px);}
  .main-services .services-box{width: calc(51.5% - 30px);}
  .footer .form-box{width: 57%}
  .label{padding: 10px}
  .input{padding: 10px}
  .input:focus + .label, .label.filled{left: 0}
  .map{height: 560px}
}
@media (max-width: 1299.9px){
  .header .top{display: none;}
  .header .bottom{padding-top: 7px}
  .header .logo{width: 195px}
  .header-menu{display: none;}
  .burger-menu{display: block;}
  .main-intro{min-height: 0}
}
@media (max-width: 1199.9px){
  body{font-size: 16px}
  .mb120{margin-bottom: 60px;}
  .mb80{margin-bottom: 50px;}
  .mb50{margin-bottom: 35px;}
  .mb40{margin-bottom: 30px;}
  .mb35{margin-bottom: 25px;}
  .mb30{margin-bottom: 20px;}
  .mb25{margin-bottom: 17px;}
  .mb20{margin-bottom: 15px;}
  .main-intro{padding-top: 15%}
  .ttl.xlg{font-size: 60px}
  .ttl.lg{font-size: 48px}
  .ttl.sm {font-size: 24px}
  .footer{padding: 60px 0}
  .footer .form-box{width: 100%; margin-bottom: 40px}
}
@media screen and (max-width: 1024px){
  .main-intro .text-box{width: 100%; padding-top: 0; margin-bottom: 20px}
  .main-intro .img-box{width: 100%; padding-bottom: 85%}
  .counter-section .item{width: calc(50% - 7px); margin-bottom: 14px}
  .main-about .img-box{width: 100%; margin-bottom: 30px}
  .main-about .text-box{width: 100%}
  .main-services .ttl-box{width: 100%; margin-bottom: 30px}
  .main-services .services-box{width: 100%;}
  .spec-list{margin-left: -7px; margin-right: -7px}
  .spec-list li{width: 150px; margin: 0 7px 14px}
  .spec-list .name{font-size: 12px}
  .spec-list .position{font-size: 12px}
  .price-tabs{width: 100%}
  .price-tabs-content{width: 100%}
} 
@media (max-width: 767.9px){
  .ttl.lg {font-size: 36px;}
  .header .btn{order:3; margin-top: 28px}
  .header.sticky .btn{ display: none; }
  .main-intro{padding: 220px 0 10px}
  .main-services .img-box .btn{position: static; margin-top: 20px}
  .contact-form .inputs{width: 100%; margin-bottom: 40px}
  .contact-form .textarea{width: 100%; height: 180px; margin-bottom: 20px}
}
@media (max-width: 576px){
  .mb120{margin-bottom: 20px;}
  .mb80{margin-bottom: 40px;}
  .mb50{margin-bottom: 25px;}
  .mb40{margin-bottom: 20px;}
  .mb35{margin-bottom: 17px;}
  .mb30{margin-bottom: 15px;}
  .mb20{margin-bottom: 12px;}
  .mb15{margin-bottom: 8px;}
  .ttl.xlg{font-size: 54px}
  .ttl.lg {font-size: 24px}
  .ttl.sm{font-size: 18px}
  .modal-wrapper {padding: 40px 20px}
  .main-intro .ttl.sm{font-size: 26px}
  .main-intro .img-box .btn{display: none;}
  .main-intro .img-box .img-absolute{display: none;}
  .main-intro .img-box .img-absolute.mobile{display: block; width: calc(100% + 48px); left: -24px;}
  .main-intro .text-box .btn-box{display: none;}
  .counter-section .item{border-radius: 22px 0 22px 22px; padding: 21px 10px}
  .counter-section .counter{font-size: 30px}
  .counter-section .text{font-size: 11px}
  .main-about .img-box{width: calc(100% + 48px); margin: 0 -24px 30px}
  .about-caption{font-size: 14px; align-items: flex-start; padding: 16px}
  .about-caption:before{width: 40px; height: 40px; margin-right: 10px}
  .main-slider .swiper-container{width: 87%; margin-left: 0}
  .services-list li{border-radius: 10px; border-width: 1px; padding: 10px 15px; margin-bottom: 10px}
  .main-services .about-caption{border-radius: 10px; padding: 20px 15px}
  .main-services .img-box {width: calc(100% + 48px); margin: 0 -24px}
  .main-services .img-box img{display: none;}
  .main-services .img-box .mobile{display: block;}
  .price-tabs .tab{height: 60px; font-size: 16px; padding-right: 5px}
  .price-tab{padding: 20px 15px;}
  .footer{padding: 24px 0 50px}
  .footer-menu{display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 30px}
  .footer-menu li{width: calc(50% - 5px);}
  .footer-contacts{width: 100%}
  .footer .form-box .ttl.sm{display: none;}
}
@media (max-width: 425px){
  .header .logo{order: 2; width: 100%;  }
  .header .logo img{width: 195px;  }
  .header.sticky .logo{width: auto; order: -1;}
  .burger-menu{margin-left: auto;}
}
@media (max-width: 365px){
  .container{padding-left: 15px; padding-right: 15px}
  .ttl.xlg{font-size: 48px}
  .btn{padding: 0 15px}
  .main-about .img-box{width: calc(100% + 30px); margin: 0 -15px 20px}
  .spec-list li{width: calc(50% - 14px);}
  .spec-list .name{font-size: 10px}
  .price-tab{font-size: 14px}
}