/* Start:/res/servicePage/45ba26caa4702ab9d9ca.css?1756987864125121*/ /*!*********************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./www/local/components/pages/service/templates/.default/style.scss ***! \*********************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** * Размер в дизайне указан, если у страницы маленькие отступы по бокам, цель функции пересчитать размеры, в случае, если * мы увеличиваем отступы, но хотим чтобы визуально страница осталась такой же, то есть уменьшаем размер пропорционально * уменьшению ширины контентной области * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @param {number} $oldContent - Изначальная ширина контентной области в пикселях (без указания px) * @param {number} $newContent - Измененная ширина контентной области в пикселях (без указания px) * @return {number} - Измененный размер в пикселях (без указания px) */ /** * Функция возвращает адаптивные размеры в заданном диапазоне, при пороге в $widthMaxSize и больше, размер будет * $maxSize, в диапазоне между $widthMinSize и $widthMaxSize, размер будет пропорционально уменьшаться/увеличиваться, * при достижении порога в $widthMinSize и меньше размер будет $minSize * * @param {number} $widthMinSize - Минимальная ширина экрана в пикселях (без указания px) * @param {number} $widthMaxSize - Максимальная ширина экрана в пикселях (без указания px) * @param {number} $minSize - Размер, который указан для минимальной ширины экрана в пикселях (без указания px) * @param {number} $maxSize - Размер, который указан для максимальной ширины экрана в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки больших экранов (от 1652px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки менее больших экранов (от 1551px до 1651px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки средних экранов (до 1550px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки маленьких экранов (от 1025px до 1252px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне планшетной верстки (от 768px до 1024px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне мобильной верстки (от 375px до 768px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * MIXINS: для каждого свойства десктопной верстки * * @param {number} ...$size - Размеры в пикселях (без указания px) * @return {property: px} */ .service { width: 100%; } @media (max-width: 1024px) { .service { max-width: unset; } } .service__heading { display: flex; flex-wrap: wrap; } .service__heading { gap: 20.5043478261px; } @media (max-width: 1651px) { .service__heading { gap: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .service__heading { gap: 15.652173913px; } } @media (max-width: 1252px) { .service__heading { gap: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } .service__heading { margin-bottom: 68.347826087px; } @media (max-width: 1651px) { .service__heading { margin-bottom: clamp(64.9130434783px, 64.9130434783px + 3.4347826087 * (100vw - 1551px) / 100, 68.347826087px); } } @media (max-width: 1550px) { .service__heading { margin-bottom: 52.1739130435px; } } @media (max-width: 1252px) { .service__heading { margin-bottom: clamp(42.3043478261px, 42.3043478261px + 9.8695652174 * (100vw - 1025px) / 227, 52.1739130435px); } } @media (max-width: 1024px) { .service__heading { flex-direction: row; gap: 8px; margin-bottom: clamp(60px, 60px + 20 * (100vw - 768px) / 256, 80px); } } @media (max-width: 767px) { .service__heading { flex-direction: row; margin-bottom: clamp(48px, 48px + 12 * (100vw - 375px) / 393, 60px); } } .service__heading-item { color: #000000; background: #F5F6F8; border-radius: 8px; display: flex; flex-direction: column; justify-content: center; align-items: center; } .service__heading-item { width: 244.3434782609px; } @media (max-width: 1651px) { .service__heading-item { width: clamp(232.0641304348px, 232.0641304348px + 12.2793478261 * (100vw - 1551px) / 100, 244.3434782609px); } } @media (max-width: 1550px) { .service__heading-item { width: 186.5217391304px; } } @media (max-width: 1252px) { .service__heading-item { width: clamp(151.2380434783px, 151.2380434783px + 35.2836956522 * (100vw - 1025px) / 227, 186.5217391304px); } } .service__heading-item { height: 75.1826086957px; } @media (max-width: 1651px) { .service__heading-item { height: clamp(71.4043478261px, 71.4043478261px + 3.7782608696 * (100vw - 1551px) / 100, 75.1826086957px); } } @media (max-width: 1550px) { .service__heading-item { height: 57.3913043478px; } } @media (max-width: 1252px) { .service__heading-item { height: clamp(46.5347826087px, 46.5347826087px + 10.8565217391 * (100vw - 1025px) / 227, 57.3913043478px); } } .service__heading-item { gap: 10.252173913px; } @media (max-width: 1651px) { .service__heading-item { gap: clamp(9.7369565217px, 9.7369565217px + 0.5152173913 * (100vw - 1551px) / 100, 10.252173913px); } } @media (max-width: 1550px) { .service__heading-item { gap: 7.8260869565px; } } @media (max-width: 1252px) { .service__heading-item { gap: clamp(6.3456521739px, 6.3456521739px + 1.4804347826 * (100vw - 1025px) / 227, 7.8260869565px); } } @media (max-width: 1024px) { .service__heading-item { gap: 12px; width: auto; height: auto; padding: clamp(5px, 5px + 5 * (100vw - 768px) / 256, 10px); } } @media (max-width: 767px) { .service__heading-item { width: auto; height: auto; padding: clamp(5px, 5px + 5 * (100vw - 375px) / 393, 10px); } } .service__heading-item:hover { background: #007B82; color: #FFFFFF; } .service__heading-item--active { background: #007B82; color: #FFFFFF; } .service__heading-text { margin: 40px 25px 25px; } .service__heading-text { font-size: 13.6695652174px; } @media (max-width: 1651px) { .service__heading-text { font-size: clamp(12.9826086957px, 12.9826086957px + 0.6869565217 * (100vw - 1551px) / 100, 13.6695652174px); } } @media (max-width: 1550px) { .service__heading-text { font-size: 10.4347826087px; } } @media (max-width: 1252px) { .service__heading-text { font-size: clamp(8.4608695652px, 8.4608695652px + 1.9739130435 * (100vw - 1025px) / 227, 10.4347826087px); } } .service__heading-text { line-height: 20.5043478261px; } @media (max-width: 1651px) { .service__heading-text { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .service__heading-text { line-height: 15.652173913px; } } @media (max-width: 1252px) { .service__heading-text { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .service__heading-text { font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); } } .service__heading-image { width: 42px; color: #7C7E80; } .service__heading-image { font-size: 15.3782608696px; } @media (max-width: 1651px) { .service__heading-image { font-size: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .service__heading-image { font-size: 11.7391304348px; } } @media (max-width: 1252px) { .service__heading-image { font-size: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } .service__heading-image { line-height: 20.5043478261px; } @media (max-width: 1651px) { .service__heading-image { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .service__heading-image { line-height: 15.652173913px; } } @media (max-width: 1252px) { .service__heading-image { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .service__heading-image { font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); } } .service__questions { margin-bottom: 85.4347826087px; } @media (max-width: 1651px) { .service__questions { margin-bottom: clamp(81.1413043478px, 81.1413043478px + 4.2934782609 * (100vw - 1551px) / 100, 85.4347826087px); } } @media (max-width: 1550px) { .service__questions { margin-bottom: 65.2173913043px; } } @media (max-width: 1252px) { .service__questions { margin-bottom: clamp(52.8804347826px, 52.8804347826px + 12.3369565217 * (100vw - 1025px) / 227, 65.2173913043px); } } @media (max-width: 1024px) { .service__questions { margin-bottom: clamp(80px, 80px + 20 * (100vw - 768px) / 256, 100px); } } @media (max-width: 767px) { .service__questions { margin-bottom: clamp(60px, 60px + 20 * (100vw - 375px) / 393, 80px); } } .service__questions-title { font-weight: 500; } .service__questions-title { font-size: 23.9217391304px; } @media (max-width: 1651px) { .service__questions-title { font-size: clamp(22.7195652174px, 22.7195652174px + 1.202173913 * (100vw - 1551px) / 100, 23.9217391304px); } } @media (max-width: 1550px) { .service__questions-title { font-size: 18.2608695652px; } } @media (max-width: 1252px) { .service__questions-title { font-size: clamp(14.8065217391px, 14.8065217391px + 3.4543478261 * (100vw - 1025px) / 227, 18.2608695652px); } } .service__questions-title { line-height: 27.3391304348px; } @media (max-width: 1651px) { .service__questions-title { line-height: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .service__questions-title { line-height: 20.8695652174px; } } @media (max-width: 1252px) { .service__questions-title { line-height: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .service__questions-title { margin-bottom: 13.6695652174px; } @media (max-width: 1651px) { .service__questions-title { margin-bottom: clamp(12.9826086957px, 12.9826086957px + 0.6869565217 * (100vw - 1551px) / 100, 13.6695652174px); } } @media (max-width: 1550px) { .service__questions-title { margin-bottom: 10.4347826087px; } } @media (max-width: 1252px) { .service__questions-title { margin-bottom: clamp(8.4608695652px, 8.4608695652px + 1.9739130435 * (100vw - 1025px) / 227, 10.4347826087px); } } @media (max-width: 1024px) { .service__questions-title { font-size: clamp(24px, 24px + 4 * (100vw - 768px) / 256, 28px); line-height: clamp(24px, 24px + 8 * (100vw - 768px) / 256, 32px); margin-bottom: 16px; } } @media (max-width: 767px) { .service__questions-title { font-size: clamp(20px, 20px + 4 * (100vw - 375px) / 393, 24px); margin-bottom: clamp(12px, 12px + 4 * (100vw - 375px) / 393, 16px); } } .service__questions-text { margin-bottom: 27.3391304348px; } @media (max-width: 1651px) { .service__questions-text { margin-bottom: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .service__questions-text { margin-bottom: 20.8695652174px; } } @media (max-width: 1252px) { .service__questions-text { margin-bottom: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .service__questions-text { font-size: 15.3782608696px; } @media (max-width: 1651px) { .service__questions-text { font-size: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .service__questions-text { font-size: 11.7391304348px; } } @media (max-width: 1252px) { .service__questions-text { font-size: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } @media (max-width: 1024px) { .service__questions-text { font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); margin-bottom: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); } } .service__question { border-bottom: 1px solid rgba(0, 0, 0, 0.1019607843); } .service__question { padding-bottom: 27.3391304348px; } @media (max-width: 1651px) { .service__question { padding-bottom: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .service__question { padding-bottom: 20.8695652174px; } } @media (max-width: 1252px) { .service__question { padding-bottom: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .service__question { margin-bottom: 27.3391304348px; } @media (max-width: 1651px) { .service__question { margin-bottom: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .service__question { margin-bottom: 20.8695652174px; } } @media (max-width: 1252px) { .service__question { margin-bottom: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } @media (max-width: 1024px) { .service__question { padding-bottom: clamp(24px, 24px + 8 * (100vw - 768px) / 256, 32px); margin-bottom: clamp(24px, 24px + 8 * (100vw - 768px) / 256, 32px); } } @media (max-width: 767px) { .service__question { padding-bottom: clamp(20px, 20px + 4 * (100vw - 375px) / 393, 24px); margin-bottom: clamp(20px, 20px + 4 * (100vw - 375px) / 393, 24px); } } .service__question-title { display: flex; justify-content: space-between; align-items: center; width: 100%; cursor: pointer; font-weight: 500; } .service__question-title { font-size: 17.0869565217px; } @media (max-width: 1651px) { .service__question-title { font-size: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .service__question-title { font-size: 13.0434782609px; } } @media (max-width: 1252px) { .service__question-title { font-size: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } @media (max-width: 1024px) { .service__question-title { font-size: 16px; line-height: 20px; } } .service__question-arrow { flex-shrink: 0; } .service__question-arrow { width: 27.3391304348px; } @media (max-width: 1651px) { .service__question-arrow { width: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .service__question-arrow { width: 20.8695652174px; } } @media (max-width: 1252px) { .service__question-arrow { width: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .service__question-arrow { height: 27.3391304348px; } @media (max-width: 1651px) { .service__question-arrow { height: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .service__question-arrow { height: 20.8695652174px; } } @media (max-width: 1252px) { .service__question-arrow { height: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .service__question-arrow--rotate { transform: rotate(180deg); } @media (max-width: 1024px) { .service__question-arrow { width: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); height: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); } } @media (max-width: 767px) { .service__question-arrow { width: clamp(20px, 20px + 8 * (100vw - 375px) / 393, 28px); height: clamp(20px, 20px + 8 * (100vw - 375px) / 393, 28px); } } .service__question-body { margin-top: 17.0869565217px; } @media (max-width: 1651px) { .service__question-body { margin-top: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .service__question-body { margin-top: 13.0434782609px; } } @media (max-width: 1252px) { .service__question-body { margin-top: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } .service__question-body { font-size: 15.3782608696px; } @media (max-width: 1651px) { .service__question-body { font-size: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .service__question-body { font-size: 11.7391304348px; } } @media (max-width: 1252px) { .service__question-body { font-size: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } .service__question-body { line-height: 20.5043478261px; } @media (max-width: 1651px) { .service__question-body { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .service__question-body { line-height: 15.652173913px; } } @media (max-width: 1252px) { .service__question-body { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .service__question-body { margin-top: clamp(12px, 12px + 8 * (100vw - 768px) / 256, 20px); font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); } } .service__question-body--hide { display: none; } @media (max-width: 1024px) { .service__question-name { font-size: clamp(16px, 16px + 4 * (100vw - 768px) / 256, 20px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); margin-inline-end: 35px; } } /*!************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./node_modules/swiper/swiper.scss ***! \************************************************************************************************************************************************************************************************/ /** * Swiper 11.2.4 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2025 Vladimir Kharlampidi * * Released under the MIT License * * Released on: February 14, 2025 */ @font-face { font-family: "swiper-icons"; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff"); font-weight: 400; font-style: normal; } :root { --swiper-theme-color: #007aff; /* --swiper-preloader-color: var(--swiper-theme-color); --swiper-wrapper-transition-timing-function: initial; */ } :host { position: relative; display: block; margin-left: auto; margin-right: auto; z-index: 1; } .swiper { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; /* Fix of Webkit flickering */ z-index: 1; display: block; } .swiper-vertical > .swiper-wrapper { flex-direction: column; } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial); box-sizing: content-box; } .swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper { transform: translate3d(0px, 0, 0); } .swiper-horizontal { touch-action: pan-y; } .swiper-vertical { touch-action: pan-x; } .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; display: block; } .swiper-slide-invisible-blank { visibility: hidden; } /* Auto Height */ .swiper-autoheight, .swiper-autoheight .swiper-slide { height: auto; } .swiper-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform, height; } .swiper-backface-hidden .swiper-slide { transform: translateZ(0); backface-visibility: hidden; } /* 3D Effects */ .swiper-3d.swiper-css-mode .swiper-wrapper { perspective: 1200px; } .swiper-3d .swiper-wrapper { transform-style: preserve-3d; } .swiper-3d { perspective: 1200px; } .swiper-3d .swiper-slide, .swiper-3d .swiper-cube-shadow { transform-style: preserve-3d; } /* CSS Mode */ .swiper-css-mode > .swiper-wrapper { overflow: auto; scrollbar-width: none; /* For Firefox */ -ms-overflow-style: none; /* For Internet Explorer and Edge */ } .swiper-css-mode > .swiper-wrapper::-webkit-scrollbar { display: none; } .swiper-css-mode > .swiper-wrapper > .swiper-slide { scroll-snap-align: start start; } .swiper-css-mode.swiper-horizontal > .swiper-wrapper { scroll-snap-type: x mandatory; } .swiper-css-mode.swiper-vertical > .swiper-wrapper { scroll-snap-type: y mandatory; } .swiper-css-mode.swiper-free-mode > .swiper-wrapper { scroll-snap-type: none; } .swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide { scroll-snap-align: none; } .swiper-css-mode.swiper-centered > .swiper-wrapper::before { content: ""; flex-shrink: 0; order: 9999; } .swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide { scroll-snap-align: center center; scroll-snap-stop: always; } .swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child { margin-inline-start: var(--swiper-centered-offset-before); } .swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before { height: 100%; min-height: 1px; width: var(--swiper-centered-offset-after); } .swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child { margin-block-start: var(--swiper-centered-offset-before); } .swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before { width: 100%; min-width: 1px; height: var(--swiper-centered-offset-after); } /* Slide styles start */ /* 3D Shadows */ .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-slide-shadow-bottom { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; } .swiper-3d .swiper-slide-shadow { background: rgba(0, 0, 0, 0.15); } .swiper-3d .swiper-slide-shadow-left { background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-3d .swiper-slide-shadow-right { background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-3d .swiper-slide-shadow-top { background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-3d .swiper-slide-shadow-bottom { background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; transform-origin: 50%; box-sizing: border-box; border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); border-radius: 50%; border-top-color: transparent; } .swiper:not(.swiper-watch-progress) .swiper-lazy-preloader, .swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader { animation: swiper-preloader-spin 1s infinite linear; } .swiper-lazy-preloader-white { --swiper-preloader-color: #fff; } .swiper-lazy-preloader-black { --swiper-preloader-color: #000; } @keyframes swiper-preloader-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* Slide styles end */ /*!***********************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./node_modules/swiper/modules/free-mode.scss ***! \***********************************************************************************************************************************************************************************************************/ .swiper-free-mode > .swiper-wrapper { transition-timing-function: ease-out; margin: 0 auto; } /*!****************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./www/local/components/pages/documents/templates/.default/mainbutton.scss ***! \****************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** * Размер в дизайне указан, если у страницы маленькие отступы по бокам, цель функции пересчитать размеры, в случае, если * мы увеличиваем отступы, но хотим чтобы визуально страница осталась такой же, то есть уменьшаем размер пропорционально * уменьшению ширины контентной области * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @param {number} $oldContent - Изначальная ширина контентной области в пикселях (без указания px) * @param {number} $newContent - Измененная ширина контентной области в пикселях (без указания px) * @return {number} - Измененный размер в пикселях (без указания px) */ /** * Функция возвращает адаптивные размеры в заданном диапазоне, при пороге в $widthMaxSize и больше, размер будет * $maxSize, в диапазоне между $widthMinSize и $widthMaxSize, размер будет пропорционально уменьшаться/увеличиваться, * при достижении порога в $widthMinSize и меньше размер будет $minSize * * @param {number} $widthMinSize - Минимальная ширина экрана в пикселях (без указания px) * @param {number} $widthMaxSize - Максимальная ширина экрана в пикселях (без указания px) * @param {number} $minSize - Размер, который указан для минимальной ширины экрана в пикселях (без указания px) * @param {number} $maxSize - Размер, который указан для максимальной ширины экрана в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки больших экранов (от 1652px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки менее больших экранов (от 1551px до 1651px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки средних экранов (до 1550px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки маленьких экранов (от 1025px до 1252px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне планшетной верстки (от 768px до 1024px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне мобильной верстки (от 375px до 768px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * MIXINS: для каждого свойства десктопной верстки * * @param {number} ...$size - Размеры в пикселях (без указания px) * @return {property: px} */ .mainbutton { display: inline-block; color: #FFFFFF; font-weight: 500; border: none; background: #007B82; cursor: pointer; white-space: nowrap; } .mainbutton { font-size: 13.6695652174px; } @media (max-width: 1651px) { .mainbutton { font-size: clamp(12.9826086957px, 12.9826086957px + 0.6869565217 * (100vw - 1551px) / 100, 13.6695652174px); } } @media (max-width: 1550px) { .mainbutton { font-size: 10.4347826087px; } } @media (max-width: 1252px) { .mainbutton { font-size: clamp(8.4608695652px, 8.4608695652px + 1.9739130435 * (100vw - 1025px) / 227, 10.4347826087px); } } .mainbutton { line-height: 20.5043478261px; } @media (max-width: 1651px) { .mainbutton { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .mainbutton { line-height: 15.652173913px; } } @media (max-width: 1252px) { .mainbutton { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } .mainbutton { padding: 13.6695652174px 23.9217391304px; } @media (max-width: 1651px) { .mainbutton { padding: clamp(12.9826086957px, 12.9826086957px + 0.6869565217 * (100vw - 1551px) / 100, 13.6695652174px) clamp(22.7195652174px, 22.7195652174px + 1.202173913 * (100vw - 1551px) / 100, 23.9217391304px); } } @media (max-width: 1550px) { .mainbutton { padding: 10.4347826087px 18.2608695652px; } } @media (max-width: 1252px) { .mainbutton { padding: clamp(8.4608695652px, 8.4608695652px + 1.9739130435 * (100vw - 1025px) / 227, 10.4347826087px) clamp(14.8065217391px, 14.8065217391px + 3.4543478261 * (100vw - 1025px) / 227, 18.2608695652px); } } .mainbutton { border-radius: 6.8347826087px; } @media (max-width: 1651px) { .mainbutton { border-radius: clamp(6.4913043478px, 6.4913043478px + 0.3434782609 * (100vw - 1551px) / 100, 6.8347826087px); } } @media (max-width: 1550px) { .mainbutton { border-radius: 5.2173913043px; } } @media (max-width: 1252px) { .mainbutton { border-radius: clamp(4.2304347826px, 4.2304347826px + 0.9869565217 * (100vw - 1025px) / 227, 5.2173913043px); } } .mainbutton:hover { background: #33959B; } @media (max-width: 1024px) { .mainbutton { font-size: clamp(14px, 14px + 2 * (100vw - 768px) / 256, 16px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); padding: clamp(12px, 12px + 4 * (100vw - 768px) / 256, 16px) clamp(22px, 22px + 6 * (100vw - 768px) / 256, 28px); } } .mainbutton__icon { vertical-align: middle; } .mainbutton__icon { margin-left: 6.8347826087px; } @media (max-width: 1651px) { .mainbutton__icon { margin-left: clamp(6.4913043478px, 6.4913043478px + 0.3434782609 * (100vw - 1551px) / 100, 6.8347826087px); } } @media (max-width: 1550px) { .mainbutton__icon { margin-left: 5.2173913043px; } } @media (max-width: 1252px) { .mainbutton__icon { margin-left: clamp(4.2304347826px, 4.2304347826px + 0.9869565217 * (100vw - 1025px) / 227, 5.2173913043px); } } .mainbutton__icon--download { width: 15.3782608696px; } @media (max-width: 1651px) { .mainbutton__icon--download { width: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .mainbutton__icon--download { width: 11.7391304348px; } } @media (max-width: 1252px) { .mainbutton__icon--download { width: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } .mainbutton__icon--download { height: 15.3782608696px; } @media (max-width: 1651px) { .mainbutton__icon--download { height: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .mainbutton__icon--download { height: 11.7391304348px; } } @media (max-width: 1252px) { .mainbutton__icon--download { height: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } @media (max-width: 1024px) { .mainbutton__icon--download { width: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); height: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); } } /*!*********************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./www/local/components/pages/support/templates/.default/style.scss ***! \*********************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** * Размер в дизайне указан, если у страницы маленькие отступы по бокам, цель функции пересчитать размеры, в случае, если * мы увеличиваем отступы, но хотим чтобы визуально страница осталась такой же, то есть уменьшаем размер пропорционально * уменьшению ширины контентной области * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @param {number} $oldContent - Изначальная ширина контентной области в пикселях (без указания px) * @param {number} $newContent - Измененная ширина контентной области в пикселях (без указания px) * @return {number} - Измененный размер в пикселях (без указания px) */ /** * Функция возвращает адаптивные размеры в заданном диапазоне, при пороге в $widthMaxSize и больше, размер будет * $maxSize, в диапазоне между $widthMinSize и $widthMaxSize, размер будет пропорционально уменьшаться/увеличиваться, * при достижении порога в $widthMinSize и меньше размер будет $minSize * * @param {number} $widthMinSize - Минимальная ширина экрана в пикселях (без указания px) * @param {number} $widthMaxSize - Максимальная ширина экрана в пикселях (без указания px) * @param {number} $minSize - Размер, который указан для минимальной ширины экрана в пикселях (без указания px) * @param {number} $maxSize - Размер, который указан для максимальной ширины экрана в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки больших экранов (от 1652px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки менее больших экранов (от 1551px до 1651px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки средних экранов (до 1550px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки маленьких экранов (от 1025px до 1252px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне планшетной верстки (от 768px до 1024px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне мобильной верстки (от 375px до 768px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * MIXINS: для каждого свойства десктопной верстки * * @param {number} ...$size - Размеры в пикселях (без указания px) * @return {property: px} */ .support { width: 100%; } .support { max-width: 1173.8739130435px; } @media (max-width: 1651px) { .support { max-width: clamp(1114.8815217391px, 1114.8815217391px + 58.9923913043 * (100vw - 1551px) / 100, 1173.8739130435px); } } @media (max-width: 1550px) { .support { max-width: 896.0869565217px; } } @media (max-width: 1252px) { .support { max-width: clamp(726.577173913px, 726.577173913px + 169.5097826087 * (100vw - 1025px) / 227, 896.0869565217px); } } @media (max-width: 1024px) { .support { max-width: unset; } } .support__heading { display: flex; } .support__heading { gap: 20.5043478261px; } @media (max-width: 1651px) { .support__heading { gap: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .support__heading { gap: 15.652173913px; } } @media (max-width: 1252px) { .support__heading { gap: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } .support__heading { margin-bottom: 68.347826087px; } @media (max-width: 1651px) { .support__heading { margin-bottom: clamp(64.9130434783px, 64.9130434783px + 3.4347826087 * (100vw - 1551px) / 100, 68.347826087px); } } @media (max-width: 1550px) { .support__heading { margin-bottom: 52.1739130435px; } } @media (max-width: 1252px) { .support__heading { margin-bottom: clamp(42.3043478261px, 42.3043478261px + 9.8695652174 * (100vw - 1025px) / 227, 52.1739130435px); } } @media (max-width: 1024px) { .support__heading { flex-direction: column; gap: 8px; margin-bottom: clamp(60px, 60px + 20 * (100vw - 768px) / 256, 80px); } } @media (max-width: 767px) { .support__heading { margin-bottom: clamp(48px, 48px + 12 * (100vw - 375px) / 393, 60px); } } .support__heading-item { background: #F5F6F8; border-radius: 8px; display: flex; flex-direction: column; width: 100%; } .support__heading-item { padding: 27.3391304348px; } @media (max-width: 1651px) { .support__heading-item { padding: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .support__heading-item { padding: 20.8695652174px; } } @media (max-width: 1252px) { .support__heading-item { padding: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .support__heading-item { gap: 10.252173913px; } @media (max-width: 1651px) { .support__heading-item { gap: clamp(9.7369565217px, 9.7369565217px + 0.5152173913 * (100vw - 1551px) / 100, 10.252173913px); } } @media (max-width: 1550px) { .support__heading-item { gap: 7.8260869565px; } } @media (max-width: 1252px) { .support__heading-item { gap: clamp(6.3456521739px, 6.3456521739px + 1.4804347826 * (100vw - 1025px) / 227, 7.8260869565px); } } @media (max-width: 1024px) { .support__heading-item { width: unset; gap: 12px; padding: clamp(24px, 24px + 8 * (100vw - 768px) / 256, 32px); } } @media (max-width: 767px) { .support__heading-item { padding: clamp(16px, 16px + 8 * (100vw - 375px) / 393, 24px); } } .support__heading-text { color: #7C7E80; } .support__heading-text { font-size: 15.3782608696px; } @media (max-width: 1651px) { .support__heading-text { font-size: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .support__heading-text { font-size: 11.7391304348px; } } @media (max-width: 1252px) { .support__heading-text { font-size: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } .support__heading-text { line-height: 20.5043478261px; } @media (max-width: 1651px) { .support__heading-text { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .support__heading-text { line-height: 15.652173913px; } } @media (max-width: 1252px) { .support__heading-text { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .support__heading-text { font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); } } .support__number { display: flex; align-items: center; font-weight: 500; } .support__number { gap: 10.252173913px; } @media (max-width: 1651px) { .support__number { gap: clamp(9.7369565217px, 9.7369565217px + 0.5152173913 * (100vw - 1551px) / 100, 10.252173913px); } } @media (max-width: 1550px) { .support__number { gap: 7.8260869565px; } } @media (max-width: 1252px) { .support__number { gap: clamp(6.3456521739px, 6.3456521739px + 1.4804347826 * (100vw - 1025px) / 227, 7.8260869565px); } } .support__number { font-size: 17.0869565217px; } @media (max-width: 1651px) { .support__number { font-size: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .support__number { font-size: 13.0434782609px; } } @media (max-width: 1252px) { .support__number { font-size: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } .support__number { line-height: 20.5043478261px; } @media (max-width: 1651px) { .support__number { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .support__number { line-height: 15.652173913px; } } @media (max-width: 1252px) { .support__number { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .support__number { line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); gap: 12px; font-size: clamp(16px, 16px + 4 * (100vw - 768px) / 256, 20px); } } .support__number:hover { color: #007B82; } .support__phone { width: max-content; } .support__phone { width: 17.0869565217px; } @media (max-width: 1651px) { .support__phone { width: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .support__phone { width: 13.0434782609px; } } @media (max-width: 1252px) { .support__phone { width: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } .support__phone { height: 17.0869565217px; } @media (max-width: 1651px) { .support__phone { height: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .support__phone { height: 13.0434782609px; } } @media (max-width: 1252px) { .support__phone { height: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } @media (max-width: 1024px) { .support__phone { width: 20px; height: 20px; } } .support__email { display: flex; align-items: center; font-weight: 500; } .support__email { gap: 6.8347826087px; } @media (max-width: 1651px) { .support__email { gap: clamp(6.4913043478px, 6.4913043478px + 0.3434782609 * (100vw - 1551px) / 100, 6.8347826087px); } } @media (max-width: 1550px) { .support__email { gap: 5.2173913043px; } } @media (max-width: 1252px) { .support__email { gap: clamp(4.2304347826px, 4.2304347826px + 0.9869565217 * (100vw - 1025px) / 227, 5.2173913043px); } } .support__email { font-size: 17.0869565217px; } @media (max-width: 1651px) { .support__email { font-size: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .support__email { font-size: 13.0434782609px; } } @media (max-width: 1252px) { .support__email { font-size: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } @media (max-width: 1024px) { .support__email { line-height: 20px; gap: 4px; font-size: clamp(16px, 16px + 4 * (100vw - 768px) / 256, 20px); } } .support__email-link { display: flex; align-items: center; } .support__email-link { gap: 6.8347826087px; } @media (max-width: 1651px) { .support__email-link { gap: clamp(6.4913043478px, 6.4913043478px + 0.3434782609 * (100vw - 1551px) / 100, 6.8347826087px); } } @media (max-width: 1550px) { .support__email-link { gap: 5.2173913043px; } } @media (max-width: 1252px) { .support__email-link { gap: clamp(4.2304347826px, 4.2304347826px + 0.9869565217 * (100vw - 1025px) / 227, 5.2173913043px); } } @media (max-width: 1024px) { .support__email-link { gap: 4px; } } .support__email-link:hover { color: #007B82; } .support__mail { width: 20.5043478261px; } @media (max-width: 1651px) { .support__mail { width: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .support__mail { width: 15.652173913px; } } @media (max-width: 1252px) { .support__mail { width: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } .support__mail { height: 20.5043478261px; } @media (max-width: 1651px) { .support__mail { height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .support__mail { height: 15.652173913px; } } @media (max-width: 1252px) { .support__mail { height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .support__mail { margin-right: 4px; width: 24px; height: 24px; } } .support__copy { cursor: pointer; } .support__copy { width: 20.5043478261px; } @media (max-width: 1651px) { .support__copy { width: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .support__copy { width: 15.652173913px; } } @media (max-width: 1252px) { .support__copy { width: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } .support__copy { height: 20.5043478261px; } @media (max-width: 1651px) { .support__copy { height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .support__copy { height: 15.652173913px; } } @media (max-width: 1252px) { .support__copy { height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .support__copy { width: 24px; height: 24px; } } .support__copy:hover { color: #007B82; } .support__questions { margin-bottom: 85.4347826087px; } @media (max-width: 1651px) { .support__questions { margin-bottom: clamp(81.1413043478px, 81.1413043478px + 4.2934782609 * (100vw - 1551px) / 100, 85.4347826087px); } } @media (max-width: 1550px) { .support__questions { margin-bottom: 65.2173913043px; } } @media (max-width: 1252px) { .support__questions { margin-bottom: clamp(52.8804347826px, 52.8804347826px + 12.3369565217 * (100vw - 1025px) / 227, 65.2173913043px); } } @media (max-width: 1024px) { .support__questions { margin-bottom: clamp(80px, 80px + 20 * (100vw - 768px) / 256, 100px); } } @media (max-width: 767px) { .support__questions { margin-bottom: clamp(60px, 60px + 20 * (100vw - 375px) / 393, 80px); } } .support__questions-title { font-weight: 500; } .support__questions-title { font-size: 23.9217391304px; } @media (max-width: 1651px) { .support__questions-title { font-size: clamp(22.7195652174px, 22.7195652174px + 1.202173913 * (100vw - 1551px) / 100, 23.9217391304px); } } @media (max-width: 1550px) { .support__questions-title { font-size: 18.2608695652px; } } @media (max-width: 1252px) { .support__questions-title { font-size: clamp(14.8065217391px, 14.8065217391px + 3.4543478261 * (100vw - 1025px) / 227, 18.2608695652px); } } .support__questions-title { line-height: 27.3391304348px; } @media (max-width: 1651px) { .support__questions-title { line-height: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .support__questions-title { line-height: 20.8695652174px; } } @media (max-width: 1252px) { .support__questions-title { line-height: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .support__questions-title { margin-bottom: 13.6695652174px; } @media (max-width: 1651px) { .support__questions-title { margin-bottom: clamp(12.9826086957px, 12.9826086957px + 0.6869565217 * (100vw - 1551px) / 100, 13.6695652174px); } } @media (max-width: 1550px) { .support__questions-title { margin-bottom: 10.4347826087px; } } @media (max-width: 1252px) { .support__questions-title { margin-bottom: clamp(8.4608695652px, 8.4608695652px + 1.9739130435 * (100vw - 1025px) / 227, 10.4347826087px); } } @media (max-width: 1024px) { .support__questions-title { font-size: clamp(24px, 24px + 4 * (100vw - 768px) / 256, 28px); line-height: clamp(24px, 24px + 8 * (100vw - 768px) / 256, 32px); margin-bottom: 16px; } } @media (max-width: 767px) { .support__questions-title { font-size: clamp(20px, 20px + 4 * (100vw - 375px) / 393, 24px); margin-bottom: clamp(12px, 12px + 4 * (100vw - 375px) / 393, 16px); } } .support__questions-text { margin-bottom: 27.3391304348px; } @media (max-width: 1651px) { .support__questions-text { margin-bottom: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .support__questions-text { margin-bottom: 20.8695652174px; } } @media (max-width: 1252px) { .support__questions-text { margin-bottom: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .support__questions-text { font-size: 15.3782608696px; } @media (max-width: 1651px) { .support__questions-text { font-size: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .support__questions-text { font-size: 11.7391304348px; } } @media (max-width: 1252px) { .support__questions-text { font-size: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } @media (max-width: 1024px) { .support__questions-text { font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); margin-bottom: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); } } /*!*********************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./www/local/components/blocks/services/templates/service/service-sections.scss ***! \*********************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** * Размер в дизайне указан, если у страницы маленькие отступы по бокам, цель функции пересчитать размеры, в случае, если * мы увеличиваем отступы, но хотим чтобы визуально страница осталась такой же, то есть уменьшаем размер пропорционально * уменьшению ширины контентной области * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @param {number} $oldContent - Изначальная ширина контентной области в пикселях (без указания px) * @param {number} $newContent - Измененная ширина контентной области в пикселях (без указания px) * @return {number} - Измененный размер в пикселях (без указания px) */ /** * Функция возвращает адаптивные размеры в заданном диапазоне, при пороге в $widthMaxSize и больше, размер будет * $maxSize, в диапазоне между $widthMinSize и $widthMaxSize, размер будет пропорционально уменьшаться/увеличиваться, * при достижении порога в $widthMinSize и меньше размер будет $minSize * * @param {number} $widthMinSize - Минимальная ширина экрана в пикселях (без указания px) * @param {number} $widthMaxSize - Максимальная ширина экрана в пикселях (без указания px) * @param {number} $minSize - Размер, который указан для минимальной ширины экрана в пикселях (без указания px) * @param {number} $maxSize - Размер, который указан для максимальной ширины экрана в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки больших экранов (от 1652px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки менее больших экранов (от 1551px до 1651px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки средних экранов (до 1550px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки маленьких экранов (от 1025px до 1252px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне планшетной верстки (от 768px до 1024px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне мобильной верстки (от 375px до 768px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * MIXINS: для каждого свойства десктопной верстки * * @param {number} ...$size - Размеры в пикселях (без указания px) * @return {property: px} */ .service-sections { margin-bottom: 30.7565217391px; } @media (max-width: 1651px) { .service-sections { margin-bottom: clamp(29.2108695652px, 29.2108695652px + 1.5456521739 * (100vw - 1551px) / 100, 30.7565217391px); } } @media (max-width: 1550px) { .service-sections { margin-bottom: 23.4782608696px; } } @media (max-width: 1252px) { .service-sections { margin-bottom: clamp(19.0369565217px, 19.0369565217px + 4.4413043478 * (100vw - 1025px) / 227, 23.4782608696px); } } @media (max-width: 1024px) { .service-sections { margin-bottom: clamp(32px, 32px + 4 * (100vw - 768px) / 256, 36px); } } @media (max-width: 767px) { .service-sections { margin-bottom: clamp(30px, 30px + 2 * (100vw - 375px) / 393, 32px); } } .service-sections__wrapper { display: grid; grid-template-columns: repeat(6, 1fr); } .service-sections__wrapper { gap: 10.252173913px; } @media (max-width: 1651px) { .service-sections__wrapper { gap: clamp(9.7369565217px, 9.7369565217px + 0.5152173913 * (100vw - 1551px) / 100, 10.252173913px); } } @media (max-width: 1550px) { .service-sections__wrapper { gap: 7.8260869565px; } } @media (max-width: 1252px) { .service-sections__wrapper { gap: clamp(6.3456521739px, 6.3456521739px + 1.4804347826 * (100vw - 1025px) / 227, 7.8260869565px); } } @media (max-width: 1024px) { .service-sections__wrapper { display: flex; gap: 0; } } .service-sections__item { box-sizing: border-box; background: #F0F1F4; color: #24282B; font-weight: 500; display: flex; align-items: center; justify-content: space-between; } .service-sections__item { border-radius: 6.8347826087px; } @media (max-width: 1651px) { .service-sections__item { border-radius: clamp(6.4913043478px, 6.4913043478px + 0.3434782609 * (100vw - 1551px) / 100, 6.8347826087px); } } @media (max-width: 1550px) { .service-sections__item { border-radius: 5.2173913043px; } } @media (max-width: 1252px) { .service-sections__item { border-radius: clamp(4.2304347826px, 4.2304347826px + 0.9869565217 * (100vw - 1025px) / 227, 5.2173913043px); } } .service-sections__item { font-size: 13.6695652174px; } @media (max-width: 1651px) { .service-sections__item { font-size: clamp(12.9826086957px, 12.9826086957px + 0.6869565217 * (100vw - 1551px) / 100, 13.6695652174px); } } @media (max-width: 1550px) { .service-sections__item { font-size: 10.4347826087px; } } @media (max-width: 1252px) { .service-sections__item { font-size: clamp(8.4608695652px, 8.4608695652px + 1.9739130435 * (100vw - 1025px) / 227, 10.4347826087px); } } .service-sections__item { line-height: 17.0869565217px; } @media (max-width: 1651px) { .service-sections__item { line-height: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .service-sections__item { line-height: 13.0434782609px; } } @media (max-width: 1252px) { .service-sections__item { line-height: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } .service-sections__item { height: 75.1826086957px; } @media (max-width: 1651px) { .service-sections__item { height: clamp(71.4043478261px, 71.4043478261px + 3.7782608696 * (100vw - 1551px) / 100, 75.1826086957px); } } @media (max-width: 1550px) { .service-sections__item { height: 57.3913043478px; } } @media (max-width: 1252px) { .service-sections__item { height: clamp(46.5347826087px, 46.5347826087px + 10.8565217391 * (100vw - 1025px) / 227, 57.3913043478px); } } .service-sections__item { padding: 0px 17.0869565217px; } @media (max-width: 1651px) { .service-sections__item { padding: clamp(0px, 0px + 0 * (100vw - 1551px) / 100, 0px) clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .service-sections__item { padding: 0px 13.0434782609px; } } @media (max-width: 1252px) { .service-sections__item { padding: clamp(0px, 0px + 0 * (100vw - 1025px) / 227, 0px) clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } .service-sections__item--active { background: #007B82; color: #FFFFFF; } .service-sections__item:hover:not(.service-sections__item--active) { color: #007B82; background: #F5F6F8; } @media (max-width: 1024px) { .service-sections__item { -webkit-user-select: none; user-select: none; max-width: max-content; height: auto; font-size: clamp(14px, 14px + 2 * (100vw - 768px) / 256, 16px); line-height: clamp(18px, 18px + 2 * (100vw - 768px) / 256, 20px); padding: clamp(12px, 12px + 8 * (100vw - 768px) / 256, 20px); } } @media (max-width: 767px) { .service-sections__item { padding: 12px; font-size: clamp(12px, 12px + 2 * (100vw - 375px) / 393, 14px); line-height: clamp(16px, 16px + 2 * (100vw - 375px) / 393, 18px); } } .service-sections__item-title:last-child { padding-right: 37.5913043478px; } @media (max-width: 1651px) { .service-sections__item-title:last-child { padding-right: clamp(35.702173913px, 35.702173913px + 1.8891304348 * (100vw - 1551px) / 100, 37.5913043478px); } } @media (max-width: 1550px) { .service-sections__item-title:last-child { padding-right: 28.6956521739px; } } @media (max-width: 1252px) { .service-sections__item-title:last-child { padding-right: clamp(23.2673913043px, 23.2673913043px + 5.4282608696 * (100vw - 1025px) / 227, 28.6956521739px); } } @media (max-width: 1024px) { .service-sections__item-title:last-child { padding-right: 0; } } .service-sections__item-img { max-width: 37.5913043478px; } @media (max-width: 1651px) { .service-sections__item-img { max-width: clamp(35.702173913px, 35.702173913px + 1.8891304348 * (100vw - 1551px) / 100, 37.5913043478px); } } @media (max-width: 1550px) { .service-sections__item-img { max-width: 28.6956521739px; } } @media (max-width: 1252px) { .service-sections__item-img { max-width: clamp(23.2673913043px, 23.2673913043px + 5.4282608696 * (100vw - 1025px) / 227, 28.6956521739px); } } .service-sections__item-img { max-height: 37.5913043478px; } @media (max-width: 1651px) { .service-sections__item-img { max-height: clamp(35.702173913px, 35.702173913px + 1.8891304348 * (100vw - 1551px) / 100, 37.5913043478px); } } @media (max-width: 1550px) { .service-sections__item-img { max-height: 28.6956521739px; } } @media (max-width: 1252px) { .service-sections__item-img { max-height: clamp(23.2673913043px, 23.2673913043px + 5.4282608696 * (100vw - 1025px) / 227, 28.6956521739px); } } @media (max-width: 1024px) { .service-sections__item-img { display: none; } } /*!*********************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./www/local/components/blocks/services/templates/service/tabs.scss ***! \*********************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** * Размер в дизайне указан, если у страницы маленькие отступы по бокам, цель функции пересчитать размеры, в случае, если * мы увеличиваем отступы, но хотим чтобы визуально страница осталась такой же, то есть уменьшаем размер пропорционально * уменьшению ширины контентной области * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @param {number} $oldContent - Изначальная ширина контентной области в пикселях (без указания px) * @param {number} $newContent - Измененная ширина контентной области в пикселях (без указания px) * @return {number} - Измененный размер в пикселях (без указания px) */ /** * Функция возвращает адаптивные размеры в заданном диапазоне, при пороге в $widthMaxSize и больше, размер будет * $maxSize, в диапазоне между $widthMinSize и $widthMaxSize, размер будет пропорционально уменьшаться/увеличиваться, * при достижении порога в $widthMinSize и меньше размер будет $minSize * * @param {number} $widthMinSize - Минимальная ширина экрана в пикселях (без указания px) * @param {number} $widthMaxSize - Максимальная ширина экрана в пикселях (без указания px) * @param {number} $minSize - Размер, который указан для минимальной ширины экрана в пикселях (без указания px) * @param {number} $maxSize - Размер, который указан для максимальной ширины экрана в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки больших экранов (от 1652px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки менее больших экранов (от 1551px до 1651px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки средних экранов (до 1550px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки маленьких экранов (от 1025px до 1252px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне планшетной верстки (от 768px до 1024px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне мобильной верстки (от 375px до 768px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * MIXINS: для каждого свойства десктопной верстки * * @param {number} ...$size - Размеры в пикселях (без указания px) * @return {property: px} */ .tabs__head { position: relative; display: flex; } .tabs__head { margin-bottom: 27.3391304348px; } @media (max-width: 1651px) { .tabs__head { margin-bottom: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .tabs__head { margin-bottom: 20.8695652174px; } } @media (max-width: 1252px) { .tabs__head { margin-bottom: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } @media (max-width: 1024px) { .tabs__head { margin-bottom: 32px; } } @media (max-width: 767px) { .tabs__head { margin-bottom: clamp(30px, 30px + 2 * (100vw - 375px) / 393, 32px); } } .tabs__head:after { content: ""; border-bottom: 1px solid #E5E6EC; height: 0; position: absolute; top: 100%; left: -50%; right: -50%; margin-top: -1px; z-index: 0; } .tabs__head-item { color: #7C7E80; font-weight: 500; max-width: max-content; cursor: pointer; position: relative; z-index: 1; } .tabs__head-item { font-size: 13.6695652174px; } @media (max-width: 1651px) { .tabs__head-item { font-size: clamp(12.9826086957px, 12.9826086957px + 0.6869565217 * (100vw - 1551px) / 100, 13.6695652174px); } } @media (max-width: 1550px) { .tabs__head-item { font-size: 10.4347826087px; } } @media (max-width: 1252px) { .tabs__head-item { font-size: clamp(8.4608695652px, 8.4608695652px + 1.9739130435 * (100vw - 1025px) / 227, 10.4347826087px); } } .tabs__head-item { line-height: 20.5043478261px; } @media (max-width: 1651px) { .tabs__head-item { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .tabs__head-item { line-height: 15.652173913px; } } @media (max-width: 1252px) { .tabs__head-item { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } .tabs__head-item { padding: 0px 17.0869565217px 10.252173913px; } @media (max-width: 1651px) { .tabs__head-item { padding: clamp(0px, 0px + 0 * (100vw - 1551px) / 100, 0px) clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px) clamp(9.7369565217px, 9.7369565217px + 0.5152173913 * (100vw - 1551px) / 100, 10.252173913px); } } @media (max-width: 1550px) { .tabs__head-item { padding: 0px 13.0434782609px 7.8260869565px; } } @media (max-width: 1252px) { .tabs__head-item { padding: clamp(0px, 0px + 0 * (100vw - 1025px) / 227, 0px) clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px) clamp(6.3456521739px, 6.3456521739px + 1.4804347826 * (100vw - 1025px) / 227, 7.8260869565px); } } .tabs__head-item:hover:not(.tabs__head-item--active) { color: #24282B; } .tabs__head-item--active { color: #007B82; border-bottom: 2px solid #007B82; cursor: default; } @media (max-width: 1024px) { .tabs__head-item { font-size: clamp(14px, 14px + 2 * (100vw - 768px) / 256, 16px); line-weight: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); padding: 0 clamp(16px, 16px + 4 * (100vw - 768px) / 256, 20px) 12px; } } .tabs__limited-width { max-width: 1173.8739130435px; } @media (max-width: 1651px) { .tabs__limited-width { max-width: clamp(1114.8815217391px, 1114.8815217391px + 58.9923913043 * (100vw - 1551px) / 100, 1173.8739130435px); } } @media (max-width: 1550px) { .tabs__limited-width { max-width: 896.0869565217px; } } @media (max-width: 1252px) { .tabs__limited-width { max-width: clamp(726.577173913px, 726.577173913px + 169.5097826087 * (100vw - 1025px) / 227, 896.0869565217px); } } .tabs__tab-content--hidden { display: none; } /*!************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./www/local/components/blocks/services/templates/service/tariffs.scss ***! \************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** * Размер в дизайне указан, если у страницы маленькие отступы по бокам, цель функции пересчитать размеры, в случае, если * мы увеличиваем отступы, но хотим чтобы визуально страница осталась такой же, то есть уменьшаем размер пропорционально * уменьшению ширины контентной области * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @param {number} $oldContent - Изначальная ширина контентной области в пикселях (без указания px) * @param {number} $newContent - Измененная ширина контентной области в пикселях (без указания px) * @return {number} - Измененный размер в пикселях (без указания px) */ /** * Функция возвращает адаптивные размеры в заданном диапазоне, при пороге в $widthMaxSize и больше, размер будет * $maxSize, в диапазоне между $widthMinSize и $widthMaxSize, размер будет пропорционально уменьшаться/увеличиваться, * при достижении порога в $widthMinSize и меньше размер будет $minSize * * @param {number} $widthMinSize - Минимальная ширина экрана в пикселях (без указания px) * @param {number} $widthMaxSize - Максимальная ширина экрана в пикселях (без указания px) * @param {number} $minSize - Размер, который указан для минимальной ширины экрана в пикселях (без указания px) * @param {number} $maxSize - Размер, который указан для максимальной ширины экрана в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки больших экранов (от 1652px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки менее больших экранов (от 1551px до 1651px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки средних экранов (до 1550px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки маленьких экранов (от 1025px до 1252px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне планшетной верстки (от 768px до 1024px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне мобильной верстки (от 375px до 768px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * MIXINS: для каждого свойства десктопной верстки * * @param {number} ...$size - Размеры в пикселях (без указания px) * @return {property: px} */ .tariffs { background: #24282B url(/res/images/26969978d07c01c4714e.png) no-repeat center center; } .tariffs { padding: 59.8043478261px 0px; } @media (max-width: 1651px) { .tariffs { padding: clamp(56.7989130435px, 56.7989130435px + 3.0054347826 * (100vw - 1551px) / 100, 59.8043478261px) clamp(0px, 0px + 0 * (100vw - 1551px) / 100, 0px); } } @media (max-width: 1550px) { .tariffs { padding: 45.652173913px 0px; } } @media (max-width: 1252px) { .tariffs { padding: clamp(37.0163043478px, 37.0163043478px + 8.6358695652 * (100vw - 1025px) / 227, 45.652173913px) clamp(0px, 0px + 0 * (100vw - 1025px) / 227, 0px); } } @media (max-width: 1024px) { .tariffs { padding: clamp(60px, 60px + 10 * (100vw - 768px) / 256, 70px) 0; background: url(/res/images/4a28586ae87f8b67efa8.png) no-repeat; background-size: cover; } } @media (max-width: 767px) { .tariffs { padding: clamp(40px, 40px + 20 * (100vw - 375px) / 393, 60px) 0; background: url(/res/images/548a1b536691131d77c0.png) no-repeat center center; background-size: cover; } } .tariffs__inner { margin: 0 auto; } .tariffs__inner { width: 1174.7282608696px; } @media (max-width: 1651px) { .tariffs__inner { width: clamp(1115.6929347826px, 1115.6929347826px + 59.035326087 * (100vw - 1551px) / 100, 1174.7282608696px); } } @media (max-width: 1550px) { .tariffs__inner { width: 896.7391304348px; } } @media (max-width: 1252px) { .tariffs__inner { width: clamp(727.1059782609px, 727.1059782609px + 169.6331521739 * (100vw - 1025px) / 227, 896.7391304348px); } } @media (max-width: 1024px) { .tariffs__inner { width: auto; } } .tariffs__header { text-align: center; color: #FFFFFF; } .tariffs__header { font-size: 41.0086956522px; } @media (max-width: 1651px) { .tariffs__header { font-size: clamp(38.947826087px, 38.947826087px + 2.0608695652 * (100vw - 1551px) / 100, 41.0086956522px); } } @media (max-width: 1550px) { .tariffs__header { font-size: 31.3043478261px; } } @media (max-width: 1252px) { .tariffs__header { font-size: clamp(25.3826086957px, 25.3826086957px + 5.9217391304 * (100vw - 1025px) / 227, 31.3043478261px); } } .tariffs__header { line-height: 41.0086956522px; } @media (max-width: 1651px) { .tariffs__header { line-height: clamp(38.947826087px, 38.947826087px + 2.0608695652 * (100vw - 1551px) / 100, 41.0086956522px); } } @media (max-width: 1550px) { .tariffs__header { line-height: 31.3043478261px; } } @media (max-width: 1252px) { .tariffs__header { line-height: clamp(25.3826086957px, 25.3826086957px + 5.9217391304 * (100vw - 1025px) / 227, 31.3043478261px); } } .tariffs__header { margin-bottom: 34.1739130435px; } @media (max-width: 1651px) { .tariffs__header { margin-bottom: clamp(32.4565217391px, 32.4565217391px + 1.7173913043 * (100vw - 1551px) / 100, 34.1739130435px); } } @media (max-width: 1550px) { .tariffs__header { margin-bottom: 26.0869565217px; } } @media (max-width: 1252px) { .tariffs__header { margin-bottom: clamp(21.152173913px, 21.152173913px + 4.9347826087 * (100vw - 1025px) / 227, 26.0869565217px); } } @media (max-width: 1024px) { .tariffs__header { font-size: clamp(36px, 36px + 12 * (100vw - 768px) / 256, 48px); line-height: clamp(36px, 36px + 12 * (100vw - 768px) / 256, 48px); margin-bottom: clamp(32px, 32px + 8 * (100vw - 768px) / 256, 40px); } } @media (max-width: 767px) { .tariffs__header { font-size: clamp(32px, 32px + 4 * (100vw - 375px) / 393, 36px); line-height: clamp(32px, 32px + 4 * (100vw - 375px) / 393, 36px); margin-bottom: clamp(20px, 20px + 12 * (100vw - 375px) / 393, 32px); } } .tariffs__wrapper { display: grid; grid-template-columns: repeat(3, 1fr); } .tariffs__wrapper { column-gap: 17.0869565217px; } @media (max-width: 1651px) { .tariffs__wrapper { column-gap: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .tariffs__wrapper { column-gap: 13.0434782609px; } } @media (max-width: 1252px) { .tariffs__wrapper { column-gap: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } @media (max-width: 1024px) { .tariffs__wrapper { column-gap: 0; padding: 0 40px; } } @media (max-width: 767px) { .tariffs__wrapper { padding: 0 20px; } } .tariffs__item { min-height: 480.1434782609px; } @media (max-width: 1651px) { .tariffs__item { min-height: clamp(456.0141304348px, 456.0141304348px + 24.1293478261 * (100vw - 1551px) / 100, 480.1434782609px); } } @media (max-width: 1550px) { .tariffs__item { min-height: 366.5217391304px; } } @media (max-width: 1252px) { .tariffs__item { min-height: clamp(297.1880434783px, 297.1880434783px + 69.3336956522 * (100vw - 1025px) / 227, 366.5217391304px); } } .tariffs__footnote { color: #FFFFFF; display: flex; justify-content: center; align-items: center; } .tariffs__footnote { margin-top: 17.0869565217px; } @media (max-width: 1651px) { .tariffs__footnote { margin-top: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .tariffs__footnote { margin-top: 13.0434782609px; } } @media (max-width: 1252px) { .tariffs__footnote { margin-top: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } @media (max-width: 767px) { .tariffs__footnote { padding: 0 clamp(20px, 20px + 20 * (100vw - 375px) / 393, 40px); } } .tariff { box-sizing: border-box; background: #FFFFFF url(/res/images/a906945f2b0d1d448c16.png) no-repeat bottom left; background-size: cover; display: flex; flex-direction: column; } .tariff { padding: 27.3391304348px 27.3391304348px; } @media (max-width: 1651px) { .tariff { padding: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px) clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .tariff { padding: 20.8695652174px 20.8695652174px; } } @media (max-width: 1252px) { .tariff { padding: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px) clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .tariff { border-radius: 6.8347826087px; } @media (max-width: 1651px) { .tariff { border-radius: clamp(6.4913043478px, 6.4913043478px + 0.3434782609 * (100vw - 1551px) / 100, 6.8347826087px); } } @media (max-width: 1550px) { .tariff { border-radius: 5.2173913043px; } } @media (max-width: 1252px) { .tariff { border-radius: clamp(4.2304347826px, 4.2304347826px + 0.9869565217 * (100vw - 1025px) / 227, 5.2173913043px); } } .tariff { font-size: 15.3782608696px; } @media (max-width: 1651px) { .tariff { font-size: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .tariff { font-size: 11.7391304348px; } } @media (max-width: 1252px) { .tariff { font-size: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } .tariff { line-height: 20.5043478261px; } @media (max-width: 1651px) { .tariff { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .tariff { line-height: 15.652173913px; } } @media (max-width: 1252px) { .tariff { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .tariff { font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); width: clamp(335px, 335px + 110 * (100vw - 768px) / 256, 445px); background: url(/res/images/fe01d63c539a34a94e18.png) no-repeat bottom left; background-size: cover; } } @media (max-width: 767px) { .tariff { width: clamp(300px, 300px + 35 * (100vw - 375px) / 393, 335px); font-size: 14px; line-height: 20px; background: url(/res/images/30f6e539c82929898918.png) no-repeat bottom left; background-size: cover; } } .tariff__title { font-weight: 500; letter-spacing: -1%; } .tariff__title { font-size: 23.9217391304px; } @media (max-width: 1651px) { .tariff__title { font-size: clamp(22.7195652174px, 22.7195652174px + 1.202173913 * (100vw - 1551px) / 100, 23.9217391304px); } } @media (max-width: 1550px) { .tariff__title { font-size: 18.2608695652px; } } @media (max-width: 1252px) { .tariff__title { font-size: clamp(14.8065217391px, 14.8065217391px + 3.4543478261 * (100vw - 1025px) / 227, 18.2608695652px); } } .tariff__title { line-height: 27.3391304348px; } @media (max-width: 1651px) { .tariff__title { line-height: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .tariff__title { line-height: 20.8695652174px; } } @media (max-width: 1252px) { .tariff__title { line-height: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .tariff__title { margin-bottom: 6.8347826087px; } @media (max-width: 1651px) { .tariff__title { margin-bottom: clamp(6.4913043478px, 6.4913043478px + 0.3434782609 * (100vw - 1551px) / 100, 6.8347826087px); } } @media (max-width: 1550px) { .tariff__title { margin-bottom: 5.2173913043px; } } @media (max-width: 1252px) { .tariff__title { margin-bottom: clamp(4.2304347826px, 4.2304347826px + 0.9869565217 * (100vw - 1025px) / 227, 5.2173913043px); } } @media (max-width: 1024px) { .tariff__title { font-size: clamp(24px, 24px + 4 * (100vw - 768px) / 256, 28px); line-height: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); margin-bottom: 8px; } } @media (max-width: 767px) { .tariff__title { font-size: 24px; line-height: 28px; } } .tariff__descr { color: #7C7E80; } .tariff__descr { margin-bottom: 17.0869565217px; } @media (max-width: 1651px) { .tariff__descr { margin-bottom: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .tariff__descr { margin-bottom: 13.0434782609px; } } @media (max-width: 1252px) { .tariff__descr { margin-bottom: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } @media (max-width: 1024px) { .tariff__descr { margin-bottom: 20px; } } .tariff__list { list-style: none; padding: 0; flex-grow: 1; display: flex; flex-direction: column; } .tariff__list { gap: 10.252173913px; } @media (max-width: 1651px) { .tariff__list { gap: clamp(9.7369565217px, 9.7369565217px + 0.5152173913 * (100vw - 1551px) / 100, 10.252173913px); } } @media (max-width: 1550px) { .tariff__list { gap: 7.8260869565px; } } @media (max-width: 1252px) { .tariff__list { gap: clamp(6.3456521739px, 6.3456521739px + 1.4804347826 * (100vw - 1025px) / 227, 7.8260869565px); } } .tariff__list { margin: 0px 0px 59.8043478261px; } @media (max-width: 1651px) { .tariff__list { margin: clamp(0px, 0px + 0 * (100vw - 1551px) / 100, 0px) clamp(0px, 0px + 0 * (100vw - 1551px) / 100, 0px) clamp(56.7989130435px, 56.7989130435px + 3.0054347826 * (100vw - 1551px) / 100, 59.8043478261px); } } @media (max-width: 1550px) { .tariff__list { margin: 0px 0px 45.652173913px; } } @media (max-width: 1252px) { .tariff__list { margin: clamp(0px, 0px + 0 * (100vw - 1025px) / 227, 0px) clamp(0px, 0px + 0 * (100vw - 1025px) / 227, 0px) clamp(37.0163043478px, 37.0163043478px + 8.6358695652 * (100vw - 1025px) / 227, 45.652173913px); } } @media (max-width: 1024px) { .tariff__list { gap: clamp(4px, 4px + 8 * (100vw - 768px) / 256, 12px); } } .tariff__list-item { display: flex; } .tariff__list-item { gap: 5.1260869565px; } @media (max-width: 1651px) { .tariff__list-item { gap: clamp(4.8684782609px, 4.8684782609px + 0.2576086957 * (100vw - 1551px) / 100, 5.1260869565px); } } @media (max-width: 1550px) { .tariff__list-item { gap: 3.9130434783px; } } @media (max-width: 1252px) { .tariff__list-item { gap: clamp(3.172826087px, 3.172826087px + 0.7402173913 * (100vw - 1025px) / 227, 3.9130434783px); } } .tariff__list-item { font-size: 15.3782608696px; } @media (max-width: 1651px) { .tariff__list-item { font-size: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .tariff__list-item { font-size: 11.7391304348px; } } @media (max-width: 1252px) { .tariff__list-item { font-size: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } .tariff__list-item { line-height: 20.5043478261px; } @media (max-width: 1651px) { .tariff__list-item { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .tariff__list-item { line-height: 15.652173913px; } } @media (max-width: 1252px) { .tariff__list-item { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .tariff__list-item { gap: 4px; font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); } } .tariff__list-item:before { content: url(/res/icons/3f8d5c5a46937faf1dd1.svg); color: #66B0B4; flex-shrink: 0; display: flex; justify-content: center; align-items: center; } .tariff__list-item:before { padding-top: 0.8543478261px; } @media (max-width: 1651px) { .tariff__list-item:before { padding-top: clamp(0.8114130435px, 0.8114130435px + 0.0429347826 * (100vw - 1551px) / 100, 0.8543478261px); } } @media (max-width: 1550px) { .tariff__list-item:before { padding-top: 0.652173913px; } } @media (max-width: 1252px) { .tariff__list-item:before { padding-top: clamp(0.5288043478px, 0.5288043478px + 0.1233695652 * (100vw - 1025px) / 227, 0.652173913px); } } .tariff__list-item:before { width: 20.5043478261px; } @media (max-width: 1651px) { .tariff__list-item:before { width: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .tariff__list-item:before { width: 15.652173913px; } } @media (max-width: 1252px) { .tariff__list-item:before { width: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } .tariff__list-item:before { height: 20.5043478261px; } @media (max-width: 1651px) { .tariff__list-item:before { height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .tariff__list-item:before { height: 15.652173913px; } } @media (max-width: 1252px) { .tariff__list-item:before { height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .tariff__list-item:before { width: 24px; height: 24px; padding-top: 0; } } .tariff__btn { max-width: max-content; } /*!**********************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./www/local/components/blocks/services/templates/service/style.scss ***! \**********************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** * Размер в дизайне указан, если у страницы маленькие отступы по бокам, цель функции пересчитать размеры, в случае, если * мы увеличиваем отступы, но хотим чтобы визуально страница осталась такой же, то есть уменьшаем размер пропорционально * уменьшению ширины контентной области * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @param {number} $oldContent - Изначальная ширина контентной области в пикселях (без указания px) * @param {number} $newContent - Измененная ширина контентной области в пикселях (без указания px) * @return {number} - Измененный размер в пикселях (без указания px) */ /** * Функция возвращает адаптивные размеры в заданном диапазоне, при пороге в $widthMaxSize и больше, размер будет * $maxSize, в диапазоне между $widthMinSize и $widthMaxSize, размер будет пропорционально уменьшаться/увеличиваться, * при достижении порога в $widthMinSize и меньше размер будет $minSize * * @param {number} $widthMinSize - Минимальная ширина экрана в пикселях (без указания px) * @param {number} $widthMaxSize - Максимальная ширина экрана в пикселях (без указания px) * @param {number} $minSize - Размер, который указан для минимальной ширины экрана в пикселях (без указания px) * @param {number} $maxSize - Размер, который указан для максимальной ширины экрана в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки больших экранов (от 1652px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки менее больших экранов (от 1551px до 1651px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки средних экранов (до 1550px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки маленьких экранов (от 1025px до 1252px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне планшетной верстки (от 768px до 1024px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне мобильной верстки (от 375px до 768px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * MIXINS: для каждого свойства десктопной верстки * * @param {number} ...$size - Размеры в пикселях (без указания px) * @return {property: px} */ .heading-h2 { letter-spacing: -1%; font-weight: 500; } .heading-h2 { font-size: 23.9217391304px; } @media (max-width: 1651px) { .heading-h2 { font-size: clamp(22.7195652174px, 22.7195652174px + 1.202173913 * (100vw - 1551px) / 100, 23.9217391304px); } } @media (max-width: 1550px) { .heading-h2 { font-size: 18.2608695652px; } } @media (max-width: 1252px) { .heading-h2 { font-size: clamp(14.8065217391px, 14.8065217391px + 3.4543478261 * (100vw - 1025px) / 227, 18.2608695652px); } } .heading-h2 { line-height: 27.3391304348px; } @media (max-width: 1651px) { .heading-h2 { line-height: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .heading-h2 { line-height: 20.8695652174px; } } @media (max-width: 1252px) { .heading-h2 { line-height: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .heading-h2 { margin-bottom: 27.3391304348px; } @media (max-width: 1651px) { .heading-h2 { margin-bottom: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .heading-h2 { margin-bottom: 20.8695652174px; } } @media (max-width: 1252px) { .heading-h2 { margin-bottom: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } @media (max-width: 1024px) { .heading-h2 { font-size: clamp(24px, 24px + 4 * (100vw - 768px) / 256, 28px); line-height: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); margin-bottom: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); } } @media (max-width: 767px) { .heading-h2 { font-size: clamp(20px, 20px + 4 * (100vw - 375px) / 393, 24px); line-height: clamp(24px, 24px + 4 * (100vw - 375px) / 393, 28px); } } /*!***************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js!./www/local/templates/main/ui/components/question/style.scss ***! \***************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** * Размер в дизайне указан, если у страницы маленькие отступы по бокам, цель функции пересчитать размеры, в случае, если * мы увеличиваем отступы, но хотим чтобы визуально страница осталась такой же, то есть уменьшаем размер пропорционально * уменьшению ширины контентной области * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @param {number} $oldContent - Изначальная ширина контентной области в пикселях (без указания px) * @param {number} $newContent - Измененная ширина контентной области в пикселях (без указания px) * @return {number} - Измененный размер в пикселях (без указания px) */ /** * Функция возвращает адаптивные размеры в заданном диапазоне, при пороге в $widthMaxSize и больше, размер будет * $maxSize, в диапазоне между $widthMinSize и $widthMaxSize, размер будет пропорционально уменьшаться/увеличиваться, * при достижении порога в $widthMinSize и меньше размер будет $minSize * * @param {number} $widthMinSize - Минимальная ширина экрана в пикселях (без указания px) * @param {number} $widthMaxSize - Максимальная ширина экрана в пикселях (без указания px) * @param {number} $minSize - Размер, который указан для минимальной ширины экрана в пикселях (без указания px) * @param {number} $maxSize - Размер, который указан для максимальной ширины экрана в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки больших экранов (от 1652px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки менее больших экранов (от 1551px до 1651px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета размеров десктопной верстки средних экранов (до 1550px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {px} - Измененный размер */ /** * Функция для пересчета размеров десктопной верстки маленьких экранов (от 1025px до 1252px) * * @param {number} $size - Изначальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне планшетной верстки (от 768px до 1024px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * Функция для пересчета адаптивных размеров в диапазоне мобильной верстки (от 375px до 768px) * * @param {number} $minSize - Минимальный размер в пикселях (без указания px) * @param {number} $maxSize - Максимальный размер в пикселях (без указания px) * @return {clamp(px, vw, px)} - Адаптивный размер */ /** * MIXINS: для каждого свойства десктопной верстки * * @param {number} ...$size - Размеры в пикселях (без указания px) * @return {property: px} */ .questions { margin-bottom: 85.4347826087px; } @media (max-width: 1651px) { .questions { margin-bottom: clamp(81.1413043478px, 81.1413043478px + 4.2934782609 * (100vw - 1551px) / 100, 85.4347826087px); } } @media (max-width: 1550px) { .questions { margin-bottom: 65.2173913043px; } } @media (max-width: 1252px) { .questions { margin-bottom: clamp(52.8804347826px, 52.8804347826px + 12.3369565217 * (100vw - 1025px) / 227, 65.2173913043px); } } @media (max-width: 1024px) { .questions { margin-bottom: clamp(80px, 80px + 20 * (100vw - 768px) / 256, 100px); } } @media (max-width: 767px) { .questions { margin-bottom: clamp(60px, 60px + 20 * (100vw - 375px) / 393, 80px); } } .question { border-bottom: 1px solid rgba(0, 0, 0, 0.1019607843); } .question { padding-bottom: 27.3391304348px; } @media (max-width: 1651px) { .question { padding-bottom: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .question { padding-bottom: 20.8695652174px; } } @media (max-width: 1252px) { .question { padding-bottom: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .question { margin-bottom: 27.3391304348px; } @media (max-width: 1651px) { .question { margin-bottom: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .question { margin-bottom: 20.8695652174px; } } @media (max-width: 1252px) { .question { margin-bottom: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } @media (max-width: 1024px) { .question { padding-bottom: clamp(24px, 24px + 8 * (100vw - 768px) / 256, 32px); margin-bottom: clamp(24px, 24px + 8 * (100vw - 768px) / 256, 32px); } } @media (max-width: 767px) { .question { padding-bottom: clamp(20px, 20px + 4 * (100vw - 375px) / 393, 24px); margin-bottom: clamp(20px, 20px + 4 * (100vw - 375px) / 393, 24px); } } .question__title { display: flex; justify-content: space-between; align-items: center; width: 100%; cursor: pointer; font-weight: 500; } .question__title { font-size: 17.0869565217px; } @media (max-width: 1651px) { .question__title { font-size: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .question__title { font-size: 13.0434782609px; } } @media (max-width: 1252px) { .question__title { font-size: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } @media (max-width: 1024px) { .question__title { font-size: 16px; line-height: 20px; } } .question__arrow { flex-shrink: 0; } .question__arrow { width: 27.3391304348px; } @media (max-width: 1651px) { .question__arrow { width: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .question__arrow { width: 20.8695652174px; } } @media (max-width: 1252px) { .question__arrow { width: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .question__arrow { height: 27.3391304348px; } @media (max-width: 1651px) { .question__arrow { height: clamp(25.9652173913px, 25.9652173913px + 1.3739130435 * (100vw - 1551px) / 100, 27.3391304348px); } } @media (max-width: 1550px) { .question__arrow { height: 20.8695652174px; } } @media (max-width: 1252px) { .question__arrow { height: clamp(16.9217391304px, 16.9217391304px + 3.947826087 * (100vw - 1025px) / 227, 20.8695652174px); } } .question__arrow--rotate { transform: rotate(180deg); } @media (max-width: 1024px) { .question__arrow { width: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); height: clamp(28px, 28px + 4 * (100vw - 768px) / 256, 32px); } } @media (max-width: 767px) { .question__arrow { width: clamp(20px, 20px + 8 * (100vw - 375px) / 393, 28px); height: clamp(20px, 20px + 8 * (100vw - 375px) / 393, 28px); } } .question__body { margin-top: 17.0869565217px; } @media (max-width: 1651px) { .question__body { margin-top: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .question__body { margin-top: 13.0434782609px; } } @media (max-width: 1252px) { .question__body { margin-top: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } .question__body { font-size: 15.3782608696px; } @media (max-width: 1651px) { .question__body { font-size: clamp(14.6054347826px, 14.6054347826px + 0.772826087 * (100vw - 1551px) / 100, 15.3782608696px); } } @media (max-width: 1550px) { .question__body { font-size: 11.7391304348px; } } @media (max-width: 1252px) { .question__body { font-size: clamp(9.5184782609px, 9.5184782609px + 2.2206521739 * (100vw - 1025px) / 227, 11.7391304348px); } } .question__body { line-height: 20.5043478261px; } @media (max-width: 1651px) { .question__body { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .question__body { line-height: 15.652173913px; } } @media (max-width: 1252px) { .question__body { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .question__body { margin-top: clamp(12px, 12px + 8 * (100vw - 768px) / 256, 20px); font-size: clamp(14px, 14px + 4 * (100vw - 768px) / 256, 18px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); } } .question__body--hide { display: none; } @media (min-width: 1025px) { .question__body p { margin-bottom: 13.6695652174px; } } @media (min-width: 1025px) and (max-width: 1651px) { .question__body p { margin-bottom: clamp(12.9826086957px, 12.9826086957px + 0.6869565217 * (100vw - 1551px) / 100, 13.6695652174px); } } @media (min-width: 1025px) and (max-width: 1550px) { .question__body p { margin-bottom: 10.4347826087px; } } @media (min-width: 1025px) and (max-width: 1252px) { .question__body p { margin-bottom: clamp(8.4608695652px, 8.4608695652px + 1.9739130435 * (100vw - 1025px) / 227, 10.4347826087px); } } @media (min-width: 1025px) { .question__body p { max-width: 777.4565217391px; } } @media (min-width: 1025px) and (max-width: 1651px) { .question__body p { max-width: clamp(738.3858695652px, 738.3858695652px + 39.0706521739 * (100vw - 1551px) / 100, 777.4565217391px); } } @media (min-width: 1025px) and (max-width: 1550px) { .question__body p { max-width: 593.4782608696px; } } @media (min-width: 1025px) and (max-width: 1252px) { .question__body p { max-width: clamp(481.2119565217px, 481.2119565217px + 112.2663043478 * (100vw - 1025px) / 227, 593.4782608696px); } } @media (max-width: 1024px) { .question__body p { margin-bottom: clamp(12px, 12px + 4 * (100vw - 768px) / 256, 16px); } } .question__name { font-size: 17.0869565217px; } @media (max-width: 1651px) { .question__name { font-size: clamp(16.2282608696px, 16.2282608696px + 0.8586956522 * (100vw - 1551px) / 100, 17.0869565217px); } } @media (max-width: 1550px) { .question__name { font-size: 13.0434782609px; } } @media (max-width: 1252px) { .question__name { font-size: clamp(10.5760869565px, 10.5760869565px + 2.4673913043 * (100vw - 1025px) / 227, 13.0434782609px); } } .question__name { line-height: 20.5043478261px; } @media (max-width: 1651px) { .question__name { line-height: clamp(19.4739130435px, 19.4739130435px + 1.0304347826 * (100vw - 1551px) / 100, 20.5043478261px); } } @media (max-width: 1550px) { .question__name { line-height: 15.652173913px; } } @media (max-width: 1252px) { .question__name { line-height: clamp(12.6913043478px, 12.6913043478px + 2.9608695652 * (100vw - 1025px) / 227, 15.652173913px); } } @media (max-width: 1024px) { .question__name { font-size: clamp(16px, 16px + 4 * (100vw - 768px) / 256, 20px); line-height: clamp(20px, 20px + 4 * (100vw - 768px) / 256, 24px); margin-inline-end: 35px; } } /* End */ /* /res/servicePage/45ba26caa4702ab9d9ca.css?1756987864125121 */