.breadcrumb { padding: 1rem 0; font-size: 0.9rem; -webkit-user-select: none; user-select: none; }
.breadcrumb-items { display: flex; align-items: center; flex-wrap: wrap; width: 100%; max-width: 1600px; margin: auto; padding: 0 20px; }
.breadcrumb-item { display: flex; align-items: center; }
.breadcrumb-home { flex: 0 0 16px; fill: #bbb; }
.breadcrumb-sep { flex: 0 0 8px; margin: 0 0.5rem; fill: #bbb; }
.breadcrumb-text { color: var(--color-blue); }

.color-magenta {
  color: #d7007f;
}
@media screen and (max-width: 600px) {
  .breadcrumb-items {
    padding: 0 10px;
  }
}

.zaruky { color: #2C2C2C; padding-inline: 1rem; }
  .zaruky.homepage .zaruky-top { display: flex; flex-direction: column; align-items: center; gap: 0; }
  .zaruky.homepage .zaruky-top__h1 { font-size: 50px; line-height: 60px; margin-bottom: 40px; }
  .zaruky.homepage .zaruky-top__text { max-width: 1140px; font-size: 22px; line-height: 28px; margin-bottom: 50px; text-align: center; }
  .zaruky.homepage .zaruky-table { display: flex; flex-direction: row; justify-content: center; gap: 55px; flex-wrap: wrap; margin-bottom: 160px; }
  .zaruky.homepage .zaruky-table-box { flex: 0 1 430px; display: flex; flex-direction: column; text-align: left; background: #FFFFFF; box-shadow: 7px 11px 33px #0000001F; border-radius: 25px; padding: 35px 50px 50px 50px; }
  .zaruky.homepage .zaruky-table-box__icon { width: 90px; height: 90px; margin-bottom: 10px; }
  .zaruky.homepage .zaruky-table-box__h2 { font-size: 30px; line-height: 36px; margin-bottom: 20px; }
  .zaruky.homepage .zaruky-table-box__text { font-size: 18px; line-height: 24px; margin-bottom: 10px; }
  .zaruky.homepage .zaruky-table-box-href { display: flex; flex-direction: row; align-items: center; gap: 5px; color: var(--color-blue); margin-top: auto; }
  .zaruky.homepage .zaruky-table-box-href__text { font-size: 16px; line-height: 22px; }
  .zaruky.homepage .zaruky-bottom { position: relative; max-width: 1500px; margin-inline: auto; width: 100%; height: 225px; background: #F5F5F5; border-radius: 25px; }
  .zaruky.homepage .zaruky-bottom-wrap { position: absolute; display: flex; flex-direction: row; align-items: center; bottom: 0; left: calc(50%); transform: translateX(-50%); }
  .zaruky.homepage .zaruky-bottom-wrap-textwrap { display: flex; flex-direction: column; text-align: center; transform: translateY(35%); }
  .zaruky.homepage .zaruky-bottom-wrap-textwrap__h3 { font-size: 22px; line-height: 28px; margin-bottom: 10px; }
  .zaruky.homepage .zaruky-bottom-wrap-textwrap__h4 { font-size: 28px; line-height: 34px; margin-bottom: 30px; }
  .zaruky.homepage .zaruky-bottom-wrap-textwrap-line { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 10px; }
  .zaruky.homepage .zaruky-bottom-wrap-textwrap-line-item { display: flex; flex-direction: row; align-items: center; gap: 12px; }
  .zaruky.homepage .zaruky-bottom-wrap-textwrap-line-item__text { font-size: 22px; line-height: 28px; }

@media screen and (max-width: 1000px) {
  .zaruky.homepage .zaruky-table-box { flex: 1 1 45%; }
}

@media screen and (max-width: 850px) {
  .zaruky.homepage .zaruky-bottom-wrap { position: relative; transform: unset; left: unset; bottom: unset; flex-direction: column-reverse; padding: 2rem 1rem; }
  .zaruky.homepage .zaruky-bottom { height: unset; }
  .zaruky.homepage .zaruky-bottom-wrap-textwrap { transform: unset; max-width: 100%; }
  .zaruky.homepage .zaruky-bottom-wrap__picture img { width: 250px; }
  .zaruky.homepage .zaruky-bottom-wrap-textwrap-line { max-width: 100%; flex-wrap: wrap; }
}

@media screen and (max-width: 700px) {
  .zaruky.homepage .zaruky-table { gap: 25px; }
  .zaruky.homepage .zaruky-table-box { flex: 1 1 100%; }
}

@media screen and (max-width: 600px) {
  .zaruky.homepage .zaruky-table { margin-bottom: 25px; }
  .zaruky.homepage .zaruky-top__h1 { font-size: 35px; line-height: 42px; margin-bottom: 25px; }
  .zaruky.homepage .zaruky-top__text { font-size: 16px; line-height: 22px; margin-bottom: 25px; }
  .zaruky.homepage .zaruky-table-box { align-items: center; text-align: center; padding: 25px 2rem 2rem 2rem; }
  .zaruky.homepage .zaruky-table-box__h2 { font-size: 24px; line-height: 30px; }
  .zaruky.homepage .zaruky-table-box__text { font-size: 16px; line-height: 22px; }
}

@media screen and (max-width: 500px) {
  .zaruky.homepage .zaruky-bottom-wrap-textwrap-line { flex-direction: column; }
    .zaruky.homepage .zaruky-bottom-wrap-textwrap-line span { display: none; }
}

.zaruky-top { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 100px; margin-bottom: 50px; }
.zaruky-top-textwrap { max-width: 530px; display: flex; flex-direction: column; }
.zaruky-top-textwrap__textTop { font-size: 28px; line-height: 34px; color: #777777; margin-bottom: 10px; }
.zaruky-top-textwrap__h1 { font-size: 50px; line-height: 60px; margin-bottom: 15px; }
.zaruky-top-textwrap__bottomText { font-size: 16px; line-height: 22px; margin-bottom: 10px; }
.zaruky-top-textwrap__picture img { max-width: 100%; min-width: 250px; }
.zaruky-why { max-width: 1250px; display: flex; flex-direction: row; text-align: center; flex-wrap: wrap; justify-content: center; gap: 30px; margin-inline: auto; }
.zaruky-why__h2 { flex: 1 1 100%; font-size: 28px; line-height: 34px; margin-bottom: 70px; }
.zaruky-why-box { flex: 0 1 382px; display: flex; flex-direction: column; text-align: center; align-items: center; background-color: #fff; box-shadow: 0px 10px 30px #0000001F; border-radius: 25px; padding: 24px 2rem 50px 2rem; }
.zaruky-why-box__icon { width: 40px; height: 40px; margin-bottom: 22px; }
.zaruky-why-box__h3 { font-size: 18px; line-height: 24px; }
.zaruky-how { background: transparent linear-gradient(180deg, #F5F5F5 0%, #FFFFFF 100%) 0% 0% no-repeat padding-box; display: flex; flex-direction: column; margin-bottom: 100px; padding-top: 142px; margin-top: -80px; }
.zaruky-how__h2 { font-size: 28px; line-height: 34px; margin-bottom: 50px; text-align: center; }
.zaruky-how-wrap { max-width: 1320px; width: 100%; display: flex; flex-direction: column; text-align: center; margin-inline: auto; }
.zaruky-how-wrap-top { display: flex; flex-direction: row; justify-content: center; }
.zaruky-how-wrap-top__button { font-size: 18px; line-height: 24px; background: #FFFFFF 0% 0% no-repeat padding-box; border-radius: 25px 25px 0px 0px; padding: 15px 50px 15px 50px; box-shadow: inset 2px -1px 10px 0 #0000001F; border: none; background: transparent;}
  .zaruky-how-wrap-top__button.active { font-size: 22px; line-height: 28px; box-shadow: 0px 10px 30px #0000001F; border: none; background: transparent;}
.zaruky-how-wrap-content { display: none; flex-direction: row; flex-wrap: wrap; justify-content: space-around; background: #FFFFFF; box-shadow: 0px 10px 30px #0000001F; border-radius: 25px; padding: 80px 2rem; gap: 15px; }
  .zaruky-how-wrap-content.active { display: flex; }
.zaruky-how-wrap-content-box { max-width: 360px; flex: 1 1 250px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.zaruky-how-wrap-content-box__icon { width: 45px; height: 45px; margin-bottom: 20px; }
.zaruky-how-wrap-content-box__h3 { font-size: 18px; line-height: 26px; margin-bottom: 20px; }
.zaruky-how-wrap-content-box__text { font-size: 16px; line-height: 22px; }
.zaruky-faqs { display: flex; flex-direction: column; padding-inline: 1rem; margin-inline: auto; }
.zaruky-faqs__h2 { font-size: 28px; line-height: 34px; margin-bottom: 42px; text-align: center; }
.zaruky-faqs-faq { max-width: 1400px; width: 100%; display: flex; flex-direction: row; justify-content: space-between; background: #FFFFFF 0% 0% no-repeat padding-box; box-shadow: 0px 10px 30px #0000001F; border-radius: 25px; padding: 25px; cursor: pointer; margin-bottom: 25px; margin-inline: auto; }
  .zaruky-faqs-faq.active .zaruky-faqs-faq-textwrap__answer { display: block; }
  .zaruky-faqs-faq.active .faqs-faq__arrow { transform: rotateZ(180deg); }
.faqs-faq__arrow { min-width: 28px; min-height: 28px; transition: all 0.2s; }
.zaruky-faqs-faq-textwrap__answer { display: none; }
.zaruky__bottomText { font-size: 18px; line-height: 24px; text-align: center; }
.zaruky-how-boxes { display: flex; flex-direction: row; justify-content: center; gap: 30px; margin-bottom: 100px; }
.zaruky-how-boxes-box { flex: 0 1 auto; max-width: 587px; width: 100%; background: #FFFFFF; box-shadow: 0px 10px 30px #0000001F; border-radius: 25px; display: flex; flex-direction: column; padding: 35px 50px 50px 50px; }
.zaruky-how-boxes-box-top { display: flex; flex-direction: row; align-items: center; margin-bottom: 25px; }
.zaruky-how-boxes-box-top__icon { width: 50px; height: 40px; margin-right: 15px; }
.zaruky-how-boxes-box-top__h3 { font-size: 22px; line-height: 30px; }
.zaruky-how-boxes-box__row { font-size: 16px; line-height: 22px; text-align: left; margin-bottom: 15px; }
.zaruky-how-boxes-box__tip { font-size: 16px; line-height: 22px; text-align: left; padding-top: 25px; margin-top: auto; }

@media screen and (max-width: 1000px) {
  .zaruky-why__h2 { margin-bottom: 0; }
}

@media screen and (max-width: 800px) {
  .zaruky-top { gap: 25px; }
}

@media screen and (max-width: 600px) {
  .zaruky { overflow-x: hidden; }
  .zaruky-top { flex-direction: column; text-align: center; margin-bottom: 0; }
  .zaruky-top-textwrap__h1 { font-size: 35px; line-height: 42px; }
  .zaruky-top-textwrap__picture { transform: translateX(40px); }
  .zaruky-why__h2 { font-size: 24px; line-height: 30px; margin-bottom: 0; }
  .zaruky-how__h2 { font-size: 24px; line-height: 30px; }
  .zaruky-faqs__h2 { font-size: 24px; line-height: 30px; margin-bottom: 20px; }
  .zaruky-faqs-faq-textwrap__question { font-size: 18px; line-height: 24px; }
  .zaruky-faqs-faq-textwrap__answer { font-size: 14px; line-height: 20px; }
  .zaruky-how-wrap-content { padding: 35px 1rem; }
  .zaruky-how { margin-bottom: 35px; }
  .zaruky-how-boxes { flex-direction: column; margin-bottom: 50px; }
  .zaruky-how-boxes-box-top { flex-direction: column; }
  .zaruky-how-boxes-box-top__icon { margin-right: unset; }
  .zaruky-how-boxes-box__row { text-align: center; }
  .zaruky-how-boxes-box__tip { text-align: center; }
}

@media screen and (max-width: 450px) {
  .zaruky-how-wrap-top { flex-direction: column; }
  .zaruky-how-wrap-content { border-radius: 0 0 25px 25px; }
  .zaruky-how-wrap-top__button { border-radius: 0; box-shadow: inset 0px 5px 10px 0px #0000001f; }
    .zaruky-how-wrap-top__button:first-of-type { border-radius: 25px 25px 0 0; }
}