@media screen and (max-width: 1704px){
	body{padding: 0 30px}
}


@media screen and (max-width: 1500px){
	section,header,footer{max-width: 1320px;}

	.container{max-width: 1200px}


	header nav ul{gap: 20px}
	header .data{gap: 30px}


	#reviews .list__swiper{padding: 0 70px 50px; box-sizing: border-box;}
	#reviews .swiper-button-prev{left: 0;}
	#reviews .swiper-button-next{right: 0;}


	.section__filters.form .flex{gap: 10px}
	.section__filters.form select,.section__filters.form .search,.section__filters .item__filters,.section__filters .btn{width: 32%;}


	header.open{border-radius: 0!important}
}



@media screen and (max-width: 1340px){
	body{padding: 0 15px;}
	section,header,footer{max-width: 100%;}
	.container{max-width: 100%;}

	.section__round{border-radius: 35px;}
	.section__round__top{border-radius: 35px 35px 0 0}
	.section__round__bottom{border-radius: 0 0 35px 35px}


	header .pull{display: flex; align-items: center; justify-content: center; background: #fff url("../img/pull.svg") 50% 50% no-repeat; border-radius: 50%; width: 54px; height: 54px;}
	header .pull.open{background: #fff url("../img/close.svg") 50% 50% no-repeat;}
	header .data{gap: 18px;}
	header .phone{display: none;}
	header nav{display: none;}
	header{padding: 15px 30px; background: #F3EEEB}




	#promo{padding: 130px 0 85px; background: #F3EEEB url("../img/bg_promom.png") 0% calc(100% + 80px) no-repeat; border-radius: 0 0 35px 35px}
	#promo img{position: relative; top: 0; right: 0; margin: 0 auto 20px; max-width: 80%;}
	#promo .text{max-width: 100%; text-align: center; padding: 0 15px}
	#promo .text .flex{justify-content: center;}


	#advantages .grid.grid-4{grid-template-columns: repeat(2, 1fr);}
	.list__vacancies.grid.grid-3{grid-template-columns: repeat(2, 1fr);}


	#services .container{padding: 0 15px;}
	#services .steps{gap: 30px}
	#services .step{width: calc(50% - 20px);}
	#services .step:after{display: none;}


	#reviews .list__swiper{padding: 0 15px 30px}
	#reviews .list__swiper .swiper-slide{width: 100%;}
	#reviews .swiper-button-prev{top: 100%; left: calc(50% - 60px); margin-top: 20px}
	#reviews .swiper-button-next{top: 100%; right: calc(50% - 60px); margin-top: 20px}


	#faq .image{position: relative; bottom: 0;}
	#faq .image img{margin: 0 auto;}
	#faq .list__faq{max-width: 100%;}


	footer .container{padding: 0 15px;}
	footer .col-1{max-width: 100%; width: 100%; text-align: center; margin-bottom: 20px;}
	footer .col-1 .logo{margin: 0 auto 20px;}
	footer .col-1 .socials .flex{justify-content: center;}
	footer .col-2,footer .col-3{width: 50%; max-width: 100%; margin-bottom: 20px;}
	footer .col-4{max-width: 100%;}


}




@media screen and (max-width: 1140px){
	.section__filters{margin-bottom: 25px; padding: 0; box-shadow: none;}
	.section__filters.form select, .section__filters.form .search, .section__filters .btn, .section__filters .item__filters.open__modal{display: none;}
	.section__filters .item__filters.open__filters {
		display: block;
		margin-top: 10px;
	}
	.section__filters .item__filters{width: 100%;}


	#page__vacancies__open .gallery{width: 100%; margin-bottom: 80px;}
	#page__vacancies__open .text{width: 100%;}
	#page__vacancies__open .vacancies__description .data,#page__vacancies__open .vacancies__description .reviews{width: 100%;}
	#page__vacancies__open .vacancies__description .reviews{padding: 20px 0 0;}


	#page__about .data{width: 100%; max-width: 100%;}
	#page__about .image{width: 100%; position: relative; right: 0; top: 0;}
	#page__about .image img{margin: 0 auto;}


	#contacts__info .data{width: 100%;}
	#contacts__info .form{width: 100%;}


	#page__contacts .data{width: 100%; margin-bottom: 24px;}
	#page__contacts #map{width: 100%; height: 500px}


	#page__contacts .review__item{width: 100%;}
	#page__contacts .review__item:last-child{margin: 0}


	#page__doc .item .image{order: 0!important; width: 100%; margin-bottom: 10px}
	#page__doc .item .image img{width: 100%;}
	#page__doc .item .text{width: 100%; padding: 0!important; order: 1!important}
	#page__doc .item .text .icon{left: 0}


	#page__doc .docs .doc__item{padding: 30px 20px;}
	#page__doc .docs .doc__item .title{font-size: 20px; line-height: 30px; margin-bottom: 15px;}
	#page__doc .docs .doc__item .title br{display: none;}
	#page__doc .docs .doc__item p{font-size: 14px; margin-bottom: 5px;}
	#page__doc .docs .doc__item p strong{font-size: 18px;}
	#page__doc .docs .doc__item .flex p{text-align: center;}


	#page__doc .docs__list .top{justify-content: center; gap: 15px;}
	#page__doc .docs__list .top .title{width: 100%; max-width: 100%; text-align: center;}
	#page__doc .docs__list .doc__item{padding: 30px;}


	#page__rekrut .text{width: 100%; padding: 0 0 30px}
	#page__rekrut .image{width: 100%;}


	#payment{padding: 30px}
	#payment .item{width: 100%; margin-bottom: 20px;}


	#user__partner{padding: 30px}
	#user__partner .image{width: 100%; margin-bottom: 20px}
	#user__partner .text{width: 100%; padding: 0}
}



@media screen and (max-width: 767px){

	.section__filters.form select, .section__filters.form .search, .section__filters .item__filters, .section__filters .btn {
    width: 100%;
  }
	body{padding: 0 15px;}

	.bt{font-size: 24px; line-height: normal; min-height: 77px; background-size: auto 77px!important; padding-top: 8px}
	.bt.bt__left{margin-bottom: 20px; text-align: center; background-position: 50% 50%!important}

	.btn-brown span{font-size: 14px}


	header .logo{max-width: 110px;}


	#promo img{max-width: 220px}
	#promo h1{margin-bottom: 7px; font-size: 24px; line-height: 29px;}
	#promo p{font-size: 14px; line-height: 24px;}


	#advantages{padding: 40px 0 0;}
	#advantages .grid.grid-4{grid-template-columns: repeat(1, 1fr);}
	#advantages .item{font-size: 14px; line-height: 24px; padding-left: 50px; padding-right: 50px}


	#vacancies{padding: 55px 0;}


	.list__vacancies.grid.grid-3{grid-template-columns: repeat(1, 1fr);}
	.item__vacancies{padding: 13px 20px 13px 120px;}
	.item__vacancies .logo{width: 90px; height: 90px; top: 13px; left: 13px;}
	.item__vacancies .logo img{max-width: 90%; max-height: 90%; width: auto; height: auto;}
	.item__vacancies .price{justify-content: flex-start; padding-top: 15px; font-size: 18px;}
	#vacancies .flex__center{padding: 45px 0 0;}


	#services{padding: 35px 0;}
	#services .step .icon{height: 80px; margin-bottom: 15px;}
	#services .step .icon img{width: auto; height: 80px;}
	#services .step p{font-size: 14px; line-height: normal;}
	#services .steps{gap: 25px; margin-bottom: 25px;}
	.list__services .item__service{width: 100%; padding: 40px 22px 22px; margin-bottom: 15px;}
	.list__services .item__service:last-child{margin: 0}
	.list__services .item__service .title{text-align: center; font-size: 16px; line-height: normal;}
	.list__services .item__service li{font-size: 14px; line-height: 21px;}



	#customers{padding: 40px 0}
	#customers .swiper{padding-bottom: 80px}
	#customers .swiper .swiper-button-prev{top: 100%; left: calc(50% - 60px); margin-top: -48px}
	#customers .swiper .swiper-button-next{top: 100%; right: calc(50% - 60px); margin-top: -48px}
	#customers .swiper img{width: auto; max-height: 30px;}


	#reviews{padding: 35px 0 100px;}
	.review__item{padding: 30px 8px 30px 18px;}
	.review__item .user{background-position: 100% 10px;}
	.review__item .user span{width: 100%; font-size: 20px; margin-bottom: 10px;}
	.review__item .rev{padding: 0; font-size: 14px; line-height: 22px;}
	.review__item .date{font-size: 16px; padding: 0}


	#faq{padding: 40px 0 45px;}
	#faq .bt{margin-bottom: 0;}
	#faq .image img{max-height: 360px;}
	#faq .list__faq .title{font-size: 16px; line-height: 20px;}
	#faq .list__faq .answer{font-size: 14px; line-height: 25px;}


	#breadcrumbs{display: none;}


	#page__vacancies{padding: 40px 0 95px}


	#page__vacancies__open{padding: 40px 0 95px}
	#page__vacancies__open .gallery .swiper img{height: 250px;}
	#page__vacancies__open .gallery .company__logo{top: 12px; left: 10px; width: 67px; height: 67px;}
	#page__vacancies__open .gallery .company__logo img{max-width: 80%;}
	#page__vacancies__open .gallery .swiper-button-next,#page__vacancies__open .gallery .swiper-button-prev{top: 100%; margin-top: 10px;}
	#page__vacancies__open .gallery .swiper-pagination{bottom: -38px!important}
	#page__vacancies__open h1{font-size: 24px;}
	#page__vacancies__open .description{font-size: 14px; line-height: 23px;}
	#page__vacancies__open .vacancies__description .data{font-size: 14px;}


	.site__tags span{height: 36px; font-size: 14px; padding: 0 17px;}



	.pagination{padding: 40px 0 0; gap: 8px}
	.pagination a,.pagination span{width: 40px; height: 40px; font-size: 14px;}


	.box__modal{padding: 35px 15px;}
	.box__modal .top .title{width: 100%; font-size: 24px;}
	.fancybox-close-small{border-radius: 50%; right: 15px;}
	.box__modal .top{margin-bottom: 15px;}
	.box__modal .top .search{width: 100%;}
	.box__modal .country{gap: 20px;}
	.box__modal .country .item{width: 100%!important}
	.box__modal .country .item .label{height: auto; margin-bottom: 15px;}
	.box__modal .country .item .label p{font-size: 14px; line-height: 25px;}
	.box__modal .item__label{font-size: 16px;}
	.box__modal .other{gap: 20px;}
	.box__modal .other .item{width: 100%;}
	label.checkbox{font-size: 16px;}


	#page__about{padding: 40px 0 0;}
	#page__about .image img{max-width: 300px; margin-bottom: 20px;}
	#page__about .data{font-size: 14px;}
	#page__about .data .note{font-size: 16px; text-align: left;}
	#page__about .data .grid{grid-template-columns: repeat(2, 1fr);}


	#faq.faq__in__page .bt{margin-bottom: 20px;}


	#contacts__info .data .info{padding: 100px 0 0; text-align: center; background-position: 50% 0; background-size: auto 85px}
	#contacts__info .data .info .title{font-size: 16px; margin-bottom: 10px;}
	#contacts__info .data .info p{font-size: 14px;}
	#contacts__info .data .tel{justify-content: center;}
	#contacts__info .data .tel a{order: 0}
	#contacts__info .data .tel .btn{order: 1}


	#page__contacts{padding: 40px 0 0;}
	#page__contacts .data{padding: 30px; border-radius: 35px;}
	#page__contacts #map{border-radius: 35px;}


	#page__doc{padding: 40px 0 95px}
	#page__doc .item .text{text-align: center; font-size: 14px; line-height: 23px;}
	#page__doc .item .text .icon img{margin: 0 auto;}
	#page__doc .item .text .title{font-size: 18px;}
	#page__doc .docs{padding: 40px 0 0;}
	#page__doc .docs .doc__item{width: 100%; margin-bottom: 20px;}
	#page__doc .docs .doc__item:last-child{margin: 0}
	#page__doc .docs__list{padding: 40px 0 0;}
	#page__doc .docs__list .doc__item{padding: 30px 18px; border-radius: 35px;}
	#page__doc .docs__list .top .title{font-size: 20px; line-height: 27px;}
	#page__doc .docs__list .top .price{height: 70px; font-size: 20px; padding: 0; width: 100%; justify-content: center;}
	#page__doc .docs__list .doc__item p{padding: 12px 15px; font-size: 14px; line-height: 22px;}


	#page__rekrut{padding: 40px 0;}
	#page__rekrut .text{font-size: 14px; line-height: 24px;}


	#payment{padding: 25px 12px;}
	#payment .item{padding: 40px 27px 114px}
	#payment .item .flex{bottom: 30px}
	#payment .item .title{font-size: 20px; margin-bottom: 10px}
	#payment .item .price{font-size: 16px;}


	#user__partner{padding: 25px 12px;}
	#user__partner .text li{font-size: 14px; line-height: 24px;}
	#customers__search p{margin-bottom: 20px; font-size: 14px; line-height: 24px;}
	#customers__search .item{padding-left: 80px;}
	#customers__search .item span img{height: 90px; width: auto;}
	#customers__search .item .title{font-size: 14px; line-height: 24px;}
	#customers__search .item a{font-size: 18px;}


	#page__rekrut.last{padding: 30px 0 0;}
	#page__rekrut.last .image{order: 0!important; margin-bottom: 20px;}
	#page__rekrut.last .text{order: 1!important;}
	#page__rekrut.last .bt{text-align: left; background-position: 0 50%!important}


	#contacts__info{padding: 40px 0 90px}


	footer{padding-top: 40px;}
	footer .col-1 .socials{padding-top: 10px;}
	footer .title{font-size: 16px;}
	footer ul li a{font-size: 14px;}
	footer .cl{width: 100%; font-size: 14px;}
	footer .row__socials{padding: 15px 0 0 38px}
	footer .copyright{justify-content: center;}
	footer .copyright p{order: 1; width: 100%; text-align: center;}
	footer .copyright p:last-child{order: 0}
	.error-code {
		font-size: 80px;
}

.error-title {
		font-size: 36px;
}

.error-description {
		font-size: 16px;
}
}