/*!*********************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/style.scss ***!
  \*********************************************************************************************************/
@font-face {
  font-family: "Inter";
  src: url(fonts/Inter_18pt-Regular.ttf) format("ttf");
  font-weight: 400;
}
@font-face {
  font-family: "Inter";
  src: url(fonts/Inter_18pt-Medium.ttf) format("ttf");
  font-weight: 500;
}
@font-face {
  font-family: "Inter";
  src: url(fonts/Inter_18pt-SemiBold.ttf) format("ttf");
  font-weight: 700;
}
@font-face {
  font-family: "Roboto";
  src: url(fonts/Roboto-Regular.ttf) format("ttf");
  font-weight: 400;
}
@font-face {
  font-family: "Roboto";
  src: url(fonts/Roboto-Medium.ttf) format("ttf");
  font-weight: 500;
}
@font-face {
  font-family: "Roboto";
  src: url(fonts/Roboto-Bold.ttf) format("ttf");
  font-weight: 700;
}
@font-face {
  font-family: "SF Pro Text";
  src: url(fonts/SFProText-Regular.ttf) format("ttf");
  font-weight: 400;
}
@font-face {
  font-family: "SF Pro Text";
  src: url(fonts/SFProText-Medium.ttf) format("ttf");
  font-weight: 500;
}
@font-face {
  font-family: "SF Pro Text";
  src: url(fonts/SFProText-Bold.ttf) format("ttf");
  font-weight: 700;
}
@font-face {
  font-family: "Tornado";
  src: local("TornadoC"), url(fonts/TornadoC.woff) format("woff");
  font-weight: 400;
}
@font-face {
  font-family: "Tornado Medium";
  src: local("Tornado MediumC"), url(fonts/TornadoMediumC.woff) format("woff");
  font-weight: 400;
}
@font-face {
  font-family: "Roboto";
  src: url(fonts/Roboto-Regular.ttf) format("ttf");
  font-weight: 400;
}
@font-face {
  font-family: "Roboto Medium";
  src: url(fonts/Roboto-Medium.ttf) format("ttf");
  font-weight: 500;
}
@font-face {
  font-family: "Roboto Bold";
  src: url(fonts/Roboto-Bold.ttf) format("ttf");
  font-weight: 700;
}
*,
*:after,
*:before {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body,
main {
  position: relative;
}

body {
  background-color: #FCFCFC;
  font-weight: 500;
  font-family: Inter, Verdana, Tahoma, sans-serif;
}
body.no-scroll {
  overflow-y: hidden;
}

ul {
  list-style: none;
}

a {
  text-decoration: none;
}

.header {
  font-family: "Tornado Medium", Tahoma, sans-serif;
  font-weight: 400;
  color: #333333;
}
.header__first {
  font-size: 34px;
  line-height: 41px;
}
.header__second {
  font-size: 24px;
  line-height: 29px;
}
.header__third {
  font-size: 18px;
  line-height: 23px;
}

main {
  padding-bottom: 96px;
}

.paragraph {
  font-size: 16px;
  line-height: 22px;
  color: #24292D;
}

.note {
  font-size: 14px;
  line-height: 18px;
  color: #748290;
}

.text {
  font-family: "Tornado", Verdana, sans-serif;
  font-weight: 400;
  text-align: left;
}

.container {
  padding: 0 16px;
  margin: 0 auto;
  min-width: 328px;
  max-width: 1024px;
  width: 100%;
}

.link {
  font-size: 14px;
  color: #004E9E;
  text-decoration: underline;
  text-underline-position: under;
  text-decoration-color: #77A7D8;
  text-decoration-style: solid;
}

.info {
  display: flex;
  gap: 8px;
  align-items: stretch;
  flex-wrap: wrap;
  padding: 20px 0;
}
.info__item-description {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
  align-items: flex-start;
}
.info__item {
  background-color: #F5F7F9;
  width: calc(50% - 4px);
  min-height: 106px;
  border-radius: 8px;
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}
.info__item .icon {
  width: 32px;
  height: auto;
}
.info__item p {
  overflow-wrap: break-word;
  width: 100%;
}
.info__item .link {
  font-size: 16px;
  line-height: 22px;
}

.marker {
  padding-left: 36px;
  position: relative;
  background-repeat: no-repeat;
  background-position: left top;
  background-size: contain;
}

.section {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}

.block {
  gap: 0;
  padding-top: 20px;
  padding-bottom: 20px;
}

.subblock {
  gap: 0;
  padding-top: 12px;
  padding-bottom: 12px;
}
.subblock:first-child {
  padding-top: 0;
}
.subblock:last-child {
  padding-bottom: 0;
}

.list {
  list-style-type: disc;
  list-style-position: outside;
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: 20px;
}

.load-screen {
  display: none;
}
.load-screen.active {
  width: 100%;
  height: 100vh;
  background-color: #004E9E;
  display: flex;
  align-items: center;
  justify-content: center;
}
.load-screen.active img {
  width: 155px;
  height: auto;
}

.support h2 {
  padding-bottom: 4px;
}
.support h2 + .underline-block {
  padding-top: 4px;
}
.support h2 + .paragraph {
  padding-top: 4px;
}
.support p + .underline-block {
  margin-top: 4px;
}
.support .link {
  padding-top: 4px;
  padding-bottom: 4px;
  margin-top: 2px;
}
.support .link:first-of-type {
  margin-top: 0;
}

.wait header h1 {
  padding-top: 44px;
}

.waiting {
  padding-bottom: 0;
  padding-top: 32px;
}
.waiting .instruction {
  margin-top: 12px;
}
.waiting .header__second {
  padding-bottom: 8px;
}
.waiting .note {
  color: #24292D;
  padding-bottom: 4px;
}
.waiting .bg-light {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  background-color: #F5F7F9;
  padding-top: 20px;
  padding-bottom: 62px;
}

.wait-step {
  padding: 16px;
  border-radius: 8px;
  background: #F5F7F9;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.wait-step h3 {
  color: #004E9E;
}

.section-wait {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  margin-top: 8px;
}

.questions .header__second {
  padding-bottom: 4px;
}

.mentor .info {
  padding-bottom: 0;
  padding-top: 16px;
}
.mentor .block .underline-block:first-of-type {
  margin-top: 4px;
}

.siz {
  padding-top: 16px;
}
.siz .tile, .siz .slider__wrapper {
  margin-top: 20px;
}

.comission h2 + .message {
  margin-top: 16px;
}
.comission .list {
  padding-top: 16px;
  padding-bottom: 0;
}
.comission .message {
  padding-top: 0;
}

.possibility .tile-link {
  margin-bottom: 0;
  margin-top: 0;
}
.possibility .container .block:first-child {
  padding-top: 16px;
}

/*.swiper {
  width: 100%;

  &-slide.slider__item {

  }
}*/
.comission,
.medium-interview,
.interview {
  padding-top: 16px;
}

.workshop .slider__wrapper {
  margin-bottom: 20px;
}
.workshop .container h2 {
  padding-bottom: 4px;
}
.workshop .container #download-file {
  margin-bottom: 20px;
}
.workshop .list {
  padding-top: 2px;
}

.probation .medical__body--info {
  padding-top: 16px;
}

.onboarding {
  padding-top: 16px;
}

.surcharge .list,
.growth .list,
.conditions .list,
.rest .list,
.young .list,
.family .list,
.difficult .list {
  padding-top: 16px;
  padding-left: 24px;
}
.surcharge .list li,
.growth .list li,
.conditions .list li,
.rest .list li,
.young .list li,
.family .list li,
.difficult .list li {
  padding-bottom: 4px;
}
.surcharge .list li:last-child,
.growth .list li:last-child,
.conditions .list li:last-child,
.rest .list li:last-child,
.young .list li:last-child,
.family .list li:last-child,
.difficult .list li:last-child {
  padding-bottom: 0;
}

fieldset {
  background-color: transparent;
}

.struct h2 {
  padding: 8px 0;
  margin: 16px 0;
  box-shadow: inset 0 -1px #C3CCD5;
}

[type=date]::-webkit-inner-spin-button {
  display: none;
}

input[type=number] {
  -webkit-appearance: none;
  appearance: none;
}

/*Firefox*/
input[type=number] {
  -moz-appearance: textfield;
}

/*Chrome*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=date] {
  -moz-appearance: textfield;
  -webkit-appearance: none;
  appearance: none;
  background: url(img/svg/date.svg) no-repeat right 16px center;
  background-size: 24px 24px;
}

input[type=date]::-webkit-calendar-picker-indicator {
  opacity: 0;
  width: 24px;
  height: 24px;
  color: rgba(0, 0, 0, 0);
  display: block;
  border-width: thin;
  background: url(img/svg/date.svg) no-repeat;
}

input[type=date].firefox {
  position: relative;
  z-index: 2;
  background: transparent;
}

h3 {
  font-family: "Tornado Medium", Tahoma, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 23px;
  letter-spacing: 0;
  vertical-align: middle;
}

.timer {
  width: 56px;
  height: 20px;
  opacity: 1;
  border-radius: 8px;
  background-color: #4F5963;
  position: absolute;
  bottom: -5px;
  font-size: 12px;
  font-weight: 400;
  color: white;
  font-family: "Tornado Medium", Verdana, sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: normal;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}

.pb-32 {
  padding-bottom: 32px;
}

.pb-24 {
  padding-bottom: 24px;
}

.icon {
  position: relative;
  width: 32px;
  height: auto;
}
.icon.back {
  display: flex;
  align-items: center;
}
.icon.back:before {
  content: url(img/svg/arrow-back.svg);
  width: 17px;
  height: 22px;
}
.icon.flag {
  width: 24px;
  height: auto;
}

.navigation {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: 90px;
  width: 100%;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-around;
  background-color: #fff;
  transition: transform 0.5s ease;
}
.navigation.hidden {
  transform: translateY(100%);
}
.navigation__item {
  width: 120px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.navigation__item--image {
  padding: 4px 20px;
  border-radius: 16px;
}
.navigation__item--image img {
  width: 24px;
  height: 24px;
  fill: #83929B;
  color: #83929B;
  stroke: #83929B;
}
.navigation__item--label {
  margin: 4px 0 6px 0;
  font-size: 12px;
  font-weight: 400;
  color: #83929B;
}
.navigation__item.active .navigation__item--image, .navigation__item:active .navigation__item--image, .navigation__item:hover .navigation__item--image {
  background-color: #E5F2FF;
}
.navigation__item.active .navigation__item--label, .navigation__item:active .navigation__item--label, .navigation__item:hover .navigation__item--label {
  font-weight: 700;
  font-family: Roboto, sans-serif;
  color: #004E9E;
}

.header-panel {
  width: 100%;
  margin: 0 auto;
  flex-wrap: wrap;
  max-width: 1200px;
  min-height: 96px;
  column-gap: 16px;
}
.header-panel.home {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 3px 16px 8px 16px;
}
.header-panel.home h1 {
  font-weight: 400;
  font-size: 34px;
  line-height: 41px;
  color: #333333;
}
.header-panel.root {
  display: flex;
  align-items: flex-end;
  padding: 47px 16px 8px 16px;
}
.header-panel.root h1 {
  padding: 0;
}
.header-panel .back__link {
  min-height: 44px;
  padding: 11px 16px;
  display: flex;
  align-items: center;
}
.header-panel .back__link p {
  margin-left: 5px;
  margin-bottom: 2px;
  color: #004E9E;
  font-family: "Tornado Medium", Tahoma, sans-serif;
}
.header-panel__title {
  font-weight: 400;
  font-size: 34px;
  line-height: 41px;
  padding: 3px 16px 8px 16px;
  color: #333333;
  font-family: "Tornado Medium", Tahoma, sans-serif;
  font-weight: 400;
}
.header-panel__simple {
  position: fixed;
  opacity: 1;
  top: 0;
  z-index: 100;
  transition: ease-in 0.3s;
  border-bottom: 1px solid #cfd3d3;
  max-height: 44px;
  width: 100%;
  padding: 0px 16px;
  background-color: #fff;
  display: flex;
  min-height: 44px;
  align-items: center;
}
.header-panel__simple a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 44px;
  height: 44px;
}
.header-panel__simple p {
  width: 100%;
  text-align: center;
  margin-left: 5px;
  margin-bottom: 2px;
  text-overflow: ellipsis;
  text-wrap: nowrap;
  overflow: hidden;
}
.header-panel__simple.hidden {
  position: absolute;
  top: -50px;
  left: 0;
  opacity: 0;
  z-index: -1;
}

.my-way {
  width: 100%;
  height: 100%;
}
.my-way__body {
  position: relative;
  width: 100%;
  height: 100%;
}
.my-way__body .background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(img/bgc-map.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0.1;
  z-index: -1;
  width: 100%;
  height: 100vh;
}
.my-way__list {
  padding: 0px 16px 0px 16px;
  margin: 76px 0 96px 0;
  background-image: url(img/svg/line.svg);
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: 25vw;
  background-size: 82vw auto;
  gap: 40px;
  display: flex;
  flex-direction: column;
  max-width: 1200px;
  margin: 0 auto;
}
.my-way__list--item {
  position: relative;
  padding-top: 52vw;
}
.my-way__list--item .item__image {
  position: absolute;
  top: 0;
  z-index: 5;
  width: 58vw;
  height: auto;
}
.my-way__list--item.disabled .item__name, .my-way__list--item.disabled .item__location {
  color: #C3CCD5;
}
.my-way__list--item:active .item__description, .my-way__list--item:focus .item__description {
  background-color: #D6EAFF;
}
.my-way__list--item:active.disabled .item__description {
  background-color: #fff;
}
.my-way__list--item:focus-visible {
  outline: none;
}
.my-way__list--item:nth-child(even) .item__image {
  right: 0;
}
.my-way__list--item:nth-child(even) .item__description {
  right: 0;
}
.my-way__list--item:nth-child(odd) .item__image {
  left: 0;
}
.my-way__list--item:nth-child(odd) .item__description {
  left: 0;
}
.my-way__list--item .item__description {
  position: absolute;
  top: 35vw;
  z-index: 10;
  width: 300px;
  height: 64px;
  background-color: #fff;
  gap: 16px;
  display: flex;
  align-items: center;
  padding: 6px;
  border-radius: 100px 16px 16px 100px;
}
.my-way__list--item .item__description--no {
  width: 52px;
  height: 52px;
  position: absolute;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  font-family: Verdana, sans-serif;
  color: #000000;
}
.my-way__list--item .item__description--label {
  line-height: 20px;
  font-size: 16px;
  font-weight: bold;
  font-family: "SF Pro Text", sans-serif;
}
.my-way__list--item .item__name {
  font-family: "Tornado Medium", Verdana, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: #24292D;
}
.my-way__list--item .item__location {
  font-family: "Tornado", Verdana, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  color: #748290;
  font-style: normal;
}
@media (min-width: 768px) {
  .my-way__list {
    background-position-y: 170px;
    background-size: 630px auto;
  }
  .my-way__list--item {
    padding-top: 400px;
  }
  .my-way__list--item .item__image {
    width: 450px;
  }
  .my-way__list--item .item__description {
    top: 276px;
  }
}

.calc-result {
  padding-right: 10px;
}
.calc-result__explanation {
  color: #748290;
  margin-top: 8px;
}

.medical {
  width: 100%;
  margin: 0 auto;
  max-width: 1200px;
  height: 100%;
  background-color: #fff;
}
.medical .accordion .list {
  list-style-type: decimal;
  padding-top: 0;
  padding-bottom: 0;
}
.medical__body {
  padding: 16px 16px 0px 16px;
}
.medical__body--progress {
  width: 100%;
  padding: 20px 14px;
  margin-top: 20px;
  margin-bottom: 20px;
  border-radius: 8px;
  background-color: #F5F7F9;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  text-align: left;
}
.medical__body--progress .icon {
  width: 24px;
  height: auto;
}
.medical__body--progress .icon.play, .medical__body--progress .icon.conclusion {
  width: 32px;
  height: 32px;
}
.medical__body--progress .progress__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.medical__body--progress .progress__header--info, .medical__body--progress .progress__header--conclusion {
  gap: 4px;
  display: flex;
  align-items: center;
  font-size: 14px;
  line-height: 18px;
  color: #333333;
  font-family: "Tornado", Verdana, sans-serif;
}
.medical__body--progress .progress__border {
  z-index: 1;
  width: 100%;
  height: 24px;
  margin-top: 8px;
  border-radius: 100px;
  background-color: #EBEBEB;
}
.medical__body--progress .progress__border--active {
  z-index: 5;
  height: 100%;
  border-radius: 100px;
  background-color: #004E9E;
}
.medical__body--message {
  padding: 0px 0 20px 0;
}
.medical .header__second {
  margin-top: 20px;
  margin-bottom: 4px;
}
.medical .medical-test {
  margin-bottom: 40px;
}
.medical .doctors {
  padding-bottom: 20px;
}
.medical .questions .header__second {
  margin-bottom: 0;
  padding-bottom: 0;
}
.medical .medical-link {
  color: #24292D;
  font-size: 18px;
  padding-right: 20px;
}
.medical .medical-link::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  background-image: url(img/svg/arrow-bottom.svg);
  transform: rotate(-90deg);
  top: calc(50% - 12px);
  right: 16px;
  filter: brightness(0) saturate(100%) invert(22%) sepia(98%) saturate(1339%) hue-rotate(192deg) brightness(93%) contrast(101%);
}

.medical-test, .doctors {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}

.contract__body {
  margin-top: 24px;
  padding: 16px 0 110px;
  display: flex;
  flex-direction: column;
}
.contract .medical__body--info {
  padding-top: 16px;
}
.contract .disabled {
  pointer-events: none;
  opacity: 0.5;
}
.contract ul.contract-info {
  list-style-type: disc;
  padding-left: inherit;
}
.contract ul.contract-info li {
  margin: 4px 0;
}
.contract .header__second {
  padding: 16px 0;
}
.contract .info {
  padding: 0;
}
.contract .contract-button {
  font-family: "Tornado Medium", Tahoma, sans-serif;
  width: 96px;
  border-radius: 8px;
  padding: 9px 16px;
  border: 2px solid;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  text-align: center;
  border-color: #004E9E;
  background-color: #D6EAFF;
  margin-left: auto;
}
.contract .pb-40 {
  padding-bottom: 40px;
}

.calculator {
  overflow: hidden;
  z-index: 10;
  padding-bottom: 120px;
  background-color: #fff;
  padding-top: 16px;
}
.calculator input:-webkit-autofill,
.calculator input:-webkit-autofill:hover,
.calculator input:-webkit-autofill:focus {
  -webkit-text-fill-color: #24292D;
  -webkit-box-shadow: 0 0 0px 10rem white inset;
  background-color: #fff;
}
.calculator__block {
  padding-top: 12px;
  padding-bottom: 12px;
}
.calculator .error {
  display: none;
  color: #E71D36;
}
.calculator form {
  gap: 24px;
  display: flex;
  flex-direction: column;
  margin-top: 20px;
}
.calculator .chips {
  border: none;
}
.calculator .chips:nth-of-type(2) .chips__list--item, .calculator .chips:nth-of-type(3) .chips__list--item {
  padding-left: 16px;
  padding-right: 16px;
}
.calculator .chips:nth-of-type(3) .chips__list--item:last-child {
  padding-left: 24px;
  padding-right: 24px;
}
.calculator .chips__title {
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #24292D;
  margin-bottom: 8px;
  font-family: "Tornado", Verdana, sans-serif;
  padding: 0 16px;
}
.calculator .chips__list {
  gap: 8px;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}
.calculator .chips__list.scroll {
  overflow-x: scroll;
  scrollbar-width: none;
}
.calculator .chips__list--item {
  color: #24292D;
  line-height: 22px;
  font-family: "Tornado", Verdana, sans-serif;
  display: flex;
  white-space: nowrap;
  align-items: center;
  justify-content: center;
  padding: 12px 24px 10px 24px;
  min-height: 48px;
  margin-bottom: 2px;
  border-radius: 24px;
  box-shadow: inset 0 0 0 1px #C3CCD5;
}
.calculator .chips__list label:first-of-type {
  margin-left: 16px;
}
.calculator .chips__list label:last-of-type {
  margin-right: 16px;
}
.calculator .chips input {
  display: none;
}
.calculator .chips input:checked + label {
  background-color: #F0F7FF;
  box-shadow: inset 0 0 0 1px #004E9E;
}
.calculator .chips + .container.block {
  padding-top: 12px;
}
.calculator #prize, .calculator #first_day {
  padding: 0 16px;
}
.calculator #prize .label__title, .calculator #first_day .label__title {
  display: block;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  color: #24292D;
  margin-bottom: 8px;
}
.calculator #prize input, .calculator #first_day input {
  border: 1px solid #C3CCD5;
  width: 100%;
  min-height: 48px;
  max-height: 48px;
  gap: 16px;
  padding: 14px 16px 10px 16px;
  border-radius: 8px;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  text-align: left;
}
.calculator #prize input:active, .calculator #prize input:focus, .calculator #prize input:focus-visible, .calculator #first_day input:active, .calculator #first_day input:focus, .calculator #first_day input:focus-visible {
  border: 1px solid #004E9E;
  outline: none;
}
.calculator #prize input:active ~ .label_icon, .calculator #prize input:focus ~ .label_icon, .calculator #prize input:focus-visible ~ .label_icon, .calculator #first_day input:active ~ .label_icon, .calculator #first_day input:focus ~ .label_icon, .calculator #first_day input:focus-visible ~ .label_icon {
  display: none;
}
.calculator #prize input:invalid, .calculator #first_day input:invalid {
  border-color: #E71D36;
}
.calculator #prize input:invalid + .error, .calculator #first_day input:invalid + .error {
  display: block;
}
.calculator #prize input[type=number], .calculator #first_day input[type=number] {
  background: url(img/svg/percent.svg) no-repeat right 16px center;
}
.calculator #prize {
  position: relative;
}
.calculator #prize .label_icon {
  position: absolute;
  display: block;
  top: 36px;
  right: 32px;
  bottom: 10px;
  width: 20px;
  height: 20px;
}
.calculator #prize .label_icon img {
  width: 100%;
  height: 100%;
}

.register input:-webkit-autofill,
.register input:-webkit-autofill:hover,
.register input:-webkit-autofill:focus {
  -webkit-text-fill-color: #24292D;
  -webkit-box-shadow: 0 0 0px 10rem white inset;
  background-color: #fff;
}
.register .background {
  position: fixed;
  z-index: -2;
  background-image: url(img/bgc-map.png);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  opacity: 0.1;
  width: 100%;
  height: 100vh;
}
.register .background-shadow {
  display: none;
  position: fixed;
  z-index: -1;
  width: 100%;
  height: 100vh;
  background-color: rgba(240, 242, 249, 0.25);
}
.register__header .logo {
  padding: 16px 0;
}
.register__header h1 {
  padding: 52px 0 8px 0;
}
.register__header p {
  padding-bottom: 4px;
}
.register header .paragraph {
  color: #4F5963;
}
.register main {
  margin-top: 24px;
}
.register footer {
  padding-bottom: 75px;
}
.register footer .paragraph {
  padding-top: 20px;
  color: #797979;
  text-align: center;
  line-height: 27px;
}
.register footer .paragraph a {
  display: block;
  color: #004E9E;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.register form.login-form.active,
.register form.register-form.active {
  gap: 0;
  padding-top: 20px;
}
.register form.login-form.active label,
.register form.register-form.active label {
  margin-top: 12px;
  margin-bottom: 2px;
}
.register form.login-form.active label span,
.register form.register-form.active label span {
  line-height: 22px;
}
.register form.login-form.active button,
.register form.register-form.active button {
  margin-top: 54px;
  margin-bottom: 20px;
}
.register form.login-form.active button.button__transparent,
.register form.register-form.active button.button__transparent {
  margin-top: 0px;
  margin-bottom: 0px;
}
.register form.login-form.active button {
  margin-top: 38px;
}
.register form.register-form.active label:nth-last-of-type(3) {
  margin-top: 28px;
  margin-bottom: 0;
}
.register form.register-form.active .medium-arrow {
  width: 100%;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.register form.register-form.active .medium-arrow + label {
  margin-top: 2px;
}
.register form.register-form.active .medium-text, .register form.register-form.active .medium-sticker {
  font-size: 14px;
  line-height: 18px;
  color: #24292D;
}
.register form.register-form.active .medium-text {
  padding: 4px 8px;
  background-color: #E9E9E9;
  border-radius: 12px;
  display: flex;
  justify-content: center;
}
.register form.register-form.active .medium-text::before, .register form.register-form.active .medium-text::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  background-image: url(img/svg/arrow.svg);
  background-repeat: no-repeat;
  background-position: center;
}
.register form.register-form.active .medium-text::before {
  top: 1px;
  transform: rotate(180deg);
}
.register form.register-form.active .medium-text::after {
  bottom: 1px;
}
.register form.register-form.active .medium-sticker {
  position: absolute;
  bottom: 0px;
  left: 0;
}

form h2 {
  padding-bottom: 8px;
}
form .message {
  padding: 6px 10px;
  border-radius: 4px;
  border: 2px solid #d1d1d1;
  display: none;
  font-size: 13px;
  font-weight: bold;
}
form .message.error {
  display: block;
  border-color: #f1d5d5;
  background-color: #fde5e5;
}
form .message.success {
  display: block;
  border-color: #cdeac7;
  background-color: #e6fde1;
}
form.login-form, form.register-form {
  display: none;
}
form.login-form.active, form.register-form.active {
  gap: 24px;
  display: flex;
  flex-direction: column;
}
form.login-form label span, form.register-form label span {
  display: block;
  margin-bottom: 0px;
}
form.login-form .password-reset, form.register-form .password-reset {
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  margin-top: 9px;
  margin-bottom: 8px;
  color: #004E9E;
  font-family: Inter, Verdana, Tahoma, sans-serif;
}

.tile-link {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tile-link__item {
  display: flex;
  position: relative;
  padding: 12px 16px;
  background-color: #F5F7F9;
  border-radius: 8px;
  min-height: 90px;
  align-items: center;
  column-gap: 12px;
}
.tile-link__item p {
  padding-right: 36px;
}
.tile-link__item::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  background-image: url(img/svg/arrow-bottom.svg);
  transform: rotate(-90deg);
  top: calc(50% - 12px);
  right: 16px;
}
.tile-link__item .paragraph + .note {
  margin-top: 2px;
  align-self: start;
}
.tile-link__link {
  /*display: grid;
  grid-template-columns: 76px 1fr;
  align-items: center;*/
}
.tile-link__img-wrapper {
  /*@include mixin.pseudo();
  top: 12px;
  left: 16px;*/
  background-color: #fff;
  border-radius: 8px;
  overflow: hidden;
  min-width: 64px;
  max-width: 64px;
  height: 64px;
}
.tile-link__img-wrapper img {
  width: 64px;
  height: auto;
}

.message {
  overflow: hidden;
  display: flex;
  column-gap: 11px;
  flex-wrap: nowrap;
  align-items: flex-end;
}
.message .message__img {
  min-width: 72px;
  height: 72px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  order: 1;
}
.message__right {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 16px;
  gap: 8px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 400;
  text-align: left;
  line-height: 22px;
  color: #24292D;
  font-family: "Tornado", Verdana, sans-serif;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  order: 2;
}
.message__right:before {
  position: absolute;
  content: "";
  bottom: 16px;
  width: 11px;
  height: 34px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}
.message__right:before {
  left: -10px;
}
.message__left {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 16px;
  gap: 8px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 400;
  text-align: left;
  line-height: 22px;
  color: #24292D;
  font-family: "Tornado", Verdana, sans-serif;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  order: 0;
}
.message__left:before {
  position: absolute;
  content: "";
  bottom: 16px;
  width: 11px;
  height: 34px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}
.message__left:before {
  transform: rotate(180deg);
  right: -10px;
}
.message__list h2 {
  margin-bottom: 16px;
}
.message__list section {
  margin-bottom: 20px;
}
.message__img--question {
  background-image: url(img/question.png);
}
.message__img--girl {
  background-image: url(img/girl.png);
}
.message__img--onboarding {
  background-image: url(img/onboarding.png);
}
.message__img--secret {
  background-image: url(img/secret.png);
}
.message__img--idea {
  background-image: url(img/idea.png);
}
.message__img--like {
  background-image: url(img/like.png);
}
.message__img--luck {
  background-image: url(img/luck.png);
}
.message__text--blue {
  background-color: #D6EAFF;
}
.message__text--blue::before {
  background-image: url(img/svg/message-blue.svg);
}
.message__text--green {
  background-color: #D6FFD8;
}
.message__text--green::before {
  background-image: url(img/svg/message-green.svg);
}
.message__text--rose {
  background-color: #FEF1F3;
}
.message__text--rose::before {
  background-image: url(img/svg/message-rose.svg);
}
.message__text--orange {
  background-color: #FFEED6;
}
.message__text--orange::before {
  background-image: url(img/svg/message-orange.svg);
}
.message__left {
  justify-content: flex-end;
}
.message__left .button {
  margin-right: auto;
  margin-left: 0;
}
.message__right .button {
  margin-left: auto;
  margin-right: 0;
}
.message .link {
  font-size: 16px;
  line-height: 22px;
  color: #004E9E;
}
.message .list {
  padding: 0 0 0 1em;
}
.message .button {
  margin-top: 8px;
  width: auto;
  padding: 9px 16px;
  font-size: 14px;
  line-height: 18px;
}
.message .marker {
  padding-bottom: 4px;
}
.message .paragraph + .link,
.message .paragraph + .marker {
  margin-top: 8px;
  background-size: 24px auto;
}
.message .marker + .link {
  margin-top: 8px;
}

.scale-out-ver-top {
  animation: scale-out-ver-top 0.5s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;
}

@keyframes scale-out-ver-top {
  0% {
    transform: scaleY(1);
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    transform: scaleY(0);
    transform-origin: 100% 0%;
    opacity: 1;
    display: none;
  }
}
.todo {
  display: flex;
  flex-direction: column;
  padding-right: 8px;
}
.todo__item {
  display: flex;
  flex-wrap: nowrap;
  column-gap: 12px;
  padding: 12px 0 0 0;
  position: relative;
}
.todo__item::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  background-image: url(img/svg/checkbox.svg);
  top: 15px;
  left: 3px;
}
.todo__item.checked .todo__main-text {
  text-decoration: line-through;
}
.todo__item.checked::before {
  background-image: url(img/svg/checkbox-checked.svg);
}
.todo__wrapper {
  display: flex;
  flex-wrap: nowrap;
  column-gap: 12px;
  justify-content: space-between;
  margin-left: 36px;
  box-shadow: 0px 1px 0 0 #E7EBF4;
  padding-bottom: 12px;
  width: 100%;
}
.todo__mark {
  font-size: 16px;
  color: #748290;
}

.accordion__item {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  padding: 12px 0;
  box-shadow: 0px 1px 0 0 #E7EBF4;
}
.accordion__item.opened .accordion__question::before {
  transform: rotate(180deg);
}
.accordion__item.opened .accordion__answer {
  display: block;
}
.accordion__question {
  position: relative;
  padding-right: 36px;
  /*font-family: 'Tornado Medium', Tahoma, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 23px;
  text-align: left;*/
}
.accordion__question::before {
  content: "";
  position: absolute;
  width: 24px;
  height: 24px;
  right: 0;
  top: calc(50% - 12px);
  background-image: url(img/svg/arrow-bottom.svg);
  background-repeat: no-repeat;
  background-position: center;
}
.accordion__question--right::before {
  transform: rotate(-90deg);
}
.accordion__answer {
  display: none;
  color: #333333;
}
.accordion.sparse .accordion__item {
  margin: 16px 0;
}

.button {
  display: block;
  padding: 14px 16px 10px 16px;
  border-radius: 8px;
  background-color: #004E9E;
  color: #fff;
  font-family: "Tornado Medium", Tahoma, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  text-align: center;
  border: none;
  width: 100%;
  max-width: 361px;
  margin: 0 auto;
}
.button:hover {
  background-color: #007EFF;
}
.button:disabled {
  background-color: #C3CCD5;
}
.button:active {
  background-color: #00356B;
}
.button--little {
  width: auto;
}
.button__transparent {
  color: #004E9E;
  background-color: transparent;
}
.button__transparent:hover {
  background-color: transparent;
  color: #007EFF;
}
.button__transparent:disabled {
  background-color: transparent;
  color: #C3CCD5;
}
.button__transparent:active {
  background-color: transparent;
  color: #00356B;
}

.input__text-label {
  color: #24292D;
}
.input__field {
  width: 100%;
  border: 1px solid #C3CCD5;
  border-radius: 8px;
  padding: 14px 16px 10px 16px;
  font-weight: 400;
  cursor: text;
  color: #24292D;
  /*position: absolute;
  top: 0;
  right: 16px;
  z-index: 1;*/
}
.input__field::placeholder {
  color: #24292D;
}
.input__field:active + label, .input__field:focus + label, .input__field:focus-visible + label {
  color: #00356B;
}
.input__field:active, .input__field:focus, .input__field:focus-visible input {
  border-color: #004E9E;
  outline: none;
}
.input__field-wrapper {
  /*position: relative;
  box-shadow: inset 0px 0px 0px 1px var.$disabled-color;
  border-radius: 8px;
  padding: 14px 16px 10px 16px;
  font-weight: 400;
  cursor: text;
  color: var.$text-color-dark;*/
}
.input__field-wrapper--percent::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  right: 16px;
  top: calc(50% - 12px);
  width: 24px;
  height: 24px;
  background-image: url(img/svg/percent.svg);
}
.input__field-wrapper--date::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  right: 16px;
  top: calc(50% - 12px);
  width: 24px;
  height: 24px;
  background-image: url(img/svg/date.svg);
}
.input__wrapper {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}
.input__list {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

.table {
  table-layout: fixed;
  width: 100%;
  border-collapse: collapse;
}

tbody {
  border-top: 1px solid #C3CCD5;
  border-bottom: 1px solid #C3CCD5;
}

tr th, tr td {
  padding: 12px 0;
}
tr th {
  font-weight: 400;
  color: #748290;
}
tr th:first-child {
  min-width: 90px;
}
tr td:last-child,
tr th:last-child {
  width: 83px;
  max-width: 30%;
  text-align: end;
}

.tile {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tile__item {
  position: relative;
  padding: 12px 16px;
  background-color: #F5F7F9;
  border-radius: 8px;
}
.tile__item p {
  padding-left: 36px;
}
.tile__item p:last-child {
  padding-top: 2px;
}
.tile__img-wrapper {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  top: 12px;
  left: 16px;
}
.tile__img-wrapper img {
  width: 24px;
  height: auto;
}

.underline-block {
  display: flex;
  flex-direction: row;
  column-gap: 12px;
  align-items: flex-start;
  padding-top: 12px;
}
.underline-block__icon {
  padding-right: 36px;
  position: relative;
  display: block;
  width: 100%;
}
.underline-block__icon::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  right: 0;
  top: calc(50% - 18px);
}
.underline-block__icon--right::after {
  background-image: url(img/svg/arrow-bottom.svg);
  transform: rotate(-90deg);
}
.underline-block__icon--download::after {
  background-image: url(img/svg/download.svg);
}
.underline-block__img {
  min-width: 24px;
  max-width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  overflow: visible;
}
.underline-block__description {
  box-shadow: 0px 1px 0 0 #E7EBF4;
  flex-grow: 1;
  padding-bottom: 12px;
  display: flex;
  flex-direction: column;
  row-gap: 2px;
  align-items: flex-start;
}
.underline-block .list {
  padding-bottom: 0;
}

.slider {
  display: flex;
  flex-direction: row;
  overflow-x: hidden;
}
.slider__wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
  /*.autoplay {
      display: none;
      width: 0;
      height: 0;
      opacity: 0;
  }*/
}
.slider__item {
  background-color: #D9D9D9;
  border-radius: 16px;
  overflow: hidden;
  margin: 0 16px 0 16px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-width: calc(100vw - 32px);
  max-width: calc(100vw - 32px);
  padding-top: calc(66vw - 32px);
}
.slider__caption {
  color: #737272;
}

.thumbnail {
  display: flex;
  flex-direction: row;
  gap: 8px;
  padding-left: 16px;
  padding-right: 16px;
  overflow-x: scroll;
  scrollbar-width: none;
  width: auto;
}
.thumbnail__item {
  display: inline-block;
  background-color: #D9D9D9;
  border-radius: 2px;
  height: 56px;
  min-width: 77px;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.roll-up {
  position: fixed;
  top: calc(100vh - 190px);
  left: 0;
  z-index: 81;
  background-color: #fff;
  border-radius: 24px 24px 0 0;
  box-shadow: 0 -5px 18px 0 rgba(0, 87, 182, 0.12);
  padding: 34px 16px 116px;
  text-align: center;
  width: 100%;
  max-height: 100vh;
}
.roll-up__header {
  margin: 0 auto;
  max-width: 1200px;
}
.roll-up__wrapper.opened {
  width: 100%;
  height: 100%;
  z-index: 81;
  background-color: rgba(36, 41, 45, 0.7);
  transition: background-color 1s;
  position: fixed;
  top: 0;
  bottom: 0;
}
.roll-up__wrapper.opened .roll-up__body {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  margin-top: 20px;
}
.roll-up__body {
  display: flex;
  transition: display 1s;
  padding: 0;
  margin: 40px auto 0;
  max-width: 1200px;
  overflow-y: auto;
  scrollbar-width: 10px;
  scroll-behavior: smooth;
  height: calc(100% - 263px);
  max-height: calc(100vh - 180px);
}
.roll-up__body::-webkit-scrollbar-track {
  border-radius: 5px;
}
.roll-up__body::-webkit-scrollbar-thumb {
  border-radius: 5px;
}
.roll-up::before {
  content: "";
  position: absolute;
  top: 5px;
  left: calc(50% - 18px);
  width: 36px;
  height: 5px;
  background-color: rgb(195, 204, 213);
  border-radius: 3px;
}

.panel {
  width: 100%;
  background-color: #ffffff;
  border-top: 1px solid #E7EBF4;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 81;
  padding-bottom: 26px;
}
.panel__list {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
.panel__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 4px;
  padding: 6px;
}
.panel__item path {
  fill: #83929B;
}
.panel__item .panel__img-wrapper {
  border-radius: 16px;
  width: 64px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.panel__item.active .panel__img-wrapper {
  background-color: #F5F7F9;
}
.panel__item.active .panel__link {
  color: #004E9E;
  font-family: "Roboto Bold", Verdana, sans-serif;
  font-weight: 700;
}
.panel__item.active path {
  fill: #004E9E;
}
.panel__link {
  color: #83929B;
  font-family: "Roboto", Verdana, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: 0.02em;
  text-align: center;
}
@media (min-width: 1200px) {
  .panel__list {
    justify-content: space-between;
  }
}

.progress {
  position: relative;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #F0F2F9;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  justify-content: center;
  align-items: center;
  background-color: white;
  z-index: 90;
  overflow: scroll;
}
.modal__close {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  background-image: url(img/svg/close.svg);
  top: 16px;
  right: 16px;
  font-size: 0;
  border: none;
  background-color: transparent;
  width: 32px;
  height: 32px;
  z-index: 91;
}
.modal img {
  width: 100%;
  height: auto;
}
.modal.open {
  display: flex;
}

.tab {
  display: flex;
  gap: 8px;
  max-width: 100vw;
}
.tab__item {
  color: #24292D;
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 14px 24px 10px 24px;
  border-radius: 24px;
  box-shadow: inset 0px 0px 0px 1px #C3CCD5;
  white-space: nowrap;
}
.tab__item.active {
  box-shadow: inset 0px 0px 0px 1px #004E9E;
  background-color: #F0F7FF;
}

.overlay {
  top: 0;
  width: 100%;
  z-index: 15;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.5);
  transition: 0.5s;
  transition-delay: 0.3s;
}
.overlay.open {
  height: 100vh;
  z-index: 100;
}

.hint {
  position: fixed;
  z-index: 20;
  bottom: -100px;
  width: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  padding-bottom: 32px;
  background-color: #fff;
  border-radius: 24px 24px 0 0;
  box-shadow: 0 -5px 18px 0 rgba(0, 87, 182, 0.12);
  transition: 0.3s;
  max-height: 100vh;
}
.hint .wrap {
  display: none;
}
.hint .wrap__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.hint .wrap__head img {
  margin-right: 20px;
}
.hint.medical-done {
  bottom: -300px;
  padding: 5px 16px 40px 16px;
  display: flex;
  align-items: start;
  justify-content: center;
  flex-direction: column;
}
.hint.medical-done h2 {
  height: 70px;
  font-weight: 400;
  font-size: 24px;
  line-height: 29px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hint.medical-done p {
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  text-align: left;
}
.hint.medical-done p + .button {
  margin-top: 20px;
}
.hint.medical-done button {
  width: 100%;
  margin-top: 20px;
  border-radius: 8px;
  padding: 12px 0;
  border: none;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  text-align: center;
  color: #004E9E;
  background-color: #fff;
}
.hint.medical-done button.primary {
  color: #fff;
  background-color: #004E9E;
}
.hint.edit-profile {
  bottom: -900px;
  padding: 5px 16px 40px 16px;
  display: flex;
  justify-content: end;
  flex-direction: column;
}
.hint.edit-profile h1 {
  padding: 20px 0;
}
.hint.edit-profile h2 {
  height: 70px;
  font-weight: 400;
  font-size: 24px;
  line-height: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hint.edit-profile p {
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  padding: 8px 0;
}
.hint.edit-profile p + .button {
  margin-top: 20px;
}
.hint.edit-profile .radio-option {
  padding: 8px 0;
}
.hint.edit-profile button {
  width: 100%;
  margin-top: 20px;
  border-radius: 8px;
  padding: 12px 0;
  border: none;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  text-align: center;
  color: #004E9E;
  background-color: #fff;
}
.hint.edit-profile button.primary {
  color: #fff;
  background-color: #004E9E;
}
.hint.open {
  bottom: 0px;
  z-index: 101;
}
.hint.open .wrap {
  display: block;
}
.hint__header-hole {
  background: #C3CCD5;
  height: 5px;
  border-radius: 2.5px;
  margin: 0 auto;
  width: 36px;
  text-align: center;
}
.hint__head {
  position: sticky;
  top: 0;
  background-color: #fff;
  z-index: 102;
  padding-bottom: 10px;
  margin-bottom: 44px;
  border-bottom: 0.33px solid #83929B;
}
.hint__head--button {
  width: 100%;
  height: 10px;
  margin: 4px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hint__head--button::before {
  content: "";
  display: block;
  width: 36px;
  height: 5px;
  border-radius: 2.5px;
  background-color: rgba(60, 60, 67, 0.3019607843);
}
.hint__head .wrap__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 37px 0 8px 16px;
}
.hint__head--title {
  font-weight: 400;
  font-size: 34px;
  line-height: 41px;
  color: #333333;
  font-family: "Tornado Medium", Tahoma, sans-serif;
}
.hint .message {
  padding: 0 16px 20px 16px;
}
.hint__table--result {
  width: 100%;
  padding: 0 16px;
}
.hint__table--result table {
  border-collapse: collapse;
}
.hint__table--result tbody {
  border: none;
}
.hint__table--result tr {
  padding: 12px 0;
}
.hint__table--result tr th:nth-child(1) {
  min-width: 100px;
}
.hint__table--result tr th:nth-child(2) {
  min-width: 140px;
}
.hint__table--result tr th:nth-child(3) {
  min-width: 80px;
}
.hint__table--result tr.head th {
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  padding-bottom: 12px;
  color: #748290;
}
.hint__table--result tr.content td {
  border-top: 0.33px solid #83929B;
}
.hint__table--result tr.total td {
  font-weight: 600;
  font-size: 18px;
  line-height: 23px;
  color: #333333;
  border-top: 1px solid #83929B;
}
.hint__table--result tr td {
  padding: 12px 0;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
}
.hint__footer {
  padding: 0 16px;
}
.hint__footer p {
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #748290;
}

.instruction {
  display: none;
  flex-direction: column;
  gap: 40px;
  max-width: 100vw;
  counter-reset: myCounter 0;
}
.instruction.active {
  display: flex;
}
.instruction__item {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.instruction__item .header__third {
  padding-left: 20px;
  position: relative;
}
.instruction__item .header__third::before {
  color: #000000;
  width: 20px;
  height: 23px;
  counter-increment: myCounter 1;
  content: counter(myCounter) ".";
  font-family: "Tornado Medium", Tahoma, sans-serif;
  font-weight: 400;
  position: absolute;
  top: 0;
  left: 0px;
}
.instruction__img {
  max-width: 100%;
  overflow: hidden;
  border-radius: 24px;
}
.instruction__img img {
  min-width: 100%;
  max-width: 100%;
  height: auto;
}

.structure > li {
  margin-bottom: 8px;
}
.structure > li:last-child {
  margin-bottom: 0;
}
.structure__item ul {
  padding-left: 28px;
}
.structure__item ul li .paragraph {
  color: #4F5963;
}
.structure__item--leaf > p {
  position: relative;
  padding: 9px 0 9px 28px;
}
.structure__item--leaf > p:first-child::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #4F5963;
  left: 10px;
  top: calc(50% - 2px);
}
.structure__item--root > p {
  position: relative;
  padding: 8px 0 8px 28px;
}
.structure__item--root > p:first-child::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
  background-color: transparent;
  background-image: url(img/svg/arrow-bottom.svg);
  left: 0px;
  top: calc(50% - 12px);
  transition: transform 100ms;
}
.structure__item--root ul {
  display: none;
}
.structure__item--root.opened > p:first-child::before {
  transform: rotate(-90deg);
  transition: transform 100ms;
}
.structure__item--root.opened ul {
  display: block;
}