@import url(https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;600&display=swap);
@font-face {
    font-family: Evolventa;
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/Evolventa-Bold.woff2) format("woff2"), url(../fonts/Evolventa-Bold.woff) format("woff")
}

@font-face {
    font-family: Evolventa;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/Evolventa-Regular.woff2) format("woff2"), url(../fonts/Evolventa-Regular.woff) format("woff")
}

@font-face {
    font-family: Noteworthy;
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/Noteworthy-Bold.woff2) format("woff2"), url(../fonts/Noteworthy-Bold.woff) format("woff")
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

html {
    -webkit-text-size-adjust: 100%;
    line-height: 1.15
}

main {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    flex-grow: 1
}

hr {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace;
    font-size: 1em
}

a {
    background-color: transparent
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
samp {
    font-family: monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,
input {
    overflow: visible
}

button,
select {
    text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,
button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],
[type=radio] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

[hidden],
template {
    display: none
}

body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(39.52%, #262425), color-stop(109.81%, #000));
    background: linear-gradient(180deg, #262425 39.52%, #000 109.81%);
    color: #fff;
    -ms-flex-direction: column;
    flex-direction: column;
    font-family: Evolventa;
    margin: 0;
    min-height: 100vh;
    padding: 0;
    position: relative
}

body,
picture {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

picture {
    pointer-events: none
}

picture img {
    max-width: 100%
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    line-height: 130%;
    margin: 0;
    padding: 0
}

li,
ol,
ul {
    list-style-type: none;
    margin: 0;
    padding: 0
}

@media (max-width:998px) {
    main {
        padding-top: 40px
    }
}

@media (max-width:768px) {
    main {
        padding-top: 0
    }
}

.container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 auto;
    max-width: 1450px;
    padding: 0 15px;
    width: 100%
}

.button {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    outline: 0;
    position: relative;
    text-decoration: none;
    -webkit-transition: .3s;
    transition: .3s
}

.button--form,
.button--main {
    background-color: #f931cf;
    border-radius: 158px;
    color: #fff;
    font-size: 26px;
    font-weight: 700
}

.button--form:active,
.button--form:hover,
.button--main:active,
.button--main:hover {
    -webkit-box-shadow: 0 1px 53px #f931cf;
    box-shadow: 0 1px 53px #f931cf
}

.button--form:active,
.button--main:active {
    background-color: #fff;
    color: #262425
}

.button--form:disabled,
.button--main:disabled {
    cursor: not-allowed;
    -webkit-filter: grayscale(.8);
    filter: grayscale(.8)
}

@media (max-width:998px) {
    .button--form,
    .button--main {
        font-size: 18px
    }
}

.button--main {
    height: 70px;
    margin: 20px auto 0;
    width: 310px;
    z-index: 3
}

@media (max-width:998px) {
    .button--main {
        height: 46px;
        margin: 0 auto;
        width: 270px
    }
}

.button--lc {
    background-color: #262425;
    border: 1px solid #fff;
    border-radius: 60px;
    color: #fff;
    font-size: 20px
}

.button--lc img {
    margin-right: 10px;
    -webkit-transition: inherit;
    transition: inherit
}

.button--lc:hover {
    -webkit-box-shadow: 0 0 20px #f931cf;
    box-shadow: 0 0 20px #f931cf
}

.button--lc:active {
    background-color: #fff;
    color: #262425
}

.button--lc:active img {
    -webkit-filter: invert(1);
    filter: invert(1)
}

@media (max-width:998px) {
    .button--lc {
        font-size: 12px
    }
    .button--lc img {
        margin-right: 5px
    }
}

.timer {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    border-radius: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #000;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    padding: 17px 77px
}

.timer__head p {
    font-size: 14px;
    line-height: normal
}

.timer__head p span {
    display: block;
    font-size: 22px;
    font-weight: 700;
    margin-top: 5px
}

.timer__body p {
    font-size: 14px;
    line-height: normal;
    text-align: center
}

.timer__time {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 52px;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    justify-content: center;
    line-height: 1
}

@media (max-width:998px) {
    .timer {
        padding: 9px 16px
    }
    .timer__head p {
        font-size: 12px
    }
    .timer__head p span {
        font-size: 17px
    }
    .timer__body p {
        font-size: 12px
    }
    .timer__time {
        font-size: 31px
    }
}

.form p {
    font-size: 16px;
    font-weight: 400;
    line-height: normal
}

@media (max-width:998px) {
    .form p {
        text-align: center
    }
}

.form__email {
    background: #fff;
    border: 0;
    border-radius: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 18px;
    height: 68px;
    margin-bottom: 10px;
    outline: 0;
    padding: 0 50px;
    width: 100%
}

.form__email::-webkit-input-placeholder {
    color: #a6a6a6
}

.form__email::-moz-placeholder {
    color: #a6a6a6
}

.form__email:-ms-input-placeholder {
    color: #a6a6a6
}

.form__email::-ms-input-placeholder {
    color: #a6a6a6
}

.form__email::placeholder {
    color: #a6a6a6
}

.form__button {
    height: 69px;
    margin-bottom: 15px;
    position: relative;
    width: 100%
}

.form__button:disabled {
    background: grey;
    cursor: not-allowed
}

.form__check,
.form__check2 {
    color: #000;
    font-size: 13px;
    font-weight: 400;
    line-height: 140%;
    margin-top: 20px
}

.form__check-input {
    opacity: 0;
    position: absolute;
    z-index: -1
}

.form__check-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.form__check-input+label:before {
    border: 1px solid #535353;
    border-radius: 4px;
    content: "";
    cursor: pointer;
    display: inline-block;
    height: 24px;
    margin-right: 10px;
    width: 24px
}

.form__check-input:checked+label:before {
    background-color: #fff;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 22px
}

.form__check-text {
    color: #000;
    width: 100%
}

.form .form__content p,
.form__check-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 120%
}

.form .form__content p {
    color: #fff
}

.form .form__content a {
    color: inherit;
    font-size: inherit;
    text-decoration: none
}

body main .swiper-container {
    overflow: hidden
}

body main .swiper-button-next,
body main .swiper-button-prev {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    font-size: 0;
    height: 32px;
    margin: 0;
    position: static;
    width: 76px
}

body main .swiper-button-next:after,
body main .swiper-button-next:before,
body main .swiper-button-prev:after,
body main .swiper-button-prev:before {
    display: none
}

@media (max-width:998px) {
    body main .swiper-button-next,
    body main .swiper-button-prev {
        height: 26px;
        width: 41px
    }
}

body main .swiper-button-prev {
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1)
}

.load__body {
    min-height: 600px;
    position: relative
}

.load__pics {
    left: 50%;
    margin: 0 auto;
    max-width: 755px;
    min-height: 740px;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%
}

.load__pics,
.load__pics picture {
    position: absolute
}

.load__pics picture:first-child {
    left: 0;
    top: 12%
}

.load__pics picture:nth-child(2) {
    left: 50%;
    top: 0;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%)
}

.load__pics picture:nth-child(3) {
    right: 0;
    top: 12%
}

.load__pics picture:nth-child(4) {
    right: 0;
    top: 68%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.load__pics picture:nth-child(5) {
    bottom: 0;
    left: 56%;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%)
}

.load__pics picture:nth-child(6) {
    left: 0;
    top: 68%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.load__text {
    font-size: 45px;
    font-weight: 700;
    line-height: 60px;
    text-align: center
}

.load.active .load__pics picture:first-child {
    -webkit-animation: piz1 5s linear forwards;
    animation: piz1 5s linear forwards
}

.load.active .load__pics picture:nth-child(2) {
    -webkit-animation: piz2 5s linear forwards;
    animation: piz2 5s linear forwards
}

.load.active .load__pics picture:nth-child(3) {
    -webkit-animation: piz3 5s linear forwards;
    animation: piz3 5s linear forwards
}

.load.active .load__pics picture:nth-child(4) {
    -webkit-animation: piz4 5s linear forwards;
    animation: piz4 5s linear forwards
}

.load.active .load__pics picture:nth-child(5) {
    -webkit-animation: piz5 5s linear forwards;
    animation: piz5 5s linear forwards
}

.load.active .load__pics picture:nth-child(6) {
    -webkit-animation: piz6 5s linear forwards;
    animation: piz6 5s linear forwards
}

@media (max-width:998px) {
    .load__body {
        margin: 35px 0 0;
        min-height: 270px
    }
    .load__pics {
        max-width: 282px;
        min-height: 276px
    }
    .load__pics picture {
        max-width: 100px
    }
    .load__pics picture:first-child {
        max-width: 119px
    }
    .load.active .load__pics picture:first-child {
        -webkit-animation: piz1m 5s linear forwards;
        animation: piz1m 5s linear forwards
    }
    .load.active .load__pics picture:nth-child(2) {
        -webkit-animation: piz2m 5s linear forwards;
        animation: piz2m 5s linear forwards
    }
    .load.active .load__pics picture:nth-child(4) {
        -webkit-animation: piz4m 5s linear forwards;
        animation: piz4m 5s linear forwards
    }
    .load.active .load__pics picture:nth-child(6) {
        -webkit-animation: piz6m 5s linear forwards;
        animation: piz6m 5s linear forwards
    }
    .load__text {
        font-size: 20px;
        line-height: 27px
    }
}

@-webkit-keyframes piz1 {
    0% {
        left: 0;
        top: 12%
    }
    to {
        left: 15%;
        top: 22%
    }
}

@keyframes piz1 {
    0% {
        left: 0;
        top: 12%
    }
    to {
        left: 15%;
        top: 22%
    }
}

@-webkit-keyframes piz1m {
    0% {
        left: 0;
        top: 12%
    }
    to {
        left: 17%;
        top: 24%
    }
}

@keyframes piz1m {
    0% {
        left: 0;
        top: 12%
    }
    to {
        left: 17%;
        top: 24%
    }
}

@-webkit-keyframes piz2 {
    0% {
        top: 0
    }
    to {
        top: 17%
    }
}

@keyframes piz2 {
    0% {
        top: 0
    }
    to {
        top: 17%
    }
}

@-webkit-keyframes piz2m {
    0% {
        top: 0
    }
    to {
        top: 18%
    }
}

@keyframes piz2m {
    0% {
        top: 0
    }
    to {
        top: 18%
    }
}

@-webkit-keyframes piz3 {
    0% {
        right: 0;
        top: 12%
    }
    to {
        right: 16%;
        top: 22%
    }
}

@keyframes piz3 {
    0% {
        right: 0;
        top: 12%
    }
    to {
        right: 16%;
        top: 22%
    }
}

@-webkit-keyframes piz4 {
    0% {
        right: 0;
        top: 68%
    }
    to {
        right: 19%;
        top: 60%
    }
}

@keyframes piz4 {
    0% {
        right: 0;
        top: 68%
    }
    to {
        right: 19%;
        top: 60%
    }
}

@-webkit-keyframes piz4m {
    0% {
        right: 0;
        top: 68%
    }
    to {
        right: 20%;
        top: 60%
    }
}

@keyframes piz4m {
    0% {
        right: 0;
        top: 68%
    }
    to {
        right: 20%;
        top: 60%
    }
}

@-webkit-keyframes piz5 {
    0% {
        bottom: 0;
        left: 56%
    }
    to {
        bottom: 16%;
        left: 54%
    }
}

@keyframes piz5 {
    0% {
        bottom: 0;
        left: 56%
    }
    to {
        bottom: 16%;
        left: 54%
    }
}

@-webkit-keyframes piz6 {
    0% {
        left: 0;
        top: 68%
    }
    to {
        left: 18%;
        top: 61%
    }
}

@keyframes piz6 {
    0% {
        left: 0;
        top: 68%
    }
    to {
        left: 18%;
        top: 61%
    }
}

@-webkit-keyframes piz6m {
    0% {
        left: 0;
        top: 68%
    }
    to {
        left: 21%;
        top: 62%
    }
}

@keyframes piz6m {
    0% {
        left: 0;
        top: 68%
    }
    to {
        left: 21%;
        top: 62%
    }
}

.result .container {
    padding-bottom: 55px;
    padding-top: 112px;
    position: relative
}

.result h2 {
    font-size: 53px;
    font-weight: 700;
    line-height: 70px;
    margin-bottom: 45px
}

.result h2 span {
    color: #f931cf;
    font-family: Noteworthy;
    font-size: 62px;
    font-weight: 700;
    line-height: 100px
}

.result p {
    font-size: 30px;
    font-weight: 700;
    line-height: 40px;
    margin-bottom: 40px;
    max-width: 560px
}

.result a {
    height: 75px;
    max-width: 366px;
    width: 100%
}

.result picture {
    bottom: -414px;
    max-width: 75%;
    position: absolute;
    right: -235px
}

@media (max-width:1400px) {
    .result picture {
        bottom: -454px
    }
}

@media (max-width:998px) {
    .result .container {
        padding-bottom: 55px;
        padding-top: 45px
    }
    .result h2 {
        font-size: 22px;
        line-height: 29px;
        margin-bottom: 10px;
        max-width: 170px
    }
    .result h2 span {
        font-size: 26px;
        line-height: 26px
    }
    .result p {
        font-size: 16px;
        line-height: 21px;
        margin-bottom: 150px;
        max-width: 170px
    }
    .result a {
        height: 46px;
        max-width: 288px;
        position: relative;
        z-index: 2
    }
    .result picture {
        bottom: 33px;
        left: 50px;
        max-width: none;
        right: auto
    }
}

.adva {
    padding: 85px 0 55px
}

.adva h2 {
    font-size: 53px;
    font-weight: 700;
    line-height: 70px;
    margin-bottom: 60px
}

.adva__block {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    align-items: flex-start;
    background-color: #fff;
    border-radius: 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    flex-grow: 1;
    padding: 20px 25px;
    position: relative
}

.adva__block--weight h3 {
    margin-bottom: 5px
}

.adva__block--weight p {
    margin-bottom: 30px
}

.adva__block--weight span {
    bottom: 40px;
    position: absolute;
    right: 15px;
    -webkit-transform: rotate(6.98deg);
    -ms-transform: rotate(6.98deg);
    transform: rotate(6.98deg)
}

.adva__block--weight picture {
    margin-top: auto
}

.adva__block--mbl {
    padding-bottom: 0
}

.adva__block--mbl h3 {
    margin-bottom: 20px
}

.adva__block--mbl h5 {
    bottom: 10px;
    color: #fff;
    font-family: Noteworthy;
    font-size: 26px;
    font-weight: 700;
    line-height: 42px;
    position: absolute
}

.adva__block--mbl h5:nth-child(3) {
    left: 16%
}

.adva__block--mbl h5:nth-child(4) {
    left: 73%
}

.adva__block--mbl img,
.adva__block--mbl picture {
    margin-top: auto;
    width: 100%
}

.adva__block--percent span {
    margin-bottom: 20px
}

.adva__block--water {
    background-position: 100% 100%;
    background-repeat: no-repeat
}

.adva__block--water h3 {
    margin-bottom: 20px
}

.adva__block--water span {
    position: absolute;
    right: 20px;
    top: 30px
}

.adva__block--imt span {
    margin: 10px 0 auto
}

.adva__block--ccal:is(div) h3 {
    margin-bottom: 20px;
    padding-right: 80px
}

.adva__block--ccal:is(div) span {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 30px;
    height: 100px;
    justify-content: center;
    line-height: 25px;
    position: absolute;
    right: 18px;
    top: 16px;
    -webkit-transform: rotate(12.89deg);
    -ms-transform: rotate(12.89deg);
    transform: rotate(12.89deg);
    width: 100px
}

.adva__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    color: #262425;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 62px;
    justify-content: space-between
}

.adva__item span {
    background-color: #f931cf;
    border-radius: 106px;
    color: #fff;
    font-family: Noteworthy;
    font-size: 30px;
    font-weight: 700;
    line-height: 48px;
    padding: 0 15px
}

.adva h3 {
    font-size: 26px;
    font-weight: 700;
    line-height: 35px
}

.adva p {
    font-size: 22px;
    line-height: 29px
}

.adva h4 {
    font-size: 16px;
    line-height: 21px
}

.adva__pagination {
    display: none
}

@media (min-width:1101px) {
    .adva .swiper-wrapper {
        grid-gap: 36px;
        display: grid;
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (max-width:1400px) {
    .adva h2 {
        padding-right: 600px
    }
    .adva__block--water h3 {
        margin-bottom: 5px
    }
    .adva__block--water span {
        margin-bottom: 5px;
        position: static
    }
}

@media (max-width:1100px) {
    .adva h2 {
        padding-right: 500px
    }
    .adva__item:is(div) {
        height: auto
    }
}

@media (max-width:998px) {
    .adva {
        padding: 20px 0 17px
    }
    .adva h2 {
        font-size: 22px;
        line-height: 29px;
        margin-bottom: 20px;
        padding-right: 0
    }
    .adva__block {
        padding: 10px 15px
    }
    .adva__block--weight span {
        bottom: 30px;
        right: 15px
    }
    .adva__block--mbl {
        padding-bottom: 0
    }
    .adva__block--mbl h3 {
        margin-bottom: 10px
    }
    .adva__block--mbl h5 {
        bottom: 15px;
        font-size: 20px;
        line-height: 32px
    }
    .adva__block--mbl h5:nth-child(3) {
        left: 16%
    }
    .adva__block--mbl h5:nth-child(4) {
        left: 73%
    }
    .adva__block--percent span {
        margin-bottom: 15px
    }
    .adva__block--water {
        background-size: 130px;
        padding-top: 25px
    }
    .adva__block--water h3 {
        margin-bottom: 25px
    }
    .adva__block--water p {
        padding-right: 50px
    }
    .adva__block--water span {
        position: absolute;
        right: 20px;
        top: 15px
    }
    .adva__block--ccal:is(div) h3 {
        margin-bottom: 15px;
        padding-right: 0
    }
    .adva__block--ccal:is(div) span {
        font-size: 26px;
        right: 0;
        top: 0
    }
    .adva__item {
        gap: 10px
    }
    .adva__item span {
        font-size: 20px;
        line-height: 32px;
        padding: 0 12px
    }
    .adva h3 {
        font-size: 16px;
        line-height: 21px
    }
    .adva p {
        font-size: 12px;
        line-height: 16px
    }
    .adva h4 {
        font-size: 10px;
        line-height: 13px
    }
    .adva__pagination:is(div) {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: center;
        margin-top: 20px;
        position: static
    }
    .adva__pagination:is(div) .swiper-pagination-bullet {
        background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#481433));
        background: linear-gradient(180deg, #000, #481433);
        border-radius: 50%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        height: 19px;
        opacity: 1;
        width: 19px
    }
    .adva__pagination:is(div) .swiper-pagination-bullet-active {
        background: -webkit-gradient(linear, left top, left bottom, from(#f931cf), to(#fff));
        background: linear-gradient(180deg, #f931cf, #fff)
    }
}

.y-get {
    padding: 55px 0
}

.y-get .container {
    position: relative
}

.y-get .container>picture {
    bottom: -190px;
    max-width: 77%;
    position: absolute;
    right: -540px
}

.y-get__col {
    max-width: 905px;
    position: relative;
    z-index: 2
}

.y-get h2 {
    font-size: 53px;
    font-weight: 700;
    line-height: 70px;
    margin-bottom: 60px
}

.y-get__body {
    background-color: #262425;
    border: 2px solid #fff;
    border-radius: 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 36px 41px 20px
}

.y-get__item {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between
}

.y-get__item picture {
    border-radius: 14px;
    overflow: hidden
}

.y-get__item div {
    max-width: 450px;
    width: 100%
}

.y-get__item h3 {
    font-size: 30px;
    font-weight: 700;
    line-height: 40px;
    margin-bottom: 15px
}

.y-get__item p {
    font-size: 28px;
    line-height: 37px
}

.y-get__nav {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    margin-top: 6px
}

@media (max-width:998px) {
    .y-get {
        padding: 20px 0
    }
    .y-get .container>picture {
        bottom: 190px;
        max-width: 260px;
        right: -122px;
        width: 200%
    }
    .y-get h2 {
        font-size: 22px;
        line-height: 29px;
        margin-bottom: 20px;
        padding-right: 50px
    }
    .y-get__body {
        border-radius: 6px;
        border-width: 1px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        max-width: 600px;
        padding: 19px 10px 5px;
        width: 100%
    }
    .y-get__item picture {
        border-radius: 14px;
        overflow: hidden
    }
    .y-get__item div {
        max-width: 450px
    }
    .y-get__item h3 {
        font-size: 14px;
        line-height: 19px;
        margin-bottom: auto
    }
    .y-get__item p {
        font-size: 12px;
        line-height: 16px
    }
    .y-get__nav {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: space-between;
        margin-top: 14px
    }
}

@media (max-width:400px) {
    .y-get__item div {
        max-width: 172px
    }
}

.order {
    padding: 55px 0 280px
}

.order .container {
    position: relative
}

.order__pic {
    max-width: 56%;
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.order__pic>span {
    left: 45%;
    max-width: 85%;
    position: absolute;
    top: 59%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 200%
}

.order__pic>span img {
    max-width: 100%
}

.order h2 {
    font-size: 53px;
    font-weight: 700;
    line-height: 70px;
    margin-bottom: 45px;
    max-width: 870px;
    position: relative;
    z-index: 2
}

.order h2 span {
    color: #f931cf;
    display: block;
    font-family: Noteworthy;
    font-size: 62px;
    font-weight: 700;
    line-height: 50px
}

.order__col {
    max-width: 510px;
    position: relative;
    z-index: 3
}

.order h3 {
    font-size: 22px;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 15px;
    text-align: center
}

.order h3 span {
    display: block;
    font-size: 32px;
    font-weight: 700
}

.order .timer {
    margin-bottom: 25px
}

.order .gift {
    margin-bottom: 20px
}

@media (max-width:998px) {
    .order {
        padding: 15px 0 150px
    }
    .order__pic {
        margin: 15px auto 0;
        max-width: 320px;
        position: relative;
        right: auto;
        top: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
    .order__pic>span {
        left: 45%;
        max-width: 85%;
        position: absolute;
        top: 59%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 200%
    }
    .order__pic>span img {
        max-width: 100%
    }
    .order h2 {
        font-size: 22px;
        line-height: 1.25;
        margin-bottom: 25px
    }
    .order h2 span {
        display: inline;
        font-size: 26px;
        line-height: inherit
    }
    .order__col {
        max-width: none
    }
    .order h3 {
        font-size: 16px
    }
    .order h3 span {
        font-size: 29px
    }
    .order .gift,
    .order .timer {
        margin-bottom: 15px
    }
}

.promo {
    padding: 55px 0
}

.promo .container {
    padding-bottom: 350px;
    position: relative
}

.promo h2 {
    font-size: 53px;
    font-weight: 700;
    line-height: 70px;
    max-width: 705px
}

.promo h2 span {
    color: #f931cf;
    font-family: Noteworthy;
    font-size: 62px;
    font-weight: 700;
    line-height: 100px
}

.promo picture {
    bottom: -91px;
    left: calc(50% - 32px);
    position: absolute;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%)
}

.promo picture img {
    max-width: 110vw
}

@media (max-width:998px) {
    .promo {
        padding: 20px 0 3px
    }
    .promo .container {
        padding-bottom: 180px
    }
    .promo h2 {
        font-size: 22px;
        line-height: 29px;
        max-width: 290px
    }
    .promo h2 span {
        font-size: 26px;
        line-height: 26px
    }
    .promo picture {
        bottom: -20px;
        left: calc(50% - 44px);
        max-width: 410px;
        width: 200%
    }
    .promo picture img {
        max-width: 100%
    }
}

.gift {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 20px
}

.gift picture {
    margin-right: 30px;
    min-width: 100px
}

.gift p {
    font-size: 22px;
    line-height: normal
}

.gift p span {
    display: block;
    text-transform: uppercase
}

@media (max-width:998px) {
    .gift p {
        font-size: 15px
    }
}

.quiz,
.quiz__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    flex-grow: 1
}

.quiz-item {
    display: none;
    position: relative
}

.quiz-item.active {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    background-position: 50%;
    background-size: cover;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    flex-grow: 1;
    min-height: 100vh;
    overflow: hidden;
    padding-top: 100px
}

.quiz-item:not(:first-child):not(:last-child)>.container {
    padding-bottom: 130px;
    padding-top: 60px
}

.quiz-item:not(:first-child):not(:last-child)>.container>picture {
    pointer-events: none
}

.quiz-item .male-pic {
    display: none
}

.quiz-item input[type=number] {
    background-color: #262425;
    border: 2px solid #fff;
    border-radius: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    font-size: 20px;
    height: 68px;
    max-width: 440px;
    text-align: center
}

.quiz-item input[type=number]::-webkit-input-placeholder {
    color: #fff
}

.quiz-item input[type=number]::-moz-placeholder {
    color: #fff
}

.quiz-item input[type=number]:-ms-input-placeholder {
    color: #fff
}

.quiz-item input[type=number]::-ms-input-placeholder {
    color: #fff
}

.quiz-item input[type=number]::placeholder {
    color: #fff
}

.quiz-item>.container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    flex-grow: 1;
    position: relative
}

.quiz-item>.container>picture {
    pointer-events: none
}

.quiz-item__title {
    font-family: Evolventa;
    font-size: 45px;
    font-weight: 700;
    line-height: 60px;
    margin-bottom: 80px
}

.quiz-item__items {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 35px 90px;
    margin-bottom: 120px;
    max-height: 480px;
    max-width: 970px;
    position: relative;
    z-index: 2
}

@media (max-width:998px) {
    .quiz-item.active {
        padding-top: 57px
    }
    .quiz-item:not(:first-child):not(:last-child)>.container {
        padding-bottom: 230px;
        padding-top: 30px
    }
    .quiz-item__title {
        font-size: 22px;
        line-height: 29px;
        margin-bottom: 35px
    }
    .quiz-item__items {
        gap: 20px;
        margin-bottom: 0;
        max-height: none
    }
    .quiz-item .quiz-nav {
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
        margin-bottom: 55px;
        margin-top: 0;
        order: -1
    }
    .quiz-item input[type=number] {
        font-size: 14px;
        height: 46px
    }
}

.quiz-item--1 {
    background-size: cover
}

.quiz-item--1 .container {
    padding-bottom: 290px;
    padding-top: 115px;
    position: relative
}

.quiz-item--1 .container>picture {
    max-width: 110%;
    position: absolute;
    right: -585px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.quiz-item--1 h1 {
    font-size: 53px;
    font-weight: 700;
    line-height: 62px;
    margin-bottom: 135px;
    max-width: 980px
}

.quiz-item--1 h1 span {
    color: #f931cf;
    font-family: Noteworthy;
    font-size: 62px
}

.quiz-item--1 p {
    font-size: 40px;
    font-weight: 700;
    line-height: 53px;
    margin-bottom: 60px
}

.quiz-item--1 .quiz-el {
    max-width: 300px
}

.quiz-item--1 .quiz-el label {
    font-size: 30px;
    font-weight: 700;
    min-height: 80px;
    position: relative
}

.quiz-item--1 .quiz-el label:before {
    position: absolute;
    right: -22px;
    top: 50%;
    -webkit-transform: translate(100%, -50%);
    -ms-transform: translate(100%, -50%);
    transform: translate(100%, -50%)
}

.quiz-item--1 .quiz-el:nth-child(3) label:before {
    content: url(../img/female.svg)
}

.quiz-item--1 .quiz-el:nth-child(4) label:before {
    content: url(../img/male.svg)
}

.quiz-item--1 .quiz-el+.quiz-el {
    margin-top: 40px
}

.quiz-item--1 .quiz-el label:active,
.quiz-item--1 .quiz-el label:hover {
    -webkit-box-shadow: 0 0 20px #f931cf;
    box-shadow: 0 0 20px #f931cf
}

.quiz-item--1 .quiz-el label:active {
    background-color: #f931cf;
    color: #fff
}

.quiz-item--1 .quiz-el+.quiz-el label:active,
.quiz-item--1 .quiz-el+.quiz-el label:hover {
    -webkit-box-shadow: 0 0 20px #0085ff;
    box-shadow: 0 0 20px #0085ff
}

.quiz-item--1 .quiz-el+.quiz-el label:active {
    background-color: #0085ff;
    color: #fff
}

@media (max-width:1200px) {
    .quiz-item--1 .container>picture {
        right: -435px
    }
}

@media (max-width:998px) {
    .quiz-item--1 .container {
        padding-bottom: 425px;
        padding-top: 40px
    }
    .quiz-item--1 .container>picture {
        display: none
    }
    .quiz-item--1 .container:before {
        bottom: 0;
        content: url(../img/1m1.png);
        left: 0;
        position: absolute
    }
    .quiz-item--1 .container:after {
        content: url(../img/1m2.png);
        position: absolute;
        right: 0;
        top: 105px
    }
    .quiz-item--1 h1 {
        font-size: 22px;
        line-height: 29px;
        margin-bottom: 185px;
        max-width: 500px
    }
    .quiz-item--1 h1 span {
        font-size: 26px
    }
    .quiz-item--1 p {
        font-size: 20px;
        line-height: 27px;
        margin-bottom: 30px
    }
    .quiz-item--1 .quiz-el {
        max-width: 205px
    }
    .quiz-item--1 .quiz-el label {
        font-size: 20px;
        min-height: 53px
    }
    .quiz-item--1 .quiz-el label:before {
        right: -11px;
        -webkit-transform: translate(100%, -50%) scale(.8);
        -ms-transform: translate(100%, -50%) scale(.8);
        transform: translate(100%, -50%) scale(.8)
    }
    .quiz-item--1 .quiz-el+.quiz-el {
        margin-top: 20px
    }
}

.quiz-item--2 .container>picture {
    max-width: 70%;
    position: absolute;
    right: -60px;
    top: 42%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media (max-width:1100px) {
    .quiz-item--2 .container>picture {
        max-width: 65%
    }
}

@media (max-width:998px) {
    .quiz-item--2 .container>picture {
        display: none
    }
    .quiz-item--2 .container:before {
        content: url(../img/2m2.png);
        position: absolute;
        right: 0;
        top: 95px
    }
    .quiz-item--2 .container:after {
        bottom: 20px;
        content: url(../img/2m1.png);
        left: 110px;
        position: absolute
    }
    .quiz-item--2 h2 {
        padding-right: 40px
    }
}

.quiz-item--3 .container>picture {
    bottom: 0;
    max-width: 90%;
    position: absolute;
    right: -150px
}

@media (max-width:1100px) {
    .quiz-item--3 .container>picture {
        right: -250px
    }
}

@media (max-width:998px) {
    .quiz-item--3 .container>picture {
        display: none
    }
    .quiz-item--3 .container:before {
        content: url(../img/3m2.png);
        position: absolute;
        right: 5px;
        top: 114px
    }
    .quiz-item--3 .container:after {
        bottom: 0;
        content: url(../img/3m1.png);
        left: 10px;
        position: absolute
    }
    .quiz-item--3 h2 {
        padding-right: 40px
    }
}

.quiz-item--4 .container>picture {
    max-width: 65%;
    position: absolute;
    right: -20px;
    top: 47%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media (max-width:998px) {
    .quiz-item--4 .container>picture {
        display: none
    }
    .quiz-item--4 .container:before {
        content: url(../img/4m2.png);
        position: absolute;
        right: 15px;
        top: 71px
    }
    .quiz-item--4 .container:after {
        bottom: 0;
        content: url(../img/4m1.png);
        left: 0;
        position: absolute
    }
    .quiz-item--4 h2 {
        padding-right: 40px
    }
}

.quiz-item--5 {
    background: initial, linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
}

.quiz-item--5 h2 {
    margin: 0 auto auto;
    max-width: 1170px;
    text-align: center
}

.quiz-item--5 h2 span {
    color: #f931cf;
    font-family: Noteworthy;
    font-size: 54px
}

.quiz-item--5 .container>picture {
    bottom: -130px;
    position: relative
}

@media (max-width:998px) {
    .quiz-item--5 h2 {
        font-size: 20px;
        line-height: 27px;
        margin: 0 auto 20px;
        max-width: 1170px;
        text-align: center
    }
    .quiz-item--5 h2 span {
        display: block;
        font-size: 26px;
        line-height: 42px
    }
    .quiz-item--5 .container {
        padding-bottom: 0 !important
    }
    .quiz-item--5 .container>picture {
        bottom: 0;
        margin: auto -20px 0 -10px
    }
}

@media (max-width:400px) {
    .quiz-item--5 {
        background: initial, linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
}

.quiz-item--6 .container>picture {
    bottom: 0;
    max-width: 80%;
    position: absolute;
    right: 12px
}

.quiz-item--6 button {
    margin: 20px 0
}

@media (max-width:1350px) {
    .quiz-item--6 .container>picture {
        right: -100px
    }
}

@media (max-width:998px) {
    .quiz-item--6 .container>picture {
        display: none
    }
    .quiz-item--6 .container:before {
        content: url(../img/6m2.png);
        pointer-events: none;
        position: absolute;
        right: 0;
        top: -39px
    }
    .quiz-item--6 .container:after {
        bottom: -31px;
        content: url(../img/6m1.png);
        left: 0;
        pointer-events: none;
        position: absolute;
        z-index: -1
    }
    .quiz-item--6 h2 {
        padding-right: 40px
    }
}

.quiz-item--7 .container>picture {
    max-width: 60%;
    position: absolute;
    right: -168px;
    top: -120px
}

.quiz-item--7 h2 {
    padding-right: 100px
}

.quiz-item--7 button {
    margin: 20px 0
}

@media (max-width:1200px) {
    .quiz-item--7 .container>picture {
        right: -200px
    }
}

@media (max-width:998px) {
    .quiz-item--7 .container>picture {
        display: none
    }
    .quiz-item--7 .container:before {
        bottom: 0;
        content: url(../img/7m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--7 h2 {
        padding-right: 40px
    }
}

.quiz-item--8 .container>picture {
    bottom: 0;
    max-width: 80%;
    position: absolute;
    right: 12px
}

.quiz-item--8 button {
    margin: 20px 0
}

@media (max-width:1350px) {
    .quiz-item--8 .container>picture {
        right: -100px
    }
}

@media (max-width:998px) {
    .quiz-item--8 .container>picture {
        display: none
    }
    .quiz-item--8 .container:before {
        content: url(../img/8m2.png);
        position: absolute;
        right: 22px;
        top: 57px
    }
    .quiz-item--8 .container:after {
        bottom: -17px;
        content: url(../img/8m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--8 h2 {
        padding-right: 40px
    }
}

.quiz-item--9 .container>picture {
    bottom: 0;
    max-width: 65%;
    position: absolute;
    right: 12px
}

@media (max-width:1350px) {
    .quiz-item--9 .container>picture {
        right: -100px
    }
}

@media (max-width:998px) {
    .quiz-item--9 .container>picture {
        display: none
    }
    .quiz-item--9 .container:before {
        content: url(../img/9m2.png);
        position: absolute;
        right: -1px;
        top: 75px
    }
    .quiz-item--9 .container:after {
        bottom: -17px;
        content: url(../img/9m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--9 h2 {
        padding-right: 40px
    }
}

.quiz-item--10 {
    background: initial, linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

.quiz-item--10 h2 {
    margin: 0 auto auto;
    max-width: 1145px;
    text-align: center
}

.quiz-item--10 h2 span {
    color: #f931cf;
    font-family: Noteworthy;
    font-size: 54px
}

.quiz-item--10 .container>picture {
    bottom: -90px;
    position: relative
}

@media (max-width:998px) {
    .quiz-item--10 h2 {
        font-size: 20px;
        line-height: 27px;
        margin: 0 auto 20px;
        max-width: 1170px;
        text-align: center
    }
    .quiz-item--10 h2 span {
        display: block;
        font-size: 26px;
        line-height: 42px
    }
    .quiz-item--10 .container {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-bottom: 0 !important
    }
    .quiz-item--10 .container>picture {
        bottom: 0;
        margin: auto -23px 0 -22px
    }
}

@media (max-width:400px) {
    .quiz-item--10 {
        background: initial, linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
    }
}

.quiz-item--11 .container>picture {
    max-width: 70%;
    position: absolute;
    right: -7px;
    top: 56%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media (max-width:1350px) {
    .quiz-item--11 .container>picture {
        right: -100px
    }
}

@media (max-width:998px) {
    .quiz-item--11 .container>picture {
        display: none
    }
    .quiz-item--11 .container:before {
        content: url(../img/11m2.png);
        position: absolute;
        right: 5px;
        top: 75px
    }
    .quiz-item--11 .container:after {
        bottom: -25px;
        content: url(../img/11m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--11 h2 {
        padding-right: 40px
    }
}

.quiz-item--12 .container>picture {
    max-width: 85%;
    position: absolute;
    right: -184px;
    top: 54%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media (max-width:1350px) {
    .quiz-item--12 .container>picture {
        right: -100px
    }
}

@media (max-width:998px) {
    .quiz-item--12 .container>picture {
        display: none
    }
    .quiz-item--12 .container:after {
        bottom: -25px;
        content: url(../img/12m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--12 h2 {
        padding-right: 40px
    }
}

.quiz-item--13 {
    background: initial, linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

.quiz-item--13 h2 {
    margin: 0 auto;
    max-width: 1145px;
    text-align: center
}

.quiz-item--13 h2 span {
    color: #f931cf;
    font-family: Noteworthy;
    font-size: 54px
}

.quiz-item--13 button {
    margin: 20px auto auto
}

@media (max-width:998px) {
    .quiz-item--13 h2 {
        font-size: 20px;
        line-height: 27px
    }
    .quiz-item--13 h2 span {
        display: block;
        font-size: 26px;
        line-height: 42px
    }
}

.quiz-item--14 .container>picture {
    bottom: 0;
    max-width: 120%;
    position: absolute;
    right: -230px;
    width: 200%
}

.quiz-item--14 button {
    margin: 20px 0
}

@media (max-width:998px) {
    .quiz-item--14 .container>picture {
        display: none
    }
    .quiz-item--14 .container:before {
        content: url(../img/13m2.png);
        pointer-events: none;
        position: absolute;
        right: 10px;
        top: 65px
    }
    .quiz-item--14 .container:after {
        bottom: -25px;
        content: url(../img/13m1.png);
        pointer-events: none;
        position: absolute;
        right: 0
    }
    .quiz-item--14 h2 {
        padding-right: 40px
    }
}

.quiz-item--15 .container>picture {
    bottom: 0;
    max-width: 65%;
    position: absolute;
    right: 12px
}

@media (max-width:998px) {
    .quiz-item--15 .container>picture {
        display: none
    }
    .quiz-item--15 .container:before {
        content: url(../img/14m2.png);
        position: absolute;
        right: 10px;
        top: 65px
    }
    .quiz-item--15 .container:after {
        bottom: -25px;
        content: url(../img/14m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--15 h2 {
        padding-right: 40px
    }
}

.quiz-item--16 .container>picture {
    bottom: 0;
    max-width: 65%;
    position: absolute;
    right: 12px
}

@media (max-width:998px) {
    .quiz-item--16 .container>picture {
        display: none
    }
    .quiz-item--16 .container:before {
        content: url(../img/15m2.png);
        position: absolute;
        right: 10px;
        top: 65px
    }
    .quiz-item--16 .container:after {
        bottom: -25px;
        content: url(../img/15m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--16 h2 {
        padding-right: 40px
    }
}

.quiz-item--17 .container>picture {
    max-width: 55%;
    position: absolute;
    right: 114px;
    top: 53%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media (max-width:998px) {
    .quiz-item--17 .container>picture {
        display: none
    }
    .quiz-item--17 .container:before {
        content: url(../img/16m2.png);
        position: absolute;
        right: 10px;
        top: 65px
    }
    .quiz-item--17 .container:after {
        bottom: -25px;
        content: url(../img/16m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--17 h2 {
        padding-right: 40px
    }
}

.quiz-item--18 {
    background: initial, linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
}

.quiz-item--18 h2 {
    margin: 0 auto auto;
    max-width: 1170px;
    text-align: center
}

.quiz-item--18 h2 span {
    color: #f931cf;
    font-family: Noteworthy;
    font-size: 54px
}

.quiz-item--18 .container>picture {
    bottom: -130px;
    position: relative
}

@media (max-width:998px) {
    .quiz-item--18 h2 {
        font-size: 20px;
        line-height: 27px;
        margin: 0 auto 20px;
        max-width: 1170px;
        text-align: center
    }
    .quiz-item--18 h2 span {
        font-size: 26px;
        line-height: 42px
    }
    .quiz-item--18 .container {
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
        padding-bottom: 0 !important
    }
    .quiz-item--18 .container>picture {
        bottom: 0;
        margin: auto -20px 0 -10px;
        right: 0
    }
}

@media (max-width:400px) {
    .quiz-item--18 {
        background: initial, linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
}

.quiz-item--19 .container>picture {
    bottom: 0;
    max-width: 72%;
    position: absolute;
    right: -56px
}

@media (max-width:998px) {
    .quiz-item--19 .container>picture {
        display: none
    }
    .quiz-item--19 .container:before {
        content: url(../img/18m2.png);
        position: absolute;
        right: 10px;
        top: 65px
    }
    .quiz-item--19 .container:after {
        bottom: -25px;
        content: url(../img/18m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--19 h2 {
        padding-right: 40px
    }
}

.quiz-item--20 .container>picture {
    bottom: 0;
    max-width: 57%;
    position: absolute;
    right: 54px
}

@media (max-width:998px) {
    .quiz-item--20 .container>picture {
        display: none
    }
    .quiz-item--20 .container:before {
        content: url(../img/19m2.png);
        position: absolute;
        right: 10px;
        top: 65px
    }
    .quiz-item--20 .container:after {
        bottom: -25px;
        content: url(../img/19m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--20 h2 {
        padding-right: 40px
    }
}

.quiz-item--21 {
    background: initial, linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

.quiz-item--21 h2 {
    margin: 0 auto auto;
    max-width: 1120px;
    text-align: center
}

.quiz-item--21 h2 span {
    color: #f931cf;
    font-family: Noteworthy;
    font-size: 54px
}

.quiz-item--21 .container>picture {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    bottom: -130px;
    justify-content: center;
    position: relative
}

@media (max-width:998px) {
    .quiz-item--21 h2 {
        font-size: 20px;
        line-height: 27px;
        margin: 0 auto 20px;
        max-width: 1170px;
        text-align: center
    }
    .quiz-item--21 h2 span {
        font-size: 26px;
        line-height: 42px
    }
    .quiz-item--21 .container {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-bottom: 0 !important
    }
    .quiz-item--21 .container>picture {
        bottom: 0;
        margin: auto -20px 0 -10px;
        max-width: 330px;
        right: 0
    }
}

@media (max-width:400px) {
    .quiz-item--21 {
        background: initial, linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
    }
}

.quiz-item--22 .container>picture {
    max-width: 115%;
    position: absolute;
    right: -585px;
    top: 51%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.quiz-item--22 button {
    height: 70px;
    margin-bottom: 20px;
    max-width: 310px;
    position: relative;
    z-index: 2
}

.quiz-item--22 input::-webkit-inner-spin-button,
.quiz-item--22 input::-webkit-outer-spin-button {
    -moz-appearance: textfield;
    -webkit-appearance: none;
    margin: 0
}

@media (max-width:998px) {
    .quiz-item--22 .container>picture {
        display: none
    }
    .quiz-item--22 .container:after {
        bottom: -25px;
        content: url(../img/21m1.png);
        position: absolute;
        right: 0
    }
    .quiz-item--22 h2 {
        padding-right: 40px
    }
    .quiz-item--22 button {
        margin-bottom: 0;
        margin-top: 20px
    }
}

.quiz-item--23 {
    background: initial, linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%);
    padding-bottom: 50px
}

@media (max-width:400px) {
    .quiz-item--23 {
        background: initial, linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
}

.quiz-item--24 {
    background-position: top;
    background-size: cover
}

.quiz-male.quiz-item .female-pic {
    display: none
}

.quiz-male.quiz-item .male-pic {
    display: block
}

@media (max-width:998px) {
    .quiz-male.quiz-item.quiz-item--2 .quiz-item__title {
        width: 75%
    }
    .quiz-male.quiz-item.quiz-item--2 .container>picture {
        display: none
    }
    .quiz-male.quiz-item.quiz-item--2 .container:before {
        content: url(../img/02m2.png)
    }
    .quiz-male.quiz-item.quiz-item--2 .container:after {
        content: url(../img/02m1.png)
    }
}

.quiz-male.quiz-item.quiz-item--3 picture {
    right: -250px
}

@media (max-width:998px) {
    .quiz-male.quiz-item.quiz-item--3 .container:before {
        content: url(../img/03m2.png)
    }
    .quiz-male.quiz-item.quiz-item--3 .container:after {
        content: url(../img/03m1.png)
    }
    .quiz-male.quiz-item.quiz-item--4 .container:before {
        content: url(../img/04m2.png);
        position: absolute;
        right: 15px;
        top: 71px
    }
    .quiz-male.quiz-item.quiz-item--4 .container:after {
        bottom: 0;
        content: url(../img/04m1.png);
        left: 0;
        position: absolute
    }
}

.quiz-male.quiz-item.quiz-item--10,
.quiz-male.quiz-item.quiz-item--5 {
    background: initial, linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

.quiz-male.quiz-item.quiz-item--10 h2 span,
.quiz-male.quiz-item.quiz-item--5 h2 span {
    color: #0085ff
}

@media (max-width:400px) {
    .quiz-male.quiz-item.quiz-item--10,
    .quiz-male.quiz-item.quiz-item--5 {
        background: initial, linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
    }
}

@media (max-width:998px) {
    .quiz-male.quiz-item.quiz-item--8 .container:before {
        content: url(../img/08m2.png)
    }
    .quiz-male.quiz-item.quiz-item--8 .container:after {
        content: url(../img/08m1.png)
    }
    .quiz-male.quiz-item.quiz-item--9 .container:before {
        content: url(../img/09m2.png)
    }
    .quiz-male.quiz-item.quiz-item--11 .container:before {
        content: url(../img/011m2.png)
    }
    .quiz-male.quiz-item.quiz-item--11 .container:after {
        content: url(../img/011m1.png)
    }
    .quiz-male.quiz-item.quiz-item--12 .container:after {
        content: url(../img/012m1.png)
    }
}

.quiz-male.quiz-item.quiz-item--13 {
    background: initial, linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

.quiz-male.quiz-item.quiz-item--13 h2 span {
    color: #0085ff
}

.quiz-male.quiz-item.quiz-item--18,
.quiz-male.quiz-item.quiz-item--21,
.quiz-male.quiz-item.quiz-item--23 {
    background: initial, linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

.quiz-male.quiz-item.quiz-item--18 h2 span,
.quiz-male.quiz-item.quiz-item--21 h2 span,
.quiz-male.quiz-item.quiz-item--23 h2 span {
    color: #0085ff
}

@media (max-width:998px) {
    .quiz-male.quiz-item.quiz-item--14 .container:before {
        content: url(../img/011m2.png)
    }
    .quiz-male.quiz-item.quiz-item--15 .container:after {
        content: url(../img/014m1.png)
    }
    .quiz-male.quiz-item.quiz-item--16 .container:before {
        display: none
    }
    .quiz-male.quiz-item.quiz-item--16 .container:after {
        content: url(../img/015m1.png)
    }
    .quiz-male.quiz-item.quiz-item--17 .container:before {
        content: url(../img/016m2.png)
    }
    .quiz-male.quiz-item.quiz-item--17 .container:after {
        content: url(../img/016m1.png)
    }
    .quiz-male.quiz-item.quiz-item--19 .container:before {
        content: url(../img/018m2.png)
    }
    .quiz-male.quiz-item.quiz-item--20 .container:before {
        content: url(../img/019m2.png)
    }
    .quiz-male.quiz-item.quiz-item--20 .container:after {
        content: url(../img/019m1.png)
    }
    .quiz-male.quiz-item.quiz-item--22 .container:after {
        content: url(../img/021m11.png)
    }
}

.quiz-male.quiz-item.quiz-item--10 .button--main,
.quiz-male.quiz-item.quiz-item--13 .button--main,
.quiz-male.quiz-item.quiz-item--14 .button--main,
.quiz-male.quiz-item.quiz-item--18 .button--main,
.quiz-male.quiz-item.quiz-item--21 .button--main,
.quiz-male.quiz-item.quiz-item--22 .button--main,
.quiz-male.quiz-item.quiz-item--5 .button--main,
.quiz-male.quiz-item.quiz-item--6 .button--main,
.quiz-male.quiz-item.quiz-item--7 .button--main,
.quiz-male.quiz-item.quiz-item--8 .button--main {
    background-color: #0085ff
}

.quiz-male.quiz-item.quiz-item--10 .button--main:hover,
.quiz-male.quiz-item.quiz-item--13 .button--main:hover,
.quiz-male.quiz-item.quiz-item--14 .button--main:hover,
.quiz-male.quiz-item.quiz-item--18 .button--main:hover,
.quiz-male.quiz-item.quiz-item--21 .button--main:hover,
.quiz-male.quiz-item.quiz-item--22 .button--main:hover,
.quiz-male.quiz-item.quiz-item--5 .button--main:hover,
.quiz-male.quiz-item.quiz-item--6 .button--main:hover,
.quiz-male.quiz-item.quiz-item--7 .button--main:hover,
.quiz-male.quiz-item.quiz-item--8 .button--main:hover {
    -webkit-box-shadow: 0 1px 53px #0085ff;
    box-shadow: 0 1px 53px #0085ff;
    color: #fff
}

.quiz-male.quiz-item.quiz-item--10 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--13 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--14 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--18 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--21 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--22 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--5 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--6 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--7 .button--main:disabled,
.quiz-male.quiz-item.quiz-item--8 .button--main:disabled {
    cursor: not-allowed;
    -webkit-filter: grayscale(.8);
    filter: grayscale(.8)
}

.quiz-male.quiz-item.quiz-item--24 {
    background-position: top;
    background-size: cover
}

.quiz-male.quiz-item.quiz-item--24 .female-pic {
    display: none
}

.quiz-male.quiz-item.quiz-item--24 .male-pic {
    display: block
}

.quiz-male.quiz-item.quiz-item--24 h2 span {
    color: #0085ff
}

@media (max-width:998px) {
    .quiz-male.quiz-item.quiz-item--24 .adva .adva__pagination:is(div) .swiper-pagination-bullet {
        background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#171448));
        background: linear-gradient(180deg, #000, #171448)
    }
    .quiz-male.quiz-item.quiz-item--24 .adva .adva__pagination:is(div) .swiper-pagination-bullet-active {
        background: -webkit-gradient(linear, left top, left bottom, from(#0085ff), to(#fff));
        background: linear-gradient(180deg, #0085ff, #fff)
    }
}

.quiz-male.quiz-item.quiz-item--24 .adva__item span {
    background-color: #0085ff
}

.quiz-male.quiz-item.quiz-item--24 .y-get .female-pic {
    display: none
}

.quiz-male.quiz-item.quiz-item--24 .y-get .male-pic {
    display: block;
    right: -340px
}

.quiz-male.quiz-item.quiz-item--24 .button--form,
.quiz-male.quiz-item.quiz-item--24 .button--main {
    background-color: #0085ff
}

.quiz-male.quiz-item.quiz-item--24 .button--form:hover,
.quiz-male.quiz-item.quiz-item--24 .button--main:hover {
    -webkit-box-shadow: 0 1px 53px #0085ff;
    box-shadow: 0 1px 53px #0085ff;
    color: #fff
}

.quiz-male.quiz-item.quiz-item--24 .button--form:disabled,
.quiz-male.quiz-item.quiz-item--24 .button--main:disabled {
    cursor: not-allowed;
    -webkit-filter: grayscale(.8);
    filter: grayscale(.8)
}

.quiz-male.quiz-item.quiz-item--24 .gift h3 {
    color: #0085ff
}

.quiz-male.quiz-item.quiz-item--24 .gift picture {
    background-color: #0085ff
}

.quiz-el,
.quiz-el2 {
    max-width: 440px
}

.quiz-el input,
.quiz-el2 input {
    display: none
}

.quiz-el label,
.quiz-el2 label {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    border-radius: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #262425;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 20px;
    justify-content: center;
    min-height: 68px;
    padding: 5px 10px;
    position: relative;
    text-align: center;
    -webkit-transition: .3s;
    transition: .3s
}

@media (max-width:998px) {
    .quiz-el label,
    .quiz-el2 label {
        font-size: 13px;
        min-height: 46px
    }
}

.quiz-male input:checked~label {
    background-color: #0085ff;
    color: #fff
}

.quiz-male .quiz-el label:active,
.quiz-male .quiz-el label:hover,
.quiz-male input:checked~label {
    -webkit-box-shadow: 0 0 20px #0085ff;
    box-shadow: 0 0 20px #0085ff
}

.quiz-male .quiz-el label:active {
    background-color: #0085ff;
    color: #fff
}

.quiz-female input:checked~label {
    background-color: #f931cf;
    color: #fff
}

.quiz-female .quiz-el label:active,
.quiz-female .quiz-el label:hover,
.quiz-female input:checked~label {
    -webkit-box-shadow: 0 0 20px #f931cf;
    box-shadow: 0 0 20px #f931cf
}

.quiz-female .quiz-el label:active {
    background-color: #f931cf;
    color: #fff
}

.quiz-nav {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    background: linear-gradient(270.98deg, rgba(17, 16, 17, .8) -16.27%, rgba(249, 49, 207, .8) 109.31%);
    border-radius: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 33px;
    justify-content: space-between;
    margin-top: auto;
    max-width: 499px;
    padding: 0 15px;
    width: 100%
}

.quiz-nav span {
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#481433));
    background: linear-gradient(180deg, #000, #481433);
    border-radius: 50%;
    display: block;
    height: 10px;
    position: relative;
    width: 10px
}

.quiz-nav span.active {
    background: -webkit-gradient(linear, left top, left bottom, from(#f931cf), to(#fff));
    background: linear-gradient(180deg, #f931cf, #fff)
}

.quiz-nav span:before {
    background-color: #fff;
    border-radius: 50%;
    -webkit-box-shadow: 2px 2px 8px rgba(0, 0, 0, .78);
    box-shadow: 2px 2px 8px rgba(0, 0, 0, .78);
    height: 30px;
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 30px
}

.quiz-nav[data-step="1"] span:first-child:before,
.quiz-nav[data-step="10"] span:nth-child(10):before,
.quiz-nav[data-step="11"] span:nth-child(11):before,
.quiz-nav[data-step="12"] span:nth-child(12):before,
.quiz-nav[data-step="13"] span:nth-child(13):before,
.quiz-nav[data-step="14"] span:nth-child(14):before,
.quiz-nav[data-step="15"] span:nth-child(15):before,
.quiz-nav[data-step="16"] span:nth-child(16):before,
.quiz-nav[data-step="2"] span:nth-child(2):before,
.quiz-nav[data-step="3"] span:nth-child(3):before,
.quiz-nav[data-step="4"] span:nth-child(4):before,
.quiz-nav[data-step="5"] span:nth-child(5):before,
.quiz-nav[data-step="6"] span:nth-child(6):before,
.quiz-nav[data-step="7"] span:nth-child(7):before,
.quiz-nav[data-step="8"] span:nth-child(8):before,
.quiz-nav[data-step="9"] span:nth-child(9):before {
    content: ""
}

@media (max-width:998px) {
    .quiz-nav {
        height: 20px;
        padding: 0 7px
    }
    .quiz-nav span {
        height: 6px;
        width: 6px
    }
    .quiz-nav span:before {
        height: 18px;
        width: 18px
    }
}

.quiz-male .quiz-nav {
    background: linear-gradient(270.98deg, rgba(17, 16, 17, .8) -16.27%, rgba(0, 133, 255, .8) 109.31%)
}

.quiz-male .quiz-nav span {
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#1b144b));
    background: linear-gradient(180deg, #000, #1b144b)
}

.quiz-male .quiz-nav span.active {
    background: -webkit-gradient(linear, left top, left bottom, from(#0085ff), to(#fff));
    background: linear-gradient(180deg, #0085ff, #fff)
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

.form__check-input:checked+label:before {
    background-image: url(../img/check.svg)
}

body main .swiper-button-next,
body main .swiper-button-prev {
    background-image: url(../img/arrow.svg)
}

.adva__block--water,
body.no-js .adva__block--water,
body.no-webp .adva__block--water {
    background-image: url(../img/adva3.png)
}

body.webp .adva__block--water {
    background-image: url(../img/adva3.webp)
}

@media (max-width:998px) {
    .adva__block--water,
    body.no-js .adva__block--water,
    body.no-webp .adva__block--water {
        background-image: url(../img/adva3.png)
    }
    body.webp .adva__block--water {
        background-image: url(../img/adva3.webp)
    }
}

.quiz-item--1,
body.no-js .quiz-item--1,
body.no-webp .quiz-item--1 {
    background-image: url(../img/bg1.png)
}

body.webp .quiz-item--1 {
    background-image: url(../img/bg1.webp)
}

@media (max-width:400px) {
    .quiz-item--1,
    body.no-js .quiz-item--1,
    body.no-webp .quiz-item--1 {
        background-image: url(../img/bg1m.png)
    }
    body.webp .quiz-item--1 {
        background-image: url(../img/bg1m.webp)
    }
}

.quiz-item--2,
body.no-js .quiz-item--2,
body.no-webp .quiz-item--2 {
    background-image: url(../img/bg2.png)
}

body.webp .quiz-item--2 {
    background-image: url(../img/bg2.webp)
}

@media (max-width:400px) {
    .quiz-item--2,
    body.no-js .quiz-item--2,
    body.no-webp .quiz-item--2 {
        background-image: url(../img/bg2m.png)
    }
    body.webp .quiz-item--2 {
        background-image: url(../img/bg2m.webp)
    }
}

.quiz-item--3,
body.no-js .quiz-item--3,
body.no-webp .quiz-item--3 {
    background-image: url(../img/bg3.png)
}

body.webp .quiz-item--3 {
    background-image: url(../img/bg3.webp)
}

@media (max-width:400px) {
    .quiz-item--3,
    body.no-js .quiz-item--3,
    body.no-webp .quiz-item--3 {
        background-image: url(../img/bg3m.png)
    }
    body.webp .quiz-item--3 {
        background-image: url(../img/bg3m.webp)
    }
}

.quiz-item--4,
body.no-js .quiz-item--4,
body.no-webp .quiz-item--4 {
    background-image: url(../img/bg4.png)
}

body.webp .quiz-item--4 {
    background-image: url(../img/bg4.webp)
}

@media (max-width:400px) {
    .quiz-item--4,
    body.no-js .quiz-item--4,
    body.no-webp .quiz-item--4 {
        background-image: url(../img/bg4m.png)
    }
    body.webp .quiz-item--4 {
        background-image: url(../img/bg4m.webp)
    }
}

.quiz-item--5,
body.no-js .quiz-item--5,
body.no-webp .quiz-item--5 {
    background-image: url(../img/bg5.png), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
}

body.webp .quiz-item--5 {
    background-image: url(../img/bg5.webp), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
}

@media (max-width:400px) {
    .quiz-item--5,
    body.no-js .quiz-item--5,
    body.no-webp .quiz-item--5 {
        background-image: url(../img/bg5m.png), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
    body.webp .quiz-item--5 {
        background-image: url(../img/bg5m.webp), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
}

.quiz-item--6,
body.no-js .quiz-item--6,
body.no-webp .quiz-item--6 {
    background-image: url(../img/bg4.png)
}

body.webp .quiz-item--6 {
    background-image: url(../img/bg4.webp)
}

@media (max-width:400px) {
    .quiz-item--6,
    body.no-js .quiz-item--6,
    body.no-webp .quiz-item--6 {
        background-image: url(../img/bg4m.png)
    }
    body.webp .quiz-item--6 {
        background-image: url(../img/bg4m.webp)
    }
}

.quiz-item--7,
body.no-js .quiz-item--7,
body.no-webp .quiz-item--7 {
    background-image: url(../img/bg3.png)
}

body.webp .quiz-item--7 {
    background-image: url(../img/bg3.webp)
}

@media (max-width:400px) {
    .quiz-item--7,
    body.no-js .quiz-item--7,
    body.no-webp .quiz-item--7 {
        background-image: url(../img/bg3m.png)
    }
    body.webp .quiz-item--7 {
        background-image: url(../img/bg3m.webp)
    }
}

.quiz-item--8,
body.no-js .quiz-item--8,
body.no-webp .quiz-item--8 {
    background-image: url(../img/bg4.png)
}

body.webp .quiz-item--8 {
    background-image: url(../img/bg4.webp)
}

@media (max-width:400px) {
    .quiz-item--8,
    body.no-js .quiz-item--8,
    body.no-webp .quiz-item--8 {
        background-image: url(../img/bg4m.png)
    }
    body.webp .quiz-item--8 {
        background-image: url(../img/bg4m.webp)
    }
}

.quiz-item--9,
body.no-js .quiz-item--9,
body.no-webp .quiz-item--9 {
    background-image: url(../img/bg9.png)
}

body.webp .quiz-item--9 {
    background-image: url(../img/bg9.webp)
}

@media (max-width:400px) {
    .quiz-item--9,
    body.no-js .quiz-item--9,
    body.no-webp .quiz-item--9 {
        background-image: url(../img/bg9m.png)
    }
    body.webp .quiz-item--9 {
        background-image: url(../img/bg9m.webp)
    }
}

.quiz-item--10,
body.no-js .quiz-item--10,
body.no-webp .quiz-item--10 {
    background-image: url(../img/bg5.png), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

body.webp .quiz-item--10 {
    background-image: url(../img/bg5.webp), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

@media (max-width:400px) {
    .quiz-item--10,
    body.no-js .quiz-item--10,
    body.no-webp .quiz-item--10 {
        background-image: url(../img/bg5m.png), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
    }
    body.webp .quiz-item--10 {
        background-image: url(../img/bg5m.webp), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
    }
}

.quiz-item--11,
body.no-js .quiz-item--11,
body.no-webp .quiz-item--11 {
    background-image: url(../img/bg4.png)
}

body.webp .quiz-item--11 {
    background-image: url(../img/bg4.webp)
}

@media (max-width:400px) {
    .quiz-item--11,
    body.no-js .quiz-item--11,
    body.no-webp .quiz-item--11 {
        background-image: url(../img/bg4m.png)
    }
    body.webp .quiz-item--11 {
        background-image: url(../img/bg4m.webp)
    }
}

.quiz-item--12,
body.no-js .quiz-item--12,
body.no-webp .quiz-item--12 {
    background-image: url(../img/bg3.png)
}

body.webp .quiz-item--12 {
    background-image: url(../img/bg3.webp)
}

@media (max-width:400px) {
    .quiz-item--12,
    body.no-js .quiz-item--12,
    body.no-webp .quiz-item--12 {
        background-image: url(../img/bg3m.png)
    }
    body.webp .quiz-item--12 {
        background-image: url(../img/bg3m.webp)
    }
}

.quiz-item--13,
body.no-js .quiz-item--13,
body.no-webp .quiz-item--13 {
    background-image: url(../img/bg13.png), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

body.webp .quiz-item--13 {
    background-image: url(../img/bg13.webp), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

@media (max-width:400px) {
    .quiz-item--13,
    body.no-js .quiz-item--13,
    body.no-webp .quiz-item--13 {
        background-image: url(../img/bg13m.png), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
    }
    body.webp .quiz-item--13 {
        background-image: url(../img/bg13m.webp), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
    }
}

.quiz-item--14,
body.no-js .quiz-item--14,
body.no-webp .quiz-item--14 {
    background-image: url(../img/bg4.png)
}

body.webp .quiz-item--14 {
    background-image: url(../img/bg4.webp)
}

@media (max-width:400px) {
    .quiz-item--14,
    body.no-js .quiz-item--14,
    body.no-webp .quiz-item--14 {
        background-image: url(../img/bg4m.png)
    }
    body.webp .quiz-item--14 {
        background-image: url(../img/bg4m.webp)
    }
}

.quiz-item--15,
body.no-js .quiz-item--15,
body.no-webp .quiz-item--15 {
    background-image: url(../img/bg3.png)
}

body.webp .quiz-item--15 {
    background-image: url(../img/bg3.webp)
}

@media (max-width:400px) {
    .quiz-item--15,
    body.no-js .quiz-item--15,
    body.no-webp .quiz-item--15 {
        background-image: url(../img/bg3m.png)
    }
    body.webp .quiz-item--15 {
        background-image: url(../img/bg3m.webp)
    }
}

.quiz-item--16,
body.no-js .quiz-item--16,
body.no-webp .quiz-item--16 {
    background-image: url(../img/bg2.png)
}

body.webp .quiz-item--16 {
    background-image: url(../img/bg2.webp)
}

@media (max-width:400px) {
    .quiz-item--16,
    body.no-js .quiz-item--16,
    body.no-webp .quiz-item--16 {
        background-image: url(../img/bg2m.png)
    }
    body.webp .quiz-item--16 {
        background-image: url(../img/bg2m.webp)
    }
}

.quiz-item--17,
body.no-js .quiz-item--17,
body.no-webp .quiz-item--17 {
    background-image: url(../img/bg4.png)
}

body.webp .quiz-item--17 {
    background-image: url(../img/bg4.webp)
}

@media (max-width:400px) {
    .quiz-item--17,
    body.no-js .quiz-item--17,
    body.no-webp .quiz-item--17 {
        background-image: url(../img/bg4m.png)
    }
    body.webp .quiz-item--17 {
        background-image: url(../img/bg4m.webp)
    }
}

.quiz-item--18,
body.no-js .quiz-item--18,
body.no-webp .quiz-item--18 {
    background-image: url(../img/bg5.png), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
}

body.webp .quiz-item--18 {
    background-image: url(../img/bg5.webp), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
}

@media (max-width:400px) {
    .quiz-item--18,
    body.no-js .quiz-item--18,
    body.no-webp .quiz-item--18 {
        background-image: url(../img/bg5m.png), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
    body.webp .quiz-item--18 {
        background-image: url(../img/bg5m.webp), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
}

.quiz-item--19,
body.no-js .quiz-item--19,
body.no-webp .quiz-item--19 {
    background-image: url(../img/bg4.png)
}

body.webp .quiz-item--19 {
    background-image: url(../img/bg4.webp)
}

@media (max-width:400px) {
    .quiz-item--19,
    body.no-js .quiz-item--19,
    body.no-webp .quiz-item--19 {
        background-image: url(../img/bg4m.png)
    }
    body.webp .quiz-item--19 {
        background-image: url(../img/bg4m.webp)
    }
}

.quiz-item--20,
body.no-js .quiz-item--20,
body.no-webp .quiz-item--20 {
    background-image: url(../img/bg3.png)
}

body.webp .quiz-item--20 {
    background-image: url(../img/bg3.webp)
}

@media (max-width:400px) {
    .quiz-item--20,
    body.no-js .quiz-item--20,
    body.no-webp .quiz-item--20 {
        background-image: url(../img/bg3m.png)
    }
    body.webp .quiz-item--20 {
        background-image: url(../img/bg3m.webp)
    }
}

.quiz-item--21,
body.no-js .quiz-item--21,
body.no-webp .quiz-item--21 {
    background-image: url(../img/bg5.png), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

body.webp .quiz-item--21 {
    background-image: url(../img/bg5.webp), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
}

@media (max-width:400px) {
    .quiz-item--21,
    body.no-js .quiz-item--21,
    body.no-webp .quiz-item--21 {
        background-image: url(../img/bg5m.png), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
    }
    body.webp .quiz-item--21 {
        background-image: url(../img/bg5m.webp), linear-gradient(293.45deg, #f931cf -27.58%, #000 50.41%)
    }
}

.quiz-item--22,
body.no-js .quiz-item--22,
body.no-webp .quiz-item--22 {
    background-image: url(../img/bg3.png)
}

body.webp .quiz-item--22 {
    background-image: url(../img/bg3.webp)
}

@media (max-width:400px) {
    .quiz-item--22,
    body.no-js .quiz-item--22,
    body.no-webp .quiz-item--22 {
        background-image: url(../img/bg3m.png)
    }
    body.webp .quiz-item--22 {
        background-image: url(../img/bg3m.webp)
    }
}

.quiz-item--23,
body.no-js .quiz-item--23,
body.no-webp .quiz-item--23 {
    background-image: url(../img/bg5.png), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
}

body.webp .quiz-item--23 {
    background-image: url(../img/bg5.webp), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
}

@media (max-width:400px) {
    .quiz-item--23,
    body.no-js .quiz-item--23,
    body.no-webp .quiz-item--23 {
        background-image: url(../img/bg5m.png), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
    body.webp .quiz-item--23 {
        background-image: url(../img/bg5m.webp), linear-gradient(285.98deg, #f931cf -38.62%, #000 96.15%)
    }
}

.quiz-item--24,
body.no-js .quiz-item--24,
body.no-webp .quiz-item--24 {
    background-image: url(../img/result-bg.png)
}

body.webp .quiz-item--24 {
    background-image: url(../img/result-bg.webp)
}

@media (max-width:400px) {
    .quiz-item--24,
    body.no-js .quiz-item--24,
    body.no-webp .quiz-item--24 {
        background-image: url(../img/result-bgm.png)
    }
    body.webp .quiz-item--24 {
        background-image: url(../img/result-bgm.webp)
    }
}

.quiz-male.quiz-item.quiz-item--10,
.quiz-male.quiz-item.quiz-item--5,
body.no-js .quiz-male.quiz-item.quiz-item--10,
body.no-js .quiz-male.quiz-item.quiz-item--5,
body.no-webp .quiz-male.quiz-item.quiz-item--10,
body.no-webp .quiz-male.quiz-item.quiz-item--5 {
    background-image: url(../img/bg5.png), linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

body.webp .quiz-male.quiz-item.quiz-item--10,
body.webp .quiz-male.quiz-item.quiz-item--5 {
    background-image: url(../img/bg5.webp), linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

@media (max-width:400px) {
    .quiz-male.quiz-item.quiz-item--10,
    .quiz-male.quiz-item.quiz-item--5,
    body.no-js .quiz-male.quiz-item.quiz-item--10,
    body.no-js .quiz-male.quiz-item.quiz-item--5,
    body.no-webp .quiz-male.quiz-item.quiz-item--10,
    body.no-webp .quiz-male.quiz-item.quiz-item--5 {
        background-image: url(../img/bg5m.png), linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
    }
    body.webp .quiz-male.quiz-item.quiz-item--10,
    body.webp .quiz-male.quiz-item.quiz-item--5 {
        background-image: url(../img/bg5m.webp), linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
    }
}

.quiz-male.quiz-item.quiz-item--13,
body.no-js .quiz-male.quiz-item.quiz-item--13,
body.no-webp .quiz-male.quiz-item.quiz-item--13 {
    background-image: url(../img/bg13.png), linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

body.webp .quiz-male.quiz-item.quiz-item--13 {
    background-image: url(../img/bg13.webp), linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

@media (max-width:400px) {
    .quiz-male.quiz-item.quiz-item--13,
    body.no-js .quiz-male.quiz-item.quiz-item--13,
    body.no-webp .quiz-male.quiz-item.quiz-item--13 {
        background-image: url(../img/bg13m.png), linear-gradient(293.45deg, #0085ff -27.58%, #000 50.41%)
    }
    body.webp .quiz-male.quiz-item.quiz-item--13 {
        background-image: url(../img/bg13m.webp), linear-gradient(293.45deg, #0085ff -27.58%, #000 50.41%)
    }
}

.quiz-male.quiz-item.quiz-item--18,
.quiz-male.quiz-item.quiz-item--21,
.quiz-male.quiz-item.quiz-item--23,
body.no-js .quiz-male.quiz-item.quiz-item--18,
body.no-js .quiz-male.quiz-item.quiz-item--21,
body.no-js .quiz-male.quiz-item.quiz-item--23,
body.no-webp .quiz-male.quiz-item.quiz-item--18,
body.no-webp .quiz-male.quiz-item.quiz-item--21,
body.no-webp .quiz-male.quiz-item.quiz-item--23 {
    background-image: url(../img/bg5.png), linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

body.webp .quiz-male.quiz-item.quiz-item--18,
body.webp .quiz-male.quiz-item.quiz-item--21,
body.webp .quiz-male.quiz-item.quiz-item--23 {
    background-image: url(../img/bg5.webp), linear-gradient(285.98deg, #0085ff -38.62%, #000 96.15%)
}

@media (max-width:400px) {
    .quiz-male.quiz-item.quiz-item--18,
    .quiz-male.quiz-item.quiz-item--21,
    .quiz-male.quiz-item.quiz-item--23,
    body.no-js .quiz-male.quiz-item.quiz-item--18,
    body.no-js .quiz-male.quiz-item.quiz-item--21,
    body.no-js .quiz-male.quiz-item.quiz-item--23,
    body.no-webp .quiz-male.quiz-item.quiz-item--18,
    body.no-webp .quiz-male.quiz-item.quiz-item--21,
    body.no-webp .quiz-male.quiz-item.quiz-item--23 {
        background-image: url(../img/bg5.png), linear-gradient(293.45deg, #0085ff -27.58%, #000 50.41%)
    }
    body.webp .quiz-male.quiz-item.quiz-item--18,
    body.webp .quiz-male.quiz-item.quiz-item--21,
    body.webp .quiz-male.quiz-item.quiz-item--23 {
        background-image: url(../img/bg5.webp), linear-gradient(293.45deg, #0085ff -27.58%, #000 50.41%)
    }
}

.quiz-male.quiz-item.quiz-item--24,
body.no-js .quiz-male.quiz-item.quiz-item--24,
body.no-webp .quiz-male.quiz-item.quiz-item--24 {
    background-image: url(../img/result-bg.png)
}

body.webp .quiz-male.quiz-item.quiz-item--24 {
    background-image: url(../img/result-bg.webp)
}

@media (max-width:400px) {
    .quiz-male.quiz-item.quiz-item--24,
    body.no-js .quiz-male.quiz-item.quiz-item--24,
    body.no-webp .quiz-male.quiz-item.quiz-item--24 {
        background-image: url(../img/result-bgm.png)
    }
    body.webp .quiz-male.quiz-item.quiz-item--24 {
        background-image: url(../img/result-bgm.webp)
    }
}