@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap');

:root {
    --color_blue: #018292;
    --color_grey: #3D3D3D;
    --color_green: #91ED81;
    --color_ltgrey: #F6F6F6;
    --color_dk2grey: #303030;
    --color_dkblue: #005C79;
    --color_dkgrey: #4D4D4D;
    --color_ltblue: #D7F5F5;
}

html {
    scroll-behavior: smooth;
}

html,
body {
    height: 100%;
    min-height: 100vh;
}

body {
    font-family: 'Inter Tight', sans-serif !important;
    background-color: var(--color_ltgrey) !important;
    color: var(--color_dk2grey);
    margin: 0px;
    display: flex;
    flex-direction: column;
}

.section-tb-60{
    padding: 60px 0px;
}
.section-t-60{
    padding: 60px 0px 0px;
}
.section-b-60{
    padding: 0px 0px 60px;
}
.section-fish-sm{
    padding: 0px;
    min-height: 174px; 
    display: flex;
    justify-content: end;
}
.section-fish-sm-img-style{
    width: 390px;
    height: 234px;
    overflow: visible;
    transform: translateY(-30px) !important;  
}

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

    .section-tb-60 {
        padding: 50px 0px;
    }
    .section-t-60{
        padding: 50px 0px 0px;
    }
    .section-b-60{
        padding: 0px 0px 50px;
    }
}

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

    .section-tb-60 {
        padding: 40px 0px;
    }
    .section-t-60{
        padding: 40px 0px 0px;
    }
    .section-b-60{
        padding: 0px 0px 40px;
    }
}

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

    .section-tb-60 {
        padding: 30px 0px;
    }
    .section-t-60{
        padding: 30px 0px 0px;
    }
    .section-b-60{
        padding: 0px 0px 30px;
    }
}

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

    .section-tb-60 {
        padding: 30px 0px;
    }
    .section-t-60{
        padding: 30px 0px 0px;
    }
    .section-b-60{
        padding: 0px 0px 30px;
    }
}
.cs-text-b{
    font-weight: 600 !important;
}
.cs-text-2b{
    font-weight: 700 !important;
}
.cs-text-blue{
    color: var(--color_blue);
}
.cs-text-green{
    color: var(--color_green);
}
.cs-text-ltblue{
    color: var(--color_ltblue);
}
.cs-text-dk2grey{
    color: var(--color_dk2grey);
}
.cs-text-dkgrey{
    color: var(--color_dkgrey);
}
.cs-text-white{
    color: white;
}
.text-h2-style{    
    font-size: 50px;
    font-weight: 600;
    margin-bottom: 30px !important;
    line-height: 1;
}
.text-50sb{
    font-size: 50px !important;
    font-weight: 600 !important;
}
.text-h2-2-style{    
    font-size: 50px;
    font-weight: 600;
    line-height: 1;
}
.text-subt-style{
    font-size: 26px;
    font-weight: 300;
}
.text-50sb{
    font-size: 50px;
    font-weight: 600;
    line-height: 1;
}
.text-36b{
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
}
.text-36sb{
    font-size: 36px;
    font-weight: 600;
    line-height: 1;
}
.text-36l{
    font-size: 36px;
    font-weight: 300;
}
.text-30b{
    font-size: 30px;
    font-weight: 700;
}
.text-30sb{
    font-size: 30px !important;
    font-weight: 600 !important;
}
.text-30r{
    font-size: 30px;
    font-weight: 400;
}
.text-28b{
    font-size: 28px;
    font-weight: 700;
    text-decoration: none !important;
}
.text-26b{
    font-size: 26px;
    font-weight: 700;
    text-decoration: none !important;
}
.text-26sb{
    font-size: 26px;
    font-weight: 600;
}
.text-26l{
    font-size: 26px;
    font-weight: 300;
}
.text-24b{
    font-size: 24px;
    font-weight: 700;
}
.text-22m{
    font-size: 22px;
    font-weight: 500;
}
.text-22l{
    font-size: 22px;
    font-weight: 300;
}
.text-20m{
    font-size: 20px;
    font-weight: 500;
}
.text-20b{
    font-size: 20px;
    font-weight: 700;
}
.text-20sb{
    font-size: 20px;
    font-weight: 600;
}
.text-20r{
    font-size: 20px;
    font-weight: 400;
}
.text-20l{
    font-size: 20px;
    font-weight: 300;
}
.text-18l{
    font-size: 18px;
    font-weight: 300;
}
.text-16b{
    font-size: 16px;
    font-weight: 700;
}
.text-16l{
    font-size: 16px;
    font-weight: 300;
}
.text-12l{
    font-size: 12px;
    font-weight: 300;
}
.cs-text-dop-pad{
    padding-top: 20px;
    padding-bottom: 40px;
}
.cs-text-advantage{
    font-size: 20px;
    font-weight: 300;
    margin-top: 15px;
    margin-bottom: 15px !important;
    margin-left: 30px;
}
.cs-text-stage{
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: start;
    padding-left: 20px;
    padding-bottom: 30px;
}
.cs-text-with{
    margin-bottom: 30px !important;
}

.pad-0{
    padding: 0px !important;
}
.mar-0{
    margin: 0px !important;
}
.mar-b-30{
    margin-bottom: 30px;
}
.pad-t-3{
    padding-top: 3px;    
}
.pad-t-5{
    padding-top: 5px;    
}
.pad-t-10{
    padding-top: 10px;    
}
.pad-l-20{
    padding-left: 20px;    
}
.pad-t-20{
    padding-top: 20px;    
}
.pad-t-30{
    padding-top: 30px;    
}
.pad-t-40{
    padding-top: 40px;    
}
.pad-t-60{
    padding-top: 60px;    
}
.pad-t-70{
    padding-top: 70px;    
}
.pad-b-10{
    padding-bottom: 10px;    
}
.pad-b-20{
    padding-bottom: 20px;    
}
.pad-b-30{
    padding-bottom: 30px;    
}
.pad-b-40{
    padding-bottom: 40px;    
}
.pad-b-60{
    padding-bottom: 60px;    
}


.header-phone{
    color: var(--color_blue);
    text-decoration: none;
    font-weight: 700;
}
.header-phone:hover{
    color: var(--color_green);
    text-decoration: none !important;
    font-weight: 700;
}

.cs-price-p1{
    padding-bottom: 25px;
}
.cs-price-p2{
    padding-bottom: 30px;
}
.cs-main-cotext-num-c{
    display: flex;
    justify-content: center;
    align-items: end;
}
.cs-white-bg-price-r{
    padding-left: 15px !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
.cs-white-bg-price-l{
    padding-right: 15px !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
.cs-white-bg-price-c{
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.cs-white-bg-price-area{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
    min-height: 100%;
}
.cs-white-bg-price-w{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);    
    padding: 30px;   
    min-height: 100%; 
    width: 100%;
    display: flex;
    flex-direction: column;    
    justify-content: space-between;    
}
.cs-white-bg-price-g{
    background-color: var(--color_green);
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);    
    padding: 40px; 
    min-height: 100%;
    display: flex;
    flex-direction: column;    
    justify-content: space-between;
}
.cs-white-bg-review{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);    
    padding: 40px;        
}
.cs-white-bg-review-context{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 15px rgba(0, 29, 33, .15);    
    padding: 60px; 
    width: 100%;       
}
.cs-white-bg-case{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);    
    padding: 30px;
    min-height: 100%;
}
.cs-white-bg-case-line{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);    
    padding: 30px;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

}
.cs-white-bg-style{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);
    margin: 40px 0px 0px;
    padding: 40px 30px;
    height: calc(100% - 40px);
}
.cs-white-bg-style-solo{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);
    padding: 40px 30px;
    min-height: 100%;
}
.cs-white-bg-style-bul{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);
    padding: 30px;
    height: 100%;
}
.cs-white-bg-style-about{
    background-color: white;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);
    padding: 30px;    
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: start;
}
.cs-dop-area-flex{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
      
}
.wpcf7-spinner{
    width: 0px;
}
.cs-dop-top{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.cs-about-text-area{
    padding-left: 50px;
}

.stage-area{
    padding-top: 50px;
    padding-bottom: 50px;
}

.cs-advantage-bul{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: start;
}
.cs-advantage-point{
    content: "";
    min-width: 14px;
    min-height: 14px;
    border-radius: 14px;
    background-color: var(--color_blue);
    margin-top: 20px;    
}
.cs-stage-point{
    content: "";
    min-width: 14px;
    min-height: 14px;
    border-radius: 14px;
    background-color: var(--color_green);
    margin-top: 5px;    
}
.cs-stage-before1::after, .cs-stage-before6::after, .cs-stage-before9::after{
    content: "";
    position: absolute;
    background-color: var(--color_green);
    border-radius: 14px;
    width: 2px;
    height: 70px;
    top: 28px;
    left: 61px;
}
.cs-stage-before2::after, .cs-stage-before7::after, .cs-stage-before10::after{
    content: "";
    position: absolute;
    background-color: var(--color_green);
    border-radius: 14px;
    width: 2px;
    height: 70px;
    top: 130px;
    left: 61px;
}
.cs-stage-before3::after{
    content: "";
    position: absolute;
    background-color: var(--color_green);
    border-radius: 14px;
    width: 2px;
    height: 70px;
    top: 238px;
    left: 61px;
}
.cs-stage-before11::after{
    content: "";
    position: absolute;
    background-color: var(--color_green);
    border-radius: 14px;
    width: 2px;
    height: 80px;
    top: 240px;
    left: 61px;
}
.cs-stage-before4::after{
    content: "";
    position: absolute;
    background-color: var(--color_green);
    border-radius: 14px;
    width: 2px;
    height: 90px;
    top: 338px;
    left: 61px;
}


.cs-advantage-photo-area{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;    
}
.cs-advantage-img-style{
    width: 100%;
    height: auto;
}
.cs-with-area{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;  
}
.cs-with-img-style{
    width: 100%;
    height: auto;    
}
.cs-with-btn{
    width: 800px;
    margin: 0px auto;
}
.cs-main-btn{
    width: 340px;
    margin: 0px auto;
}
.cs-rewiev-btn{
    width: 480px;
    margin: 0px auto;
}
.cs-context-case-btn{
    width: 360px;
    margin: 0px auto;
}
.cs-bul-area-col{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
}
.cs-bul-area-row{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: start;
    width: 100%;
    padding-bottom: 20px;
}


    


.cs-blue-btn{
    border-radius: 8px;
    background-color: var(--color_blue);
    width: 100%;
    height: 50px;
    color: white;
    font-size: 18px;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
}
.cs-blue-btn:hover{
    color: var(--color_dkblue);
    background-color: var(--color_green);    
}
.cs-blue-btn-mar-40t{
    margin-top: 40px;    
}


.cs-green-btn{
    border-radius: 8px;
    background-color: var(--color_green);
    width: 100%;
    height: 80px;
    color: var(--color_dkblue);
    font-size: 30px;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    text-decoration: none !important;
}
.cs-green-btn:hover{
    color: white;
    background-color: var(--color_blue);    
}


.cs-main-blue-btn{
    border-radius: 8px 8px 30px 8px;
    background-color: var(--color_blue);
    width: 100%;
    height: 60px;
    padding: 10px;    
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
}
.cs-main-sm-btn{
    border-radius: 8px 8px 20px 8px;
    background-color: var(--color_green);
    min-width: 40px;
    min-height: 40px; 
    display: flex;
    justify-content: center;
    align-items: center;  
    transition: all 0.5s ease-in-out; 
}
.cs-main-sm-btn-text{
    color: white;
    font-size: 18px;
    font-weight: 600;
    width: 100%;
    transition: all 0.5s ease-in-out;
}
.cs-main-sm-btn-img-style{
    width: 22px;
    height: 18px;
}
.cs-main-blue-btn:hover{
    background-color: var(--color_green);    
}
.cs-main-blue-btn:hover .cs-main-sm-btn{
    background-color:white;      
}
.cs-main-blue-btn:hover .cs-main-sm-btn-text{
    color: var(--color_blue);
    
}


.main-bg-1, .main-bg-2, .main-bg-3, .main-bg-4, .main-bg-5, .main-bg-6{
    width: 100%;
}
.main-bg-1{
    background-image: url("../images/fish-01-3.png");
    background-repeat: no-repeat;
    background-position: bottom 70% left -20px; 
    background-size: 422px auto;
    min-height: 1060px;  
}
.main-bg-2{
    background-image: url("../images/bg-3.png");
    background-repeat: no-repeat;
    background-position: bottom 0 left 0; 
    background-size: 100% auto;
    min-height: 960px;  
}
.main-bg-3{
    background-image: url("../images/fish-front-2.png");
    background-repeat: no-repeat;
    background-position: bottom 320px right 30px; 
    background-size: 191px;
    min-height: 860px;  
}

.main-bg-4{
    background-image: url("../images/bg-2.png");
    background-repeat: no-repeat;
    background-position: bottom 0 left 0; 
    background-size: 100% auto;
    min-height: 1060px;  
}
.main-bg-5{
    background-image: url("../images/fish-front-1.png");
    background-repeat: no-repeat;
    background-position: bottom 28 right 30; 
    background-size: 153px auto;
    min-height: 860px;  
}

.main-bg-6{
    background-image: url("../images/bg-1.png");
    background-repeat: no-repeat;
    background-position: bottom 0 left 0; 
    background-size: 100% auto;
    min-height: 1060px;  
}

.with-bg{
    background-image: url("../images/fish-03.png");
    background-repeat: no-repeat;
    background-position: bottom 60px left 100px;   
}
.q-bg{
    background-image: url("../images/fish-04.png");
    background-repeat: no-repeat;
    background-position: bottom 0px right 60px; 
    padding-bottom: 100px;  
}
.bul-bg{
    background-image: url("../images/fish-02.png");
    background-repeat: no-repeat;
    background-position: bottom 0px left 80px;   
}
.form-bg{
    background-image: url("../images/fish-sm-r.png");
    background-repeat: no-repeat;
    background-position: bottom 0px left 80px;   
}
.context-bg1{
    background-image: url("../images/fish-sm-l.png");
    background-repeat: no-repeat;
    background-position: bottom 0px left 80px;   
}
.context-bg2{
    background-image: url("../images/fish-05.png");
    background-repeat: no-repeat;
    background-position: bottom 0px left 00px;   
}


.rewiev-img-style{
    width: 100%;
    height: auto;
    padding: 10px;
}
.grid-item { 
    width: 540px; 
}

.card {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;    
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 0px !important;
    border-bottom: 1px solid rgba(48, 48, 48, 0.5);
    border-radius: 0.px !important;
}
.card-header, .card-body{
    background-color: var(--color_ltgrey) !important;
}

.card-header {
    padding: 0.75rem  0rem !important;    
}
.btn-q{
    padding-left: 0px !important

}
.cs-q-card{
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}
.cs-q-card p{
    max-width: 100%;
    word-wrap: break-word;
    display: flex;
}
.cs-q-card:hover{
    text-decoration: none !important;
    color: var(--color_dk2grey);
}
.cs-q-img-style{
    width: 50px;
    height: 50px;
}
.cs-q-bg-arrow{
    background-color: var(--color_green);
    border-radius: 8px;
    width: 50px;
    height: 50px;
    transition: all 0.5s ease-in-out;
    margin-left: 30px;
}
.collapsed .cs-q-bg-arrow{
    background-color: #DFECF3;
    border-radius: 8px;
    width: 50px;
    height: 50px;
    transition: all 0.5s ease-in-out;
}
.collapsed:hover .cs-q-bg-arrow{
    background-color: var(--color_green);
    border-radius: 8px;
    width: 50px;
    height: 50px;
}
.cs-bul-img-style{
    width: 60px;
    height: 60px;
    margin-right: 15px;
}
.cs-context-task-img-style{
    width: 80px;
    height: 80px;
    margin-right: 30px;
}
.cs-loz-pad{
    padding-top: 100px;
    padding-bottom: 20px;
}
.cs-main-subt-pad{
    padding-bottom: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.cs-main-round-area{
    display: flex;
    justify-content: end;
    align-items: center;
}
.cs-main-round-bg{
    border-radius: 500px;
    background-color: var(--color_green);   
    width: 229px; 
    height: 229px; 
    display: flex;
    align-items: center;
    justify-content: center;
}
.cs-main-round-img-style{
    width: 210px; 
    height: 210px; 
}
.img-logo-slyle{
    width: 60px;
    height: 60px;
}

@-webkit-keyframes rotating /* Safari and Chrome */ {
    from {
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  @keyframes rotating {
    from {
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -ms-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  .rotating {
    -webkit-animation: rotating 25s linear infinite;
    -moz-animation: rotating 25s linear infinite;
    -ms-animation: rotating 25s linear infinite;
    -o-animation: rotating 25s linear infinite;
    animation: rotating 25s linear infinite;
  }













  /*
   СТИЛИ МЕНЮ
*/
.block-menu {    
}
.navbar-brand{
    display: flex ;
    justify-content: start;
    align-items: end;
}
.logo-text{
    padding-left: 10px;
    color: var(--color_blue);
    font-size: 16px;
    font-weight: 800;
    max-width: 100px;
}
.logo-text:hover{
    color: var(--color_blue);    
}

.sect-1{
    margin-top: 0px;
}

.block-menu-context{
    z-index: 999;
    position: absolute;
    top: 0px;
    left: 0;
    width: 100vw;
    height: 60px;   
    background-color: none; 
}













.cs-modal{
    overflow-y:scroll;
}









.header-menu {
    display: none;
    z-index: 999;
    position: fixed;
    top: 0px;
    left: 0;
    width: 100vw;
    height: 60px;   
    background-color: var(--color_ltgrey);    
    overflow-y:scroll;
}

.header-menu .container {
    height: 60px;
}

.header-menu-btn-area{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 40px;
}

@media screen and (max-width: 1200px) {
.logo-text{
    display: none;
}
}

@media screen and (max-width: 1200px) {
    .sect-1{
        margin-top: 60px;
    }

    .first-screen,
    .section-schedule,
    .section-contact,
    .section-course-base,
    .section-course-life,
    .section-course-money,
    .section-course-karma,
    .section-course-relationship {
        padding-top: 60px !important;
    }

    .header-menu {
        display: block;

    }

    .header-menu div ul li {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .header-menu div ul li a {
        font-size: 24px;
        font-weight: 400;
    }

    .header-menu div ul li a:hover {
        font-weight: 800;
    }

    .nav-login {
        border-radius: 10px 10px 10px 10px !important;
    }

    .nav-login:hover {
        transform: translateY(0px) !important;
    }

    .navbar div .navbar-brand {
        display: none;
    }

    .navbar-brand2 {
        position: relative;
        z-index: 1000;
    }

    .header-menu .container {
        height: 60px;
        width: 100vw;
    }

    .header-menu-top {
        height: 60px;
        z-index: 999;
        background-color: var(--color_ltgrey);
    }

    .header-menu-body {
        height: calc(100vh - 60px);       
        justify-content: start;
        align-items: start;        
        transition: all 2s ease;
        background-color: var(--color_ltgrey);
        display: none;    
        opacity: 0;    
    }
    .header-menu-body.bopen {
        display: flex;    
        opacity: 1; 
        animation: b-open 1s;
    }
    .header-menu-body.bclose {
        display: none;    
        opacity: 0; 
        animation: b-close 1s;
    }
    @keyframes b-open {
        from {
            opacity: 0;
            display: none;  
        }
    
        to {
            opacity: 1;
            display: flex;    
        }
    }
    
    @keyframes b-close {  
        from {
            opacity: 1;
            display: flex;  
        }
        to {
            opacity: 0;
            display: none; 
        }
    }


    .burger-btn {
        position: relative;
        width: 40px;
        height: 40px;
        background-color: transparent;
        border: none;
        outline: none;
        z-index: 1000;
        cursor: pointer;
    }

    .burger-btn-style {
        display: flex;
        justify-content: end;
        align-items: center;
    }

    .burger-btn span {
        display: block;
        position: absolute;
        width: 30px;
        height: 3px;
        left: 5px;
        background-color: var(--color_blue);
        transition: background-color .3s, opacity .3s, transform .5s;
        will-change: transform;
    }

    .burger-btn span:nth-child(1) {
        transform: translateY(-10px);
    }

    .burger-btn span:nth-child(2) {}

    .burger-btn span:nth-child(3) {
        transform: translateY(10px);
    }

    .header-menu.open {
        height: 100vh;        
        animation: m-open 1s;
    }
    .header-menu.mclose {
        height: 60px;        
        animation: m-close 1s;
    }
    @keyframes m-open {
        from {
            min-height: 0px;
            height: 0px;
        }
    
        to {
            min-height: 100vh;
            height: 600px;
        }
    }
    
    @keyframes m-close {  
        from {
            min-height: 100vh;
            height: 600px;
        }
        to {
            min-height: 60px;
            height: 60px;
        }
    }
    

    .header-menu.open .header-menu-body {
        transform: translateY(0px);
    }

    .header-menu.open .burger-btn span {
        background-color: var(--color_blue);
    }

    .header-menu.open .burger-btn span:nth-child(1) {
        transform: translateY(0) rotate(45deg);
    }

    .header-menu.open .burger-btn span:nth-child(2) {
        opacity: 0;
    }

    .header-menu.open .burger-btn span:nth-child(3) {
        transform: translateY(0) rotate(-45deg);
    }

}
.header-menu-btn-m{
    padding-bottom: 50px;
}



.img-logo-slyle {
    width: 41px;
    height: 47px;
}

.navbar {
    padding: 0px;
}

.nav-login {
    height: 60px;
    background: linear-gradient(132deg, #022859 0%, #09346B 38%, #022859 100%);
    border-radius: 0px 0px 10px 10px;
    text-transform: uppercase;
    transition-duration: 0.5s;
}

.nav-login:hover {
    transform: translateY(-10px);
}

.nav-login li {
    padding: 0px 30px;
    display: flex;
    justify-content: center;
    /*Центрирование по горизонтали*/
    align-items: center;
}

.nav-login li a {
    height: 60px;
    line-height: 60px;
    color: var(--color_beige);
    text-decoration: none;
    font-weight: 300;
    font-size: 14px;
}

.nav-header-menu li {
    padding: 0px 10px;
}

.nav-header-menu li a {
    height: 60px;
    line-height: 60px;
    color: var(--color_blue);
    text-decoration: none;
    font-weight: 400;
    font-size: 13px;
    transition-duration: 0.5s;
}

.nav-header-menu li a:hover {
    color: var(--color_green);
}

.nav-main li a{
    font-size: 10px;
}

.nav-main li:nth-child(1) a{
    font-weight: 700;    
}
.nav-main li:nth-child(1) a:hover{
    color: var(--color_blue);
    cursor: auto;    
}
.nav-context li:nth-child(2) a{
    font-weight: 700;    
}
.nav-context li:nth-child(2) a:hover{
    color: var(--color_blue);
    cursor: auto;    
}
.nav-cases li:nth-child(4) a{
    font-weight: 700;    
}
.nav-cases li:nth-child(4) a:hover{
    color: var(--color_blue);
    cursor: auto;    
}
.nav-about li:nth-child(5) a{
    font-weight: 700;    
}
.nav-about li:nth-child(5) a:hover{
    color: var(--color_blue);
    cursor: auto;    
}
.nav-nav-review li:nth-child(6) a{
    font-weight: 700;    
}
.nav-nav-review li:nth-child(6) a:hover{
    color: var(--color_blue);
    cursor: auto;    
}


.header-menu-btn{
    width: 180px;
    height: 50px;
    border-radius: 8px;
    background-color: var(--color_blue);
    color: white;
    font-size: 18px;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
}
.header-menu-btn:hover{
    background-color: var(--color_green);
    color: var(--color_blue);    
}
@media screen and (max-width: 1200px) {
    .header-phone{
        padding-bottom: 20px;
    }
}

.bg-cont{
    background-image: url("../images/bg-f-4.png");
    background-repeat: no-repeat;
    background-position: top 0% left 0px; 
    background-size: 100% auto;
    min-height: 260px; 
}
.bg-cont1{
    background-image: url("../images/bg-f-1.png");
    background-repeat: no-repeat;
    background-position: top -240px left 0px; 
    background-size: 100% auto;
    min-height: 400px; 
    background-color: white;
}
.bg-cont2{
    background-color: white;
}
.bg-cont3{
    background-image: url("../images/fish-06.png");
    background-repeat: no-repeat;
    background-position: top 0% right 0px; 
    background-size: 153px auto;
}
.bg-cont4{
    background-image: url("../images/fish-07.png");
    background-repeat: no-repeat;
    background-position: top 30% left 0px; 
    background-size: 153px auto;
}
.cs-main-context-bul-area{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-top: 80px;
}
.cs-main-context-bul{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
    max-width: 200px;
}


.cs-stage-left-area{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: end;
}
.cs-stage-right-area{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    padding-left: 40px;;
}
.cs-stage-num-text{
    color: var(--color_green);
    font-size: 130px;
    font-weight: 600;
    line-height: 0.8;
}

.footer{
    background-color: #184173;
    background-image: url("../images/bg-f-2.png");
    background-repeat: no-repeat;
    background-position: bottom 0% left 0px;     
}
.footer-wave{
    background-image: url("../images/bg-f-1.png");
    background-repeat: no-repeat;
    background-position: top 0% left 0px; 
    background-size: 100% auto;
    min-height: 690px;  
}
.footer-down{
    background-image: url("../images/bg-f-3.png");
    background-repeat: no-repeat;
    background-position: bottom 0% right 0px;    
}

.footer-area{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.footer-col-z, .footer-col-u, .footer-col-n,.footer-col-c, .footer-col-s{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
}
.footer-m-c-area{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
}
.footer-m-r-area{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: start;
}

.footer-title{
    color: #4C83AE;
    font-size: 18px;
    font-weight: 600;
}
.nav-footer-menu{
    padding-left: 0px !important;
}
.footer-contact, .nav-footer-menu li a {
    color: var(--color_ltblue);;
    font-size: 14px;
    font-weight: 300;
    
    text-decoration: none;
    transition: all 0.2s ease;
}
.nav-footer-menu li{
    list-style-type:  none;
}

.footer-contact:hover, .nav-footer-menu li a:hover {
    text-decoration: none;    
    color: var(--color_green);
}



.nav-footer-menu-doc{
    padding-left: 0px !important;
}
.nav-footer-menu-doc li a {
    color: var(--color_ltblue);;
    font-size: 12px;
    font-weight: 300;
    
    text-decoration: none;
    transition: all 0.2s ease;
}
.nav-footer-menu-doc li{
    list-style-type:  none;
    display: flex;
    justify-content: center;
}

.nav-footer-menu-doc li a:hover {
    text-decoration: none;    
    color: var(--color_green);
}




.footer-menu-area {
    padding: 10px 0px 0px;
}
.footer-col-s{
    width: 180px;
}
.footer-sm-area{
    padding-top: 20px;
    width: 180px;
    display: flex;
    flex-direction: row;
    justify-content: end;
}
.contact-sm-area{
    padding-top: 20px;
    width: 180px;
    display: flex;
    flex-direction: row;
    justify-content: start;
}
@media screen and (max-width: 992px) { 
    .contact-sm-area{
        justify-content: center;
    }
}
@media screen and (max-width: 576px) {
    .footer-col-s, .footer-sm-area{
        width: 200px;
    }
}

.footer-sm-logo-area{
    width: 40px;
    height: 40px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: white;
    transition: all 0.5s ease-in-out;
    margin-left: 5px;
}
.footer-sm-logo-area:hover{    
    background-color: var(--color_green);    
}

@media screen and (max-width: 576px) {  
    .footer-sm-area{
        justify-content: center;
    }
    .footer-sm-logo-area{
        margin-left: 5px;
        margin-right: 5px;
    }
}
.wa-logo-slyle, .tg-logo-slyle{
    width: 25px;
    height: 25px;
}
.vk-logo-slyle{
    width: 40px;
    height: 40px;
}

.footer-menu-btn{
    width: 180px;
    height: 50px;
    border-radius: 8px;
    background-color: white;
    color: #184173; 
    font-size: 18px;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
}
.footer-menu-btn:hover{
    background-color: var(--color_green);       
}

.footer-doc-area{
    padding-top: 60px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
}
.menu-usl li a{
    color: #A3B3C7;
}
.menu-usl li:nth-child(1) a{
    color: white !important;
}
.menu-usl li:nth-child(1) a:hover{
    color: var(--color_green) !important;
}


.form-left-area{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
}
.form-left-tel{
    font-size: 36px;
    font-weight: 700;
    color: var(--color_blue);
    transition: all 0.5s ease-in-out;
    text-decoration: none;
    cursor: pointer;
    padding-bottom: 30px;
}
.form-left-tel:hover{
    text-decoration: none;
    color: var(--color_green);
}
.form-left-email{
    font-size: 26px;
    font-weight: 600;
    color: var(--color_blue);
    transition: all 0.5s ease-in-out;
    text-decoration: none;
    cursor: pointer;
    padding-bottom: 10px;
}
.form-left-email:hover{
    text-decoration: none;
    color: var(--color_green);
}

.form-sm-logo-area{
    width: 50px;
    height: 50px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    background-color: var(--color_blue);
    transition: all 0.5s ease-in-out;
}
.form-sm-logo-area:hover{    
    background-color: var(--color_green);    
}
@media screen and (max-width: 992px) { 
    .form-sm-logo-area{
        margin-left: 5px;
        margin-right: 5px;
    }
}

.form-pad{
    padding-left: 50px;
}
.cs2-form-input, .cs-form-line p{
    margin-bottom: 10px !important;
}
.cs-form-line p span{
    display: flex;
    flex-direction: column;
    width: 100%;
}

.cs2-form-input, .cs-form-line p span input{
    display: flex;
    width: 100%;
    height: 70px;
    border: 0px;
    border-radius: 8px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .1);
    padding: 0px 30px;
    color: var(--color_dk2grey);
    font-size: 24px;
    font-weight: 300;
}

.cs-form-textarea p{
    margin-bottom: 10px !important;
}
.cs-form-textarea p span{
    display: flex;
    flex-direction: column;
    width: 100%;
}
.cs-form-textarea p span textarea{
    display: flex;
    width: 100%;
    height: 200px;    
    border: 0px;
    border-radius: 8px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .1);
    padding: 30px;
    color: var(--color_dk2grey);
    font-size: 24px;
    font-weight: 300;
}


.form-cb-area{
    display: flex;
    flex-direction: row;
    justify-content: start;    
}
.form-cb-area div p{
    margin-bottom: 0px !important;
    text-align:left;
    padding-left: 7px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color_dkgrey);
    display: block !important;
}
.form-cb-area div p a{
    margin-bottom: 0px !important;    
    font-size: 12px;
    font-weight: 600;
    color: var(--color_dkgrey);
}
.form-cb-area-avito{
    display: flex;
    flex-direction: row;
    justify-content: start;    
}
.form-cb-area-avito div p{
    margin-bottom: 0px !important;
    text-align:left;    
    padding-left: 7px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color_dkgrey);
    display: block !important;
}
.form-cb-area-avito p input{
    padding-top: 3px;
}
.form-cb-area-avito div p a{
    margin-bottom: 0px !important;    
    font-size: 12px;
    font-weight: 600;
    color: var(--color_dkgrey);
}
.form-cb-area-bitrix{
    display: flex;
    flex-direction: row;
    justify-content: start;    
}
.form-cb-area-bitrix div p{
    margin-bottom: 0px !important;
    text-align:left;    
    padding-left: 7px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color_dkgrey);
    display: block !important;
}
.form-cb-area-bitrix p input{
    padding-top: 3px;
}
.form-cb-area-bitrix div p a{
    margin-bottom: 0px !important;    
    font-size: 12px;
    font-weight: 600;
    color: var(--color_dkgrey);
}

.form-cb-area-sales{
    display: flex;
    flex-direction: row;
    justify-content: start;    
}
.form-cb-area-sales div p{
    margin-bottom: 0px !important;
    text-align:left;    
    padding-left: 7px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color_dkgrey);
    display: block !important;
}
.form-cb-area-sales p input{
    padding-top: 3px;
}
.form-cb-area-sales div p a{
    margin-bottom: 0px !important;    
    font-size: 12px;
    font-weight: 600;
    color: var(--color_dkgrey);
}

.form-cb-area-seo{
    display: flex;
    flex-direction: row;
    justify-content: start;    
}
.form-cb-area-seo div p{
    margin-bottom: 0px !important;
    text-align:left;    
    padding-left: 7px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color_dkgrey);
    display: block !important;
}
.form-cb-area-seo p input{
    padding-top: 3px;
}
.form-cb-area-seo div p a{
    margin-bottom: 0px !important;    
    font-size: 12px;
    font-weight: 600;
    color: var(--color_dkgrey);
}

.form-cb-area-sites{
    display: flex;
    flex-direction: row;
    justify-content: start;    
}
.form-cb-area-sites div p{
    margin-bottom: 0px !important;
    text-align:left;    
    padding-left: 7px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color_dkgrey);
    display: block !important;
}
.form-cb-area-sites p input{
    padding-top: 3px;
}
.form-cb-area-sites div p a{
    margin-bottom: 0px !important;    
    font-size: 12px;
    font-weight: 600;
    color: var(--color_dkgrey);
}

.form-cb-area-vk{
    display: flex;
    flex-direction: row;
    justify-content: start;    
}
.form-cb-area-vk div p{
    margin-bottom: 0px !important;
    text-align:left;    
    padding-left: 7px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color_dkgrey);
    display: block !important;
}
.form-cb-area-vk p input{
    padding-top: 3px;
}
.form-cb-area-vk div p a{
    margin-bottom: 0px !important;    
    font-size: 12px;
    font-weight: 600;
    color: var(--color_dkgrey);
}
.cs-form-btn{
    border-radius: 8px;
    background-color: var(--color_green);
    width: 100%;
    height: 80px;
    color: var(--color_blue);
    font-size: 18px;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    text-transform: uppercase;
    border: 0px;
}
.cs-form-btn:hover{
    color: white;
    background-color: var(--color_blue);    
}
.cs-form-main-disabled
{
    pointer-events: none;
    opacity: 0.6;
}

.wpcf7 form .wpcf7-response-output {
    margin: 0em !important;
    padding: 0.5em 1em !important;
    border: 2px solid #00a0d2;
}

.cs-about-all-img-style{
    width: 100%;
    height: auto;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .25);
}
.cs-about-team-img{
    width: 230px;
    height: 230px;
    border-radius: 20px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .1);
    overflow: hidden;
}
.cs-about-team-img-style{
    width: 100%;
    height: auto;
}
.cs-case-ba-col{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;   
}
.cs-case-ba-row{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: start;
}
.cs-case-main-img-style{   
    width: 100%;
    height: auto;  
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .1);  
}
.cs-case-main-img-area{
    width: auto;
    height: 100%;
    overflow: hidden;    
}
.cs-case-title{
    text-decoration: none !important;
    padding-top: 30px;
}
.cs-case-content-area figure{
    padding-top: 20px;
    padding-bottom: 20px;
}

.case-slider-arrow-img-style{
    width: 30px;
    height: 30px;
}
.case-slider-arrow-bg{
    min-width: 70px;
    min-height: 70px;
    background-color: var(--color_green);
    border-radius: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    margin-left: 20px;
}
.case-slider-arrow-bg:hover{
    background-color: var(--color_blue);    
}
.case-slider-arrow-area{
    display: flex;
    flex-direction: row;
}
.case-slider-top-area{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.case-area-div{
    padding-top: 40px; 
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    transform: translateX(0px);
    transition: all 0.5s ease-in-out;
    height: 100%;
}
.team-area-div{
    padding-top: 40px; 
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    transform: translateX(0px);
    transition: all 0.5s ease-in-out;
    height: 100%;
}
.review-area-div{
    padding-top: 40px; 
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    transform: translateX(0px);
    transition: all 0.5s ease-in-out;
    height: 100%;
    min-width: 100%;
    margin-right: 30px;
}


.case-area{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: start;
    overflow: hidden;
    transition: all 0.5s ease-in-out;
    padding: 20px 0px 80px !important;
}
.review-area{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: start;
    overflow: hidden;
    transition: all 0.5s ease-in-out;
    padding: 20px 15px 80px !important;
}
.team-area{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: start;
    overflow: hidden;
    transition: all 0.5s ease-in-out;
    padding: 20px 0px 80px !important;
}

.case-title-area{
    padding-bottom: 20px;
}
.cs-case-btn{
    width: 280px;
    min-height: 50px;
    margin-top: 20px;
    background-color: var(--color_blue);
    border-radius: 8px;
    display: flex;    
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 18px;
    font-weight: 600;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
}
.cs-case-btn:hover{    
    background-color: var(--color_green);    
    color: var(--color_blue);    
    text-decoration: none;
}
.case-all-area{
    min-height: 390px;
    margin-bottom: 30px;
    border-radius: 30px;
    overflow: hidden;
}
.case-all-area-shadow{
    background: linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,.0));
    min-height: 390px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: end;
    padding: 20px;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
}
.case-all-area-shadow div{
    text-decoration: none !important;  
    transition: all 0.5s ease-in-out;
    cursor: pointer; 
}
.case-all-area-shadow:hover div{
    text-decoration: none !important;
    color: var(--color_green);
}
.case-all-area-shadow:hover .case-arrow-bg{
    background-color: var(--color_green);    
}
.case-all-area-text{
    text-decoration: none !important;
}
.case-arrow-bg{
    min-width: 70px;
    min-height: 70px;
    background-color: var(--color_blue);
    border-radius: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    margin-left: 20px;
}
.case-arrow-bg:hover{
    background-color: var(--color_green);    
}
.cs-context-task-area{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    padding-bottom: 50px;
    padding-right: 70px;
}
.case-time{
    padding-bottom: 20px;
}
.team-img-main-area{
    min-width: 255px;
    min-height: 340px;
    border-radius: 30px;
    overflow: hidden;
}

.cs-review-name-area{
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: end;
}
.cs-review-context-name-area{
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: end;
    width: 100%;
}
.pad-review-all-15{
    padding: 15px;   
    width: 570px !important; 
}
.cs-review-img-area{
    width: 160px;
    height: 160px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .25); 
    border-radius: 160px;
    overflow: hidden;
}
.cs-about-img-area{
    width: 110px;
    height: 110px;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .25); 
    border-radius: 110px;
    overflow: hidden;
}
.cs-review-img-style{
    background-size: cover; 
    background-repeat: no-repeat; 
    background-position: center;    
}
.cs-review-context-img-style{
    max-width: 380px;
    height: auto;
}
.cs-review-zoom-img-style{
    width: 90px;
    height: 90px;
}
.cs-about-zoom-img-style{
    width: 60px;
    height: 60px;
}
.cs-review-zoom-area{
    width: 160px;
    height: 160px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cs-review-zoom-area:hover{    
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    background-color: var(--color_green);
}
.cs-about-gallery-area{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
@media screen and (max-width: 992px) {
    .cs-about-gallery-area{
        max-width: 370px;
    }
}
@media screen and (max-width: 576px) {
    .cs-about-gallery-area{
        justify-content: center;
    }
}
.cs-about-zoom-area{
    width: 110px;
    height: 110px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(255,255,255,0.5);
}
.cs-about-zoom-area:hover{    
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    background-color: var(--color_green);
}
.cs-review-area-down{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: end;
    padding-top: 40px;
}
.cs-review-context-area{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 100%;    
}
.cs-review-context-text-area{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
    padding-right: 40px;
    min-height: 100%;
}
.cs-review-context-img-area{
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 0px 20px rgba(0, 29, 33, .25); 
}

.modal-dialog{
    max-width: 600px;
}
.modal-body{
    padding-top: 20px;
}
.form_answer_area{
    padding-bottom: 10px;
}
.form-pad-modal-1{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.form-pad-modal-1 div form p {
    display: flex;
    justify-content: center;
}
.form-pad-modal-1 div form p .wpcf7-spinner {
    display: none;    
}
.opac-0{
    opacity: 0;
}
.form-fields{
    display: flex;
    flex-direction: column;
}
.master-agreement {
    display: flex;
    flex-direction: row;
    justify-content: start;    
    width: 100%;
    font-size: 12px;
    color: var(--color-gray);
    margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
    .master-agreement {
        width: 100%;
        font-size: 9px;
    }
}
.master-agreement input {
    width: 16px;
    height: 16px;
}
.master-agreement label {
    margin-bottom: 0px !important;
    text-align:left;
    padding-left: 7px;
    font-size: 12px;
    font-weight: 300;
    color: var(--color_dkgrey);
    display: block !important;
}

.master-agreement label a {
    margin-bottom: 0px !important;    
    font-size: 12px;
    font-weight: 600;
    color: var(--color_dkgrey);
}
.master-agreement a:hover {
    color: var(--color-light-gray);
}
.kviz-btn-area{
    padding-top: 30px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.kviz-btn-end{    
    border: 0px;  
}
.kviz-btn-end p input{
    border-radius: 8px;
    background-color: var(--color_blue);
    width: 300px;
    height: 60px;
    padding: 10px;    
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    color: white; 
    text-decoration: none;  
    border: 0px;       
}
.kviz-btn-next{
    border-radius: 8px;
    background-color: var(--color_blue);
    width: 200px;
    height: 60px;
    padding: 10px;    
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    color: white; 
    text-decoration: none;      
}
.cs-kviz-sm-btn{
    border-radius: 8px;
    background-color: var(--color_green);
    min-width: 40px;
    min-height: 40px; 
    display: flex;
    justify-content: center;
    align-items: center;  
    transition: all 0.5s ease-in-out; 
}
.cs-kviz-sm-btn-text{
    color: white;
    font-size: 18px;
    font-weight: 600;
    width: 100%;
    text-decoration: none;  
    transition: all 0.5s ease-in-out;
} 
.cs-kviz-sm-btn-img-style{
    width: 22px;
    height: 18px;
}
.kviz-btn-next:hover{
    background-color: var(--color_green);
}
.kviz-btn-next:hover .cs-kviz-sm-btn-text{
    color: var(--color_blue);      
}
.kviz-btn-next:hover .cs-kviz-sm-btn{
    background-color: white;          
}
.kviz-btn-end p input:hover{
    background-color: var(--color_green);
}
.kviz-btn-end p input:hover .cs-kviz-sm-btn-text{
    color: var(--color_blue);      
}
.kviz-btn-end p input:hover .cs-kviz-sm-btn{
    background-color: white;          
}

.kviz-btn-before{
    width: 200px;
    height: 60px;
    font-size: 18px;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    text-align: center;    
    border-radius: 8px;
    color: white;
    background-color: #B3DADF;
}   
.kviz-btn-before p{
    margin-bottom: 0px !important;
}
.kviz-btn-next p{
    margin-bottom: 0px !important;
}
.kviz-btn-end p{
    width: 300px;
    margin-bottom: 0px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white; 
    border: 0px; 
}
.kviz-btn-end p span{
    width: 0px;
    margin: 0px !important;
}

.kviz-btn-before:hover {   
    background-color: var(--color_green); 
    color: var(--color_blue);   
}
.case-slider-top-area-link{
    text-decoration: none;
}
.case-slider-top-area-link:hover{
    text-decoration: none;
}
@media screen and (max-width: 576px) {
    .kviz-btn-next,
    .kviz-btn-before {
        width: 48%;  
        font-size: 16px;
    }
}
.kviz-title{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
}
.kviz-title p{
    width: 100%;
    margin-bottom: 0px !important;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
}
.kviz-title p button{
}
.kviz-title-style{
    color: var(--color_dk2grey);
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    width: 100%;
}
.kviz-title-style p{
    color: var(--color_dk2grey);
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.kviz-subtitle-style{
    color: var(--color_dk2grey);
    font-size: 18px;
    font-weight: 300;
    text-align: center;
}
.kviz-text{
    color: var(--color_dk2grey);
    font-size: 18px;
    font-weight: 700;
    text-align: left;
}
@media screen and (max-width: 576px) {
    .kviz-title-style {
        font-size: 20px;        
    }
    .kviz-subtitle-style{
        font-size: 16px;        
    }
    .kviz-text{
        font-size: 16px;        
    }
}
.kviz-area{
    display: flex;
    flex-direction: column;
}
.undisp {
    display: none;
}


@media screen and (max-width: 2000px) {
    .footer-wave{
        min-height: 540px;  
    } 
    .main-bg-1{
        background-image: url("../images/fish-01-3.png");
        background-repeat: no-repeat;
        background-position: bottom 70% left -20px; 
        background-size: 422px auto;
        min-height: 960px;  
    }
    .main-bg-2{
        background-image: url("../images/bg-3.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 960px;  
    }    
    .main-bg-3{
        background-image: url("../images/fish-front-2.png");
        background-repeat: no-repeat;
        background-position: bottom 260px right 30px; 
        background-size: 191px;
        min-height: 860px;  
    }
       
    .main-bg-4{
        background-image: url("../images/bg-2.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 960px;  
    }    
    .main-bg-5{
        background-image: url("../images/fish-front-1.png");
        background-repeat: no-repeat;
        background-position: bottom 500 left 0; 
        background-size: 153px auto;
        min-height: 960px;  
    } 
    .main-bg-6{
        background-image: url("../images/bg-1.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 960px;  
    }
    .bg-cont{
        background-image: url("../images/bg-f-4.png");
        background-repeat: no-repeat;
        background-position: top 0% left 0px; 
        background-size: 100% auto;
        min-height: 240px; 
    }
    .bg-cont1{
        background-image: url("../images/bg-f-1.png");
        background-repeat: no-repeat;
        background-position: top -170px left 0px; 
        background-size: 100% auto;
        min-height: 370px; 
        background-color: white;
    }
}
@media screen and (max-width: 1800px) {
    .footer-wave{
        min-height: 490px;  
    }
    .bg-cont{
        background-image: url("../images/bg-f-4.png");
        background-repeat: no-repeat;
        background-position: top 0% left 0px; 
        background-size: 100% auto;
        min-height: 220px; 
    }
    .bg-cont1{
        background-image: url("../images/bg-f-1.png");
        background-repeat: no-repeat;
        background-position: top -170px left 0px; 
        background-size: 100% auto;
        min-height: 340px; 
        background-color: white;
    }
    .main-bg-3{
        background-image: url("../images/fish-front-2.png");
        background-repeat: no-repeat;
        background-position: bottom 220px right 30px; 
        background-size: 191px;        
    }
}
@media screen and (max-width: 1600px) {     
    .main-bg-1{
        background-image: url("../images/fish-01-3.png");
        background-repeat: no-repeat;
        background-position: bottom 60% left -20px; 
        background-size: 422px auto;
        min-height: 860px;  
    }
    .main-bg-2{
        background-image: url("../images/bg-3.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 860px;  
    }    
    .main-bg-3{
        background-image: url("../images/fish-front-2.png");
        background-repeat: no-repeat;
        background-position: bottom 160px right 30px; 
        background-size: 191px;  
        min-height: 860px;       
    }
    .main-bg-4{
        background-image: url("../images/bg-2.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 860px;  
    }    
    .main-bg-6{
        background-image: url("../images/bg-1.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 860px;  
    }
    .with-bg{
        background-image: url("../images/fish-03.png");
        background-repeat: no-repeat;
        background-position: bottom 60px left 0px;   
    }
    .bg-cont{
        background-image: url("../images/bg-f-4.png");
        background-repeat: no-repeat;
        background-position: top 0% left 0px; 
        background-size: 100% auto;
        min-height: 190px; 
    }
    .bg-cont1{
        background-image: url("../images/bg-f-1.png");
        background-repeat: no-repeat;
        background-position: top -150px left 0px; 
        background-size: 100% auto;
        min-height: 290px; 
        background-color: white;
    }
}
@media screen and (max-width: 1400px) {     
    .main-bg-1{
        background-image: url("../images/fish-01-3.png");
        background-repeat: no-repeat;
        background-position: bottom 50% left -20px; 
        background-size: 422px auto;
        min-height: 760px;  
    }
    .main-bg-2{
        background-image: url("../images/bg-3.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 760px;  
    }    
    .main-bg-3{
        background-image: url("../images/fish-front-2.png");
        background-repeat: no-repeat;
        background-position: bottom 160px right 30px; 
        background-size: 191px;
        min-height: 760px;  
    }  
    .main-bg-4{
        background-image: url("../images/bg-2.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 760px;  
    }
    .main-bg-6{
        background-image: url("../images/bg-1.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 760px;  
    }
    .with-bg{
        background-image: url("../images/fish-03.png");
        background-repeat: no-repeat;
        background-position: bottom 60px left -100px;   
    }
    .bg-cont{
        background-image: url("../images/bg-f-4.png");
        background-repeat: no-repeat;
        background-position: top 0% left 0px; 
        background-size: 100% auto;
        min-height: 160px; 
    }
    .bg-cont1{
        background-image: url("../images/bg-f-1.png");
        background-repeat: no-repeat;
        background-position: top -110px left 0px; 
        background-size: 100% auto;
        min-height: 260px; 
        background-color: white;
    }
    .footer-wave{
        min-height: 390px;  
    }
}
@media screen and (max-width: 1200px) {
    .text-30b{
        font-size: 26px;        
    }    
    .cs-text-advantage{
        font-size: 18px;        
        margin-left: 20px;
    }
    .text-h2-style{    
        font-size: 42px;        
    }
    .text-subt-style{
        font-size: 22px;        
    }
    .text-h2-2-style{    
        font-size: 42px;
    }
    .text-26b{
        font-size: 22px;       
    }
    .text-26l{
        font-size: 22px;       
    }
    .text-22m{
        font-size: 20px;        
    }
    .text-22l{
        font-size: 20px;        
    }
    .text-20l{
        font-size: 18px;        
    }
    .text-20b{
        font-size: 18px;        
    }
    .text-20sb{
        font-size: 18px;        
    }
    .form-left-tel{
        font-size: 30px;   
        padding-bottom: 20px;     
    }
    .form-left-email{
        font-size: 26px;        
    }
    .cs2-form-input, .cs-form-line p span input{        
        font-size: 20px;
        height: 60px;
    }
    .cs-form-btn{        
        height: 70px;        
    }
    .team-img-main-area{
        min-width: 210px;
        min-height: 280px;
        border-radius: 30px;
        overflow: hidden;
    }
    .grid-item { 
        width: 450px; 
    }
    .cs-white-bg-style{
        margin: 30px 0px 0px;
        padding: 30px 20px;
        height: calc(100% - 30px);
    }
    .with-bg{
        background-image: url("../images/fish-03.png");
        background-repeat: no-repeat;
        background-position: bottom 120px left -100px;          
    }
    .bul-bg{
        background-image: url("../images/fish-02.png");
        background-repeat: no-repeat;
        background-position: bottom 0px left 10px;   
    }
    .main-bg-1{
        background-image: url("../images/fish-01-3.png");
        background-repeat: no-repeat;
        background-position: bottom 50% left -20px; 
        background-size: 360px auto;
        min-height: 760px;  
    }
    .main-bg-3{
        background-image: url("../images/fish-front-2.png");
        background-repeat: no-repeat;
        background-position: bottom 120px right 0px; 
        background-size: 191px;
        min-height: 760px;  
    }
    .text-24b{
        font-size: 22px;        
    }
    .cs-stage-before1::after, .cs-stage-before6::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 62px;
        top: 32px;
        left: 61px;
    }
    .cs-stage-before9::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 72px;
        top: 32px;
        left: 61px;
    }
    .cs-stage-before2::after, .cs-stage-before7::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 70px;
        top: 135px;
        left: 61px;
    }
    .cs-stage-before10::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 60px;
        top: 150px;
        left: 61px;
    }
    .cs-stage-before3::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 62px;
        top: 252px;
        left: 61px;
    }
    .cs-stage-before11::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 80px;
        top: 253px;
        left: 61px;
    }
    .cs-stage-before4::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 82px;
        top: 352px;
        left: 61px;
    }
    .bg-cont{
        background-image: url("../images/bg-f-4.png");
        background-repeat: no-repeat;
        background-position: top 0% left 0px; 
        background-size: 100% auto;
        min-height: 140px; 
    }
    .bg-cont1{
        background-image: url("../images/bg-f-1.png");
        background-repeat: no-repeat;
        background-position: top -80px left 0px; 
        background-size: 100% auto;
        min-height: 250px; 
        background-color: white;
    }
    .footer-wave{
        min-height: 340px;  
    }
    .pad-review-all-15{
        padding: 15px;   
        width: 450px !important; 
    }
}
@media screen and (max-width: 992px) {
    .cs-white-bg-review-context{
        padding: 30px;
    }
    .cs-review-context-img-style{
        max-width: 240px;
        height: auto;
    }
    .text-h2-style{    
        margin-bottom: 20px !important;      
        text-align: center;  
    }    
    .text-h2-2-style{    
        margin-bottom: 10px !important; 
    }
    .cs-bul-area-col div{
        font-size: 16px !important;
    }
    .text-20m{
        font-size: 16px;
        font-weight: 500;
    }
    .cs-text-992-l{
        text-align: left !important;
    }
    .cs-text-advantage{
        margin-top: 10px;
        margin-bottom: 10px !important;        
    }
    .cs-advantage-point{        
        margin-top: 15px;    
    } 
    .cs-stage-point{        
        margin-top: 15px;    
    }  
    .cs-about-all-img-style{
        margin-top: 20px;
    }
    .about-m-pad{
        margin-top: 20px;
        margin-bottom: 0px !important;
    }
    .q-bg{
        background-image: none;   
    }
    .cs-about-text-area{
        padding-left: 30px;
    }
    .form-left-area{
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
        margin-bottom: 30px;
    }
    .form-bg{
        background-image: url("../images/fish-sm-r.png");
        background-repeat: no-repeat;
        background-position: bottom 0px left -120px;   
    }
    .footer-wave{
        min-height: 270px;  
    }
    .footer-col-n, .footer-col-c{
        margin-left: 30px;
    }
    .grid-item { 
        width: 100%; 
    }
    .team-area-div{
        padding-top: 10px;         
    }
    .cs-with-btn{
        width: 100%;
        margin: 0px auto;
    }
    .cs-advantage-photo-area{
        padding-top: 20px;   
        display: flex;
        flex-direction: row;
        justify-content: start;
        align-items: start;
    }
    .cs-advantage-photo-area img{
        width: 40%;
    }
    .cs-advantage-photo-text{
        padding-left: 20px;
    }
    .cs-advantage-photo-text div{
        padding-top: 0px !important;
    }
    .cs-text-with{
        margin-bottom: 20px !important;
    }
    .case-area-div{
        padding-top: 0px;        
    }
    .bul-bg{
        background-image: url("../images/fish-02.png");
        background-repeat: no-repeat;
        background-position: bottom 0px left 10px;   
        background-size: 50% auto;
    }
    .text-36sb{
        font-size: 32px;        
    }
    .text-36b{
        font-size: 32px;        
    }
    .text-36l{
        font-size: 32px;        
    }
    .pad-m-b-40{
        padding-bottom: 40px;
    }
    .cs-white-bg-style-bul{
        padding: 20px;        
    }
    .cs-main-round-area{
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 15px 0px;
    }
    .main-bg-1{
        background-image: url("../images/fish-01-3.png");
        background-repeat: no-repeat;
        background-position: bottom 40% left -20px; 
        background-size: 320px auto;
        min-height: 900px;  
    }
    .main-bg-2{
        background-image: url("../images/bg-3.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 900px;  
    }  
    .main-bg-3{
        background-image: url("../images/fish-front-2.png");
        background-repeat: no-repeat;
        background-position: bottom 60px right 0px; 
        background-size: 191px;
        min-height: 900px;  
    }
    .main-bg-4{
        background-image: url("../images/bg-2.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 900px;  
    }
    .main-bg-6{
        background-image: url("../images/bg-1.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 900px;  
    }
    .cs-white-bg-price-w{
        width: 100%;  
    }
    .cs-white-bg-price-g{
        width: 100%;
    }
    .cs-white-bg-price-r{
        padding-right: 15px !important;
        padding-left: 15px !important;
        padding-top: 20px !important;
        padding-bottom: 0px !important;
    }
    .cs-white-bg-price-l{
        padding-right: 15px !important;
        padding-left: 15px !important;
        padding-top: 0px !important;
        padding-bottom: 20px !important;
    }
    .cs-white-bg-price-c{
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .pad-b-60{
        padding-bottom: 40px;
    }
    .cs-stage-num-text{
        font-size: 100px;
        line-height: 0.8;
    }
    .cs-stage-right-area{
        padding-left: 0px;
        padding-top: 30px;
    }
    .cs-stage-point{
        margin-top: 2px;    
    }
    .cs-text-stage{
        padding-bottom: 20px;
    }
    .cs-stage-before1::after, .cs-stage-before6::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 56px;
        top: 55px;
        left: 21px;
    }
    .cs-stage-before2::after, .cs-stage-before7::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 56px;
        top: 145px;
        left: 21px;
    }
    .cs-stage-before3::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 56px;
        top: 240px;
        left: 21px;
    }
    .cs-stage-before4::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 76px;
        top: 330px;
        left: 21px;
    }
    .cs-stage-before9::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 56px;
        top: 55px;
        left: 21px;
    }    
    .cs-stage-before10::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 56px;
        top: 145px;
        left: 21px;
    }    
    .cs-stage-before11::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 76px;
        top: 240px;
        left: 21px;
    }
    .context-bg2{
        background-image: url("../images/fish-08.png");
        background-repeat: no-repeat;
        background-position: bottom 0px right 0px;   
    }
    .bg-cont{
        background-image: url("../images/bg-f-4.png");
        background-repeat: no-repeat;
        background-position: top 0% left 0px; 
        background-size: 100% auto;
        min-height: 120px; 
    }
    .bg-cont1{
        background-image: url("../images/bg-f-1.png");
        background-repeat: no-repeat;
        background-position: top -10px left 0px; 
        background-size: 100% auto;
        min-height: 260px; 
        background-color: white;
    }
    .bg-cont3{
        background-image: url("../images/fish-06.png");
        background-repeat: no-repeat;
        background-position: top 0% right 0px; 
        background-size: 102px auto;
    }
    .bg-cont4{
        background-image: url("../images/fish-07.png");
        background-repeat: no-repeat;
        background-position: top 20% left 0px; 
        background-size: 102px auto;
    }
    .text-50sb{
        font-size: 38px !important;
    }
    .text-30sb{
        font-size: 26px !important;        
    }
    .text-16b{
        font-size: 14px;
        font-weight: 700;
    }   
    .cs-context-task-img-style{
        width: 60px;
        height: 60px;
        margin-right: 20px;
    } 
    .stage-area{
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .cs-context-task-area{
        padding-bottom: 40px;
        padding-right: 50px;
    }
    .cs-case-main-img-area, .cs-case-m-pad-b-20{
        margin-bottom: 20px;;    
    }
    .cs-text-md-center{
        text-align: center;
    }
    .form-pad{
        padding-left: 0px;
    }
    .cs-form-btn{
        margin-top: 15px;
        width: 100%;
    }
    .pad-review-all-15{
        padding: 15px;   
        width: 100% !important; 
    }
}

@media screen and (max-width: 768px) {
    .text-h2-style{    
        font-size: 36px;
        margin-bottom: 20px !important;        
    }
    .text-h2-2-style{    
        font-size: 36px;
        margin-bottom: 0px !important;
    }
    .text-30b{
        font-size: 22px;        
    }
    .cs-text-advantage{
        font-size: 16px;
        font-weight: 300;
        margin-top: 5px;
        margin-bottom: 5px !important;
        margin-left: 10px;
    }
    .cs-advantage-point{        
        margin-top: 8px;    
    } 
    .cs-stage-point{        
        margin-top: 8px;    
    }
    .cs-about-team-img{
        min-width: 155px;
        min-height: 155px;
        width: 155px;
        height: 155px;
        border-radius: 20px;
        box-shadow: 0px 0px 20px rgba(0, 29, 33, .1);
        overflow: hidden;
    }
    .text-20l{
        font-size: 16px;        
    }
    .text-20b{
        font-size: 16px;        
    }
    .text-20sb{
        font-size: 16px;        
    }
    .pad-b-40{
        padding-bottom: 20px;    
    }
    .text-26b{
        font-size: 20px;        
    }
    .text-26l{
        font-size: 20px;       
    }
    .text-22m{
        font-size: 18px;        
    }
    .text-22l{
        font-size: 18px;        
    }
    .form-left-area{
        margin-top: 20px;
    }
    .cs2-form-input, .cs-form-line p span input{        
        font-size: 18px;        
    }
    
    .team-img-main-area{
        min-width: 240px;
        min-height: 320px;
        border-radius: 30px;
        overflow: hidden;
    }
    .cs-rewiev-btn{
        width: 100%;
        margin: 0px;
    }
    .cs-blue-btn{
        font-size: 16px;        
    }   
    .cs-green-btn{
        font-size: 22px;        
    }   
    .case-slider-arrow-img-style{
        width: 20px;
        height: 20px;
    }
    .case-slider-arrow-bg{
        min-width: 50px;
        min-height: 50px;
        margin-left: 10px;
    } 
    .cs-q-img-style{
        width: 40px;
        height: 40px;
    }
    .cs-q-bg-arrow{
        width: 40px;
        height: 40px;        
    }
    .collapsed .cs-q-bg-arrow{
        width: 40px;
        height: 40px;        
    }
    .collapsed:hover .cs-q-bg-arrow{
        width: 40px;
        height: 40px;
    }
    .cs-white-bg-style-solo{
        padding: 30px 20px;        
    }
    .section-fish-sm-img-style{
        width: 220px;
        height: 132px;
        transform: translateY(0px) !important;  
    }
    .text-subt-style{
        font-size: 20px;    
        text-align: center;    
    }
    .cs-with-area{
        padding-bottom: 30px;  
    }
    .text-36sb{
        font-size: 28px;        
    }
    .text-36b{
        font-size: 28px;        
    }
    .text-36l{
        font-size: 28px;        
    }
    .cs-white-bg-style-bul-m-pad{
        margin-bottom: 20px;
    }
    .cs-loz-pad{
        padding-top: 80px;
        padding-bottom: 20px;
    }
    .cs-bul-area-row{
        padding-bottom: 0px;
    }
    .main-bg-1{
        background-image: url("../images/fish-01-3.png");
        background-repeat: no-repeat;
        background-position: bottom 120px left -20px; 
        background-size: 260px auto;
        min-height: 760px;  
    }
    .main-bg-2{
        background-image: url("../images/bg-3.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 760px;  
    }   
    .main-bg-3{
        background-image: url("../images/fish-front-2.png");
        background-repeat: no-repeat;
        background-position: bottom 0px right 0px; 
        background-size: 191px;
        min-height: 760px;  
    } 
    .main-bg-4{
        background-image: url("../images/bg-2.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 760px;  
    }  
    .main-bg-6{
        background-image: url("../images/bg-1.png");
        background-repeat: no-repeat;
        background-position: bottom 0 left 0; 
        background-size: 100% auto;
        min-height: 760px;  
    }
    .text-30r{
        font-size: 24px;        
    }
    .text-20r{
        font-size: 18px;        
    }
    .pad-t-70{
        padding-top: 40px;
    }
    .modal-dialog{
        max-width: 500px;
    } 
    .cs-form-btn{
        margin-top: 15px;
        width: 100%;        
    }  
    .cs-stage-num-text{
        font-size: 80px;
        line-height: 0.8;
    } 
    .cs-stage-right-area{
        padding-left: 0px;
        padding-top: 20px;
    }    
    .bg-cont1{
        background-image: url("../images/bg-f-1.png");
        background-repeat: no-repeat;
        background-position: top -10px left 0px; 
        background-size: 100% auto;
        min-height: 200px; 
        background-color: white;
    }
    .bg-cont3{
        background-image: url("../images/fish-06.png");
        background-repeat: no-repeat;
        background-position: top 70% right 0px; 
        background-size: 102px auto;
    }
    .bg-cont4{
        background-image: url("../images/fish-07.png");
        background-repeat: no-repeat;
        background-position: bottom 30% left 0px; 
        background-size: 102px auto;
    }
    .cs-main-context-bul{        
        max-width: 140px;
    }
    .cs-main-context-bul-area{
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        padding-top: 80px;
        padding-bottom: 80px;
    }  
    .cs-stage-point{
        margin-top: 4px;
    }
    .cs-stage-before1::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 68px;
        top: 53px;
        left: 21px;
    }    
    .cs-stage-before2::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 68px;
        top: 164px;
        left: 21px;
    }
    .cs-stage-before3::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 68px;
        top: 273px;
        left: 21px;
    }
    .cs-stage-before4::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 92px;
        top: 380px;
        left: 21px;
    }
    .cs-stage-before6::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 54px;
        top: 49px;
        left: 21px;
    }
    .cs-stage-before7::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 68px;
        top: 140px;
        left: 21px;
    }
    .cs-stage-before9::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height:68px;
        top: 53px;
        left: 21px;
    }    
    .cs-stage-before10::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 53px;
        top: 160px;
        left: 21px;
    }    
    .cs-stage-before11::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 2px;
        height: 68px;
        top: 250px;
        left: 21px;
    } 
    .context-bg2{
        background-image: url("../images/fish-08.png");
        background-repeat: no-repeat;
        background-position: bottom 0px right 0px; 
        background-size: 111px auto;  
    } 
    .cs-text-stage{
        padding-left: 10px;        
    }
    .stage-area{
        padding-top: 25px;
        padding-bottom: 25px;
    }
    .cs-context-task-area{
        padding-bottom: 30px;
        padding-right: 0px;
    }
    .cs-white-bg-case{
        padding: 20px;        
    }
}

@media screen and (max-width: 576px) {
    .cs-context-task-area{
        padding-bottom: 20px;
        padding-right: 0px;
    }
    .stage-area{
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .cs-white-bg-style-about{
        background-color: white;
        border-radius: 30px;
        box-shadow: 0px 0px 20px rgba(0, 29, 33, .15);
        padding: 30px;    
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
    }
    .footer-menu-btn{
        width: 100%;
        height: 50px;        
    }
    .footer-area{
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
    }
    .footer-col-s{
        padding-bottom: 40px;        
    }
    .footer-wave{
        min-height: 170px;  
    }
    .cs2-form-input, .cs-form-line p span input{
        height: 50px;
        padding: 0px 20px;
        font-size: 16px;        
    }    
    .footer-down{
        background-image: url("../images/bg-f-3.png");
        background-repeat: no-repeat;
        background-position: bottom 220px right 0px;    
    }
    .cs-about-team-img{
        min-width: 250px;
        min-height: 250px;
        width: 250px;
        height: 250px;   
        margin-bottom: 20px;     
    }
    .cs-about-text-area{
        padding-left: 0px;
    }
    .cs-about-text-area div{
        text-align: center;
    }
    .team-img-main-area{
        min-width: 210px;
        min-height: 280px;
        border-radius: 30px;
        overflow: visible;
    }
    .team-area-div{
        max-width: 240px !important;    
        padding-top: 0px;         
    }
    .cs-text-with{
        margin-bottom: 15px !important;
    }
    .cs-with-area{
        padding-bottom: 0px;  
    }
    .with-bg{
        background-image: none;        
    }
    .pad-t-60{
        padding-top: 30px;
    }
    .cs-green-btn{
        font-size: 20px;     
        text-align: center;   
    }
    .text-36sb{
        font-size: 26px;        
    }
    .text-36b{
        font-size: 26px;        
    }
    .text-36l{
        font-size: 26px;        
    }
    .cs-white-bg-style-bul-m-pad{
        margin-bottom: 20px;
    }
    .cs-loz-pad{
        padding-top: 60px;
        padding-bottom: 20px;
    }
    .main-bg-1{
        background-image: url("../images/fish-01-3.png");
        background-repeat: no-repeat;
        background-position: bottom 100px left -30px; 
        background-size: 260px auto;
        min-height: 760px;  
    } 
    .main-bg-3{
        background-image: url("../images/fish-front-2.png");
        background-repeat: no-repeat;
        background-position: bottom -30px right 0px; 
        background-size: 191px;
        min-height: 760px;  
    }  
    .cs-main-round-bg{
        border-radius: 500px;
        background-color: var(--color_green);   
        width: 180px; 
        height: 180px; 
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .cs-main-round-img-style{
        width: 170px; 
        height: 170px; 
    }  
    .text-24b{
        font-size: 20px;        
    }
    .cs-form-btn{
        margin-top: 15px;
        width: 100%;
    }
    .modal-dialog{
        max-width: calc(100%-20px);
    }
    .modal-body{
        padding: 20px 0px 0px;
    }
    .cs-text-m-center{
        text-align: center;
    }
    .pad-b-60{
        padding-bottom: 30px;
    }
    .text-50sb{
        font-size: 32px !important;
    }
    .text-30sb{
        font-size: 22px !important;        
    }
    .bg-cont1{
        background-image: url("../images/bg-f-1.png");
        background-repeat: no-repeat;
        background-position: top 0px left 0px; 
        background-size: 100% auto;
        min-height: 200px; 
        background-color: white; 
    }
    .cs-review-img-area{
        width: 100px;
        height: 100px;
        box-shadow: 0px 0px 20px rgba(0, 29, 33, .25); 
        border-radius: 160px;
        overflow: hidden;
    }
    .cs-about-img-area{
        width: 90px;
        height: 90px;
        box-shadow: 0px 0px 20px rgba(0, 29, 33, .25); 
        border-radius: 90px;
        overflow: hidden;
    }
    .cs-review-img-style{
        background-size: cover; 
        background-repeat: no-repeat; 
        background-position: center;    
    }
    .cs-review-zoom-img-style{
        width: 50px;
        height: 50px;
    }
    .cs-about-zoom-img-style{
        width: 40px;
        height: 40px;
    }
    .cs-review-zoom-area{
        width: 100px;
        height: 100px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .cs-about-zoom-area{
        width: 90px;
        height: 90px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}
@media screen and (max-width: 576px) {
    .main-bg-1{
        background-image: url("../images/fish-01-3.png");
        background-repeat: no-repeat;
        background-position: bottom 20px left -30px; 
        background-size: 160px auto;
        min-height: 760px;  
    } 
    .cs-stage-before1::after, .cs-stage-before2::after, .cs-stage-before3::after, .cs-stage-before4::after, .cs-stage-before6::after, .cs-stage-before7::after, .cs-stage-before9::after, .cs-stage-before10::after, .cs-stage-before11::after{
        content: "";
        position: absolute;
        background-color: var(--color_green);
        border-radius: 14px;
        width: 0px;
        height: 0px;        
    }   
}

.cookie-a{
    color: var(--color_blue) !important;
    transition: all 0.5s ease-in-out;
}
.cookie-a:hover{
    color: var(--color_green) !important;
}


.contextsea-captcha-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(15, 23, 42, 0.55);
}

.contextsea-captcha-modal.is-open {
    display: flex;
}

.contextsea-captcha-modal__backdrop {
    position: absolute;
    inset: 0;
}

.contextsea-captcha-modal__dialog {
    position: relative;
    z-index: 1;
    max-width: 480px;
    width: 100%;
    padding: 32px 28px;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 20px 45px rgba(15, 23, 42, 0.15);
    text-align: center;
}

.contextsea-captcha-modal__title {
    margin-bottom: 12px;
    font-size: 24px;
    font-weight: 600;
    color: #111827;
}

.contextsea-captcha-modal__description {
    margin-bottom: 20px;
    color: #4b5563;
    font-size: 16px;
}

.contextsea-captcha-modal__captcha {
    display: flex;
    justify-content: center;
}

.contextsea-captcha-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.06);
    color: #111827;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.contextsea-captcha-modal__close:hover,
.contextsea-captcha-modal__close:focus {
    background: rgba(15, 23, 42, 0.12);
}

body.contextsea-captcha-modal-open {
    overflow: hidden;
}


.form-error {
    color: red;
    display: flex;
    justify-content: center;
    text-align: center;
    font-weight: 600;
    font-size: 12px;
}

.form-success{
    color: var(--color-light-blue);
    display: flex;
    justify-content: center;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    padding-bottom: 5px;
}
@media screen and (max-width: 768px) {
    .form-error {
        justify-content: center;
    }

    .form-success{
        justify-content: center;
    }
}


.smartcaptcha-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 2000;
  }
  
  .smartcaptcha-modal--visible {
    display: flex;
  }
  
  .smartcaptcha-modal__content {
    position: relative;
    width: 100%;
    max-width: 420px;
    padding: 32px 24px 28px;
    background-color: #ffffff;
    border-radius: 16px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    text-align: center;
    outline: none;
  }
  
  .smartcaptcha-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    border: none;
    background: transparent;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    color: #6c757d;
  }
  
  .smartcaptcha-modal__close:hover,
  .smartcaptcha-modal__close:focus {
    color: #1f1f1f;
  }
  
  .smartcaptcha-modal__title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 12px;
    color: #1e1e1e;
  }
  
  .smartcaptcha-modal__description {
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 20px;
    color: #5f6c7b;
  }
  
  .smartcaptcha-modal__widget {
    display: flex;
    justify-content: center;
  }
  
  .smartcaptcha-modal__widget > div {
    margin: 0 auto;
  }
  
  @media (max-width: 480px) {
    .smartcaptcha-modal {
      padding: 12px;
    }
  
    .smartcaptcha-modal__content {
      padding: 24px 16px 20px;
      border-radius: 12px;
    }
  
    .smartcaptcha-modal__title {
      font-size: 18px;
    }
  }

li strong{
	font-weight: 600;
}
h3 strong{
	font-weight: 500 !important;
	color: var(--color_blue) !important;
}
/* ===== Page: Стоимость ===== */
.bul-price-bg{
    background-image: url("../images/fish-10.png");
    background-repeat: no-repeat;
    background-position: bottom 30px left 20px;   
    background-size: 33%;
}
.cs-price-page{background:#f7f7f7;color:#2f3133;padding-bottom:80px}.cs-price-page .container{max-width:1110px}.cs-price-hero{padding:70px 0 35px;text-align:center}.cs-price-hero h1,
.cs-price-section-title{color:var(--color_blue);font-weight:600}
.cs-price-hero h1{font-size:36px;margin:0 0 40px}
.cs-price-lead{font-size:34px;font-weight:600;line-height:1.18}
.mc-green{color:var(--color_blue)}
.cs-price-card-col{padding:10px} 
.cs-price-card{height:100%;background:#fff;border-radius:18px;box-shadow:0 3px 14px rgba(0,29,33,.13);padding:32px 34px 24px;display:flex;flex-direction:column;justify-content:space-between}
.cs-price-card.is-featured{background:var(--color_green)}
.cs-price-card-title-row{display:flex;align-items:flex-start;gap:15px}
.cs-price-icon,.cs-price-detail-icon{flex:0 0 auto;background:#82eb7c;color:#17392d;border-radius:5px;display:flex;align-items:center;justify-content:center;font-weight:800}.cs-price-icon{width:48px;height:48px;font-size:28px}
.cs-price-icon--image{overflow:hidden;padding:0;background:#82eb7c}.cs-price-icon--image img{display:block;width:100%;height:100%;object-fit:contain;padding:7px}.cs-price-card.is-featured .cs-price-icon--image{background:#fff}
.cs-price-card h2{font-size:23px;line-height:1.1;margin:5px 0 18px;font-weight:700}
.cs-price-card-text{font-size:15px;line-height:1.25}
.cs-price-list{padding-left:22px;margin:14px 0;font-size:14px}
.cs-price-list li::marker,.cs-price-detail li::marker{color:var(--color_blue)}
.cs-price-card-price{font-size:14px;font-weight:700;margin-top:8px}
.cs-price-btn{width:100%;border:0;border-radius:5px;background:var(--color_blue);color:#fff;font-size:18px;font-weight:600;padding:18px 15px;margin-top:24px;cursor:pointer}
.is-featured .cs-price-btn{background:#fff;color:#202020}
.cs-price-additional{padding-top:65px}
.cs-price-section-title{font-size:28px;margin:0 0 28px;font-weight: 500;}
.cs-price-card--service{padding:34px 42px 24px}
.cs-price-card--service h3{text-align:center;font-size:30px;line-height:1.05;font-weight:700;margin:0 0 20px}
.cs-price-card--service h3 span{font-size:24px}
.cs-price-service-desc{text-align:center;color:#4D4D4D;font-size:22px;line-height:1.15;min-height:58px;margin-bottom:22px;font-weight:300;}
.cs-price-detail{display:flex;gap:16px;margin:20px 0;font-size:18px;line-height:1.25;font-weight:300;}
.cs-price-detail-icon{width:50px;height:50px;font-size:23px}
.cs-price-detail strong{display:block;font-size:22px;margin-bottom:8px}
.cs-price-detail ul{padding-left:17px;margin:0}
.cs-price-detail p{margin:0;color:#303030}
.cs-price-terms{padding-top:80px}
.cs-price-term-row{display:grid;grid-template-columns:130px 210px 2px 1fr;gap:30px;align-items:start;margin:0 0 45px}
.cs-price-term-num{font-size:76px;line-height:.9;color:#82eb7c;font-weight:500}
.cs-price-term-name{color:var(--color_blue);font-size:17px;line-height:1.08;font-weight:700;padding-top:13px}
.cs-price-term-divider{width:2px;background:#82eb7c;min-height:72px}
.cs-price-term-text{font-size:13px;line-height:1.45;color:#666;padding-top:5px}
.cs-price-guarantee{padding-top:45px}
.cs-price-guarantee-box{background:#fff;border-radius:18px;box-shadow:0 3px 14px rgba(0,29,33,.13);padding:34px}
.cs-price-guarantee-intro{font-size:17px;line-height:1.25;margin-bottom:15px}
.cs-price-guarantee-intro strong{color:var(--color_blue)}
.cs-price-guarantee-item{display:flex;gap:15px;margin:13px 0}
.cs-price-guarantee-item>span{width:44px;height:44px;border-radius:5px;background:#82eb7c;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:700;flex:0 0 auto}
.cs-price-guarantee-item strong{font-size:15px}
.cs-price-guarantee-item p{margin:2px 0 0;font-size:14px;color:#666}
.cs-price-guarantee-note{font-size:12px;padding-left:60px}
.cs-price-promo{padding-top:65px}
.cs-price-promo-box{
    background-color:#82eb7c;
    background-image:url('../images/mc-s-fish.png');
    background-repeat:no-repeat;
    background-position:center bottom;
    background-size:100% auto;

    border-radius:30px;
    min-height:250px;
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:30px;
    overflow:hidden;
    box-shadow:0 2px 18px rgba(0,0,0,.12)
}
.cs-price-promo-kicker{font-size:42px;font-weight:800;margin-bottom:12px}
.cs-price-promo-text{font-size:27px;line-height:1.15}
.cs-price-promo-text strong{font-weight:800}
@media(max-width:992px){
    .cs-price-card--service h3{text-align:center;font-size:24px;line-height:1.05;font-weight:700;margin:0 0 15px}
    .cs-price-card--service h3 span{font-size:20px}
    .cs-price-service-desc{text-align:center;color:#4D4D4D;font-size:18px;line-height:1.15;min-height:8px;margin-bottom:0px;font-weight:300;}
    .cs-price-detail strong{display:block;font-size:18px;margin-bottom:8px}
    .cs-price-detail{display:flex;gap:16px;margin:20px 0;font-size:16px;line-height:1.25;font-weight:300;}

}
@media(max-width:767px){
    .cs-price-hero{padding-top:45px}
    .cs-price-hero h1{font-size:27px;margin-bottom:25px}
    .cs-price-lead{font-size:22px}
    .cs-price-section-title{font-size:25px;padding-top: 30px;}
    .cs-price-card{padding:25px 22px}
    .cs-price-card--service{padding:28px 24px}
    .cs-price-term-row{grid-template-columns:80px 1fr;gap:10px 15px;margin-bottom:35px}
    .cs-price-term-num{font-size:58px}
    .cs-price-term-name{font-size:16px}
    .cs-price-term-divider{display:none}
    .cs-price-term-text{grid-column:1/-1;padding-left:0}
    .cs-price-guarantee-box{padding:25px 20px}
    .cs-price-guarantee-note{padding-left:0}
    .cs-price-promo-box{min-height:150px}
    .cs-price-promo-kicker{font-size:34px}
    .cs-price-promo-text{font-size:21px}
}


/* ============================================================
   Страница «Стоимость» — блок «Обсудить проект»
   ============================================================ */
.cs-price-contact{
    padding-bottom: 90px;
}
.cs-price-contact .text-h2-style{
    margin-bottom: 45px;
}
.cs-price-contact .contact-sm-area{
    width: auto;
    flex-wrap: wrap;
}
.cs-price-contact-social-icon{
    display: block;
    max-width: 26px;
    max-height: 26px;
    width: auto;
    height: auto;
    object-fit: contain;
}
.cs-price-contact .form-sm-logo-area:nth-child(3) .cs-price-contact-social-icon{
    max-width: 40px;
    max-height: 40px;
}
.cs-price-contact-note{
    margin-top: 45px;
    max-width: 360px;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.45;
    color: white;
    background-color: var(--color_blue);
    padding: 20px;
    border-radius: 12px;
}
.cs-price-contact-note strong{
    font-weight: 700;
}
@media screen and (max-width: 992px){
    .cs-price-contact .text-h2-style{
        text-align: center;
    }
    .cs-price-contact-note{
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }
    .cs-price-contact .form-pad{
        padding-left: 0;
    }
    .form-title{
        text-align: center;
    }
}
@media screen and (max-width: 576px){
    .cs-price-contact{
        padding-bottom: 60px;
    }
    .cs-price-contact .text-h2-style{
        margin-bottom: 30px;
    }
    .cs-price-contact-note{
        font-size: 16px;
        margin-top: 30px;
    }
}

/* =========================================================
   Страница «Дополнительные услуги»
   ========================================================= */
.cs-additional-services-page {
    padding-bottom: 0;
}

.cs-additional-services-list {
    padding-top: 75px;
    padding-bottom: 75px;
}

.cs-additional-services-title {
    text-align: center;
    margin-bottom: 35px;
}

.cs-additional-services-contact {
    margin-top: 0;
}

@media (max-width: 767px) {
    .cs-additional-services-list {
        padding-top: 45px;
        padding-bottom: 45px;
    }

    .cs-additional-services-title {
        margin-bottom: 20px;
    }
}
/* Дополнительные услуги: иконки из метаполей */
.cs-additional-services-page .cs-price-detail-icon--image {
    padding: 8px;
}
.cs-additional-services-page .cs-price-detail-icon--image img {
    display: block;
    width: 30px;
    height: 30px;
    object-fit: contain;
}
.cs-additional-services-page .cs-price-detail-content {
    min-width: 0;
    flex: 1 1 auto;
}
.cs-additional-services-page .cs-price-detail-content p + ul {
    margin-top: 7px;
}
.cs-price-detail-content ul li{
    padding-bottom: 4px;
    line-height: 1.15;
}
/* ==========================================================================\n   Страница «Партнерам»\n   ========================================================================== */
.cs-partners-page{background:#f7f7f7;color:var(--color_dk2grey)}
.cs-partners-page .container{position:relative;z-index:2}
.cs-partners-hero{padding:55px 0 35px}
.cs-partners-page-title{text-align:center;color:var(--color_blue);font-size:36px;line-height:1.15;font-weight:600;margin:0 0 40px;text-transform:uppercase}
.cs-partners-hero-row{align-items:center}
.cs-partners-hero-heading{font-size:30px;line-height:1.2;font-weight:700;margin:0 0 24px;color:var(--color_dk2grey)}
.cs-partners-hero-list{display:flex;flex-direction:column;gap:22px}
.cs-partners-hero-item{display:flex;align-items:flex-start;gap:16px;font-size:24px;line-height:1.22;font-weight:300}
.cs-partners-hero-item strong{font-weight:700}
.cs-partners-dot{width:14px;height:14px;min-width:14px;border-radius:50%;background:var(--color_blue);margin-top:8px}
.cs-partners-hero-image{display:block;width:100%;height:315px;object-fit:cover;border-radius:28px;background:#e6e6e6}
.cs-partners-hero-image--placeholder{background:linear-gradient(135deg,#e9e9e9,#d8d8d8)}
.cs-partners-section{padding:45px 0}
.cs-partners-section-title{font-size:44px;line-height:1.08;font-weight:600;color:var(--color_blue);margin:0 0 32px}
.cs-partners-cards-row,.cs-partners-delegation-row{margin-left:-10px;margin-right:-10px}
.cs-partners-card-col,.cs-partners-delegation-col{padding-left:10px;padding-right:10px;margin-bottom:20px}
.cs-partners-card{height:100%;background:#fff;border-radius:24px;padding:32px 36px;box-shadow:0 2px 18px rgba(0,0,0,.12)}
.cs-partners-card h3{font-size:25px;line-height:1.12;font-weight:700;margin:0 0 18px}
.cs-partners-card h3 small{display:block;font-size:18px;line-height:1.15;font-weight:500;margin-top:2px}
.cs-partners-card-text{font-size:19px;line-height:1.18;font-weight:300;white-space:normal}
.cs-partners-card-text p strong{font-weight: 700;}
.cs-partners-bullets{list-style:none;padding:0;margin:16px 0 0}
.cs-partners-bullets li{position:relative;padding-left:28px;margin:9px 0;font-size:17px;line-height:1.15;font-weight:300}
.cs-partners-bullets li:before{content:"";position:absolute;left:0;top:.42em;width:10px;height:10px;border-radius:50%;background:var(--color_blue)}
.cs-partners-delegation{position:relative}
.cs-partners-delegation:after{content:"";position:absolute;right:10px;top:20px;width:190px;height:88px;background:url("../images/fish-01-2.png") no-repeat right center/contain;opacity:.9}
.cs-partners-delegation-card{height:100%;background:#fff;border-radius:16px;padding:22px 38px;box-shadow:0 2px 15px rgba(0,0,0,.11)}
.cs-partners-delegation-card h3{font-size:24px;line-height:1.13;font-weight:700;margin:0 0 6px}
.cs-partners-delegation-card p{font-size:18px;line-height:1.18;font-weight:300;margin:0}
.cs-partners-benefits{position:relative;padding-bottom:55px;min-height:400px}
.cs-partners-benefits:after{content:"";position:absolute;right:0;bottom:-20px;width:509px;height:360px;background:url("../images/fish-partner.png") no-repeat right bottom/contain;pointer-events:none}
.cs-partners-benefits:before{content:"";position:absolute;right:25%;top:30px;width:110px;height:80px;background:url("../images/fish-front-1.png") no-repeat center/contain;transform:rotate(-15deg);pointer-events:none}
.cs-partners-benefits-list{max-width:580px;display:flex;flex-direction:column;gap:38px}
.cs-partners-benefit-item{display:flex;align-items:center;gap:24px}
.cs-partners-benefit-icon{width:72px;height:72px;min-width:72px;display:flex;align-items:center;justify-content:center}
.cs-partners-benefit-icon img{max-width:100%;max-height:100%;object-fit:contain}
.cs-partners-benefit-icon--empty{border:2px solid var(--color_blue);border-radius:14px;opacity:.3}
.cs-partners-benefit-copy{font-size:23px;line-height:1.08;font-weight:300}
.cs-partners-benefit-copy strong{font-weight:700}
.cs-partners-contact{padding-bottom:90px;position:relative}
.cs-partners-contact:after{content:"";position:absolute;right:0;top:5px;width:188px;height:78px;background:url("../images/fish-09.png") no-repeat right center/contain;pointer-events:none}
.cs-partners-contact .text-h2-style{max-width:620px;font-size:28px;}

@media screen and (max-width: 1199px){
  .nav-header-menu-d {display: none;}
  .cs-partners-page-title{font-size:32px}.cs-partners-section-title{font-size:38px}.cs-partners-hero-heading{font-size:27px}.cs-partners-hero-item{font-size:21px}.cs-partners-card h3{font-size:23px}.cs-partners-card-text{font-size:17px}.cs-partners-delegation-card h3{font-size:21px}.cs-partners-delegation-card p{font-size:16px}.cs-partners-benefit-copy{font-size:20px}
}
@media screen and (max-width: 991px){
  .cs-partners-hero{padding-top:35px}.cs-partners-page-title{margin-bottom:28px}.cs-partners-hero-image{margin-top:30px;height:auto;min-height:260px}.cs-partners-section{padding:32px 0}.cs-partners-section-title{font-size:34px;margin-bottom:24px}.cs-partners-card{padding:28px}
  .cs-partners-delegation:after{width:110px;height:60px;top:15px}.cs-partners-benefits:after{width:300px;height:260px}.cs-partners-benefits:before{right:8%;opacity:.55}.cs-partners-benefits-list{max-width:75%}.cs-partners-contact .form-pad{padding-left:0;margin-top:30px}
  .cs-partners-page{padding-top: 60px;}
  .cs-partners-contact .text-h2-style{max-width:100%;font-size:28px;}
}
@media screen and (max-width: 767px){
  .cs-partners-page-title{font-size:28px}
  .cs-partners-hero-heading{font-size:22px}
  .cs-partners-hero-item{font-size:18px;gap:12px}
  .cs-partners-dot{width:11px;height:11px;min-width:11px;margin-top:6px}
  .cs-partners-section-title{font-size:31px}
  .cs-partners-card,.cs-partners-delegation-card{border-radius:16px;padding:24px}
  .cs-partners-card h3{font-size:21px}.cs-partners-card-text,.cs-partners-bullets li{font-size:16px}
  .cs-partners-benefits-list{max-width:100%;gap:28px}
  .cs-partners-benefit-item{gap:16px}
  .cs-partners-benefit-icon{width:58px;height:58px;min-width:58px}
  .cs-partners-benefit-copy{font-size:18px}
  .cs-partners-benefits:after{width:220px;height:180px;opacity:.08}
  .cs-partners-benefits:before{display:none}
  .cs-partners-contact:after{top: -40px;width:95px;height:65px}
  
}
@media screen and (max-width: 480px){
  .cs-partners-hero{padding-top:24px}.cs-partners-page-title{font-size:25px}.cs-partners-hero-image{min-height:210px;border-radius:18px}.cs-partners-section-title{font-size:28px}.cs-partners-card{padding:21px}.cs-partners-delegation-card{padding:20px}.cs-partners-benefit-item{align-items:flex-start}.cs-partners-benefit-icon{width:50px;height:50px;min-width:50px}.cs-partners-benefit-copy{font-size:17px}
}