@media (max-width: 767px) {
    .ctg{
        width: 100%;
        padding: 0 25px;
        box-sizing: border-box;
    }
    .form .control span span.error{
        left: 68px;
    }
    .cookie{
        right: 0;
        top: 0;
        bottom: auto;
    }
    body{
        margin-top: 75px;
    }
    header .pc, header .tablet{
        display: none;
    }
    header .mob{
        padding: 16px 0 10px;
        top: 0;
        left: 0;
        display: block;
        text-align: center;
        position: fixed;
        width: 100%;
        background-color: #fff;
        box-shadow: 0 0 29px rgba(64, 34, 85, 0.16);
    }
    header .mob .descr{
        margin: 0;
        font-size: 15px;
    }
    header .mob .menu-button{
        position: absolute;
        top: 6px;
        right: 0;
        padding: 20px;
    }
    header .mob .menu-button span{
        width: 18px;
        height: 2px;
        background-color: #cc55da;
        display: block;
        transition: transform .3s;
    }
    header .mob .menu-button.active span:first-of-type{
        transform: rotate(45deg);
        transition: transform .3s;
        position: relative;
        top: 5px;
    }
    header .mob .menu-button.active span:last-of-type{
        transform: rotate(135deg);
        transition: transform .3s;
        position: relative;
        top: 0px;
    }
    header .mob .menu-button.active span:nth-of-type(2){
        display: none
    }
    header .mob .menu-button span:not(:last-of-type){
        margin-bottom: 3px;
    }
    header .mob .menu{
        display: none;
        position: absolute;
        background-color: #fff;
        width: 100%;
        top: 75px;
        left: 0;
    }
    header .mob .menu ul{
        margin: 0;
        padding: 15px 0;
        border-top: 1px solid #e5e5e5;
        border-bottom: 1px solid #e5e5e5;
    }
    header .mob .menu ul li a{
        font-size: 15px;
        font-family: 'Proxima-Bold';
        text-transform: uppercase;
        letter-spacing: 0.1em;
    }
    header .mob .menu ul li a.active{
        color: #cc55da;
    }
    header .mob .menu ul li:not(:last-of-type){
        margin-bottom: 29px;
    }
    header .mob .menu ul li .shop:before {
        content: '';
        width: 19px;
        height: 16px;
        background: url(/assets/images/svg/basket.svg) center center / cover no-repeat;
        display: inline-block;
        margin-right: 15px;
    }
    header .mob .menu .social{
        display: flex;
        align-items: flex-end;
        justify-content: center;
    }
    header .mob .menu .social a{
        display: block;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        transition: background-image .3s;
        margin: 28px 23px;
    }
    header .mob .menu .social .vk{
        background-image: url(../images/svg/vk_1.svg);
        width: 20px;
        height: 11px;
    }
    header .mob .menu .social .inst{
        background-image: url(../images/svg/insta_1.svg);
        width: 14px;
        height: 14px;
    }
    header .mob .menu .social .fb{
        background-image: url(../images/svg/fb_1.svg);
        width: 7px;
        height: 15px;
    }
    header .mob .menu .phones a{
        font-size: 15px;
        font-family: 'Proxima-Bold';
        letter-spacing: 0.08em;
    }
    header .mob .menu .phones a:first-of-type{
        margin-right: 25px;
    }
    header .mob .menu .time p {
        font-size: 15px;
        margin: 18px 0;
    }
    header .mob .menu .location p{
        font-size: 15px;
    }
    .promo h1{
        display: none;
    }
    .promo .text p{
        font-size: 18px;
        line-height: normal;
        width: 221px;
    }
    .promo .seo img {
        height: 430px;
    }
    .promo.ctg .text {
        width: 335px;
        margin: auto;
    }
    .promo .seo {
        position: relative;
        top: initial;
        right: initial;
        width: 335px;
        margin: auto;
    }
    .promo .seo img {
        position: absolute;
        height: 430px;
        top: -315px;
        right: -304px;
    }
    .promo .seo p {
        position: relative;
        top: initial;
        left: initial;
        width: 225px;
        margin-top: 70px;
        font-size: 16px;
        line-height: 24px;
    }
    .promo .seo p:after{
        content: '';
        position: absolute;
        left: -133px;
        top: -49px;
        width: 593px;
        height: 361px;
        background: url(/assets/images/icon/figure.png) center center / contain no-repeat;
        z-index: -1;
    }
    .promo .seo p span{
        font-size: 18px;
        font-family: 'Proxima-SemiBold';
        line-height: 25px;
        width: 165px;
    }
    .promo .img{
        position: relative;
        margin: 45px 0 0;
    }
    .promo .img, .company .img{
        justify-content: center;
    }
    .promo .img p, .company .img p{
        width: 82px;
        height: 82px;
    }
    .promo .img p span, .company .img p span{
        width: 62px;
        height: 62px;
        background-size: 67%;
        margin: 10px auto 0;
    }
    .promo .img p:nth-of-type(2) span, .company .img p:nth-of-type(2) span{
        background-size: 75%;
    }
    .promo .img p:nth-of-type(3) span, .company .img p:nth-of-type(3) span{
        background-size: 50%;
    }
    .courses h2 strong {
        margin-bottom: 20px;
    }
    .promo .bg {
        position: absolute;
        top: -18px;
        left: -114px;
        transform: translate(0, 0);
        z-index: -1;
    }
    .courses{
        display: flex;
        flex-wrap: wrap;
    }
    .courses h2{
        font-size: 20px;
        line-height: normal;
        margin-top: 60px;
        order: 1;
        margin-bottom: 25px;
        padding: 0 25px;
        box-sizing: border-box;
    }
    .courses .slider{
        order: 2;
        width: 100%;
    }
    .courses .about{
        order: 3;
    }
    .courses .about .left {
        position: relative;
        display: none;
    }
    .slider .block, .slider .text-bg{
        display: none;
    }
    .swiper-container{
        width: 100%;
        height: 375px;
    }
    .courses .slider .swiper-button-prev {
        left: 15px;
        right: auto;
    }
    .courses .slider .swiper-button-next {
        right: 15px;
        left: auto;
    }
    .courses .about .right span{
        font-size: 18px;
        margin-top: 35px;
        padding: 0 25px;
        box-sizing: border-box;
    }
    header{
        z-index: 100;
    }
    .courses .about .right p{
        font-size: 14px;
        line-height: 25px;
        padding: 0 25px;
        box-sizing: border-box;
    }
    .courses .about .right p:last-of-type {
        margin-bottom: 30px;
    }
    .courses {
        margin-bottom: 0;
        padding: 0;
    }
    .courses a.more{
        margin-left: 25px;
    }
    .mob_blocks {
        display: block;
        order: 4;
        width: 100%;
        background: linear-gradient(45deg, #ca4eda, #f7a1e5);
        padding: 40px 0 50px;
        margin-top: 35px;
    }
    .courses .mob_blocks .block{
        position: initial;
        background: none;
        text-align: center;
    }
    .courses .mob_blocks .block:not(:last-of-type){
        margin-bottom: 30px;
    }
    .courses .mob_blocks .block:nth-of-type(1) img{
        height: 64px;
    }
    .courses .mob_blocks .block:nth-of-type(2) img{
        height: 46px;
    }
    .courses .mob_blocks .block:nth-of-type(3) img{
        height: 38px;
    }
    .materials h2{
        font-size: 20px;
        line-height: normal;
        margin: 45px 0 30px;
    }
    .materials h2 strong{
        margin-bottom: 15px;
    }
    .materials .top{
        display: none;
    }
    .materials .first {
        position: relative;
        width: calc(100% + 50px);
        left: -25px;
    }
    .materials .bottom img{
        display: none;
    }
    .materials img{
        max-width: initial;
    }
    .materials .bottom .text{
        margin: 0 0 0 ;
    }
    .materials .bottom .text span{
        font-size: 18px;
    }
    .materials .bottom .text p{
        font-size: 14px;
    }
    .materials .bottom{
        margin: 0;
    }
    .materials .add-inf .vertical{
        display: none;
    }
    .materials .bottom .text p:last-of-type{
        margin-bottom: 25px;
    }
    .materials .add-inf{
        flex-wrap: wrap;
    }
    .materials .add-inf .advantage {
        width: 50%;
        text-align: center;
        margin-top: 40px;
    }
    .materials .add-inf img{
        display: none;
    }
    .materials .add-inf .advantage img {
        max-width: initial !important;
        height: 35px;
        display: block;
        margin: auto;
    }
    .materials .add-inf .advantage p{
        font-size: 15px;
    }
    .materials{
        margin-bottom: 50px;
    }
    .form{
        padding: 55px 25px;
        box-sizing: border-box;
    }
    .form .wrapper{
        width: 100%;
    }
    .form span{
        font-size: 20px;
        line-height: normal;
    }
    .form span strong{
        margin-bottom: 30px;
    }
    .form form input{
        margin: 0 0 20px;
    }
    .form form p{
        font-size: 14px;
    }
    .form .inf p{
        font-size: 18px;
    }
    footer .wrapper {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        padding: 0;
    }
    footer .wrapper .nav{
        order: 1;
        width: 100%;
        padding: 0 25px;
        box-sizing: border-box;
    }
    footer .wrapper .social{
        order: 2;
        width: 100%;
        justify-content: center;
        border-bottom: 1px solid #e5e5e5;
        margin-bottom: 30px;
        padding-bottom: 35px;
        
    }
    footer{
        position: relative;
        padding: 30px 0 69px;
    }
    footer .wrapper .inf{
        order: 3;
        text-align: center;
        padding: 0 20px;
        box-sizing: border-box;
        width: 100%;
    }
    footer .wrapper .inf p{
        margin: auto;
    }
    footer .wrapper .nav .menu li:not(:last-of-type) {
        margin-right: 0;
    }
    footer .wrapper .nav .menu{
        justify-content: space-between;
    }
    footer .wrapper .nav .policy {
        position: absolute;
        bottom: 35px;
        left: 50%;
        transform: translate(-50%, 0);
        width: max-content;
        margin-bottom: 0;
    }
    ul.breadcrumbs{
        display: none;
    }
    .training h1, .materials-p h1{
        font-size: 20px;
        line-height: normal;
        margin-bottom: 20px;
        margin-top: 60px;
    }
    .training h1 strong, .materials-p h1 strong{
        margin-bottom: 20px;
    }
    .training .inf{
        flex-wrap: wrap;
    }
    .training .inf p{
        font-size: 14px;
        line-height: 25px;
    }
    .training .inf img {
        max-width: initial;
        width: calc(100% + 50px);
        position: relative;
        left: -25px;
        order: 1;
        margin-top: 30px;
    }
    .training .advantages{
        flex-wrap: wrap;
        margin-top: 30px;
        border: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .training .advantages p {
        font-size: 20px;
        line-height: 26px;
    }
    .training .advantages p{
        margin-top: 80px;
    }
    .training p, .materials-p p, .company .content p{
        font-size: 14px;
        line-height: 25px;
    }
    .training h2{
        font-size: 20px;
        margin: 45px auto 5px;
    }
    .training .course .block{
        width: 100%;
    }
    .materials-p h2, .company .type h2{
        font-size: 20px;
        width: calc(100% + 50px);
        position: relative;
        left: -25px;
        margin-bottom: 25px;
    }
    .materials-p h2 strong{
        font-size: 20px;
    }
    .slider .swiper-button-next{
        right: -10px;
    }
    .slider .swiper-button-prev{
        left: -10px;
    }
    .first .swiper-container, .swiper-container-second{
        width: calc(100% + 50px);
        position: relative;
        left: -25px;
        height: 375px;
    }
    .materials-p .slider{
        margin-bottom: 30px;
    }
    .materials-p .advanteges {
        margin: 40px 0 25px;
        flex-wrap: wrap;
    }
    .materials-p .advanteges p {
        width: 50%;
        font-size: 15px;
        line-height: normal;
    }
    .form .inf img {
        margin: 0px 0 10px;
    }
    .form form button{
        font-size: 20px;
        padding: 15px 0;
    }
    .company .main h1 {
        font-size: 90px;
        line-height: normal;
        margin: 30px 0 20px;
        text-shadow: 8px 11px 5px rgba(83, 0, 91, 0.30196078431372547)
    }
    .t_4 .bg {
        position: absolute;
        top: -391px;
        left: -7%;
        transform: translate(-50%, 0);
        z-index: 0;
    }
    .company .main p{
        font-size: 20px;
        line-height: 25px;
    }
    .company .main .bg {
        position: absolute;
        top: initial;
        bottom: 0;
        left: 50%;
        transform: translate(-50%, 0);
    }
    .company .main{
        overflow: visible;
    }
    .company .img {
        position: absolute;
        bottom: -128px;
        left: 50%;
        transform: translate(-50%, 0);
    }
    .company .content h2 {
        font-family: 'Proxima-Bold';
        font-size: 20px;
        text-align: center;
        margin: 75px 0 20px;
    }
    .company .content .slider{
        margin: 30px 0 35px;
    }
    .company .supervisor {
        max-width: 375px;
        margin: 0 auto 0;;
        box-sizing: border-box;
        padding-left: 25px;
        position: relative;
    }
    .company .supervisor span{
        font-size: 30px;
        width: 160px;
        margin: 0 0 0;
    }
    .company .supervisor .seo img {
        height: 340px;
        position: absolute;
        left: 140px;
        top: -26px;
    }
    .company .supervisor .seo {
        position: initial;
        margin-bottom: 10px;
    }
    .company .supervisor .seo p{
        position: relative;
        top: 0;
        left: 0;
    }
    .company .supervisor h2 {
        margin: 0 0 0;
    }
    .company .supervisor .seo p span{
        font-size: 20px;
        line-height: 30px;
        width: 140px;
        margin-top: 70px;
    }
    .company .supervisor .seo p:before {
        content: '“';
        font-family: 'Proxima';
        font-size: 100px;
        color: #cc55da;
        position: absolute;
        top: -15px;
        left: -5px;
    }
    .company .supervisor .seo p{
        font-size: 18px;
    }
    .company .supervisor ul li {
        list-style: none;
        font-size: 14px;
        line-height: 25px;
    }
    .company .supervisor ul:nth-of-type(2):after{
        left: 0;
        top: -40px;
    }
    .company .supervisor .blocks{
        flex-wrap: wrap;
        margin-top: 50px;
    }
    .company .supervisor .blocks .left, .company .supervisor .blocks .right{
        flex: initial;
        width: 100%;
    }
    .company .supervisor .blocks .left{
        order: 1;
        margin-top: 60px;
        margin-bottom: 30px;
    }
    .company .supervisor .blocks .right p, .company .supervisor .blocks .left p, .company .type p{
        font-size: 14px;
        line-height: 25px;
    }
    .company .supervisor .blocks .right:after{
        left: 0;
        top: -40px;
    }
    .company .supervisor .blocks .left:after{
        left: 0;
        top: -40px;
    }
    .company .supervisor .blocks .left p{
        width: 100%;
    }
    .company .supervisor .blocks .left .title{
        font-size: 18px;
    }
    .company .type .slider{
        margin-bottom: 30px;
    }
    .company .proud span {
        display: block;
        font-size: 20px;
        font-family: 'Proxima-Bold';
        margin: 35px auto 18px;
        text-align: center;
    }
    .swiper-container-third{
        margin-right: auto;
        width: 84%;
        height: 205px;
    }
    .company .proud {
        margin-bottom: 40px;
    }
    .contact {
        display: flex;
        align-items: center;
        margin-bottom: 145px;
        position: relative;
        flex-wrap: wrap;
    }
    .contact .left h1{
        margin-top: 60px;
    }
    .contact .left h1, .contact .left p {
        font-size: 20px;
        line-height: 30px;
        text-align: center;
    }
    .contact .right{
        width: 100%;
        position: absolute;
        bottom: -260px;
        text-align: center;
        background-color: #fff;
    }
    .contact .right a:not(.email){
        padding-left: 25px;
    }
    .form.cont {
        padding-top: 160px;
    }
    h1{
        font-size: 20px;
        line-height: 30px;
    }
    .policy{
        margin-top: 60px;
        margin-bottom: 40px;
    }
    .policy p, .policy ul li{
        font-size: 14px;
        line-height: 25px;
    }
    .t_4{
        padding: 0;
    }
    .t_4 .ctg .thanks p{
        font-size: 20px;
        line-height: normal;
    }
    .t_4 .ctg .thanks p strong{
        font-size: 30px;
    }
    .t_4 .ctg .thanks p:after {
        content: '';
        position: absolute;
        background: url(../images/icon/lines.png) center center / cover no-repeat;
        width: 212px;
        height: 212px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .t_4 .ctg {
        margin-bottom: 60px;
        margin-top: 115px;
    }
    .t_4 .ctg .thanks {
        margin: 140px 0 150px;
    }
    .t_4 .ctg h1{
        font-size: 150px;
        line-height: 60px;
        letter-spacing: .06em;
    }
    .t_4 .ctg span {
        display: block;
        font-family: 'Proxima-Bold';
        font-size: 30px;
        margin: 35px 0 0;
        line-height: 25px;
    }
    .t_4 .ctg p {
        margin: 0 auto;
        font-size: 20px;
        font-family: 'Proxima-Light';
        max-width: 600px;
        line-height: 25px;
    }
    .training .course .block .modal .content{
        width: calc(100% - 50px);
        padding: 35px 25px 35px;
        top: 100px;
    }
    .training .course .block .modal .content h2, .training .course .block .modal .content h3{
        font-size: 20px;
        line-height: 25px;
    }
    .training .course .block .modal .content p{
        font-size: 16px;
        line-height: 25px;
    }
    .training .course .block .modal .content .close{
        width: 17px;
        height: 15px;
        padding: 15px;
        right: 0;
        top: 0;
    }
    .training .course .block .modal .content .close img{
        max-width: 100%;
    }
}