@media screen and (max-width: 1300px){
	.container{max-width: 100%; padding: 0 30px;}

	body{font-size: 14px; line-height: 19px;}

	.btn{height: 44px!important; padding: 0 12px; font-size: 14px!important; border-radius: 12px!important}
	.btn-more{padding: 0!important; height: auto!important;}
	.btn-instagram{width: 32px!important; height: 32px!important; padding: 0!important}


	.bt{font-size: 30px; margin-bottom: 24px!important; line-height: 33px;}
	.bt.bt__large{font-size: 46px; margin-bottom: 8px; line-height: 51px;}


	header{padding: 16px 0;}
	header li:hover > .sub-menu,header li .sub-menu li:hover > .sub-menu{display:none;}
	header .logo{width: 44px;}
	header nav{display: none; position: absolute; top: 77px; left: 0; width: 100%; z-index: 500; background: rgba(0, 0, 0, 0.5); box-sizing: border-box; overflow-y: auto;}
	header nav ul{background: #fff; display: block; gap: 0}
	header nav ul li{width: 100%; height: auto; text-align: left; display: block;}
	header nav ul li a{display: block; text-align: left; padding: 12px 16px;}
	header nav ul li a:after,header nav ul li a:before{right: 16px;}
	header nav ul li ul{display: none; position: relative; top: 0; left: 0; width: 100%; box-shadow: none; border-radius: 0; border: none; background: var(--sBG); padding: 16px 0 16px 16px; box-sizing: border-box; min-width: auto}
	header .callback{gap: 8px; display: flex; align-items: center;}
	header .pull{display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; box-sizing: border-box; border-radius: 12px; border: 1px solid #E2E8F0; background: var(--sBG) url("../img/icon-pull.svg") 50% 50% no-repeat;}
	header .pull.open{background: var(--sBG) url("../img/icon-close.svg") 50% 50% no-repeat;}


	#promo .text{width: 400px}
	#promo .image{width: calc(100% - 480px); right: 30px}
	#promo .actions{padding: 32px 0;}


	#directions .grid{grid-template-columns: repeat(2, 1fr);}
	.item__direction img{height: 300px}
	.item__direction .data{transform: none; padding: 16px;}
	.item__direction .excerpt{margin-bottom: 16px;}


	#about__text .text{width: 300px;}
	#about__text .data{width: calc(100% - 324px)}


	#locations .grid{grid-template-columns: repeat(1, 1fr);}

	#live .swiper-slide{width: 370px}
	#live img{width: 100%; height: 200px;}


	.slider-sw .swiper-button-next{right: 100px;}
	.slider-sw .swiper-button-prev{left: 100px}


	#consultation .grid{grid-template-columns: repeat(1, 1fr); gap: 0}
	#consultation .image{display: none;}


	#team .grid{grid-template-columns: repeat(2, 1fr);}


	#events .events{gap: 24px;}
	.event__item{width: 100%!important}


	#prices .grid{grid-template-columns: repeat(1, 1fr);}
	.item__price ul{margin: 0}

	#prices .grid.grid-2 .item__price{padding-bottom: 90px}


	#why .grid,#safety .grid,#importantly .grid{grid-template-columns: repeat(2, 1fr);}


	#locations .tab{height: 300px; height: auto;}
	#locations .tabs .tab{height: 300px;}


	#complex .left{margin-bottom: 24px;}
	#complex .left,#complex .right{width: 100%;}

	.section__about .text, .section__about .image{width: 100%;}
	.section__about .text{margin-bottom: 24px;}


	#promo__events .image .item{left: 30px; bottom: -25px}


	.advantages__sport .grid,#timework .grid,#steps .grid{grid-template-columns: repeat(2, 1fr);}
	.item__time:after{display: none;}


	#security .grid{grid-template-columns: repeat(1, 1fr);}


	#about__for .image{margin-bottom: 24px}
	#about__for .text{margin: 0; padding: 0}


	.promo__note.note1{left: calc(50% - 200px)}
	.promo__note.note2{right: calc(50% - 200px)}


	footer li:hover > .sub-menu,footer li .sub-menu li:hover > .sub-menu{display:none;}
	footer{padding: 32px 0;}
	footer .col{width: 100%; max-width: 100%; border-bottom: 1px solid #E2E8F0;}
	footer .col:nth-child(1){margin-bottom: 32px; border: none;}
	footer .col ul{display: none; padding: 12px 0 24px; width: 100%;}
	footer .col ul li a{display: flex;}
	footer .col ul li a:after{opacity: 0.3}
	footer .col ul ul{position: relative; left: 0; background: #fff; padding: 12px; box-shadow: none; border-radius: 12px; margin-top: 12px}
	footer .col ul ul li a:after{right: 12px;}
	footer .title{position: relative; cursor: pointer; padding: 16px 40px 16px 0; margin: 0}
	footer .title:after{position: absolute; top: calc(50% - 10px); right: 0; width: 20px; height: 20px; content: ''; background: url("../img/icon-arrow-down.svg") 50% 50% no-repeat; transition: all 0.2s;}
	footer .col:nth-child(4){border-bottom: none;}
	footer .copyright{text-align: center; margin-top: 24px; padding: 0; border: none;}
}











@media screen and (max-width: 767px){
	.container{padding: 0 16px;}

	.bt__note{margin-bottom: 24px;}


	.section{padding: 32px 0;}


	#promo .text{width: 100%; text-align: center;}
	#promo .image{position: relative; width: 100%; height: 235px; margin-bottom: 24px; right: 0;}
	#promo .bt.bt__large{margin-bottom: 8px!important}
	#promo .actions{gap: 8px; padding: 24px 0;}
	#promo .actions .btn{width: 100%;}
	#promo .counts .item{width: 100%; border-bottom: 1px solid #E2E8F0; padding: 20px 0;}
	#promo .counts .item:last-child{margin: 0; padding-bottom: 0; border-bottom: none;}
	#promo .counts .count{font-size: 30px; margin-bottom: 5px}


	#directions .grid{grid-template-columns: repeat(1, 1fr); gap: 8px}
	.item__direction img{height: 255px;}


	#about__text .text{width: 100%; margin-bottom: 24px;}
	#about__text .data{width: 100%;}
	#about__text .item__box{margin-bottom: 8px;}
	.item__box .title img{width: 32px;}


	.filters__site{margin-bottom: 8px;}
	.item__filter{height: 44px;}


	.slider-sw .swiper-button-next{right: 16px;}
	.slider-sw .swiper-button-prev{left: 16px}
	.slider-sw .swiper-pagination{width: calc(100% - 64px)!important; left: 32px!important}


	#promo__page{background: transparent; padding: 24px 0;}
	#promo__page .bt__large{margin-bottom: 8px!important;}


	#team .grid{grid-template-columns: repeat(1, 1fr); gap: 8px}
	#team .filters__site{display: none;}
	#team .tabs__site .tab{display: block;}
	.item__team .data{padding: 12px;}
	.item__team .status,.item__team .title{margin-bottom: 8px;}


	#promo__events{padding-bottom: 90px}
	#promo__events .btn{position: absolute; bottom: 24px; left: 16px; width: calc(100% - 32px)}
	#promo__events .grid{grid-template-columns: repeat(1, 1fr); text-align: center;}


	.event__item{padding: 12px}
	.event__item .image{order: 0!important; width: 100%!important; height: 160px; margin-bottom: 16px!important}
	.event__item .image img{height: 100%!important; object-fit: cover;}
	.event__item .data{width: 100%!important; order: 1!important}
	.event__item .tags{position: relative; margin-top: 8px;}


	#individual .grid{grid-template-columns: repeat(1, 1fr); gap: 0}
	.item__individual{border-bottom: 1px solid #E2E8F0; padding: 12px 0}
	.item__individual:last-child{padding-bottom: 0; border: none;}
	.item__individual img{width: 72px; height: 72px;}


	.item__price .price{font-size: 30px;}
	.item__price{padding-bottom: 95px}
	#prices .note{padding-top: 24px}


	#advantages .grid{grid-template-columns: repeat(1, 1fr); gap: 8px}
	.item__advantages img{width: 48px; height: 48px}


	#details .gallery{display: none;}
	#details .slider-sw{display: block;}
	#details .swiper{overflow-x: visible;}
	#details .swiper-slide{max-width: 100%; width: 370px}
	#details .swiper-slide img{width: 100%; height: 170px; border-radius: var(--radius);}


	#locations.section__locations .item__box{margin-bottom: 8px}


	#consultation__block .data{padding: 12px;}
	#consultation__block .bt{margin-bottom: 16px!important}
	#consultation__block .bt__note{margin-bottom: 24px;}


	#promo__movna{padding: 24px 0;}
	#promo__movna .btn,#team .btn{width: 100%;}
	#promo__movna .images{position: relative; left: 0; width: 100%;}
	#promo__movna .images img{display: none;}
	#promo__movna .images img.mobile{display: block; margin-top: 24px; border-radius: 20px;}


	#choose__direction .grid,#why .grid,#how .grid,#clubs .grid,#schedule .grid,#why .grid, #importantly .grid,#types .grid,#smile .grid,#timework .grid,#steps .grid,#list__tech .grid{grid-template-columns: repeat(1, 1fr); gap: 8px}

	#smile .grid{gap: 24px;}


	.item__complex{padding: 12px;}
	.item__complex .status{position: absolute; top: 28px; left: 28px;}
	.item__complex img{width: 100%; height: 200px!important; margin-bottom: 20px!important}
	.item__complex .s__tags{padding-top: 24px; gap: 8px!important;}
	.item__complex .s__tags a,.item__complex .s__tags span{height: 44px!important}
	.item__complex.item__left{padding: 12px;}
	.item__complex.item__left .image{width: 100%; top: 0; left: 0; position: relative;}
	.item__complex .steps li:after{display: none;}


	.section__about .actions{gap: 8px;}
	.section__about .actions .btn{width: 100%;}
	.section__about ul{gap: 8px;}
	.section__about ul li{width: 100%;}


	#safety .grid,#variants .grid{grid-template-columns: repeat(1, 1fr); gap: 8px}
	#variants .item__advantages{padding-bottom: 24px}
	#variants .item__advantages .btn{position: relative; width: 100%; left: 0; bottom: 0; margin-top: 16px;}
	#variants .bt__bg{line-height: 26px; height: 26px; padding: 0 8px;}


	#promo__object{padding: 24px 0;}
	#promo__object .data{position: relative; height: auto;}
	#promo__object .text{padding: 0; margin-bottom: 24px; max-width: 100%;}
	#promo__object .btn{width: 100%;}
	#promo__object img{width: calc(100% - 32px); border-radius: 20px; margin-left: 16px; height: 300px;}


	#contacts .map{width: 100%; height: 300px; margin-top: 24px; order: 1}
	#contacts .data{width: 100%; order: 0; text-align: center;}
	#contacts .actions{gap: 8px}
	#contacts .actions .btn{width: 100%;}


	#promo__events .image .item{display: none;}
	#promo__events .image{max-width: 100%; height: 300px;}
	#promo__events .image img{width: 100%; height: 100%; border-radius: var(--radius);}


	#quote .data{padding: 12px;}
	.advantages__sport .item__advantages{padding: 12px 12px 12px 72px; position: relative;}
	.advantages__sport .item__advantages img{margin: 0; position: absolute; left: 12px; top: calc(50% - 24px)}
	.advantages__sport .item__advantages .bt__title{margin-bottom: 8px}


	.promo__note{position: relative; width: 100%; max-width: 100%; top: 0!important; bottom: 0!important; left: 0!important; right: 0!important; padding: 12px; margin-top: 8px;}


	#counts .grid{grid-template-columns: repeat(1, 1fr);}
	.item__count{border: none; border-bottom: 1px solid #E2E8F0; padding: 0 0 24px;}
	.item__count .count{font-size: 30px;}


	.item__time{position: relative; padding: 12px 12px 12px 72px;}
	.item__time span{position: absolute; left: 12px; width: 48px; height: 48px; top: calc(50% - 24px)}
	.item__time .bt__title{margin-bottom: 8px;}


	.blockquote .text{width: 100%; order: 1; max-width: 100%;}
	.blockquote .bt__bg{order: 0; line-height: 26px; padding: 0 12px;}


	.section__left .text{text-align: left;}

	#promo__events.section.section__shop.section__sport.section__left .btn{position: relative; left: 0; width: 100%; top: 5px;}
	#promo__events.section.section__shop.section__sport.section__left .image{height: auto;}
	#promo__events.section.section__shop.section__sport.section__left .image img{width: 100%; height: auto;}


	#consultation .form{padding: 12px;}
	.form label{margin-bottom: 8px;}
	.form input[type="text"], .form input[type="email"], .form input[type="tel"], .form input[type="password"], .form textarea, .form select{margin-bottom: 20px; height: 50px; font-size: 14px;}
	.form textarea{height: 120px;}
	.box__modal{padding: 50px 16px 20px!important}
	.box__modal .bt{font-size: 24px;}
	.box__modal .grid{grid-template-columns: repeat(1, 1fr); gap: 0}
}