/*!************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/scss/app.scss ***!
  \************************************************************************************************************/
@charset "UTF-8";
.orange {
  color: #FF8200;
}

.blue {
  color: #005FFF;
}

.green {
  color: #60B660;
}

.red {
  color: #BF0000;
}

.white {
  color: #FFFFFF;
}

:root {
  --interval-5: 5px;
  --interval-10: 10px;
  --interval-15: 15px;
  --interval-20: 20px;
  --interval-25: 25px;
  --interval-30: 30px;
  --interval-35: 35px;
  --interval-40: 40px;
  --interval-45: 45px;
  --interval-50: 50px;
  --interval-55: 55px;
  --interval-60: 60px;
  --interval-65: 65px;
  --interval-70: 70px;
  --interval-75: 75px;
  --interval-80: 80px;
  --interval-85: 85px;
  --interval-90: 90px;
  --interval-95: 95px;
  --interval-100: 100px;
}

@media screen and (max-width: 1366px) {
  :root {
    --interval-5: .36vw;
    --interval-10: .73vw;
    --interval-15: 1.09vw;
    --interval-20: 1.46vw;
    --interval-25: 1.83vw;
    --interval-30: 2.19vw;
    --interval-35: 2.19vw;
    --interval-40: 2.92vw;
    --interval-45: 2.92vw;
    --interval-50: 3.66vw;
    --interval-55: 3.66vw;
    --interval-60: 4.39vw;
    --interval-65: 4.39vw;
    --interval-70: 5.12vw;
    --interval-75: 5.49vw;
    --interval-80: 5.49vw;
    --interval-85: 5.49vw;
    --interval-90: 5.49vw;
    --interval-95: 6.95vw;
    --interval-100: 7.65vw;
  }
}
@media screen and (max-width: 1024px) {
  :root {
    --interval-5: .54vw;
    --interval-10: 1.09vw;
    --interval-15: 1.63vw;
    --interval-20: 2.19vw;
    --interval-25: 2.74vw;
    --interval-30: 3.28vw;
    --interval-40: 4.38vw;
    --interval-50: 5.49vw;
    --interval-60: 6.58vw;
    --interval-70: 7.68vw;
    --interval-75: 8.23vw;
    --interval-95: 10.42vw;
    --interval-100: 11.47vw;
  }
}
@media screen and (max-width: 640px) {
  :root {
    --interval-5: 1vw;
    --interval-10: 2vw;
    --interval-15: 3vw;
    --interval-20: 4.5vw;
    --interval-25: 5vw;
    --interval-30: 6vw;
    --interval-40: 8vw;
    --interval-50: 10vw;
    --interval-60: 12vw;
    --interval-70: 14vw;
    --interval-75: 15vw;
    --interval-95: 19vw;
    --interval-100: 20vw;
  }
}
.img-shadow {
  box-shadow: 0 5px 10px 2px rgba(34, 60, 80, 0.2);
}

.border-rotate {
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-name: border-rotate;
  animation-duration: 5000ms;
  animation-fill-mode: both;
}

.bold {
  font-family: "Manrope-Bold";
}

* {
  box-sizing: border-box;
  background: none;
  outline: none;
  resize: none;
  border: none;
  padding: 0;
  margin: 0;
}

body, html {
  padding: 0;
  margin: 0;
}

body {
  font-family: "Manrope-Regular";
  background: #F0F3F0;
  line-height: 1.37;
  font-size: 17px;
  color: #666666;
}
@media screen and (max-width: 1366px) {
  body {
    font-size: 1.24vw;
  }
}
@media screen and (max-width: 1024px) {
  body {
    font-size: 1.86vw;
  }
}
@media screen and (max-width: 640px) {
  body {
    font-size: 4vw;
  }
}
body.fixed {
  overflow: hidden;
  height: 100vh;
}

b, strong {
  font-family: "Manrope-Bold";
}

table {
  border-collapse: collapse;
}

button {
  transition: all 250ms;
  cursor: pointer;
}

h1, h2, h3, h4, b, strong {
  font-weight: normal;
}

a {
  text-decoration: none;
}

img {
  image-rendering: -webkit-optimize-contrast;
}

@font-face {
  font-family: "Manrope-Bold";
  src: url(0aca6c12ec5a8c8a72cb.eot);
  src: url(0aca6c12ec5a8c8a72cb.eot?#iefix) format("embedded-opentype"), url(741080ae082d03399737.woff) format("woff"), url(47f6d7143da9d8c0e480.ttf) format("truetype");
}
@font-face {
  font-family: "Manrope-Regular";
  src: url(a5171b0e14e480cdf7e9.eot);
  src: url(a5171b0e14e480cdf7e9.eot?#iefix) format("embedded-opentype"), url(57b696de48e4471bf095.woff) format("woff"), url(a9b9e09fe6b69741f316.ttf) format("truetype");
}
.wrap {
  min-height: 100%;
  overflow: hidden;
  padding: 0;
  margin: 0;
}

.header {
  background: #FFFFFF;
  position: relative;
  height: var(--interval-60);
  z-index: 100;
}
.header > .center {
  z-index: 2;
}
.header.menu-active {
  background: #FFFFFF;
}
.header .center {
  justify-content: space-between;
  align-items: center;
  position: relative;
  display: flex;
  height: 100%;
  z-index: 3;
}
.header .logo {
  position: relative;
  width: calc(var(--interval-10) * 12);
  z-index: 2;
}
.header .logo .logo-link {
  display: block;
}
.header .logo .logo-icon {
  display: block;
  width: 100%;
}
.header .link {
  position: relative;
  display: flex;
  z-index: 2;
}
.header .link .link-icons {
  position: relative;
  height: 0.9em;
  width: 1.2em;
}
.header .link .link-text {
  font-family: "Manrope-Bold";
  padding-left: 0.4em;
  font-size: 14px;
  color: #FFFFFF;
}
@media screen and (max-width: 1366px) {
  .header .link .link-text {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 1024px) {
  .header .link .link-text {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) {
  .header .link .link-text {
    font-size: 3vw;
  }
}
.header .phone {
  margin-right: var(--interval-25);
}
.header .login {
  margin-right: var(--interval-25);
}
.header .button.primary {
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 1024px) {
  .header {
    height: 8vw;
  }
  .header .logo {
    margin-right: 0;
    width: 15vw;
  }
  .header .phone {
    margin-left: auto;
  }
}
@media screen and (max-width: 640px) {
  .header {
    height: 15vw;
  }
  .header .logo {
    width: 30vw;
  }
  .header .link .link-text {
    display: none;
  }
  .header .phone {
    margin-left: auto;
    margin-right: 2vw;
  }
  .header .login {
    margin-right: 2vw;
  }
  .header .button.primary {
    padding: 0 2vw;
    font-size: 3vw;
  }
}

.fixed .header:before {
  background: linear-gradient(to bottom, #081A38 0%, transparent 100%);
  position: absolute;
  content: "";
  height: 3vw;
  width: 100%;
  z-index: 4;
  top: 100%;
  left: 0;
}
@media screen and (max-width: 1024px) {
  .fixed .header:before {
    display: none;
  }
}

@keyframes desktop-header-fix {
  0% {
    height: 0;
  }
  100% {
    height: 60px;
  }
}
@keyframes device-header-fix {
  0% {
    height: 0;
  }
  100% {
    height: 40px;
  }
}
@keyframes mobile-header-fix {
  0% {
    height: 0;
  }
  100% {
    height: 12vw;
  }
}
@keyframes header-elements-fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.center {
  max-width: 100%;
  padding: 0 var(--interval-30);
  margin: 0 auto;
  width: 1366px;
}

.main.banner {
  background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 30%, #D2D2D2 100%);
  padding-top: calc(var(--interval-70) / 2);
  height: calc(var(--interval-100) * 4.7);
  border-bottom: 2px solid #D2D2D2;
  overflow: hidden;
}
.main.banner .center {
  position: relative;
  height: 100%;
}
.main.banner .banner-text {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.8s;
  transform: translateX(-10vw);
  animation-delay: 1800ms;
  opacity: 0;
}
.main.banner .banner-text .text {
  font-size: 58px;
  line-height: 1.2;
  color: #000000;
}
@media screen and (max-width: 1366px) {
  .main.banner .banner-text .text {
    font-size: 4.24vw;
  }
}
@media screen and (max-width: 1024px) {
  .main.banner .banner-text .text {
    font-size: 6.36vw;
  }
}
@media screen and (max-width: 640px) {
  .main.banner .banner-text .text {
    font-size: 9vw;
  }
}
.main.banner .banner-text .text.blue {
  position: absolute;
  color: #005FFF;
  left: calc(var(--interval-100) * 5.9);
  top: var(--interval-70);
}
.main.banner .banner-text .arrow {
  position: absolute;
  height: calc(var(--interval-10) * 4.2);
  width: calc(var(--interval-100) * 1.9);
  left: calc(var(--interval-100) * 3.6);
  top: calc(var(--interval-10) * 8.8);
}
.main.banner .banner-text .arrow .image {
  display: block;
  width: 100%;
}
.main.banner .banner-city {
  position: absolute;
  height: calc(var(--interval-100) * 2.67);
  right: var(--interval-30);
  left: var(--interval-30);
  bottom: 0;
}
.main.banner .banner-city .structure {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.7s;
  position: absolute;
  width: 100px;
  height: 100%;
  opacity: 0;
  bottom: 0;
}
.main.banner .banner-city .structure .image {
  animation-timing-function: linear;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.7s;
  position: absolute;
  width: 100%;
  bottom: -1px;
  left: 0;
}
.main.banner .banner-city .structure .image.image-01 {
  transform: translateX(-2px);
  animation-delay: 2200ms;
  z-index: 2;
}
.main.banner .banner-city .structure .image.image-02 {
  animation-delay: 2200ms;
  bottom: 0;
  z-index: 1;
  opacity: 0;
  left: -2px;
}
.main.banner .banner-city .structure.structure-01, .main.banner .banner-city .structure.structure-02, .main.banner .banner-city .structure.structure-03, .main.banner .banner-city .structure.structure-04, .main.banner .banner-city .structure.structure-05, .main.banner .banner-city .structure.structure-06 {
  transform: translateX(-10vw);
}
.main.banner .banner-city .structure.structure-07 {
  transform: translateY(10vw);
}
.main.banner .banner-city .structure.structure-08, .main.banner .banner-city .structure.structure-09, .main.banner .banner-city .structure.structure-10, .main.banner .banner-city .structure.structure-11, .main.banner .banner-city .structure.structure-12, .main.banner .banner-city .structure.structure-13, .main.banner .banner-city .structure.structure-14 {
  transform: translateX(10vw);
}
.main.banner .banner-city .structure.structure-01 {
  animation-delay: 1800ms;
  z-index: 3;
  width: 6.8%;
  left: 0;
}
.main.banner .banner-city .structure.structure-02 {
  animation-delay: 1600ms;
  z-index: 2;
  width: 12.6%;
  left: 1.9%;
}
.main.banner .banner-city .structure.structure-03 {
  animation-delay: 1400ms;
  z-index: 1;
  width: 11%;
  left: 11%;
}
.main.banner .banner-city .structure.structure-04 {
  animation-delay: 1200ms;
  z-index: 2;
  width: 9.9%;
  left: 17.6%;
}
.main.banner .banner-city .structure.structure-05 {
  animation-delay: 1000ms;
  z-index: 3;
  width: 11.7%;
  left: 24.8%;
}
.main.banner .banner-city .structure.structure-06 {
  z-index: 2;
  width: 9.1%;
  left: 33.2%;
}
.main.banner .banner-city .structure.structure-07 {
  animation-delay: 900ms;
  z-index: 3;
  width: 19.1%;
  left: 40%;
}
.main.banner .banner-city .structure.structure-08 {
  animation-delay: 1100ms;
  z-index: 2;
  width: 14.9%;
  left: 57%;
}
.main.banner .banner-city .structure.structure-09 {
  animation-delay: 1300ms;
  z-index: 1;
  width: 4.7%;
  left: 71.7%;
}
.main.banner .banner-city .structure.structure-10 {
  animation-delay: 1500ms;
  z-index: 2;
  width: 3%;
  left: 75.4%;
}
.main.banner .banner-city .structure.structure-11 {
  animation-delay: 1700ms;
  z-index: 3;
  width: 2.2%;
  right: 16.4%;
}
.main.banner .banner-city .structure.structure-12 {
  animation-delay: 1900ms;
  z-index: 1;
  width: 11.4%;
  right: 11.4%;
}
.main.banner .banner-city .structure.structure-13 {
  animation-delay: 2100ms;
  z-index: 2;
  width: 9.5%;
  right: 7.8%;
}
.main.banner .banner-city .structure.structure-14 {
  animation-delay: 1700ms;
  z-index: 3;
  width: 10.2%;
  right: 0;
}
.main.banner .banner-city .logo {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.5s;
  transform: translateY(100vw);
  animation-delay: 2200ms;
  position: absolute;
  bottom: calc(var(--interval-10) * 9.8);
  right: 30.2%;
  width: 1.75%;
}
.main.banner .banner-city .logo .image {
  width: 100%;
}
.main.banner .banner-city .logo .image.image-01 {
  position: relative;
  z-index: 2;
}
.main.banner .banner-city .logo .image.image-02 {
  position: absolute;
  z-index: 1;
  left: -2px;
  top: 0;
}
.main.banner .banner-city .logo .icon-pointer {
  margin-bottom: var(--interval-15);
  position: relative;
  height: var(--interval-30);
  float: right;
  width: 100%;
}
.main.banner .banner-city .logo .icon-logo {
  position: relative;
  float: right;
  width: 137%;
}
@media screen and (max-width: 1024px) {
  .main.banner {
    height: 65vw;
  }
  .main.banner .banner-text .text {
    font-size: 58px;
    line-height: 1.2;
    color: #000000;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1366px) {
  .main.banner .banner-text .text {
    font-size: 4.24vw;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .main.banner .banner-text .text {
    font-size: 6.36vw;
  }
}
@media screen and (max-width: 1024px) and (max-width: 640px) {
  .main.banner .banner-text .text {
    font-size: 9vw;
  }
}
@media screen and (max-width: 1024px) {
  .main.banner .banner-text .text.regular br {
    display: none;
  }
  .main.banner .banner-text .text.blue {
    position: static;
    text-align: right;
  }
  .main.banner .banner-text .text.black {
    text-align: center;
  }
  .main.banner .banner-text .arrow {
    position: absolute;
    top: 17.5vw;
    left: 4vw;
  }
  .main.banner .banner-text .arrow .image {
    display: block;
    width: 100%;
  }
  .main.banner .banner-city {
    right: -50vw;
    left: -50vw;
  }
}
@media screen and (max-width: 640px) {
  .main.banner {
    height: 125vw;
  }
  .main.banner .banner-text {
    padding-top: 7vw;
  }
  .main.banner .banner-text .text {
    font-size: 10vw;
  }
  .main.banner .banner-text .text.black {
    text-align: left;
  }
  .main.banner .banner-text .arrow {
    top: 56.5vw;
    left: 1vw;
    height: auto;
    width: 42vw;
  }
  .main.banner .banner-city {
    right: -65vw;
    left: -80vw;
  }
}

.animated.checked .banner-text {
  animation-name: primary-move-left;
}
.animated.checked .structure {
  opacity: 1;
}
.animated.checked .structure .image.image-01 {
  animation-name: city-white-move;
}
.animated.checked .structure .image.image-02 {
  animation-name: city-shadow-fade;
}
.animated.checked .structure.structure-01, .animated.checked .structure.structure-02, .animated.checked .structure.structure-03, .animated.checked .structure.structure-04, .animated.checked .structure.structure-05 {
  animation-name: primary-move-left;
}
.animated.checked .structure.structure-06 {
  animation-name: primary-move-up;
}
.animated.checked .structure.structure-07, .animated.checked .structure.structure-08, .animated.checked .structure.structure-09, .animated.checked .structure.structure-10, .animated.checked .structure.structure-11, .animated.checked .structure.structure-12, .animated.checked .structure.structure-13, .animated.checked .structure.structure-14 {
  animation-name: primary-move-right;
}
.animated.checked .logo {
  animation-name: primary-move-up;
}

.block-banner {
  width: calc(var(--interval-100) * 6.4);
  margin-top: var(--interval-30);
  position: relative;
}
.block-banner + * {
  margin-top: var(--interval-40);
}
.block-banner .banner-image {
  border-radius: var(--interval-15);
  overflow: hidden;
}
.block-banner .banner-image .image {
  display: block;
  width: 100%;
}
.block-banner .banner-content {
  padding: var(--interval-40) var(--interval-75);
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}
.block-banner .banner-content .image {
  margin-bottom: var(--interval-30);
  display: block;
}
.block-banner .banner-content .image.logo {
  width: 100%;
}
.block-banner .banner-content .image.arrow {
  margin-left: -20%;
  width: 145%;
}
.block-banner .banner-content .text {
  font-size: 22px;
  color: #FFFFFF;
}
@media screen and (max-width: 1366px) {
  .block-banner .banner-content .text {
    font-size: 1.61vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-banner .banner-content .text {
    font-size: 2.41vw;
  }
}
@media screen and (max-width: 640px) {
  .block-banner .banner-content .text {
    font-size: 5vw;
  }
}
@media screen and (max-width: 640px) {
  .block-banner {
    margin-right: -6vw;
    margin-left: -6vw;
    width: auto;
  }
  .block-banner .banner-image {
    border-radius: 0;
  }
  .block-banner .banner-content {
    padding: 6vw;
  }
  .block-banner .banner-content .image.arrow {
    display: none;
  }
}

@keyframes city-shadow-fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes city-white-move {
  0% {
    transform: translateX(-2px);
  }
  100% {
    transform: translateX(0);
  }
}
.desktop-hide {
  display: none;
}

@media screen and (max-width: 1024px) {
  .desktop-hide {
    display: block;
  }
  .mobile-hide {
    display: none;
  }
}
.header .menu {
  padding-right: calc(var(--interval-10) * 12);
  justify-content: center;
  align-items: center;
  display: flex;
  height: 100%;
  width: 100%;
}
.header .menu .menu-group {
  display: flex;
}
.header .menu .menu-item {
  cursor: pointer;
  height: inherit;
}
.header .menu .menu-item .item-link {
  transition: all 300ms;
  align-items: center;
  white-space: nowrap;
  font-size: 14px;
  color: #000000;
  margin: 0 var(--interval-20);
  display: flex;
  height: inherit;
}
@media screen and (max-width: 1366px) {
  .header .menu .menu-item .item-link {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 1024px) {
  .header .menu .menu-item .item-link {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) {
  .header .menu .menu-item .item-link {
    font-size: 3vw;
  }
}
.header .menu .menu-item .item-link .link-icons {
  position: relative;
  margin-left: 0.3em;
  height: 0.44em;
  width: 0.8em;
}
.header .menu .menu-item .item-link .link-icons .icon {
  transition: all 350ms;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}
.header .menu .menu-item .item-link .link-icons .icon.two {
  opacity: 0;
}
.header .menu .menu-item:hover > .item-link {
  opacity: 0.7;
}
@media screen and (max-width: 1024px) {
  .header .menu {
    transition: all 300ms;
    background: #E1EFE1;
    transform: translateY(-100%);
    position: absolute;
    padding: 10vw var(--interval-30) 10vw;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    overflow-y: auto;
    flex-wrap: wrap;
    height: 100vh;
    width: 100vw;
    z-index: 1;
    top: 0;
    left: 0;
  }
  .header .menu .menu-group {
    flex-direction: column;
    white-space: nowrap;
  }
  .header .menu .menu-item {
    animation-delay: 500ms;
    animation-timing-function: linear;
    animation-fill-mode: both;
    animation-duration: 400ms;
    margin-bottom: 3vw;
    height: auto;
    opacity: 0;
  }
  .header .menu .menu-item.checked > .item-link {
    color: #60B6AE;
  }
  .header .menu .menu-item > .item-link {
    font-size: 30px;
    color: #60B660;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1366px) {
  .header .menu .menu-item > .item-link {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .header .menu .menu-item > .item-link {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 1024px) and (max-width: 640px) {
  .header .menu .menu-item > .item-link {
    font-size: 5.5vw;
  }
}
@media screen and (max-width: 1024px) {
  .header .menu .menu-item .item-link {
    white-space: normal;
    margin: 0;
  }
  .header .menu .menu-item .item-link .link-icons {
    display: none;
  }
  .header .menu .menu-item .sub-menu {
    display: block;
  }
  .header .menu .sub-menu .sub-menu-item > .item-link {
    font-size: 22px;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1366px) {
  .header .menu .sub-menu .sub-menu-item > .item-link {
    font-size: 1.61vw;
  }
}
@media screen and (max-width: 1024px) and (max-width: 1024px) {
  .header .menu .sub-menu .sub-menu-item > .item-link {
    font-size: 2.41vw;
  }
}
@media screen and (max-width: 1024px) and (max-width: 640px) {
  .header .menu .sub-menu .sub-menu-item > .item-link {
    font-size: 5vw;
  }
}
@media screen and (max-width: 1024px) {
  .header .menu .sub-menu .sub-menu-item.title {
    display: none;
  }
  .header .menu .sub-menu .sub-menu-item.checked .item-link {
    color: #CCCCCC;
  }
}
@media screen and (min-width: 1024.0001px) {
  .header .menu .menu-item {
    position: relative;
  }
  .header .menu .menu-item .item-link .link-text {
    position: relative;
  }
  .header .menu .menu-item .item-link .link-text:after {
    transition: all 300ms;
    background: #60B660;
    position: absolute;
    content: "";
    height: 1px;
    width: 0;
    left: 50%;
    top: 110%;
  }
  .header .menu .menu-item:hover .item-link .link-text:after {
    width: 100%;
    left: 0;
  }
  .header .menu .menu-item.checked .item-link .link-text:after {
    width: 100%;
    left: 0;
  }
}
@media screen and (max-width: 640px) {
  .header .menu {
    padding: 17vw var(--interval-30) 10vw;
    top: 0;
  }
  .header .menu .menu-item {
    margin-bottom: 5vw;
  }
  .header .menu .menu-item > .item-link {
    font-size: 5.2vw;
  }
  .header .menu .menu-item .item-link {
    white-space: normal;
    padding: 0.5vw 0;
  }
  .header .menu .sub-menu .sub-menu-item > .item-link {
    font-size: 3.2vw;
  }
}
.header .desktop-menu {
  transform: translateY(-100%);
  transition: all 500ms;
  position: absolute;
  height: 100vh;
  width: 100%;
  opacity: 0;
  z-index: 2;
  top: 100%;
  left: 0;
}
.header .desktop-menu .blur {
  -webkit-backdrop-filter: blur(0);
  backdrop-filter: blur(0);
  background: transparent;
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}
.header .desktop-menu .background {
  background: #60B6AE;
}
.header .desktop-menu .center {
  align-items: flex-start;
  position: relative;
  z-index: 22;
  opacity: 0;
}
.header .desktop-menu .sub-menu-wrap {
  overflow: hidden; /* Скрываем лишнее содержимое */
  max-height: 1000px; /* Начальная высота 0 */
  transition: max-height 0.3s ease; /* Плавный переход для max-height */
  padding: 40px 0 100px;
  min-height: 400px;
  width: 100%;
}
.header .desktop-menu .sub-menu-item {
  padding-bottom: var(--interval-5);
}
.header .desktop-menu .sub-menu-item .item-link {
  color: #FFFFFF;
}
.header .desktop-menu .sub-menu-item.checked .item-link {
  color: #CCCCCC;
}
.header .desktop-menu .sub-menu-item.title {
  padding-bottom: var(--interval-10);
}
.header .desktop-menu .sub-menu-item.title .item-link {
  color: #60B6AE;
}
.header .desktop-menu .sub-menu-item:hover .item-link {
  color: #CCCCCC;
}
.header .desktop-menu .sub-menu-item:hover.title .item-link {
  color: #CCCCCC;
}
.header.menu-active .desktop-menu {
  transform: translateY(0);
  opacity: 1;
}
.header.menu-active .desktop-menu .center {
  transition: all 300ms 500ms;
  opacity: 1;
}
.header.menu-active .desktop-menu .blur {
  transition: all 300ms 500ms;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  background: rgba(0, 0, 0, 0.5019607843);
}

.button.mobile {
  position: absolute;
  overflow: hidden;
  display: none;
  height: 3.5vw;
  width: 4vw;
  z-index: 2;
  right: 3vw;
}
.button.mobile .line {
  background: linear-gradient(90deg, #60B660 0%, #60B6AE 100%);
  transform: rotate(0) translateY(-50%);
  animation-timing-function: linear;
  animation-fill-mode: both;
  animation-duration: 400ms;
  transform-origin: 50% 10%;
  border-radius: 1vw;
  position: absolute;
  height: 0.5vw;
  width: 100%;
  top: 50%;
  left: 0;
}
.button.mobile .line.line-01 {
  margin-top: -35%;
}
.button.mobile .line.line-02 {
  transition: all 100ms;
}
.button.mobile .line.line-03 {
  margin-top: 35%;
}
.button.mobile.checked .line.line-01 {
  animation-name: menu-button-line-01;
}
.button.mobile.checked .line.line-02 {
  animation-name: menu-button-line-02;
}
.button.mobile.checked .line.line-03 {
  animation-name: menu-button-line-03;
}
.button.mobile.checked ~ .menu {
  transform: translateY(0);
}
.button.mobile.checked ~ .menu .menu-item {
  animation-name: mobile-menu-fade;
  opacity: 1;
}
@media screen and (max-width: 1024px) {
  .button.mobile {
    display: block;
  }
}
@media screen and (max-width: 640px) {
  .button.mobile {
    height: 8vw;
    width: 8vw;
    right: 6vw;
  }
  .button.mobile .line {
    border-radius: 2vw;
    height: 1vw;
  }
}

@keyframes menu-button-line-01 {
  0% {
    transform: rotate(0) translateY(-50%);
    margin-top: -35%;
  }
  50% {
    transform: rotate(0) translateY(-50%);
    margin-top: 0;
  }
  60% {
    transform: rotate(0) translateY(-50%);
    margin-top: 0;
  }
  100% {
    transform: rotate(-45deg) translateY(-50%);
    margin-top: 0;
  }
}
@keyframes menu-button-line-02 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  60% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes menu-button-line-03 {
  0% {
    transform: rotate(0) translateY(-50%);
    margin-top: 35%;
  }
  50% {
    transform: rotate(0) translateY(-50%);
    margin-top: 0;
  }
  60% {
    transform: rotate(0) translateY(-50%);
    margin-top: 0;
  }
  100% {
    transform: rotate(45deg) translateY(-50%);
    margin-top: 0;
  }
}
.block-text {
  position: relative;
  font-size: 18px;
  line-height: 1.7;
}
@media screen and (max-width: 1366px) {
  .block-text {
    font-size: 1.31vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text {
    font-size: 1.96vw;
  }
}
@media screen and (max-width: 640px) {
  .block-text {
    font-size: 4vw;
  }
}
.block-text > * {
  margin-bottom: var(--interval-30);
}
.block-text > *:last-child {
  margin-bottom: 0;
}
.block-text .title-1 {
  font-family: "Manrope-Bold";
  line-height: 1.1;
  font-size: 50px;
  color: #000000;
}
@media screen and (max-width: 1366px) {
  .block-text .title-1 {
    font-size: 3.82vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text .title-1 {
    font-size: 5.73vw;
  }
}
@media screen and (max-width: 640px) {
  .block-text .title-1 {
    font-size: 9vw;
  }
}
.block-text .title-1.full {
  max-width: 90vw;
  width: 130%;
}
.block-text .title-1 .title-text {
  vertical-align: middle;
  display: inline-block;
  margin-right: var(--interval-40);
}
.block-text .title-1 .title-icon {
  vertical-align: middle;
  display: inline-block;
  width: var(--interval-70);
}
.block-text .title-1 + .title-1, .block-text .title-1 + .title-2 {
  margin-top: calc(var(--interval-15) * -1);
}
.block-text .title-1:last-child {
  margin-bottom: calc(var(--interval-25) * -1);
}
.block-text .title-2 {
  font-family: "Manrope-Regular";
  margin-bottom: var(--interval-30);
  margin-top: var(--interval-60);
  line-height: 1.1;
  font-size: 30px;
  color: #000000;
}
@media screen and (max-width: 1366px) {
  .block-text .title-2 {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text .title-2 {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 640px) {
  .block-text .title-2 {
    font-size: 5.5vw;
  }
}
.block-text .title-3 {
  font-family: "Manrope-Bold";
  margin-top: var(--interval-40);
  line-height: 1.3;
  font-size: 26px;
}
@media screen and (max-width: 1366px) {
  .block-text .title-3 {
    font-size: 1.9vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text .title-3 {
    font-size: 2.85vw;
  }
}
@media screen and (max-width: 640px) {
  .block-text .title-3 {
    font-size: 5vw;
  }
}
.block-text .intro {
  font-size: 25px;
  color: #60B660;
}
@media screen and (max-width: 1366px) {
  .block-text .intro {
    font-size: 1.83vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text .intro {
    font-size: 2.74vw;
  }
}
@media screen and (max-width: 640px) {
  .block-text .intro {
    font-size: 5vw;
  }
}
.block-text h2 {
  font-family: "Manrope-Bold";
  margin-bottom: var(--interval-10);
  font-size: 26px;
}
@media screen and (max-width: 1366px) {
  .block-text h2 {
    font-size: 1.9vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text h2 {
    font-size: 2.85vw;
  }
}
@media screen and (max-width: 640px) {
  .block-text h2 {
    font-size: 5vw;
  }
}
.block-text h3 {
  font-family: "Manrope-Bold";
  margin-bottom: var(--interval-10);
  font-size: 22px;
}
@media screen and (max-width: 1366px) {
  .block-text h3 {
    font-size: 1.61vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text h3 {
    font-size: 2.41vw;
  }
}
@media screen and (max-width: 640px) {
  .block-text h3 {
    font-size: 5vw;
  }
}
.block-text p {
  margin-bottom: var(--interval-30);
}
.block-text p a {
  text-decoration: underline;
  transition: all 250ms;
  color: #005FFF;
}
.block-text p a:hover {
  opacity: 0.6;
}
.block-text p + .download {
  margin-top: calc(var(--interval-15) * -1);
}
.block-text p > img {
  max-width: 100%;
  display: block;
  width: auto;
}
.block-text ol {
  list-style: none;
  padding-left: 0;
  counter-reset: numeric-list;
}
.block-text ol > li {
  padding-left: var(--interval-40);
  margin-bottom: var(--interval-10);
  position: relative;
}
.block-text ol > li:before {
  counter-increment: numeric-list;
  content: counter(numeric-list) ". ";
  margin-bottom: var(--interval-10);
  position: absolute;
  text-align: center;
  color: #005FFF;
  width: 1.5em;
  left: 0.2em;
}
.block-text ol ul, .block-text ol ol {
  margin-top: var(--interval-10);
}
.block-text ul {
  list-style: none;
}
.block-text ul li {
  padding-left: var(--interval-40);
  margin-bottom: var(--interval-10);
  position: relative;
}
.block-text ul li:before {
  border-radius: 100%;
  border: 0.1em solid #005FFF;
  box-sizing: border-box;
  position: absolute;
  background: white;
  height: 0.4em;
  width: 0.4em;
  content: "";
  top: 0.5em;
  left: 1em;
}
.block-text ul ul, .block-text ul ol {
  margin-top: var(--interval-10);
}
.block-text .table {
  margin-bottom: var(--interval-30);
  flex-wrap: wrap;
  display: flex;
}
.block-text .table .table-row {
  border-bottom: 1px solid #CCCCCC;
  justify-content: space-between;
  min-height: var(--interval-50);
  padding: var(--interval-10) 0;
  align-items: center;
  display: flex;
  width: 100%;
}
.block-text .table .table-cell.title {
  font-family: "Manrope-Bold";
  font-size: 12px;
  color: #000000;
}
@media screen and (max-width: 1366px) {
  .block-text .table .table-cell.title {
    font-size: 0.87vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text .table .table-cell.title {
    font-size: 1.3vw;
  }
}
@media screen and (max-width: 640px) {
  .block-text .table .table-cell.title {
    font-size: 2.5vw;
  }
}
.block-text .table .table-cell:first-child {
  padding-right: var(--interval-30);
  text-align: left;
}
.block-text .table .table-cell:last-child {
  text-align: right;
}
.block-text .table.details .table-row {
  justify-content: flex-start;
}
.block-text .table.details .table-cell:first-child {
  width: 28%;
}
.block-text .table.details .table-cell:last-child {
  text-align: left;
  width: 72%;
}
.block-text .links .link-row + .link-row {
  margin-top: var(--interval-5);
}
.block-text .links .link {
  align-items: center;
  display: inline-flex;
  color: inherit;
}
.block-text .links .link .link-icons {
  position: relative;
  height: 17px;
  width: 17px;
}
.block-text .links .link .link-icons .icon {
  transform: translate(-50%, -50%);
  position: absolute;
  max-height: 100%;
  max-width: 100%;
  width: 100%;
  left: 50%;
  top: 50%;
}
.block-text .links .link .link-text {
  padding-left: 7px;
}
@media screen and (max-width: 1680px) {
  .block-text .title-1 {
    width: 65vw;
  }
  .block-text .title-2 {
    width: 65vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-text .title-1 {
    font-size: 6vw;
    width: 70%;
  }
  .block-text .title-1 .title-text {
    margin-right: 0;
  }
  .block-text .title-1 br {
    display: none;
  }
  .block-text .title-2 {
    font-size: 4vw;
    width: 70%;
  }
  .block-text .title-2 br {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .block-text .title-1 {
    font-size: 9vw;
    width: 100%;
  }
  .block-text .title-1 .title-icon {
    width: 16vw;
  }
  .block-text .title-1 .title-text {
    margin-right: 0;
  }
  .block-text .title-2 {
    font-size: 7vw;
    width: 100%;
  }
  .block-text ol > li:before {
    left: 0;
  }
  .block-text ul li:before {
    left: 0.5em;
  }
  .block-text .table.details .table-row {
    flex-wrap: wrap;
  }
  .block-text .table.details .table-cell:first-child {
    width: 100%;
  }
  .block-text .table.details .table-cell:last-child {
    text-align: left;
    width: 100%;
  }
}

.block-nav {
  position: absolute;
  top: var(--interval-25);
}
.block-nav .link .icon {
  width: calc(var(--interval-10) * 3.4);
}
.block-nav .link .text {
  padding-left: var(--interval-10);
  font-size: 14px;
  color: #333333;
}
@media screen and (max-width: 1366px) {
  .block-nav .link .text {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-nav .link .text {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) {
  .block-nav .link .text {
    font-size: 3vw;
  }
}

.download {
  margin-top: var(--interval-10);
}
.download .download-row.download-row {
  margin-top: var(--interval-10);
}
.download .download-link {
  transition: all 300ms;
  display: inline-flex;
  align-items: center;
  color: inherit;
}
.download .download-link .link-icon {
  width: var(--interval-25);
}
.download .download-link .link-text {
  padding-left: var(--interval-10);
  font-size: 16px;
}
@media screen and (max-width: 1366px) {
  .download .download-link .link-text {
    font-size: 1.17vw;
  }
}
@media screen and (max-width: 1024px) {
  .download .download-link .link-text {
    font-size: 1.75vw;
  }
}
@media screen and (max-width: 640px) {
  .download .download-link .link-text {
    font-size: 4vw;
  }
}
.download .download-link:hover {
  opacity: 0.5;
}

.block-socials {
  flex-wrap: wrap;
  display: flex;
}
.block-socials .socials-item {
  width: 33.33%;
}
@media screen and (max-width: 1024px) {
  .block-socials .socials-item {
    padding-right: 4vw;
    width: auto;
  }
}

.socials-item {
  margin-bottom: var(--interval-10);
}
.socials-item .link .link-icons {
  height: calc(var(--interval-10) * 3.8);
  width: calc(var(--interval-10) * 3.8);
}
.socials-item .link .link-text {
  padding-left: var(--interval-25);
  padding-top: var(--interval-15);
  color: #333333;
}
.socials-item .link .link-text .large {
  font-size: 25px;
}
@media screen and (max-width: 1366px) {
  .socials-item .link .link-text .large {
    font-size: 1.83vw;
  }
}
@media screen and (max-width: 1024px) {
  .socials-item .link .link-text .large {
    font-size: 2.74vw;
  }
}
@media screen and (max-width: 640px) {
  .socials-item .link .link-text .large {
    font-size: 5vw;
  }
}
.socials-item .link .link-text .small {
  font-size: 13px;
}
@media screen and (max-width: 1366px) {
  .socials-item .link .link-text .small {
    font-size: 0.95vw;
  }
}
@media screen and (max-width: 1024px) {
  .socials-item .link .link-text .small {
    font-size: 1.42vw;
  }
}
@media screen and (max-width: 640px) {
  .socials-item .link .link-text .small {
    font-size: 2.5vw;
  }
}
@media screen and (max-width: 1024px) {
  .socials-item {
    min-width: 50%;
  }
  .socials-item:empty {
    display: none;
  }
  .socials-item .link .link-text .small {
    font-size: 2vw;
  }
}
@media screen and (max-width: 640px) {
  .socials-item {
    width: 100%;
  }
  .socials-item .link .link-text {
    max-width: 60vw;
  }
  .socials-item .link .link-text .small {
    font-size: 4vw;
  }
}

.page-image {
  position: relative;
  width: 100%;
}
.page-image .image {
  top: var(--interval-40);
  position: absolute;
  right: 0;
}
.page-image.about .image {
  right: calc(var(--interval-95) * -1);
  width: calc(var(--interval-100) * 4.15);
}
.page-image.co-location .image {
  width: calc(var(--interval-100) * 3.4);
}
.page-image.rent .image {
  width: calc(var(--interval-100) * 2.7);
}
.page-image.rack .image {
  width: calc(var(--interval-100) * 2.2);
}
.page-image.cloud .image {
  width: calc(var(--interval-100) * 3.4);
}
.page-image.network .image {
  width: calc(var(--interval-100) * 3);
}
.page-image.backup .image {
  width: calc(var(--interval-100) * 3.75);
}
.page-image.security .image {
  width: calc(var(--interval-100) * 3);
}
.page-image.company .image {
  width: calc(var(--interval-100) * 2.8);
}
.page-image.docs .image {
  width: calc(var(--interval-100) * 2.5);
}
.page-image.faq .image {
  width: calc(var(--interval-100) * 3.2);
}
@media screen and (max-width: 1024px) {
  .page-image .image {
    width: 25vw !important;
    top: 0 !important;
    right: 0;
  }
  .page-image.about .image {
    right: 4vw;
    width: 22vw !important;
  }
}
@media screen and (max-width: 640px) {
  .page-image .image {
    width: 50vw !important;
    margin: 0 auto 6vw;
    max-height: 50vw;
    position: static;
    display: block;
  }
  .page-image.about .image {
    width: 50vw !important;
  }
}

.page-banner .page-image .image {
  transform: translateX(50%);
}
@media screen and (max-width: 1680px) {
  .page-banner .page-image .image {
    transform: translateX(0);
  }
}

.arrows-list {
  font-size: 16px;
}
@media screen and (max-width: 1366px) {
  .arrows-list {
    font-size: 1.17vw;
  }
}
@media screen and (max-width: 1024px) {
  .arrows-list {
    font-size: 1.75vw;
  }
}
@media screen and (max-width: 640px) {
  .arrows-list {
    font-size: 4vw;
  }
}
.arrows-list .row {
  margin-top: var(--interval-10);
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.arrows-list .row .row-icon {
  margin-right: var(--interval-10);
  width: var(--interval-25);
}
.arrows-list .row .row-text {
  width: calc(100% - var(--interval-10));
}

.block-cards {
  height: calc(var(--interval-100) * 4);
  position: relative;
}
.block-cards .box.card {
  position: absolute;
}
.block-cards .box.card.box-01 {
  left: 0;
  top: 0;
}
.block-cards .box.card.box-02 {
  left: calc(var(--interval-100) * 3);
  top: calc(var(--interval-100) * 1.7);
  z-index: 2;
}
.block-cards .box.card.box-03 {
  left: calc(var(--interval-100) * 6.1);
  top: calc(var(--interval-10) * -1);
}
.block-cards .box.card.box-04 {
  left: calc(var(--interval-100) * 9.1);
  top: calc(var(--interval-100) * 1.2);
}
@media screen and (max-width: 1024px) {
  .block-cards {
    height: 73vw;
  }
  .block-cards .box.card {
    position: absolute;
  }
  .block-cards .box.card.box-01 {
    left: 3vw;
    top: 0;
  }
  .block-cards .box.card.box-02 {
    left: 45vw;
    top: 15vw;
    z-index: 2;
  }
  .block-cards .box.card.box-03 {
    left: 3vw;
    top: 32vw;
    z-index: 3;
  }
  .block-cards .box.card.box-04 {
    left: 45vw;
    top: 47vw;
  }
}
@media screen and (max-width: 640px) {
  .block-cards {
    height: 153vw;
  }
  .block-cards .box.card {
    position: absolute;
  }
  .block-cards .box.card.box-01 {
    left: 0;
    top: 0;
  }
  .block-cards .box.card.box-02 {
    left: 8vw;
    top: 35vw;
    z-index: 2;
  }
  .block-cards .box.card.box-03 {
    left: 0;
    top: 71vw;
    z-index: 3;
  }
  .block-cards .box.card.box-04 {
    left: 8vw;
    top: 107vw;
  }
}

.popup-wrapper {
  background: transparent;
  justify-content: center;
  transition: all 100ms;
  align-items: center;
  overflow-y: auto;
  position: fixed;
  display: flex;
  padding: var(--interval-30);
  height: 100vh;
  width: 100vw;
  z-index: -1;
  opacity: 0;
  left: 0;
  top: 0;
}
.popup-wrapper.active {
  backdrop-filter: blur(3px);
  background: rgba(0, 0, 0, 0.5);
  z-index: 200;
  opacity: 1;
}
.popup-wrapper.active .popup.primary {
  transform: scale(1);
  opacity: 1;
}
.popup-wrapper.active .popup.gallery {
  transform: scale(1);
  opacity: 1;
}
.popup-wrapper .popup.primary {
  transition: all 300ms 100ms;
  transform: scale(0.5);
  border-radius: var(--interval-20);
  background: #FFFFFF;
  position: relative;
  max-width: 100%;
  color: #333333;
  padding: var(--interval-80);
  width: calc(var(--interval-100) * 6.8);
  opacity: 0;
  z-index: 2;
}
.popup-wrapper .popup.primary .popup-title {
  font-family: "Manrope-Bold";
  margin-bottom: var(--interval-10);
  font-size: 26px;
}
@media screen and (max-width: 1366px) {
  .popup-wrapper .popup.primary .popup-title {
    font-size: 1.9vw;
  }
}
@media screen and (max-width: 1024px) {
  .popup-wrapper .popup.primary .popup-title {
    font-size: 2.85vw;
  }
}
@media screen and (max-width: 640px) {
  .popup-wrapper .popup.primary .popup-title {
    font-size: 5vw;
  }
}
.popup-wrapper .popup.primary .popup-close {
  justify-content: center;
  align-items: center;
  position: absolute;
  cursor: pointer;
  display: flex;
  z-index: 10;
  height: var(--interval-30);
  width: var(--interval-30);
  right: var(--interval-20);
  top: var(--interval-20);
}
.popup-wrapper .popup.primary .popup-close .icon {
  transition: all 300ms;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}
.popup-wrapper .popup.primary .popup-close .icon.icon-02 {
  opacity: 0;
}
.popup-wrapper .popup.primary .popup-close:hover .icon.icon-01 {
  opacity: 0;
}
.popup-wrapper .popup.primary .popup-close:hover .icon.icon-02 {
  opacity: 1;
}
.popup-wrapper .popup.primary .form-wrapper {
  padding: var(--interval-60);
  width: 100%;
}
.popup-wrapper .popup.primary .form-wrapper .form {
  background-color: #FFFFFF;
  padding: 0;
}
.popup-wrapper .popup.primary .form-wrapper .form .product {
  margin-bottom: var(--interval-20);
  font-size: 30px;
  color: #005FFF;
}
@media screen and (max-width: 1366px) {
  .popup-wrapper .popup.primary .form-wrapper .form .product {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) {
  .popup-wrapper .popup.primary .form-wrapper .form .product {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 640px) {
  .popup-wrapper .popup.primary .form-wrapper .form .product {
    font-size: 5.5vw;
  }
}
@media screen and (max-width: 640px) {
  .popup-wrapper .popup.primary .form-wrapper {
    padding: 6vw;
  }
}
.popup-wrapper .popup.primary .form-wrapper .message.sent {
  padding-top: calc(var(--interval-100) * 2);
}
.popup-wrapper .popup.primary .form-wrapper .message .text.green {
  font-size: 30px;
}
@media screen and (max-width: 1366px) {
  .popup-wrapper .popup.primary .form-wrapper .message .text.green {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) {
  .popup-wrapper .popup.primary .form-wrapper .message .text.green {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 640px) {
  .popup-wrapper .popup.primary .form-wrapper .message .text.green {
    font-size: 5.5vw;
  }
}
.popup-wrapper .popup.primary .form-wrapper .message .text.grey {
  font-size: 20px;
}
@media screen and (max-width: 1366px) {
  .popup-wrapper .popup.primary .form-wrapper .message .text.grey {
    font-size: 1.46vw;
  }
}
@media screen and (max-width: 1024px) {
  .popup-wrapper .popup.primary .form-wrapper .message .text.grey {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 640px) {
  .popup-wrapper .popup.primary .form-wrapper .message .text.grey {
    font-size: 4.5vw;
  }
}
@media screen and (max-width: 640px) {
  .popup-wrapper .popup.primary .form-wrapper .message .text.green {
    margin-bottom: 2vw;
    font-size: 9vw;
  }
  .popup-wrapper .popup.primary .form-wrapper .message .text.grey {
    font-size: 6vw;
  }
}

.main.content {
  padding: 0;
}

.block-map {
  margin-bottom: var(--interval-60);
  margin-top: var(--interval-20);
  align-items: flex-start;
  display: flex;
}
.block-map .map {
  margin-right: var(--interval-20);
  border-radius: var(--interval-15);
  position: relative;
  overflow: hidden;
  padding-top: 35%;
  width: 49%;
}
.block-map .map iframe {
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}
.block-map .info {
  width: 38%;
}
.block-map .info .item {
  margin-bottom: var(--interval-30);
  align-items: flex-start;
  display: flex;
}
.block-map .info .item .item-icon {
  width: var(--interval-30);
}
.block-map .info .item .item-icon .icon {
  display: block;
  width: 100%;
}
.block-map .info .item .item-text {
  padding-left: var(--interval-20);
  width: calc(100% - var(--interval-30));
}
.block-map .info .item .item-text .title {
  font-family: "Manrope-Bold";
}
@media screen and (max-width: 1024px) {
  .block-map {
    flex-wrap: wrap;
  }
  .block-map .map {
    padding-top: 50%;
    width: 100%;
  }
  .block-map .info {
    padding-top: 4vw;
    column-gap: 4vw;
    display: flex;
    width: 100%;
  }
  .block-map .info .item {
    flex: 1;
  }
}
@media screen and (max-width: 640px) {
  .block-map {
    margin: 6vw 0;
  }
  .block-map .map {
    padding-top: 100%;
    margin-right: 0;
  }
  .block-map .info {
    padding-top: 6vw;
    flex-wrap: wrap;
  }
  .block-map .info .item {
    width: 100%;
    flex: none;
  }
}

.price {
  align-items: flex-end;
  display: inline-flex;
}
.price .price-number {
  font-family: "Manrope-Bold";
  font-size: 58px;
  line-height: 1;
}
@media screen and (max-width: 1366px) {
  .price .price-number {
    font-size: 4.24vw;
  }
}
@media screen and (max-width: 1024px) {
  .price .price-number {
    font-size: 6.36vw;
  }
}
@media screen and (max-width: 640px) {
  .price .price-number {
    font-size: 9vw;
  }
}
.price .price-value {
  margin-left: 10px;
  line-height: 1.5;
  font-size: 22px;
}
@media screen and (max-width: 1366px) {
  .price .price-value {
    font-size: 1.61vw;
  }
}
@media screen and (max-width: 1024px) {
  .price .price-value {
    font-size: 2.41vw;
  }
}
@media screen and (max-width: 640px) {
  .price .price-value {
    font-size: 5vw;
  }
}

.box {
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  flex-direction: column;
  font-size: 17px;
  position: relative;
  display: flex;
}
@media screen and (max-width: 1366px) {
  .box {
    font-size: 1.24vw;
  }
}
@media screen and (max-width: 1024px) {
  .box {
    font-size: 1.86vw;
  }
}
@media screen and (max-width: 640px) {
  .box {
    font-size: 4vw;
  }
}
.box .left {
  justify-content: flex-start;
}
.box .left .box-icon .icon {
  transform: translate(0, -50%);
  left: 0;
}
.box .right {
  justify-content: flex-end;
}
.box .right .box-icon .icon {
  transform: translate(0, -50%);
  left: auto;
  right: 0;
}
.box .space {
  justify-content: space-between;
}
.box .box-align {
  margin-bottom: auto;
  position: relative;
  z-index: 2;
}
.box .box-title {
  margin-bottom: var(--interval-10);
  font-family: "Manrope-Bold";
  line-height: 1.2;
  color: #000000;
}
.box .box-title.large {
  font-size: 58px;
}
@media screen and (max-width: 1366px) {
  .box .box-title.large {
    font-size: 4.39vw;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-title.large {
    font-size: 6.58vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-title.large {
    font-size: 11vw;
  }
}
.box .box-title.medium {
  font-size: 50px;
}
@media screen and (max-width: 1366px) {
  .box .box-title.medium {
    font-size: 3.82vw;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-title.medium {
    font-size: 5.73vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-title.medium {
    font-size: 9vw;
  }
}
.box .box-title.small {
  font-size: 30px;
}
@media screen and (max-width: 1366px) {
  .box .box-title.small {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-title.small {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-title.small {
    font-size: 5.5vw;
  }
}
.box .box-text {
  color: #666666;
}
.box .box-text.large {
  font-size: 25px;
}
@media screen and (max-width: 1366px) {
  .box .box-text.large {
    font-size: 1.83vw;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-text.large {
    font-size: 2.74vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-text.large {
    font-size: 5vw;
  }
}
.box .box-text.medium {
  font-size: 22px;
}
@media screen and (max-width: 1366px) {
  .box .box-text.medium {
    font-size: 1.61vw;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-text.medium {
    font-size: 2.41vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-text.medium {
    font-size: 5vw;
  }
}
.box .box-text.small {
  font-size: 17px;
}
@media screen and (max-width: 1366px) {
  .box .box-text.small {
    font-size: 1.24vw;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-text.small {
    font-size: 1.86vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-text.small {
    font-size: 4vw;
  }
}
.box .box-icon {
  position: relative;
}
.box .box-icon .icon {
  transform: translate(-50%, -50%);
  position: absolute;
  max-width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
}
.box .box-icon.large {
  height: calc(var(--interval-100) * 2);
  width: calc(var(--interval-100) * 2.5);
}
.box .box-icon.medium {
  height: calc(var(--interval-100) * 1.3);
  width: calc(var(--interval-100) * 1.3);
}
.box .box-icon.small {
  margin-bottom: calc(var(--interval-10) * -1);
  margin-right: calc(var(--interval-20) * -1);
  height: var(--interval-60);
  width: var(--interval-80);
}
.box .box-arrow {
  position: absolute;
  height: calc(var(--interval-10) * 2.3);
  width: calc(var(--interval-10) * 3.4);
}
.box .box-arrow .icon {
  display: block;
  width: 100%;
}
.box .box-arrow .text {
  transform: translateY(-50%);
  position: absolute;
  color: #333333;
  left: 120%;
  top: 50%;
}
.box .box-table {
  width: 100%;
}
.box .box-table .table {
  flex-wrap: wrap;
  display: flex;
  width: 100%;
}
.box .box-table .table .table-row {
  border-bottom: 1px solid #CCCCCC;
  justify-content: space-between;
  min-height: var(--interval-30);
  padding: var(--interval-10) 0;
  align-items: center;
  display: flex;
  width: 100%;
}
.box .box-table .table .table-cell {
  font-size: 14px;
  color: #666666;
}
@media screen and (max-width: 1366px) {
  .box .box-table .table .table-cell {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-table .table .table-cell {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-table .table .table-cell {
    font-size: 3vw;
  }
}
.box .box-table .table .table-cell.title {
  font-family: "Manrope-Bold";
  font-size: 12px;
  color: #000000;
}
@media screen and (max-width: 1366px) {
  .box .box-table .table .table-cell.title {
    font-size: 0.87vw;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-table .table .table-cell.title {
    font-size: 1.3vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-table .table .table-cell.title {
    font-size: 2.5vw;
  }
}
.box .box-table .table .table-cell:first-child {
  padding-right: var(--interval-30);
  text-align: left;
}
.box .box-table .table .table-cell:last-child {
  text-align: right;
}
.box .box-buttons {
  justify-content: flex-start;
  margin-top: var(--interval-30);
  align-items: center;
  display: flex;
  gap: 1em;
}
.box .box-top {
  margin-bottom: var(--interval-20);
  position: relative;
  display: flex;
  z-index: 2;
}
.box .box-bottom {
  margin-top: var(--interval-70);
  position: relative;
  display: flex;
  z-index: 2;
}
.box .box-item {
  margin-bottom: var(--interval-30);
  flex-direction: column;
  position: relative;
  display: flex;
  z-index: 2;
}
.box .box-item:last-child {
  margin-bottom: 0;
}
.box .box-item .box-align {
  align-items: center;
  display: flex;
}
.box .box-item .box-title {
  padding-left: var(--interval-30);
  width: calc(var(--interval-100) + 1.15);
  margin-bottom: 0;
}
.box .box-item .box-text {
  padding-left: calc(var(--interval-100) * 1.15);
}
.box .box-item .box-icon {
  height: var(--interval-85);
  width: var(--interval-85);
}
.box.padding-70 {
  padding: var(--interval-50) var(--interval-70);
}
.box.padding-50 {
  padding: var(--interval-40) var(--interval-50);
}
.box.line-height .box-text {
  font-size: 19px;
  line-height: 1.6;
}
@media screen and (max-width: 1366px) {
  .box.line-height .box-text {
    font-size: 1.35vw;
  }
}
@media screen and (max-width: 1024px) {
  .box.line-height .box-text {
    font-size: 1.96vw;
  }
}
@media screen and (max-width: 640px) {
  .box.line-height .box-text {
    font-size: 4vw;
  }
}
.box.corner {
  box-shadow: 3px 4px 3px -2px rgba(0, 0, 0, 0.1);
}
.box.corner .corner {
  position: absolute;
  overflow: hidden;
  height: 100%;
  width: 100%;
  z-index: 1;
  left: 0;
  top: 0;
}
.box.corner .corner:before {
  transform-origin: 0 100%;
  transform: rotate(-45deg);
  position: absolute;
  height: 2000px;
  width: 2000px;
  content: "";
  left: 845px;
  top: 0;
}
.box.white .corner:before {
  background: #FFFFFF;
}
.box.green-01 .corner:before {
  background: #60B660;
}
.box.green-01 .box-title {
  color: #FFFFFF;
}
.box.green-01 .box-text {
  color: #FFFFFF;
}
.box.green-03 .corner:before {
  background: #E1EFE1;
}
.box.text {
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1);
  margin-bottom: var(--interval-60);
  padding-bottom: calc(var(--interval-100) * 1.2);
  padding-right: calc(var(--interval-100) * 1.8);
  padding-left: calc(var(--interval-100) * 1.2);
  padding-top: var(--interval-90);
  background: #FFFFFF;
  color: #666666;
}
@media screen and (min-width: 1024.01px) {
  .box .box-icon.animated.checked.dev .icon {
    animation-name: primary-fade;
  }
  .box .box-icon.animated.checked.dev .icon.icon-01 {
    animation-delay: 1000ms;
  }
  .box .box-icon.animated.checked.dev .icon.icon-02 {
    animation-delay: 1200ms;
  }
  .box .box-icon.animated.checked.dev .icon.icon-03 {
    animation-delay: 1400ms;
  }
  .box .box-icon.animated.checked.int .icon.icon-01 {
    animation-name: int-icon-01;
    animation-duration: 1000ms;
    animation-delay: 1000ms;
    transform-origin: 50% 50%;
    top: 0;
  }
  .box .box-icon.animated.checked.int .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 2000ms;
    top: 0;
  }
  .box .box-icon.animated.checked.int .icon.icon-03 {
    animation-name: int-icon-03;
    animation-duration: 600ms;
    transform-origin: 50% 50%;
    animation-delay: 2500ms;
    top: 0;
  }
  .box .box-icon.animated.checked.expert .icon.icon-01 {
    animation-name: int-icon-01;
    animation-duration: 1000ms;
    animation-delay: 1000ms;
    transform-origin: 50% 50%;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.expert .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 2000ms;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.full .icon.icon-01 {
    animation-name: primary-fade-rotate-revert;
    animation-duration: 1000ms;
    animation-delay: 1000ms;
    transform-origin: 50% 56%;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.full .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 2000ms;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.sec .icon.icon-01 {
    animation-name: primary-fade-scale;
    animation-duration: 1000ms;
    animation-delay: 1000ms;
    transform-origin: 0 100%;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.sec .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 2000ms;
    transform-origin: 100% 100%;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.supp .icon.icon-01 {
    animation-name: primary-move-right;
    animation-duration: 600ms;
    animation-delay: 1000ms;
    transform-origin: 0 100%;
    right: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.supp .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 1600ms;
    transform-origin: 100% 100%;
    right: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.supp .icon.icon-03 {
    animation-name: primary-move-left;
    animation-duration: 600ms;
    transform-origin: 50% 50%;
    animation-delay: 2000ms;
    right: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.ui {
    overflow: hidden;
  }
  .box .box-icon.animated.checked.ui .icon.icon-01 {
    animation-name: primary-move-right;
    animation-duration: 600ms;
    animation-delay: 1000ms;
    z-index: 2;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.ui .icon.icon-02 {
    animation-name: primary-move-up;
    animation-delay: 1600ms;
    z-index: 1;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.ui .icon.icon-03 {
    animation-name: primary-move-left;
    animation-delay: 2000ms;
    z-index: 2;
    left: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.host .icon.icon-01 {
    animation-name: primary-move-right;
    animation-duration: 600ms;
    animation-delay: 1000ms;
    right: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.host .icon.icon-02 {
    animation-name: primary-move-up;
    animation-delay: 1600ms;
    right: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.app .icon.icon-01 {
    animation-name: primary-move-right;
    animation-duration: 600ms;
    animation-delay: 1000ms;
    right: 0;
    top: 0;
  }
  .box .box-icon.animated.checked.app .icon.icon-02 {
    animation-name: primary-move-left;
    animation-duration: 600ms;
    animation-delay: 1000ms;
    right: 0;
    top: 0;
  }
}
@media screen and (max-width: 1024px) {
  .box .box-title.large {
    font-size: 3vw;
  }
  .box .box-title.medium {
    font-size: 3vw;
  }
  .box .box-title.small {
    font-size: 3vw;
  }
  .box .box-text.large {
    font-size: 2vw;
  }
  .box .box-text.medium {
    font-size: 2vw;
  }
  .box .box-text.small {
    font-size: 2vw;
  }
  .box .box-icon.large {
    height: 10vw;
    width: 14vw;
  }
  .box .box-icon.medium {
    height: 10vw;
    width: 10vw;
  }
  .box .box-icon.small {
    margin-bottom: 0;
    margin-right: 0;
    height: 10vw;
    width: 10vw;
  }
  .box .box-item .box-title {
    padding-left: 3vw;
    width: 70vw;
  }
  .box .box-item .box-text {
    padding-left: 13vw;
  }
  .box .box-item .box-icon {
    height: 10vw;
    width: 10vw;
  }
  .box.padding-70 {
    padding: 3vw;
  }
  .box.padding-50 {
    padding: 3vw;
  }
  .box.text {
    padding: 3vw;
  }
}
@media screen and (max-width: 640px) {
  .box .box-title.large {
    font-size: 7vw;
  }
  .box .box-title.medium {
    font-size: 7vw;
  }
  .box .box-title.small {
    font-size: 7vw;
  }
  .box .box-text.large {
    font-size: 4vw;
  }
  .box .box-text.medium {
    font-size: 4vw;
  }
  .box .box-text.small {
    font-size: 4vw;
  }
  .box .box-icon.large {
    height: 24vw;
    width: 34vw;
  }
  .box .box-icon.medium {
    height: 24vw;
    width: 24vw;
  }
  .box .box-icon.small {
    height: 24vw;
    width: 24vw;
  }
  .box .box-item {
    margin-bottom: 8vw;
  }
  .box .box-item .box-title {
    padding-left: 3vw;
    font-size: 6.5vw;
    width: 61vw;
  }
  .box .box-item .box-text {
    margin-top: 2vw;
    padding-left: 0;
  }
  .box .box-item .box-icon {
    height: 15vw;
    width: 15vw;
  }
  .box.padding-70 {
    padding: 6vw;
  }
  .box.padding-50 {
    padding: 6vw;
  }
  .box.text {
    padding: 6vw;
  }
}

.grid {
  margin-bottom: calc(var(--interval-30) * -1);
  justify-content: normal;
  align-items: stretch;
  display: flex;
}
.grid > .box {
  margin-bottom: var(--interval-20);
}
.grid > .box.slider__item {
  margin-bottom: 0;
}
.grid > .box.slider__item .box {
  margin-right: var(--interval-20);
  margin-bottom: 0;
  height: 100%;
}
.grid > .box.slider__item .box .grid {
  column-gap: 0;
}
.grid > .box.slider__item .box .grid .box {
  margin-top: 0;
}
.grid > .box.slider__item .box .box {
  height: auto;
}
.grid.grid-wrap {
  margin-left: calc(var(--interval-30) * -1);
  column-gap: normal;
  flex-wrap: wrap;
}
.grid.grid-wrap > .grid {
  margin-left: 0;
}
.grid.grid-wrap > .box {
  margin-bottom: var(--interval-30);
  margin-left: var(--interval-30);
}
.grid.grid-wrap > .box .box {
  margin-bottom: 0;
  margin-left: 0;
  width: 100%;
}
.grid.grid-wrap > .box .box + .box {
  margin-top: var(--interval-30);
}
.grid.grid-wrap.wrap-2 > .box {
  width: calc(50% - var(--interval-30));
}
.grid.grid-wrap.wrap-2 > .box.full {
  width: 100%;
}
.grid.grid-wrap.wrap-3 > .box {
  width: calc(33.33% - var(--interval-30));
}
.grid + .grid {
  margin-top: var(--interval-30);
}
.grid.mosaic {
  position: relative;
}
.grid.mosaic > .box.slider__item .box {
  height: auto;
}
@media screen and (min-width: 1024.01px) {
  .grid.display-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: var(--interval-30);
    grid-row-gap: var(--interval-30);
  }
  .grid.display-grid .item-01 {
    grid-area: 1/1/3/3;
  }
  .grid.display-grid .item-02 {
    grid-area: 1/3/2/4;
  }
  .grid.display-grid .item-03 {
    grid-area: 2/3/3/4;
  }
  .grid.display-grid .box.slider__item .box {
    margin-right: 0;
  }
  .grid.display-grid .box .box-bottom {
    margin-top: var(--interval-15);
  }
}
@media screen and (max-width: 1024px) {
  .grid {
    margin-bottom: 0;
  }
  .grid .box.slider__item {
    width: 40vw;
  }
  .grid .box.slider__item .box .grid .box + .box {
    margin-top: var(--interval-20);
  }
  .grid .box.slider__item.slider__item_active .box-icon.dev .icon {
    animation-name: primary-fade;
  }
  .grid .box.slider__item.slider__item_active .box-icon.dev .icon.icon-01 {
    animation-delay: 400ms;
  }
  .grid .box.slider__item.slider__item_active .box-icon.dev .icon.icon-02 {
    animation-delay: 600ms;
  }
  .grid .box.slider__item.slider__item_active .box-icon.dev .icon.icon-03 {
    animation-delay: 800ms;
  }
  .grid .box.slider__item.slider__item_active .box-icon.int .icon.icon-01 {
    animation-name: int-icon-01;
    animation-delay: 400ms;
    transform-origin: 50% 50%;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.int .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 600ms;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.int .icon.icon-03 {
    animation-name: int-icon-03;
    transform-origin: 50% 50%;
    animation-delay: 800ms;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.expert .icon.icon-01 {
    animation-name: int-icon-01;
    animation-delay: 400ms;
    transform-origin: 50% 50%;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.expert .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 600ms;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.full .icon.icon-01 {
    animation-name: primary-fade-rotate-revert;
    animation-delay: 400ms;
    transform-origin: 50% 56%;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.full .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 600ms;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.sec .icon.icon-01 {
    animation-name: primary-fade-scale;
    animation-delay: 400ms;
    transform-origin: 0 100%;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.sec .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 600ms;
    transform-origin: 100% 100%;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.supp .icon.icon-01 {
    animation-name: primary-move-right;
    animation-delay: 400ms;
    transform-origin: 0 100%;
    right: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.supp .icon.icon-02 {
    animation-name: primary-fade-scale;
    animation-delay: 600ms;
    transform-origin: 100% 100%;
    right: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.supp .icon.icon-03 {
    animation-name: primary-move-left;
    transform-origin: 50% 50%;
    animation-delay: 800ms;
    right: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.ui .icon.icon-01 {
    animation-name: primary-move-right;
    animation-delay: 400ms;
    z-index: 2;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.ui .icon.icon-02 {
    animation-name: primary-move-up;
    animation-delay: 600ms;
    z-index: 1;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.ui .icon.icon-03 {
    animation-name: primary-move-left;
    animation-delay: 800ms;
    z-index: 2;
    left: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.host .icon.icon-01 {
    animation-name: primary-move-right;
    animation-delay: 400ms;
    right: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.host .icon.icon-02 {
    animation-name: primary-move-up;
    animation-delay: 600ms;
    right: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.app .icon.icon-01 {
    animation-name: primary-move-right;
    animation-delay: 400ms;
    right: 0;
    top: 0;
  }
  .grid .box.slider__item.slider__item_active .box-icon.app .icon.icon-02 {
    animation-name: primary-move-left;
    animation-delay: 600ms;
    right: 0;
    top: 0;
  }
  .grid .box.slider__item.large {
    width: 80vw;
  }
  .grid.grid-wrap {
    margin-left: 0;
    flex-wrap: nowrap;
  }
  .grid.grid-wrap.wrap-2 > .box {
    width: auto;
  }
  .grid.grid-wrap.wrap-2 > .box .box {
    width: 40vw;
  }
  .grid.grid-wrap.wrap-2 > .box.large .box {
    width: 80vw;
  }
  .grid.grid-wrap.wrap-3 > .box {
    width: auto;
  }
  .grid.grid-wrap.wrap-3 > .box .box {
    width: 40vw;
  }
  .grid.grid-wrap.wrap-3 > .box.large .box {
    width: 80vw;
  }
  .grid.grid-wrap > .box.slider__item {
    margin-bottom: 0;
    margin-left: 0;
    flex: none;
  }
  .grid.grid-wrap:not(.slider__items) {
    flex-wrap: wrap;
  }
  .grid.grid-wrap:not(.slider__items) .box {
    width: 100%;
  }
  .grid.grid-wrap:not(.slider__items) .box.large {
    width: 100%;
  }
  .grid.grid-wrap:not(.slider__items).wrap-2 {
    margin-left: 0;
  }
  .grid.grid-wrap:not(.slider__items).wrap-2 .box {
    margin-left: 0;
  }
  .grid.grid-wrap:not(.slider__items).wrap-3 > .box {
    width: calc(50% - var(--interval-20));
  }
  .grid.grid-wrap.clients {
    margin-left: 0;
    display: grid;
  }
  .grid.grid-wrap.clients .box {
    margin-left: 0;
  }
  .grid.grid-wrap.clients .box.large {
    height: 60vw;
    order: 1;
  }
  .grid.grid-wrap.clients .box.vertical {
    flex-direction: row;
    column-gap: var(--interval-20);
    display: flex;
    order: 2;
  }
  .grid.grid-wrap.clients .box.vertical .box {
    margin-top: 0;
    flex: 1;
  }
  .grid.grid-wrap.clients .grid {
    margin-left: 0;
    order: 3;
  }
  .grid.grid-wrap.clients .grid .box {
    width: 100%;
  }
  .grid.mosaic {
    position: relative;
  }
  .grid.mosaic > .box.slider__item .box {
    height: 100%;
  }
  .grid.display-grid .box.slider__item {
    margin-bottom: 0;
    margin-left: 0;
    width: auto;
    flex: none;
  }
  .grid.display-grid .box.slider__item .box {
    width: 40vw;
  }
}
@media screen and (max-width: 640px) {
  .grid .box.slider__item {
    width: 80vw;
    flex: none;
  }
  .grid .box.slider__item .box .grid .box + .box {
    margin-top: var(--interval-20);
  }
  .grid .box.slider__item.large {
    width: 80vw;
  }
  .grid.grid-wrap {
    margin-left: 0;
    flex-wrap: nowrap;
  }
  .grid.grid-wrap.wrap-2 > .box {
    width: auto;
  }
  .grid.grid-wrap.wrap-2 > .box .box {
    width: 80vw;
  }
  .grid.grid-wrap.wrap-2 > .box.large .box {
    width: 80vw;
  }
  .grid.grid-wrap.wrap-3 > .box {
    width: auto;
  }
  .grid.grid-wrap.wrap-3 > .box .box {
    width: 80vw;
  }
  .grid.grid-wrap.wrap-3 > .box.large .box {
    width: 80vw;
  }
  .grid.grid-wrap > .box.slider__item {
    margin-bottom: 0;
    margin-left: 0;
  }
  .grid.grid-wrap:not(.slider__items) .box {
    width: 100%;
  }
  .grid.grid-wrap:not(.slider__items) .box.large {
    flex: auto;
    width: 100%;
  }
  .grid.grid-wrap:not(.slider__items).wrap-2 {
    margin-left: 0;
  }
  .grid.grid-wrap:not(.slider__items).wrap-2 .box {
    margin-left: 0;
  }
  .grid.grid-wrap:not(.slider__items).wrap-3 > .box {
    margin-left: 0;
    width: 100%;
  }
  .grid.grid-wrap.clients.grid-wrap.wrap-2 .box {
    margin-left: 0;
  }
  .grid.grid-wrap.clients.grid-wrap.wrap-2 .box.large {
    padding-bottom: 8vw;
    height: 120vw;
    order: 1;
  }
  .grid.grid-wrap.clients.grid-wrap.wrap-2 .box.vertical {
    flex-direction: row;
    column-gap: var(--interval-20);
    display: block;
    width: 100%;
    order: 2;
  }
  .grid.grid-wrap.clients.grid-wrap.wrap-2 .box.vertical .box {
    width: 100%;
    margin-top: 0;
    flex: none;
  }
  .grid.grid-wrap.clients.grid-wrap.wrap-2 .box.vertical .box + .box {
    margin-top: var(--interval-20);
  }
  .grid.grid-wrap.clients.grid-wrap.wrap-2 .grid {
    margin-left: 0;
    order: 3;
  }
  .grid.grid-wrap.clients.grid-wrap.wrap-2 .grid .box {
    width: 100%;
  }
  .grid.display-grid .box.slider__item .box {
    width: 80vw;
  }
}

.hybrid-block {
  position: relative;
}
.hybrid-block .hybrid-box {
  position: absolute;
  width: calc(50% - var(--interval-15));
  top: calc(var(--interval-100) * 6);
  right: 0;
}
.hybrid-block .hybrid-box .box-buttons {
  margin-top: var(--interval-20);
  text-align: center;
  position: absolute;
  width: 100%;
  top: 100%;
  left: 0;
}
.hybrid-block .hybrid-box .box-icon.animated.checked.expert .icon.icon-01 {
  animation-name: int-icon-01;
  animation-duration: 1000ms;
  animation-delay: 1000ms;
  transform-origin: 50% 50%;
  left: 0;
  top: 0;
}
.hybrid-block .hybrid-box .box-icon.animated.checked.expert .icon.icon-02 {
  animation-name: primary-fade-scale;
  animation-delay: 2000ms;
  left: 0;
  top: 0;
}
.hybrid-block .hybrid-box .box-icon.animated.checked.full .icon.icon-01 {
  animation-name: primary-fade-rotate-revert;
  animation-duration: 1000ms;
  animation-delay: 1000ms;
  transform-origin: 50% 56%;
  left: 0;
  top: 0;
}
.hybrid-block .hybrid-box .box-icon.animated.checked.full .icon.icon-02 {
  animation-name: primary-fade-scale;
  animation-delay: 2000ms;
  left: 0;
  top: 0;
}
.hybrid-block .hybrid-box .box-icon.animated.checked.sec .icon.icon-01 {
  animation-name: primary-fade-scale;
  animation-duration: 1000ms;
  animation-delay: 1000ms;
  transform-origin: 0 100%;
  left: 0;
  top: 0;
}
.hybrid-block .hybrid-box .box-icon.animated.checked.sec .icon.icon-02 {
  animation-name: primary-fade-scale;
  animation-delay: 2000ms;
  transform-origin: 100% 100%;
  left: 0;
  top: 0;
}
@media screen and (max-width: 1024px) {
  .hybrid-block .hybrid-box {
    position: static;
    width: auto;
  }
  .hybrid-block .hybrid-box .box-buttons {
    position: static;
  }
}

.button {
  text-transform: uppercase;
  font-family: "Manrope-Bold";
  transition: all 350ms;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  cursor: pointer;
  gap: 0.3em;
}
.button .button-icons {
  position: relative;
}
.button .button-icons .icon {
  transform: translate(-50%, -50%);
  position: absolute;
  max-height: 100%;
  max-width: 100%;
  width: 100%;
  left: 50%;
  top: 50%;
}
.button.white {
  background: #FFFFFF;
  color: #005FFF;
}
.button.green {
  background: #60B660;
  color: #FFFFFF;
}
.button.transparent {
  border: 1px solid #FFFFFF;
  color: #FFFFFF;
}
.button.primary {
  font-size: 14px;
  min-height: 2.7em;
}
@media screen and (max-width: 1366px) {
  .button.primary {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 1024px) {
  .button.primary {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) {
  .button.primary {
    font-size: 3vw;
  }
}
.button.primary .button-icons {
  height: 1.2em;
  width: 1.6em;
}
.button.large {
  font-size: 22px;
  min-height: 2.5em;
}
@media screen and (max-width: 1366px) {
  .button.large {
    font-size: 1.61vw;
  }
}
@media screen and (max-width: 1024px) {
  .button.large {
    font-size: 2.41vw;
  }
}
@media screen and (max-width: 640px) {
  .button.large {
    font-size: 5vw;
  }
}
.button.large .button-icons {
  height: 1em;
  width: 1.5em;
}
.button.circle {
  border-radius: var(--interval-40);
  padding: 0 var(--interval-25);
}
@media screen and (max-width: 640px) {
  .button.primary {
    font-size: 3.5vw;
    min-height: 2.7em;
  }
  .button.primary .button-icons {
    height: 1.2em;
    width: 1.6em;
  }
  .button.primary .button-text {
    padding-left: 0.6em;
  }
  .button.large {
    font-size: 4vw;
  }
  .button.large.white {
    font-size: 4.4vw;
  }
}

.link {
  transition: all 300ms;
  display: inline-flex;
  align-items: center;
  color: #005FFF;
  gap: 0.5em;
}
.link .link-icons {
  position: relative;
}
.link .link-icons .icon {
  transform: translate(-50%, -50%);
  position: absolute;
  max-height: 100%;
  max-width: 100%;
  width: 100%;
  left: 50%;
  top: 50%;
}
.link:hover {
  opacity: 0.5;
}

.module {
  padding: var(--interval-60) 0;
}
.module .module-center {
  padding: 0 var(--interval-30);
  max-width: 100%;
  margin: 0 auto;
  width: 1366px;
}
.module .module-title {
  font-family: "Manrope-Bold";
  font-size: 70px;
  padding-bottom: var(--interval-20);
  line-height: 1.2;
  color: #000000;
}
@media screen and (max-width: 1366px) {
  .module .module-title {
    font-size: 4.97vw;
  }
}
@media screen and (max-width: 1024px) {
  .module .module-title {
    font-size: 7.45vw;
  }
}
@media screen and (max-width: 640px) {
  .module .module-title {
    font-size: 11vw;
  }
}
.module .module-title .icon {
  margin-left: var(--interval-20);
  width: var(--interval-50);
}
.module .module-text {
  font-size: 25px;
  color: #666666;
}
@media screen and (max-width: 1366px) {
  .module .module-text {
    font-size: 1.83vw;
  }
}
@media screen and (max-width: 1024px) {
  .module .module-text {
    font-size: 2.74vw;
  }
}
@media screen and (max-width: 640px) {
  .module .module-text {
    font-size: 5vw;
  }
}
.module .module-text .text {
  padding-top: var(--interval-20);
}
.module .module-text .text.text-30 {
  font-size: 30px;
}
@media screen and (max-width: 1366px) {
  .module .module-text .text.text-30 {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) {
  .module .module-text .text.text-30 {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 640px) {
  .module .module-text .text.text-30 {
    font-size: 5.5vw;
  }
}
.module .module-buttons {
  padding-top: var(--interval-20);
  gap: var(--interval-20);
  display: flex;
}
.module .module-icon.animated.checked.it .icon.icon-01 {
  animation-name: primary-move-left;
  animation-duration: 600ms;
  animation-delay: 1000ms;
  z-index: 2;
  left: 0;
  top: 0;
}
.module .module-icon.animated.checked.it .icon.icon-02 {
  animation-name: primary-move-up;
  animation-delay: 1600ms;
  z-index: 2;
  left: 0;
  top: 0;
}
.module .module-icon.animated.checked.it .icon.icon-03 {
  animation-name: primary-fade;
  animation-duration: 600ms;
  animation-delay: 2000ms;
  z-index: 2;
}
.module .module-icon.animated.checked.it .icon.icon-04 {
  animation-name: primary-move-right;
  animation-duration: 600ms;
  animation-delay: 2000ms;
  z-index: 1;
  left: 0;
  top: 0;
}
.module .module-icon.animated.checked.doc .icon.icon-01 {
  animation-name: primary-move-right;
  animation-duration: 600ms;
  animation-delay: 1000ms;
  z-index: 2;
  left: 0;
  top: 0;
}
.module .module-icon.animated.checked.doc .icon.icon-02 {
  animation-name: primary-move-bottom;
  animation-delay: 1600ms;
  z-index: 2;
  left: 0;
  top: 0;
}
@media screen and (max-width: 1024px) {
  .module .module-icon.animated.checked.it .icon.icon-01 {
    animation-name: primary-move-left;
    animation-delay: 400ms;
    z-index: 2;
    left: 0;
    top: 0;
  }
  .module .module-icon.animated.checked.it .icon.icon-02 {
    animation-name: primary-move-up;
    animation-delay: 1000ms;
    z-index: 2;
    left: 0;
    top: 0;
  }
  .module .module-icon.animated.checked.it .icon.icon-03 {
    animation-name: primary-fade;
    animation-delay: 1400ms;
    z-index: 2;
  }
  .module .module-icon.animated.checked.it .icon.icon-04 {
    animation-name: primary-move-right;
    animation-duration: 600ms;
    animation-delay: 1800ms;
    z-index: 1;
    left: 0;
    top: 0;
  }
  .module .module-icon.animated.checked.doc .icon.icon-01 {
    animation-name: primary-move-right;
    animation-delay: 400ms;
    z-index: 2;
    left: 0;
    top: 0;
  }
  .module .module-icon.animated.checked.doc .icon.icon-02 {
    animation-name: primary-move-bottom;
    animation-delay: 800ms;
    z-index: 2;
    left: 0;
    top: 0;
  }
}
.module:first-child {
  padding-top: var(--interval-30);
}
.module.white {
  background: #FFFFFF;
}
.module.gradient {
  background: linear-gradient(90deg, #60B660 0%, #60B660 50%, #60B6AE 50%, #60B6AE 100%);
  box-shadow: 3px 4px 3px -2px rgba(0, 0, 0, 0.1);
  position: relative;
  max-width: 100%;
  padding: 0;
}
.module.gradient .module-center {
  background: linear-gradient(90deg, #60B660 0%, #60B6AE 100%);
  padding: var(--interval-60) var(--interval-30);
}
.module.gradient .module-title {
  color: #FFFFFF;
}
.module.gradient .module-text {
  color: #FFFFFF;
}
.module.gradient.special .module-center {
  padding-bottom: var(--interval-25);
  padding-top: var(--interval-25);
}
.module.gradient.special .module-title {
  font-size: 30px;
  text-align: center;
  padding: 0;
  margin: 0;
}
@media screen and (max-width: 1366px) {
  .module.gradient.special .module-title {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) {
  .module.gradient.special .module-title {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 640px) {
  .module.gradient.special .module-title {
    font-size: 5.5vw;
  }
}
.module.align {
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1);
}
.module.align .module-center {
  justify-content: space-between;
  align-items: center;
  display: flex;
  gap: var(--interval-30);
}
.module.align .module-icon {
  width: calc(var(--interval-100) * 4.3);
  height: calc(var(--interval-100) * 3.4);
  position: relative;
}
.module.align .module-icon .icon {
  transform: translate(-50%, -50%);
  position: absolute;
  max-width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
}
.module.align .module-icon:first-child {
  margin-left: calc(var(--interval-75) * -1);
}
.module.align .module-text {
  width: calc(var(--interval-100) * 8.5);
}
.module.checked.animated .box.hide-box {
  animation-name: primary-fade;
  animation-delay: 700ms;
}
.module.checked.animated .box.text {
  animation-name: primary-fade;
  animation-delay: 700ms;
}
.module.checked.animated .hybrid-box {
  animation-name: primary-move-up;
  animation-delay: 900ms;
}
.module.checked.animated .hybrid-box .box {
  animation-name: primary-move-up;
  animation-delay: 900ms;
  opacity: 1;
}
.module.checked.animated .slider .box, .module.checked.animated .grid .box {
  animation-name: primary-move-up;
}
.module.checked.animated .slider .box:nth-child(1), .module.checked.animated .grid .box:nth-child(1) {
  animation-delay: 300ms;
}
.module.checked.animated .slider .box:nth-child(2), .module.checked.animated .grid .box:nth-child(2) {
  animation-delay: 500ms;
}
.module.checked.animated .slider .box:nth-child(3), .module.checked.animated .grid .box:nth-child(3) {
  animation-delay: 700ms;
}
.module.checked.animated .slider .box:nth-child(4), .module.checked.animated .grid .box:nth-child(4) {
  animation-delay: 900ms;
}
.module.checked.animated .slider .box:nth-child(5), .module.checked.animated .grid .box:nth-child(5) {
  animation-delay: 1200ms;
}
.module.checked.animated .slider .box:nth-child(6), .module.checked.animated .grid .box:nth-child(6) {
  animation-delay: 1500ms;
}
.module.checked.animated .slider .box:nth-child(7), .module.checked.animated .grid .box:nth-child(7) {
  animation-delay: 1800ms;
}
.module.checked.animated .slider .box:nth-child(8), .module.checked.animated .grid .box:nth-child(8) {
  animation-delay: 2100ms;
}
.module.checked.animated .slider .box:nth-child(9), .module.checked.animated .grid .box:nth-child(9) {
  animation-delay: 2400ms;
}
.module.checked.animated .slider .box:nth-child(10), .module.checked.animated .grid .box:nth-child(10) {
  animation-delay: 2700ms;
}
.module.checked.animated .slider .box:nth-child(11), .module.checked.animated .grid .box:nth-child(11) {
  animation-delay: 3000ms;
}
.module.checked.animated .slider .box:nth-child(12), .module.checked.animated .grid .box:nth-child(12) {
  animation-delay: 3300ms;
}
.module.checked.animated .slider .box:nth-child(13), .module.checked.animated .grid .box:nth-child(13) {
  animation-delay: 3600ms;
}
.module.checked.animated .slider .box:nth-child(14), .module.checked.animated .grid .box:nth-child(14) {
  animation-delay: 3900ms;
}
.module.checked.animated .slider .box:nth-child(15), .module.checked.animated .grid .box:nth-child(15) {
  animation-delay: 4200ms;
}
.module.checked.animated .slider .slider__item .box {
  animation-name: primary-move-right;
}
.module.checked.animated .slider .slider__item:nth-child(1) .box {
  animation-delay: 300ms;
}
.module.checked.animated .slider .slider__item:nth-child(2) .box {
  animation-delay: 500ms;
}
.module.checked.animated .slider .slider__item:nth-child(3) .box {
  animation-delay: 700ms;
}
.module.checked.animated .slider .slider__item:nth-child(4) .box {
  animation-delay: 900ms;
}
.module.checked.animated .slider .slider__btn {
  animation-name: primary-fade;
  animation-delay: 1000ms;
}
.module.checked.animated .module-title {
  animation-name: primary-move-up;
}
.module.checked.animated .module-text {
  animation-name: primary-move-up;
  animation-delay: 100ms;
}
.module.checked.animated .module-text.center {
  animation-name: primary-fade;
  animation-delay: 1000ms;
}
.module.checked.animated .module-buttons {
  animation-name: primary-fade;
  animation-delay: 1000ms;
}
.module.checked.animated .link-wrap {
  animation-name: primary-fade;
  animation-delay: 1000ms;
}
.module.checked.animated .block-text {
  animation-name: primary-fade;
}
@media screen and (max-width: 1900px) {
  .module.gradient .icons {
    margin-left: -45px;
  }
  .module.arrow .block-arrow:before {
    display: none;
  }
  .module.arrow .block-arrow .icon.icon-arrow {
    right: 0;
  }
}
@media screen and (max-width: 1600px) {
  .module.align .module-icon:first-child {
    margin-left: 0;
  }
}
@media screen and (max-width: 1024px) {
  .module .module-title {
    font-size: 5vw;
  }
  .module .module-text {
    font-size: 2vw;
  }
  .module.align .module-center {
    align-items: flex-start;
    flex-direction: column;
  }
  .module.align .module-text {
    width: 100%;
  }
  .module.align .module-icon {
    height: 25vw;
    width: 25vw;
  }
  .module.align .module-icon:first-child {
    margin-left: 0;
  }
}
@media screen and (max-width: 640px) {
  .module {
    padding: 8vw 0;
  }
  .module .module-title {
    font-size: 9vw;
  }
  .module .module-text {
    font-size: 4vw;
  }
  .module .module-buttons {
    align-items: center;
    flex-direction: column;
  }
  .module.gradient .module-center {
    padding: 8vw 6vw;
  }
  .module.gradient.special .module-title {
    font-size: 8vw;
  }
  .module.align .module-center {
    align-items: center;
    text-align: center;
  }
  .module.align .module-text {
    width: 100%;
  }
  .module.align .module-icon {
    height: 60vw;
    width: 60vw;
  }
}

.block-mission {
  border-radius: var(--interval-15);
  padding: var(--interval-50) var(--interval-60);
  margin-bottom: var(--interval-20);
  background: #E8F0FF;
  position: relative;
  overflow: hidden;
  height: calc(var(--interval-100) * 5);
}
.block-mission .mission-text {
  position: relative;
  z-index: 10;
  width: 50%;
}
.block-mission .mission-text .title {
  background: #005FFF;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: "Manrope-Bold";
  margin-bottom: var(--interval-15);
  display: inline-block;
  line-height: 1;
  font-size: 70px;
}
@media screen and (max-width: 1366px) {
  .block-mission .mission-text .title {
    font-size: 4.97vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-mission .mission-text .title {
    font-size: 7.45vw;
  }
}
@media screen and (max-width: 640px) {
  .block-mission .mission-text .title {
    font-size: 11vw;
  }
}
.block-mission .mission-text .text {
  margin-bottom: var(--interval-25);
  font-size: 22px;
}
@media screen and (max-width: 1366px) {
  .block-mission .mission-text .text {
    font-size: 1.61vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-mission .mission-text .text {
    font-size: 2.41vw;
  }
}
@media screen and (max-width: 640px) {
  .block-mission .mission-text .text {
    font-size: 5vw;
  }
}
.block-mission .mission-text .text .marker {
  position: relative;
}
.block-mission .mission-text .text .marker span {
  position: relative;
  color: #FFFFFF;
  z-index: 2;
}
.block-mission .mission-text .text .marker img {
  position: absolute;
  z-index: 1;
  width: 110%;
  left: -5%;
}
.block-mission .mission-image {
  justify-content: center;
  align-items: center;
  position: absolute;
  padding-top: 19.6%;
  display: flex;
  bottom: 4.9%;
  right: 8.4%;
  width: 19.6%;
}
.block-mission .mission-image .image {
  position: absolute;
  bottom: 0;
  left: 0;
}
.block-mission .mission-image .image.image-mission {
  width: 100%;
  z-index: 4;
}
.block-mission .mission-image .image.image-arrow {
  transform: translate(85%, -82%);
  width: 66%;
  z-index: 5;
}
.block-mission .mission-image .circle {
  border-radius: 100%;
  position: absolute;
}
.block-mission .mission-image .circle.circle-01 {
  background: #AAC9FF;
  height: 156%;
  width: 156%;
  left: -27%;
  top: -27%;
  z-index: 3;
}
.block-mission .mission-image .circle.circle-02 {
  background: #CFE0FF;
  height: 234%;
  width: 234%;
  left: -66%;
  top: -66%;
  z-index: 2;
}
.block-mission .mission-image .circle.circle-03 {
  background: #DBE8FF;
  height: 312%;
  width: 312%;
  left: -105%;
  top: -105%;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  .block-mission .mission-text {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .block-mission {
    padding: 6vw 6vw 60vw;
    height: auto;
  }
  .block-mission .mission-image {
    padding-top: 50%;
    bottom: 2%;
    right: 25%;
    width: 50%;
  }
}

.slider {
  font-size: 0;
  position: relative;
}
.slider .slider__wrapper .slider__btn {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.5s;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: calc(100% + var(--interval-20));
  height: var(--interval-20);
  width: var(--interval-10);
  z-index: 3;
}
.slider .slider__wrapper .slider__btn .icon {
  position: absolute;
  width: 100%;
  margin: 0;
  left: 0;
  top: 0;
}
.slider .slider__wrapper .slider__btn .icon.blocked {
  opacity: 0;
}
.slider .slider__wrapper .slider__btn.slider__btn_hide .icon.active {
  opacity: 0;
}
.slider .slider__wrapper .slider__btn.slider__btn_hide .icon.blocked {
  opacity: 1;
}
.slider .slider__wrapper .slider__btn.slider__btn_prev {
  right: var(--interval-30);
}
.slider .slider__wrapper .slider__btn.slider__btn_next {
  right: 0;
}
@media screen and (max-width: 1024px) {
  .slider .slider__wrapper .slider__btn {
    height: 4vw;
    width: 2vw;
  }
  .slider .slider__wrapper .slider__btn.slider__btn_prev {
    right: 6vw;
  }
  .slider .slider__wrapper .slider__btn.slider__btn_next {
    right: 0;
  }
}
@media screen and (max-width: 640px) {
  .slider .slider__wrapper .slider__btn {
    height: 6vw;
    width: 3vw;
  }
  .slider .slider__wrapper .slider__btn.slider__btn_prev {
    right: 8vw;
  }
  .slider .slider__wrapper .slider__btn.slider__btn_next {
    right: 0;
  }
}
.slider .slider__wrapper .slider__indicators {
  transform: translate(-50%);
  position: absolute;
  display: flex;
  bottom: 30px;
  z-index: 2;
  left: 50%;
}
.slider .slider__wrapper .slider__indicators .slider__indicator {
  transition: all 300ms;
  border-radius: 100%;
  margin: 0 10px;
  height: 10px;
  width: 10px;
}
.slider.primary .slider__wrapper .slider__items {
  transition: transform 0.5s ease;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  will-change: transform;
  counter-reset: slide;
  display: flex;
}
.slider.primary .slider__wrapper .slider__items .slider__item {
  transform-style: preserve-3d;
  backface-visibility: hidden;
  will-change: transform;
  position: relative;
  max-width: 100%;
}
.slider.primary .slider__wrapper .slider__items .slider__item .box {
  height: 100%;
}
.slider.primary .slider__wrapper .slider__items .slider__item.box {
  display: block;
}
.slider.primary .slider__wrapper .slider__items .slider__item.box .box {
  width: 100%;
}
.slider.primary .slider__wrapper .slider__items.items-03 .slider__item .box {
  margin-right: var(--interval-20);
  width: 422px;
}
.slider.primary .slider__wrapper .slider__items.items-04 .slider__item.box .box {
  margin-right: var(--interval-20);
  width: 312px;
}
@media screen and (max-width: 1366px) {
  .slider.primary .slider__wrapper .slider__items.items-03 .slider__item.box .box {
    width: 30vw;
  }
  .slider.primary .slider__wrapper .slider__items.items-04 .slider__item.box .box {
    width: 30vw;
  }
}
@media screen and (max-width: 1024px) {
  .slider.primary .slider__wrapper .slider__items.items-03 .slider__item.box .box {
    width: 40vw;
  }
  .slider.primary .slider__wrapper .slider__items.items-04 .slider__item.box .box {
    width: 40vw;
  }
}
@media screen and (max-width: 640px) {
  .slider.primary .slider__wrapper .slider__items.items-03 .slider__item.box .box {
    width: 80vw;
  }
  .slider.primary .slider__wrapper .slider__items.items-04 .slider__item.box .box {
    width: 80vw;
  }
}
.slider.mobile .slider__wrapper .slider__btn {
  display: none;
}
.slider.mobile .slider__wrapper .slider__indicators {
  display: none;
}
@media screen and (min-width: 1025px) {
  .slider.mobile .slider__items {
    transform: translate3d(0, 0, 0) !important;
  }
}
@media screen and (max-width: 1024px) {
  .slider.mobile {
    margin-bottom: 10vw;
  }
  .slider.mobile .slider__wrapper .slider__btn {
    display: block;
  }
  .slider.mobile .slider__wrapper .slider__items {
    transition: transform 0.5s ease;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    will-change: transform;
    counter-reset: slide;
    display: flex;
  }
  .slider.mobile .slider__wrapper .slider__items .slider__item {
    transform-style: preserve-3d;
    backface-visibility: hidden;
    will-change: transform;
    position: relative;
    max-width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .slider.mobile {
    margin-bottom: 16vw;
  }
}
.slider.margin {
  margin-right: calc(var(--interval-20) * -1);
}
@media screen and (max-width: 1024px) {
  .slider.margin {
    margin-right: 0;
  }
}

.footer .module {
  padding: var(--interval-100) 0;
}
.footer .module-center {
  align-items: flex-start;
  display: flex;
}
.footer .block {
  align-items: flex-start;
  flex-direction: column;
  display: flex;
  width: 100%;
  gap: var(--interval-15);
}
.footer .block .link {
  color: #000000;
}
.footer .block .link .link-icons {
  height: var(--interval-20);
  width: var(--interval-20);
}
.footer .block.left {
  font-size: 16px;
}
@media screen and (max-width: 1366px) {
  .footer .block.left {
    font-size: 1.17vw;
  }
}
@media screen and (max-width: 1024px) {
  .footer .block.left {
    font-size: 1.75vw;
  }
}
@media screen and (max-width: 640px) {
  .footer .block.left {
    font-size: 4vw;
  }
}
.footer .block.left .text {
  color: #666666;
}
.footer .block.center {
  width: calc(var(--interval-100) * 4.5);
  padding: 0 var(--interval-15);
}
.footer .block.center .logo-icon {
  display: block;
  width: 100%;
}
.footer .block.right {
  padding-left: var(--interval-80);
  font-size: 14px;
}
@media screen and (max-width: 1366px) {
  .footer .block.right {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 1024px) {
  .footer .block.right {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) {
  .footer .block.right {
    font-size: 3vw;
  }
}
.footer .block.right .text {
  color: #000000;
}
.footer .block.right .link {
  text-decoration: underline;
}
@media screen and (max-width: 640px) {
  .footer .module {
    padding: 10vw 0;
  }
  .footer .module-center {
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .footer .block .link {
    color: #000000;
  }
  .footer .block .link .link-icons {
    height: var(--interval-20);
    width: var(--interval-20);
  }
  .footer .block.left {
    width: 70%;
  }
  .footer .block.center {
    width: 25%;
    padding: 0;
    margin: 0;
  }
  .footer .block.right {
    padding-left: 0;
    margin-top: 8vw;
    font-size: 14px;
  }
}
@media screen and (max-width: 640px) and (max-width: 1366px) {
  .footer .block.right {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 640px) and (max-width: 1024px) {
  .footer .block.right {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) and (max-width: 640px) {
  .footer .block.right {
    font-size: 3vw;
  }
}

@keyframes mobile-menu-fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes mobile-menu-move {
  0% {
    top: -150vh;
    opacity: 0;
  }
  100% {
    opacity: 1;
    top: 15vw;
  }
}
@keyframes desktop-menu-blur {
  0% {
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
  }
  100% {
    opacity: 1;
    top: 15vw;
  }
}
@keyframes primary-fade-scale {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes primary-fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes primary-move-up {
  0% {
    transform: translateY(10vw);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes primary-move-bottom {
  0% {
    transform: translateY(-10vw);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes primary-move-right {
  0% {
    transform: translateX(10vw);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes primary-move-left {
  0% {
    transform: translateX(-10vw);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes primary-fade-rotate-revert {
  0% {
    transform: rotate(0);
    opacity: 0;
  }
  20% {
    transform: rotate(-72deg);
    opacity: 1;
  }
  100% {
    transform: rotate(-360deg);
    opacity: 1;
  }
}
.animated.module .module-icon .icon {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.5s;
  opacity: 0;
}
.animated.module .module-title {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  transform: translateY(10vw);
  animation-fill-mode: both;
  animation-duration: 0.5s;
  opacity: 0;
}
.animated.module .module-text {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  transform: translateY(10vw);
  animation-fill-mode: both;
  animation-duration: 0.5s;
  opacity: 0;
}
.animated .box {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.5s;
  opacity: 0;
}
.animated .box-icon .icon {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.5s;
  opacity: 0;
}
.animated .link-wrap {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.5s;
  opacity: 0;
}
.animated .block-text {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.5s;
  opacity: 0;
}
.animated .hybrid-box {
  animation-timing-function: ease-out;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-duration: 0.5s;
  opacity: 0;
}

@keyframes int-icon-01 {
  0% {
    transform: rotateZ(0) scale(0);
    opacity: 0;
  }
  20% {
    transform: rotateZ(0) scale(1);
    opacity: 0;
  }
  100% {
    transform: rotateZ(720deg) scale(1);
    opacity: 1;
  }
}
@keyframes int-icon-03 {
  0% {
    transform: rotateZ(0);
    opacity: 0;
  }
  20% {
    transform: rotateZ(72deg);
    opacity: 1;
  }
  100% {
    transform: rotateZ(360deg);
    opacity: 1;
  }
}
.table.catalogue .table-row {
  padding-bottom: var(--interval-25);
  padding-top: var(--interval-15);
  border-bottom: 1px solid #B2B2B2;
}
.table.catalogue .row-title {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}
.table.catalogue .row-title .name {
  font-family: "Manrope-Bold";
  font-size: 30px;
  margin-right: var(--interval-10);
}
@media screen and (max-width: 1366px) {
  .table.catalogue .row-title .name {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) {
  .table.catalogue .row-title .name {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 640px) {
  .table.catalogue .row-title .name {
    font-size: 5.5vw;
  }
}
.table.catalogue .row-title .status.new {
  text-transform: uppercase;
  background-color: #60B6AE;
  font-size: 10px;
  border-radius: 0.2em;
  padding: 0.2em 0.5em;
  color: #FFFFFF;
}
.table.catalogue .row-content {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}
.table.catalogue .row-content .price {
  white-space: nowrap;
  text-align: right;
}
.table.catalogue .row-content .price .text.grey {
  font-size: 30px;
  line-height: 0.9;
}
@media screen and (max-width: 1366px) {
  .table.catalogue .row-content .price .text.grey {
    font-size: 2.19vw;
  }
}
@media screen and (max-width: 1024px) {
  .table.catalogue .row-content .price .text.grey {
    font-size: 3.28vw;
  }
}
@media screen and (max-width: 640px) {
  .table.catalogue .row-content .price .text.grey {
    font-size: 5.5vw;
  }
}
.table.catalogue .row-content .price .text.blue {
  margin-top: -0.2em;
  font-size: 40px;
  line-height: 0.9;
}
@media screen and (max-width: 1366px) {
  .table.catalogue .row-content .price .text.blue {
    font-size: 2.92vw;
  }
}
@media screen and (max-width: 1024px) {
  .table.catalogue .row-content .price .text.blue {
    font-size: 4.38vw;
  }
}
@media screen and (max-width: 640px) {
  .table.catalogue .row-content .price .text.blue {
    font-size: 9vw;
  }
}
.table.catalogue .row-content .price .text.period {
  font-size: 16px;
}
@media screen and (max-width: 1366px) {
  .table.catalogue .row-content .price .text.period {
    font-size: 1.17vw;
  }
}
@media screen and (max-width: 1024px) {
  .table.catalogue .row-content .price .text.period {
    font-size: 1.75vw;
  }
}
@media screen and (max-width: 640px) {
  .table.catalogue .row-content .price .text.period {
    font-size: 4vw;
  }
}
.table.catalogue .row-content .price .text.small {
  width: 100%;
}
.table.catalogue .row-content .cell .text {
  white-space: nowrap;
}
.table.catalogue .row-content .cell .text.large {
  font-size: 22px;
}
@media screen and (max-width: 1366px) {
  .table.catalogue .row-content .cell .text.large {
    font-size: 1.61vw;
  }
}
@media screen and (max-width: 1024px) {
  .table.catalogue .row-content .cell .text.large {
    font-size: 2.41vw;
  }
}
@media screen and (max-width: 640px) {
  .table.catalogue .row-content .cell .text.large {
    font-size: 5vw;
  }
}
.table.catalogue .row-content .cell .text.small {
  font-size: 12px;
}
@media screen and (max-width: 1366px) {
  .table.catalogue .row-content .cell .text.small {
    font-size: 0.87vw;
  }
}
@media screen and (max-width: 1024px) {
  .table.catalogue .row-content .cell .text.small {
    font-size: 1.3vw;
  }
}
@media screen and (max-width: 640px) {
  .table.catalogue .row-content .cell .text.small {
    font-size: 2.5vw;
  }
}
.table.catalogue .row-content .cell.processor {
  width: 35%;
}
.table.catalogue .row-content .cell.memory {
  width: 20%;
}
.table.catalogue .row-content .cell.memory:first-child {
  width: 15%;
}
.table.catalogue .row-content .cell.disk {
  width: 20%;
}
.table.catalogue .row-content .cell.price {
  padding-right: var(--interval-20);
  display: block;
  width: 15%;
}
.table.catalogue .row-content .cell.cart {
  text-align: right;
  width: 10%;
}
.table.catalogue .row-content .cell.description {
  padding-right: var(--interval-20);
  width: 75%;
}
.table.catalogue .row-content .button {
  display: flex;
}
.table.catalogue.vds .cell.processor {
  width: 12%;
}
.table.catalogue.vds .cell.memory {
  width: 12%;
}
.table.catalogue.vds .cell.disk {
  width: 12%;
}
.table.catalogue.vds .cell.ip {
  width: 8%;
}
.table.catalogue.vds .cell.speed {
  width: 12%;
}
.table.catalogue.vds .cell.price {
  width: 15%;
}
.table.catalogue.vds .cell.cart {
  text-align: right;
  width: 10%;
}
.table.catalogue.support .row-content .cell .text {
  white-space: normal;
}
@media screen and (max-width: 1024px) {
  .table.catalogue .table-row {
    padding-bottom: 2vw;
  }
  .table.catalogue .row-content {
    flex-wrap: wrap;
  }
  .table.catalogue .row-content .cell {
    padding-bottom: 2vw;
  }
  .table.catalogue .row-content .cell.processor {
    width: auto;
  }
  .table.catalogue .row-content .cell.memory {
    width: auto;
  }
  .table.catalogue .row-content .cell.memory:first-child {
    width: 15%;
  }
  .table.catalogue .row-content .cell.disk {
    width: auto;
  }
  .table.catalogue .row-content .cell.price {
    text-align: left;
    width: 50%;
  }
  .table.catalogue .row-content .cell.price .text.blue {
    margin-top: 0;
  }
  .table.catalogue .row-content .cell.cart {
    text-align: right;
    width: 50%;
  }
  .table.catalogue .row-content .cell.description {
    padding-right: var(--interval-20);
    width: 75%;
  }
  .table.catalogue .row-content .cell .text.small {
    font-size: 2vw;
  }
  .table.catalogue .row-content .button {
    display: inline-flex;
  }
  .table.catalogue.vds .cell.processor {
    width: auto;
  }
  .table.catalogue.vds .cell.memory {
    min-width: 15%;
    width: auto;
  }
  .table.catalogue.vds .cell.disk {
    min-width: 15%;
    width: auto;
  }
  .table.catalogue.vds .cell.ip {
    min-width: 15%;
    width: auto;
  }
  .table.catalogue.vds .cell.speed {
    width: auto;
  }
  .table.catalogue.vds .cell.price {
    width: 40%;
  }
  .table.catalogue.vds .cell.cart {
    width: 20%;
  }
  .table.catalogue.storage .cell.memory:first-child {
    width: 33%;
  }
  .table.catalogue.storage .cell.users {
    width: 33%;
  }
  .table.catalogue.storage .cell.traffic {
    width: 21%;
  }
  .table.catalogue.storage .cell.price {
    width: 33%;
  }
  .table.catalogue.storage .cell.cart {
    text-align: right;
    width: 21%;
  }
  .table.catalogue.support .cell .text {
    white-space: normal;
  }
  .table.catalogue.support .cell.description {
    width: 100%;
  }
  .table.catalogue.ssl .cell .text {
    white-space: normal;
  }
  .table.catalogue.ssl .cell.description {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .table.catalogue .table-row {
    padding-bottom: 2vw;
  }
  .table.catalogue .row-title {
    padding-bottom: 2vw;
  }
  .table.catalogue .row-title .name {
    font-size: 8.5vw;
  }
  .table.catalogue .row-title .status.new {
    font-size: 4vw;
  }
  .table.catalogue .row-content {
    align-items: flex-end;
    flex-wrap: wrap;
  }
  .table.catalogue .row-content .cell {
    padding-bottom: 2vw;
  }
  .table.catalogue .row-content .cell .text {
    white-space: normal;
  }
  .table.catalogue .row-content .cell .text.large {
    font-size: 5vw;
  }
  .table.catalogue .row-content .cell .text.small {
    font-size: 3vw;
  }
  .table.catalogue .row-content .cell.processor {
    width: 100%;
  }
  .table.catalogue .row-content .cell.memory {
    width: 100%;
  }
  .table.catalogue .row-content .cell.memory:first-child {
    width: 100%;
  }
  .table.catalogue .row-content .cell.disk {
    width: 100%;
  }
  .table.catalogue .row-content .cell.price {
    padding-right: 0;
    width: 100%;
  }
  .table.catalogue .row-content .cell.price .text.blue {
    margin-top: 0;
    font-size: 10vw;
  }
  .table.catalogue .row-content .cell.price .text.grey {
    font-size: 8vw;
  }
  .table.catalogue .row-content .cell.price .text.period {
    padding-left: 0.2em;
  }
  .table.catalogue .row-content .cell.price .text.small {
    width: auto;
  }
  .table.catalogue .row-content .cell.cart {
    text-align: left;
    width: 100%;
  }
  .table.catalogue .row-content .cell.description {
    width: 100%;
  }
  .table.catalogue .row-content .cell > .text {
    display: block;
  }
  .table.catalogue .row-content .button {
    display: inline-flex;
  }
  .table.catalogue.vds .cell.processor {
    width: 100%;
  }
  .table.catalogue.vds .cell.memory {
    width: 100%;
  }
  .table.catalogue.vds .cell.disk {
    width: 100%;
  }
  .table.catalogue.vds .cell.ip {
    width: 100%;
  }
  .table.catalogue.vds .cell.speed {
    width: 100%;
  }
  .table.catalogue.vds .cell.price {
    padding-right: 0;
    width: 100%;
  }
  .table.catalogue.vds .cell.price .text.small {
    width: auto;
  }
  .table.catalogue.vds .cell.cart {
    width: 100%;
  }
  .table.catalogue.storage .cell.memory:first-child {
    width: 100%;
  }
  .table.catalogue.storage .cell.users {
    width: 100%;
  }
  .table.catalogue.storage .cell.traffic {
    width: 100%;
  }
  .table.catalogue.storage .cell.price {
    width: 100%;
  }
  .table.catalogue.storage .cell.cart {
    width: 100%;
  }
  .table.catalogue.support .cell .text {
    white-space: normal;
  }
  .table.catalogue.support .cell.description {
    padding-right: 0;
    width: 100%;
  }
  .table.catalogue.support .cell.description .text.large {
    padding-bottom: 4vw;
  }
  .table.catalogue.ssl .cell .text {
    white-space: normal;
  }
  .table.catalogue.ssl .cell.description {
    width: 100%;
    padding-right: 0;
  }
}

.form {
  border-radius: var(--interval-15);
  padding: var(--interval-40);
  background-color: #EDEDED;
  position: relative;
  z-index: 3;
}
.form .field {
  margin-bottom: var(--interval-30);
  position: relative;
  display: block;
}
.form .field .name {
  transition: all 300ms;
  position: absolute;
  color: #999999;
  left: var(--interval-20);
  top: var(--interval-15);
}
.form .field .error {
  transition: all 300ms;
  position: absolute;
  top: calc(100% + var(--interval-5));
  font-size: 12px;
  color: #BF0000;
  opacity: 0;
}
@media screen and (max-width: 1366px) {
  .form .field .error {
    font-size: 0.87vw;
  }
}
@media screen and (max-width: 1024px) {
  .form .field .error {
    font-size: 1.3vw;
  }
}
@media screen and (max-width: 640px) {
  .form .field .error {
    font-size: 2.5vw;
  }
}
.form .field.input input {
  border: 1px solid #CCCCCC;
  font-family: "Manrope-Regular";
  background-color: #FFFFFF;
  border-radius: var(--interval-5);
  font-size: inherit;
  color: #333333;
  padding: var(--interval-5) var(--interval-20) 0;
  display: block;
  height: 55px;
  width: 100%;
}
.form .field.input input:active, .form .field.input input:valid, .form .field.input input:focus {
  border: 1px solid #333333;
}
.form .field.input input:active + .name, .form .field.input input:valid + .name, .form .field.input input:focus + .name {
  font-size: 12px;
  top: var(--interval-5);
}
@media screen and (max-width: 1366px) {
  .form .field.input input:active + .name, .form .field.input input:valid + .name, .form .field.input input:focus + .name {
    font-size: 0.87vw;
  }
}
@media screen and (max-width: 1024px) {
  .form .field.input input:active + .name, .form .field.input input:valid + .name, .form .field.input input:focus + .name {
    font-size: 1.3vw;
  }
}
@media screen and (max-width: 640px) {
  .form .field.input input:active + .name, .form .field.input input:valid + .name, .form .field.input input:focus + .name {
    font-size: 2.5vw;
  }
}
.form .field.text textarea {
  border: 1px solid #CCCCCC;
  font-family: "Manrope-Regular";
  background-color: #FFFFFF;
  border-radius: var(--interval-5);
  font-size: inherit;
  padding: var(--interval-20) var(--interval-20);
  color: #333333;
  display: block;
  height: var(--interval-95);
  width: 100%;
}
.form .field.text textarea:active, .form .field.text textarea:valid, .form .field.text textarea:focus {
  border: 1px solid #333333;
}
.form .field.text textarea:active + .name, .form .field.text textarea:valid + .name, .form .field.text textarea:focus + .name {
  font-size: 12px;
  top: var(--interval-5);
}
@media screen and (max-width: 1366px) {
  .form .field.text textarea:active + .name, .form .field.text textarea:valid + .name, .form .field.text textarea:focus + .name {
    font-size: 0.87vw;
  }
}
@media screen and (max-width: 1024px) {
  .form .field.text textarea:active + .name, .form .field.text textarea:valid + .name, .form .field.text textarea:focus + .name {
    font-size: 1.3vw;
  }
}
@media screen and (max-width: 640px) {
  .form .field.text textarea:active + .name, .form .field.text textarea:valid + .name, .form .field.text textarea:focus + .name {
    font-size: 2.5vw;
  }
}
.form .field.checkbox {
  margin-bottom: var(--interval-15);
  align-items: flex-start;
  cursor: pointer;
  display: flex;
}
.form .field.checkbox input {
  display: none;
}
.form .field.checkbox input:checked ~ .icons .icon.one {
  opacity: 0;
}
.form .field.checkbox input:checked ~ .icons .icon.two {
  opacity: 1;
}
.form .field.checkbox input:checked ~ .text {
  color: #000000;
}
.form .field.checkbox .icons {
  display: inline-block;
  position: relative;
  margin-right: var(--interval-10);
  height: var(--interval-20);
  width: var(--interval-20);
}
.form .field.checkbox .icons .icon {
  transition: all 300ms;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}
.form .field.checkbox .icons .icon.two {
  opacity: 0;
}
.form .field.checkbox .text {
  transition: all 300ms;
  display: inline-block;
  color: #7F7F7F;
  width: 85%;
}
.form .field.checkbox .text .link {
  display: inline;
}
.form .field.error .error {
  opacity: 1;
}
.form .field.error.input input {
  border: 1px solid #BF0000;
}
.form .field.error.text textarea {
  border: 1px solid #BF0000;
}
.form .field.error.checkbox .text {
  color: #BF0000;
}
.form .field.error.checkbox .text .link {
  color: #BF0000;
}
.form .captcha {
  margin-bottom: var(--interval-15);
}
@media screen and (max-width: 1024px) {
  .form {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .form {
    padding: 6vw;
  }
  .form .field {
    margin-bottom: 6vw;
  }
  .form .field .name {
    top: 4.5vw;
  }
  .form .field.input input {
    padding: 2vw 4vw 0;
    display: block;
    height: 15vw;
  }
  .form .field.input input:active + .name, .form .field.input input:valid + .name, .form .field.input input:focus + .name {
    font-size: 3vw;
    top: 1vw;
  }
  .form .field.text textarea {
    padding: 4vw;
    height: 50vw;
  }
  .form .field.text textarea:active + .name, .form .field.text textarea:valid + .name, .form .field.text textarea:focus + .name {
    font-size: 3vw;
    top: 1vw;
  }
  .form .field.checkbox .icons {
    margin-right: 4vw;
    margin-top: 0vw;
    height: 6vw;
    width: 6vw;
  }
}

.form-image {
  position: relative;
  height: 0;
}
.form-image .image-align {
  width: calc(var(--interval-100) * 2);
  position: absolute;
  left: 51%;
  top: var(--interval-50);
}
.form-image .image-align .image {
  margin-bottom: var(--interval-10);
  width: 100%;
}
.form-image .image-align .text {
  color: #999999;
  text-align: center;
  font-size: 75px;
}
@media screen and (max-width: 1366px) {
  .form-image .image-align .text {
    font-size: 5.49vw;
  }
}
@media screen and (max-width: 1024px) {
  .form-image .image-align .text {
    font-size: 8.23vw;
  }
}
@media screen and (max-width: 640px) {
  .form-image .image-align .text {
    font-size: 12vw;
  }
}
@media screen and (max-width: 1024px) {
  .form-image {
    display: none;
  }
}

.form-wrapper {
  position: relative;
  width: 49%;
}
.form-wrapper .message {
  transition: all 500ms;
  position: absolute;
  z-index: 2;
  opacity: 0;
}
.form-wrapper .message.sent {
  padding-top: calc(var(--interval-100) * 1.1);
  width: 85%;
  left: 0;
  top: 0;
}
.form-wrapper .message.sent .icon.cart {
  width: 100%;
}
.form-wrapper .message.sent .text {
  padding-left: var(--interval-60);
}
.form-wrapper .message.sent .text.green {
  margin-top: var(--interval-60);
}
.form-wrapper .message .text.green {
  font-family: "Manrope-Bold";
  font-size: 26px;
  color: #26BD85;
}
@media screen and (max-width: 1366px) {
  .form-wrapper .message .text.green {
    font-size: 1.9vw;
  }
}
@media screen and (max-width: 1024px) {
  .form-wrapper .message .text.green {
    font-size: 2.85vw;
  }
}
@media screen and (max-width: 640px) {
  .form-wrapper .message .text.green {
    font-size: 5vw;
  }
}
.form-wrapper .message .text.grey {
  font-size: 18px;
}
@media screen and (max-width: 1366px) {
  .form-wrapper .message .text.grey {
    font-size: 1.31vw;
  }
}
@media screen and (max-width: 1024px) {
  .form-wrapper .message .text.grey {
    font-size: 1.96vw;
  }
}
@media screen and (max-width: 640px) {
  .form-wrapper .message .text.grey {
    font-size: 4vw;
  }
}
.form-wrapper .form.sending .button {
  opacity: 0;
}
.form-wrapper .form.sending ~ .message.sending {
  opacity: 1;
}
.form-wrapper .form.sent {
  z-index: 1;
}
.form-wrapper .form.sent .button {
  opacity: 0;
}
.form-wrapper .form.sent .field {
  opacity: 0;
}
.form-wrapper .form.sent .captcha {
  opacity: 0;
}
.form-wrapper .form.sent ~ .message.sending {
  opacity: 0;
}
.form-wrapper .form.sent ~ .message.sent {
  opacity: 1;
}
@media screen and (max-width: 1024px) {
  .form-wrapper {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .form-wrapper .message .text.green {
    margin-bottom: 2vw;
    font-size: 9vw;
  }
  .form-wrapper .message .text.grey {
    font-size: 6vw;
  }
}

.block-search {
  height: var(--interval-95);
}
.block-search .center {
  justify-content: center;
  align-items: center;
  display: flex;
  height: 100%;
}
.block-search .form {
  justify-content: space-between;
  border-radius: 50px;
  align-items: center;
  background: #FFFFFF;
  padding-left: var(--interval-30);
  padding-right: calc(var(--interval-70) / 10);
  padding-bottom: 0;
  padding-top: 0;
  display: flex;
  width: calc(var(--interval-75) * 10);
  height: var(--interval-50);
}
.block-search .field {
  padding-right: 30px;
  position: relative;
  display: flex;
  width: 100%;
  margin: 0;
}
.block-search .field .input {
  color: #000000;
  position: relative;
  font-size: 14px;
  display: block;
  width: 100%;
  z-index: 2;
}
@media screen and (max-width: 1366px) {
  .block-search .field .input {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-search .field .input {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) {
  .block-search .field .input {
    font-size: 3vw;
  }
}
.block-search .field .input:focus ~ .name {
  opacity: 0;
}
.block-search .field .name {
  transition: all 300ms;
  transform: translateY(-50%);
  position: absolute;
  font-size: 14px;
  z-index: 1;
  top: 50%;
  left: 0;
}
@media screen and (max-width: 1366px) {
  .block-search .field .name {
    font-size: 1.02vw;
  }
}
@media screen and (max-width: 1024px) {
  .block-search .field .name {
    font-size: 1.53vw;
  }
}
@media screen and (max-width: 640px) {
  .block-search .field .name {
    font-size: 3vw;
  }
}
@media screen and (max-width: 640px) {
  .block-search .form {
    padding-right: 1vw;
  }
  .block-search .form .button.primary {
    font-size: 3vw;
  }
}