*,
:before,
:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body {
	color: #152435;
	font-family: "Rubik", sans-serif;
	font-weight: 400;
	background: #fff;
}

.b-all-conteiner {
	overflow: hidden;
}

a {
	text-decoration: none;
	color: inherit;
}

.b-conteiner {
	max-width: 430px;
	margin: 0 auto;
	padding: 0 15px;
	position: relative;
}

.b-h1 {
	font-size: 30px;
	font-weight: 700;
	line-height: 34px;
font-family: "Rubik", sans-serif;
	position: relative;
	text-align: center;
	z-index: 10;
	margin-bottom: 16px;
}

.b-h3 {
	font-size: 22px;
	font-weight: 500;
	line-height: 26px;
	position: relative;
	z-index: 10;
}

.b-p {
	font-size: 16px;
	font-weight: 400;
	line-height: 20px;
	position: relative;
	z-index: 10;
}

.b-p2 {
	font-size: 19px;
	font-weight: 400;
	line-height: 23px;
	position: relative;
	z-index: 10;
}

.b-button {
	border: none;
	outline: none;
	display: block;
	margin: 0 auto;
	cursor: pointer;
	position: relative;
	text-align: center;
	z-index: 10;
	padding: 16px 40px;
	border-radius: 25px;
	background: linear-gradient(180deg, #f8b79c 0%, #e2866c 100%);
	font-size: 20px;
	font-weight: 700;
	line-height: 24px;
	font-family: "Rubik", sans-serif;
	color: #fff;
	width: max-content;
	max-width: 100%;
	min-width: 199px;
}
.b-button--blue {
	color: #fff;
	background: linear-gradient(99deg, #2c4d79 7.15%, #346793 84.29%);
}
.b-button span {
	position: relative;
	z-index: 5;
}

.b-form {
	position: relative;
	z-index: 10;
	border-radius: 10px;
	background: linear-gradient(99deg, #2c4d79 7.15%, #346793 84.29%);
	padding: 30px 28px;
	color: #fff;
	text-align: center;
}

.b-form .b-h3 {
	margin-bottom: 20px;
	text-align: center !important;
}

.b-form .b-note {
	font-size: 14px;
	line-height: 18px;
	margin-top: 24px;
}

.b-price {
	position: relative;
	z-index: 10;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
font-family: "Rubik", sans-serif;
	margin: 20px auto;
}

.b-price-old {
	text-decoration: line-through;
	font-size: 24px;
	font-weight: 400;
	line-height: 28px;
	padding: 0 12px;
}

.b-price-new {
	font-size: 39px;
	font-weight: 700;
	line-height: 42px;
	padding: 0 12px;
}

.b-input,
.b-select {
	position: relative;
	z-index: 10;
	display: block;
	outline: none;
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
	padding: 14px 19px;
	border-radius: 5px;
	border: 1px solid rgba(255, 255, 255, 0.5);
	margin-bottom: 16px;
font-family: "Rubik", sans-serif;
	background: transparent;
	color: #fff;
	width: 100%;
}

.b-input:active,
.b-input:focus,
.b-select:active,
.b-select:focus {
	outline: none;
}

select::-ms-expand {
	display: none;
}

.b-input::-webkit-input-placeholder {
	color: #fff;
}

.b-input:-moz-placeholder {
	color: #fff;
}

.b-select {
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(../img/select_arrow.svg);
    background-repeat: no-repeat;
    background-position: 10% 50%;
	
}


.js_errorMessage, .only_number {
    direction: ltr;
    text-align: right;
}
.b-step {
	height: 100vh;
	background: url(../img/bg_m.jpg) center top;
	display: grid;
}

.b-step.bg-empty {
	background: #fff;
}

.b-step .b-h1 {
	color: #fff;
}

.b-step .b-h3 {
	color: #375c89;
	margin-bottom: 12px;
}

.b-step-1,
.b-step-2,
.b-step-3,
.b-step-4,
.b-step-5,
.b-step-6 {
	display: none;
	margin: auto;
	height: max-content;
}

.b-step .b-box {
	background: #fff;
	position: relative;
	overflow: hidden;
	border-radius: 30px;
	padding: 24px 14px;
}

.b-step .b-nav {
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
}

.b-step .b-nav-item {
	border-radius: 30px;
	border: 1px solid #97abe6;
	width: 14.89%;
	height: 8px;
	margin-left: auto;
	position: relative;
}

.b-step .b-nav-item:last-child {
	margin-right: 0;
}

.b-step .b-nav-item.active span {
	display: block;
	border-radius: 30px;
	background: linear-gradient(180deg, #c2d1fe 0%, #8ba0dd 100%);
	position: absolute;
	width: calc(100% + 2px);
	height: calc(100% + 2px);
	left: -1px;
	top: -1px;
}

.b-step .b-nav-item.active span::before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	border-radius: 30px;
	width: 100%;
	height: 100%;
	background: repeating-linear-gradient(-60deg, rgba(255, 255, 255, 0) 0 2px, rgba(255, 255, 255, 0.5) 2px 3px);
}

.b-step-start {
	padding: 20px 0 40px;
	background: #fff;
	height: max-content;
	margin: auto;
}

.b-step-start .b-h1 {
	color: #375c89;
}

.b-step-start .b-h3 {
	font-size: 19px;
	line-height: 23px;
	margin-bottom: 31px;
	font-weight: 400;
	color: #152435;
}

.b-step-start .b-box {
	position: static;
	padding: 0;
	overflow: visible;
	border-radius: 0;
}

.b-step-start .b-bg-1 {
	position: absolute;
	display: block;
	width: 297px;
	height: 390px;
	transform: rotate(117.766deg) scaleX(-1);
	left: -367px;
	top: -224px;
}

.b-step-start .b-bg-2 {
	position: absolute;
	display: block;
	width: 420px;
	height: 552px;
transform: rotate(-167.23deg);
    left: -340px;
	top: 14px;
}

.b-step-start .b-bg-3 {
	position: absolute;
	display: block;
	width: 283px;
	height: 375px;
	transform: rotate(151.943deg);
	right: -303px;
	top: -187px;
}

.b-step-start .b-bg-4 {
	position: absolute;
	display: block;
	width: 241px;
	height: 319px;
	transform: rotate(224.594deg) scaleY(-1);
	right: -308px;
	top: 277px;
}

.b-step-start .b-bg-5 {
	position: absolute;
	display: none;
}

.b-step-start .b-img {
	position: absolute;
	display: block;
	width: 260px;
	transform: rotate(-152.845deg);
	top: -18px;
	right: 68px;
	z-index: 2;
}

.b-step-start .b-img-box {
	position: relative;
	height: 360px;
	width: 300px;
	margin: 0 auto;
}

.b-step-start .b-img-box .b-product {
	position: absolute;
	display: block;
	width: 160px;
    top: 71px;
   right: -15px;
	z-index: 1;
}

.b-step-start .b-img-box .b-woman {
	position: absolute;
	display: block;
	width: 246px;
	top: 29px;
	right: 102px;
	z-index: 3;
}

.b-step-1 {
	padding: 20px 0 40px;
}

.b-step-1 .b-bg-1,
.b-step-1 .b-bg-2 {
	display: none;
}

.b-step-1 .b-p2 {
	width: 160px;
}

.b-step-1 .s2 {
	display: none;
}

.b-step-1 .b-arrow {
	display: block;
	position: absolute;
	height: 25px;
	top: 17px;
	right: 69%;
	transform: rotate(-90deg);
}

.b-step-1 .b-tube {
	width: 29px;
	display: block;
	position: absolute;
	transition: 0.4s;
	cursor: pointer;
	overflow: hidden;
	border-bottom-left-radius: 40px;
	border-bottom-right-radius: 40px;
}

.b-step-1 .b-tube img {
	display: block;
	width: 100%;
	position: relative;
	z-index: 3;
}

.b-step-1 .b-tube .filling {
	display: block;
	position: absolute;
	width: 80%;
	height: 100%;
	border-bottom-left-radius: 40px;
	border-bottom-right-radius: 40px;
	top: 0;
	left: 10%;
	transform: translateY(100%);
	transition: 0.4s;
	z-index: 0;
}

.b-step-1 .b-tube.c1 .filling {
	background: #4470ea;
	background: linear-gradient(0deg, #4470ea 0%, #4470ea 72%, white 72%);
	transform: translateY(0);
}

.b-step-1 .b-tube.c2 .filling {
	background: #4de289;
	background: linear-gradient(0deg, #4de289 0%, #4de289 72%, white 72%);
	transform: translateY(0);
}

.b-step-1 .b-tube.c3 .filling {
	background: #ead96b;
	background: linear-gradient(0deg, #ead96b 0%, #ead96b 72%, white 72%);
	transform: translateY(0);
}

.b-step-1 .b-tube.c4 .filling {
	background: #af3b83;
	background: linear-gradient(0deg, #af3b83 0%, #af3b83 72%, white 72%);
	transform: translateY(0);
}

.b-step-1 .b-tube.c5 .filling {
	background: #74992c;
	background: linear-gradient(0deg, #74992c 0%, #74992c 72%, white 72%);
	transform: translateY(0);
}

.b-step-1 .b-tube.color {
	right: calc(88.5% - 14px);
	top: 0;
	overflow: visible;
}

.b-step-1 .b-tube.color img {
	display: block;
	width: 100%;
	transition: 0.4s;
	z-index: 10;
}

.b-step-1 .b-tube.color .img {
	display: block;
	width: 29px;
	height: 142px;
	transition: 0.4s;
	z-index: 10;
	background: url(../img/tube_color_1.png) no-repeat;
	background-size: contain;
}

.b-step-1 .b-tube.color .img.is1 {
	background: url(../img/tube_color_2.png) no-repeat;
	background-size: contain;
}

.b-step-1 .b-tube.color .img.is2 {
	background: url(../img/tube_color_3.png) no-repeat;
	background-size: contain;
}

.b-step-1 .b-tube.color .img.is3 {
	background: url(../img/tube_color_4.png) no-repeat;
	background-size: contain;
}

.b-step-1 .b-tube.color .img.is4 {
	background: url(../img/tube_color_5.png) no-repeat;
	background-size: contain;
}

.b-step-1 .b-tube.t1 {
	bottom: 8px;
	left: calc(11.5% - 14px);
}

.b-step-1 .b-tube.t2 {
	bottom: 8px;
	left: calc(30.75% - 14px);
}

.b-step-1 .b-tube.t3 {
	bottom: 8px;
	left: calc(50% - 14px);
}

.b-step-1 .b-tube.t4 {
	bottom: 8px;
	left: calc(69.25% - 14px);
}

.b-step-1 .b-tube.t5 {
	bottom: 8px;
	left: calc(88.5% - 14px);
}

.b-step-1 .b-img-box {
	height: 373px;
	position: relative;
	width: 100%;
	z-index: 3;
}

.b-step-1 .b-img-box.active .b-tube.color .filling-all,
.b-step-1 .b-img-box.active .b-tube.color .img,
.b-step-1 .b-img-box.active .b-tube.color img {
	transform: rotate(-13deg);
}

.b-step-1 .b-img-box.active .s1 {
	display: none;
}

.b-step-1 .b-img-box.active .s2 {
	display: block;
}

.b-step-1 .b-img-box.active .b-arrow {
	display: none;
}

.b-step-1 .b-img-box.active.fin .s2 {
	display: none;
}

.b-step-1 .b-img-box.active.fin .b-tube.active {
	transform: translateY(-22px);
}

.b-step .b-flex-box {
	position: relative;
	z-index: 0;
	display: flex;
	flex-wrap: wrap;
	min-height: 404px;
	flex-direction: column;
	justify-content: space-between;
}

.b-step .b-flex-box .b-button {
	height: max-content;
	margin-top: 20px;
}

.b-step .b-flex-box .b-p2 {
	height: max-content;
}

.b-step .b-flex-box .b-p {
	width: 80%;
}

.b-step .b-flex-box .b-tube {
	position: absolute;
	z-index: 1;
	width: 29px;
	top: 0;
	left: 3px;
}

.b-step .b-comp-box {
	position: relative;
	z-index: 0;
	margin: auto;
	width: 262px;
}

.b-step-2 {
	padding: 20px 0 40px;
}

.b-step-2 .b-comp-box {
	height: 119px;
}

.b-step-2 .b-img-1 {
	position: absolute;
	z-index: 0;
	display: block;
	width: 166px;
	left: -59px;
	top: -24px;
	transform: rotate(13.394deg);
}

.b-step-2 .b-img-2 {
	position: absolute;
	z-index: 0;
	display: block;
	width: 191px;
	top: 11px;
	left: 156px;
	transform: rotate(51.114deg) scaleY(-1);
}

.b-step-3 {
	padding: 20px 0 40px;
}

.b-step-3 .b-comp-box {
	height: 159px;
}

.b-step-3 .b-img-1 {
	position: absolute;
	display: block;
	left: -71px;
	top: 13px;
	width: 236px;
transform: rotate(-117.272deg) scaleY(-1);
}

.b-step-3 .b-img-2 {
	position: absolute;
	display: block;
	left: 141px;
	top: 50px;
	width: 139px;
	/* transform: rotate(150.792deg); */
}

.b-step-3 .b-img-3 {
	position: absolute;
	display: block;
	right: 217px;
	top: 190px;
	width: 107px;
	/* transform: scaleY(-1); */
}

.b-step-4 {
	padding: 20px 0 40px;
}

.b-step-4 .b-comp-box {
	height: 152px;
}

.b-step-4 .b-p {
	font-size: 18px;
	line-height: 22px;
}

.b-step-4 .b-img-1 {
	position: absolute;
	display: block;
	right: -121px;
	left: unset;
	top: -25px;
	width: 214px;
	z-index: 0;
}

.b-step-4 .b-img-2 {
	position: absolute;
	display: block;
	left: 83px;
	top: 82px;
	width: 112px;
	z-index: 0;
}

.b-step-4 .b-img-3 {
	position: absolute;
	display: block;
	right: 130px;
	top: 0px;
	width: 178px;
	transform: rotate(-153.57deg);
	z-index: 1;
}

.b-step-4 .b-img-4 {
	position: absolute;
	display: block;
	right: 181px;
	top: 0px;
	width: 170px;
	transform: rotate(14.7deg);
	z-index: 0;
}

.b-step-5 {
	padding: 20px 0 40px;
}

.b-step-5 .b-comp-box {
	height: 174px;
}

.b-step-5 .b-p {
	font-size: 18px;
	line-height: 22px;
}

.b-step-5 .b-img-1 {
	position: absolute;
	display: block;
	left: -119px;
	top: 19px;
	width: 213px;
	z-index: 0;
}

.b-step-5 .b-img-2 {
	position: absolute;
	display: block;
	left: 83px;
	top: -5px;
	width: 316px;
	z-index: 0;
}

.b-step-5 .b-img-3 {
	position: absolute;
	display: none;
}

.b-step-5 .b-img-4 {
	position: absolute;
	display: none;
}

.b-step-6 {
	padding: 20px 0 40px;
}

.b-step-6 .b-comp-box {
	height: 202px;
}

.b-step-6 .b-p {
	font-size: 18px;
	line-height: 22px;
}

.b-step-6 .b-img-1 {
	position: absolute;
	display: block;
	left: -111px;
	top: 15px;
	width: 215px;
	z-index: 0;
}

.b-step-6 .b-img-2 {
	position: absolute;
	display: block;
	left: 105px;
	top: 0;
	width: 228px;
	z-index: 0;
}

.b-step-6 .b-img-3 {
	position: absolute;
	display: block;
	left: 229px;
	top: 123px;
	width: 133px;
	z-index: 0;
}

.b-main {
	display: none;
}

.b-effect {
	padding-top: 20px;
	overflow: hidden;
}

.b-effect .b-h1 {
	color: #375c89;
}

.b-effect .b-bg-1 {
	width: 648px;
	position: absolute;
	display: block;
	transform: rotate(100.95deg) scaleY(-1);
	top: 35px;
	left: -645px;
}

.b-effect .b-bg-2 {
	width: 553px;
	position: absolute;
	display: block;
	transform: rotate(83.19deg) scaleY(-1);
	top: 71px;
	right: -551px;
}

.b-effect .b-bg-3 {
	display: none;
}

.b-effect .b-img {
	width: 468px;
	position: absolute;
	display: block;
	transform: rotate(-5.54deg) scaleY(-1);
	z-index: 0;
	top: 3px;
	left: -71px;
}

.b-effect .b-img-box {
	position: relative;
	height: 234px;
	width: 300px;
	margin: 0 auto;
}

.b-effect .b-girl {
	display: block;
	position: absolute;
	width: 258px;
	top: 30px;
	left: 24px;
	z-index: 1;
}

.b-effect .b-box {
	margin-top: 16px;
	border-radius: 20px;
	background: #fff;
	box-shadow: 4px 4px 20px 0px rgba(12, 21, 30, 0.2);
	padding: 20px 14px;
	margin-bottom: 20px;
}

.b-effect .b-box-item {
	margin-bottom: 16px;
}

.b-effect .b-box-item:last-child {
	margin-bottom: 0;
}

.b-effect .b-box .b-p2 {
	margin-bottom: 16px;
}

.b-effect .b-progressbar {
	border-radius: 20px;
	background: #edf0f3;
	box-shadow: 0px 4px 5px 0px rgba(21, 36, 53, 0.15);
	position: relative;
	width: 100%;
	margin-top: 6px;
	padding: 3px;
}

.b-effect .b-progressbar span {
	display: block;
	height: 22px;
	border-radius: 20px;
	position: relative;
}

.b-effect .b-progressbar span::before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	border-radius: 30px;
	width: 100%;
	height: 100%;
	background: repeating-linear-gradient(-60deg, rgba(255, 255, 255, 0) 0 2px, rgba(255, 255, 255, 0.5) 2px 3px);
}

.b-effect .b-progressbar .p1 {
	width: 93%;
	background: linear-gradient(180deg, #f3e9a5 0%, #c8be7e 100%);
	animation: a-progress-93 ease-in 1s both;
}

.b-effect .b-progressbar .p2 {
	width: 100%;
	background: linear-gradient(180deg, #c2d1fe 0%, #8ba0dd 100%);
	animation: a-progress-100 ease-in 1s both 1s;
}

.b-effect .b-progressbar .p3 {
	width: 89%;
	background: linear-gradient(180deg, #a8f3c5 0%, #83d1a2 100%);
	animation: a-progress-89 ease-in 1s both 2s;
}

@keyframes a-progress-93 {
	0% {
		width: 0;
	}
	100% {
		width: 93%;
	}
}

@keyframes a-progress-100 {
	0% {
		width: 0;
	}
	100% {
		width: 100%;
	}
}

@keyframes a-progress-89 {
	0% {
		width: 0;
	}
	100% {
		width: 89%;
	}
}

.b-result {
	background: url(../img/bg_m.jpg) center top;
	background-size: auto 100%;
	padding: 40px 0;
	color: #fff;
}

.b-result .b-item {
	position: relative;
	max-width: 272px;
	width: 100%;
	margin: 0 auto 74px;
}

.b-result .b-item::before {
	content: '';
	display: block;
	position: absolute;
	left: 50%;
	top: -47px;
	transform: translateX(-50%);
	width: 10px;
	height: 43px;
	background: url(../img/result_line_1.svg) no-repeat;
}

.b-result .b-item:first-child::before {
	display: none;
}

.b-result .b-item:last-child {
	margin-bottom: 0;
}

.b-result .b-item .b-p {
	padding-right: 39px;
}

.b-result .b-item .b-icon {
	display: block;
	position: absolute;
	width: 25px;
	top: -2px;
	right:  0;
}

.b-result .b-item svg {
	display: block;
	margin: 0 auto 8px;
}

.b-order {
	padding: 33px 0 36px;
}

.b-order .b-bg-1 {
	position: absolute;
	display: block;
	width: 658px;
	transform: rotate(21.27deg);
	top: -36px;
	right: -625px;
	z-index: 0;
}

.b-order .b-bg-2 {
	position: absolute;
	display: block;
	width: 471px;
	transform: rotate(26.67deg);
	top: 612px;
	left: -505px;
	z-index: 0;
}

.b-order .b-bg-3 {
	position: absolute;
	display: block;
	width: 578px;
	transform: rotate(73.05deg) scaleY(-1);
	top: 118px;
	left: -518px;
	z-index: 0;
}

.b-order .b-bg-4 {
	position: absolute;
	display: block;
	width: 691px;
	transform: rotate(-168.71deg) scaleY(-1);
	top: 824px;
	left: -752px;
	z-index: 0;
}

.b-order .b-h3 {
	text-align: center;
}

.b-order .b-attention {
	color: #000;
	position: relative;
	padding-right: 36px;
	margin-bottom: 16px;
}

.b-order .b-attention .b-icon {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 24px;
	right: 0;
}

.b-order .b-left {
	position: relative;
	z-index: 3;
}

.b-order .b-product {
	/* width: 95%;
  margin-left: 10.5%; */
	display: block;
	margin: 0 auto;
}

.b-order .b-product-box {
	margin: 0 auto 20px;
	position: relative;
	z-index: 0;
}

.b-order .b-mark {
	width: 13.5%;
	display: block;
	margin: 0 6px;
}

.b-order .b-mark-box {
	margin-top: 7px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.b-order .b-mark-box.desc {
	display: none;
}

.b-order .b-progress {
	margin: 23px auto 20px;
	padding: 20px 14px;
	border-radius: 20px;
	background: #fff;
	box-shadow: 4px 4px 20px 0px rgba(12, 21, 30, 0.2);
}

.b-order .b-progress .b-h3 {
	color: #152435;
	text-align: center;
}

.b-order .b-progress-flex {
	display: flex;
	align-items: center;
	justify-content: center;
}

.b-order .b-progress-flex .b-h3 {
	margin-right: 10px;
}

.b-order .b-progress-circle {
	margin-bottom: 7px;
	position: relative;
}

.b-order .b-progress-circle svg {
	transform: rotate(-25deg);
}

.b-order .b-progress-circle svg circle {
	opacity: 0;
	transition: 0.1s;
}

.b-order .b-progress-circle .b-h1 {
	position: absolute;
	width: 100%;
	display: block;
	text-align: center;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.b-order.anim svg circle {
	opacity: 1;
}

.b-order.anim svg.mob circle {
	stroke-linecap: round;
	stroke-dasharray: 0 502;
	animation: a-progress-cirle-mob 1.5s ease-in forwards;
}

.b-order.anim svg.desc circle {
	stroke-linecap: round;
	stroke-dasharray: 0 602;
	animation: a-progress-cirle-desc 1.5s ease-in forwards;
}

@keyframes a-progress-cirle-mob {
	0% {
		stroke-dasharray: 0 502;
	}
	100% {
		stroke-dasharray: 405 502;
	}
}

@keyframes a-progress-cirle-desc {
	0% {
		stroke-dasharray: 0 602;
	}
	100% {
		stroke-dasharray: 485 602;
	}
}

.mob {
	display: block;
}

.desc {
	display: none;
}

@media screen and (min-width: 992px) {
	.b-conteiner {
		max-width: 1170px;
	}
	.b-button {
		transition: 0.4s;
		font-size: 24px;
		line-height: 28px;
		padding: 14px 40px;
	}
	.b-button::before {
		content: '';
		opacity: 0;
		position: absolute;
		z-index: 1;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		border-radius: 25px;
		background: linear-gradient(180deg, #fccfbd 0%, #e89d88 100%);
		transition: 0.4s;
	}
	.b-button--blue::before {
		background: linear-gradient(#2c4d79 7.15%, #346793 84.29%);
	}
	.b-button:hover::before {
		opacity: 1;
	}
	.b-h1 {
		font-size: 50px;
		line-height: 58px;
		margin-bottom: 32px;
	}
	.b-h3 {
		font-size: 32px;
		line-height: 38px;
	}
	.b-p {
		font-size: 18px;
		line-height: 22px;
	}
	.b-p2 {
		font-size: 24px;
		line-height: 28px;
	}
	.b-form {
		width: 309px;
		padding: 20px 32px 26px;
	}
	.b-form .b-h3 {
		margin-bottom: 16px;
	}
	.b-form .b-note {
		margin-top: 16px;
	}
	.b-step {
		background: url(../img/bg.jpg) center -30px;
	}
	.b-step.bg-empty {
		background: url(../img/bg.jpg) center -30px;
	}
	.b-step .b-h1 {
		margin-bottom: 32px;
	}
	.b-step .b-button {
		margin: 0;
	}
	.b-step .b-box {
		width: 847px;
		background: #fff;
		padding: 40px;
		margin: 0 auto;
	}
	.b-step-start {
		padding: 32px 0 64px;
		position: relative;
		z-index: 3;
		background: none;
	}
	.b-step-start .b-box {
		padding: 40px;
		border-radius: 30px;
		background: #fff;
		position: relative;
	}
	.b-step-start .b-h1 {
		color: #fff;
	}
	.b-step-start .b-h3 {
		font-size: 24px;
		font-weight: 400;
		line-height: 28px;
		width: 440px;
		margin-bottom: 37px;
	}
	.b-step-start .b-bg-box {
		position: absolute;
		z-index: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		right: 0;
		top: 0;
		border-radius: 30px;
	}
	.b-step-start .b-bg-1 {
		width: 397px;
		transform: rotate(91.55deg);
		top: 76px;
		right: -4px;
	}
	.b-step-start .b-bg-2,
	.b-step-start .b-bg-3,
	.b-step-start .b-bg-4 {
		display: none;
	}
	.b-step-start .b-bg-5 {
		display: block;
		width: 239px;
		top: 244px;
		right: -49px;
		transform: rotate(-20.041deg);
	}
	.b-step-start .b-img {
		width: 487px;
		top: -105px;
		right: 527px;
	}
	.b-step-start .b-img-box {
		height: 222px;
		width: 100%;
		position: static;
	}
	.b-step-start .b-img-box .b-woman {
		width: 316px;
		bottom: 0;
		top: unset;
		right: 511px;
	}
	.b-step-start .b-img-box .b-product {
		width: 180px;
		top: 100px;
        right: 350px;
	}
	.b-step-start .b-img-box .hidden {
		position: absolute;
		z-index: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		left: 0;
		top: 0;
		border-radius: 30px;
		z-index: 2;
	}
	.b-step .b-nav {
		justify-content: center;
		margin-bottom: 40px;
		margin-top: -16px;
	}
	.b-step .b-nav-item {
		margin-left: 16px;
		width: 84px;
		height: 10px;
	}
	.b-step-1 {
		padding: 32px 0 64px;
	}
	.b-step-1 .b-nav {
		margin-bottom: 24px;
	}
	.b-step-1 .b-bg-1 {
		display: block;
		position: absolute;
		width: 523px;
		top: 291px;
		left: -323px;
		z-index: 0;
		transform: rotate(153.335deg) scaleX(-1);
	}
	.b-step-1 .b-bg-2 {
		display: block;
		position: absolute;
		width: 796px;
		top: -82px;
		right: -710px;
		z-index: 0;
		transform: rotate(-22.069deg) scaleY(-1);
	}
	.b-step-1 .b-tube {
		width: 37px;
	}
	.b-step-1 .b-tube.color {
		left: 189px;
		top: auto;
		bottom: -10px;
	}
	.b-step-1 .b-tube.color .img {
		width: 37px;
		height: 182px;
	}
	.b-step-1 .b-tube.color:hover {
		transform: translateY(-37px);
	}
	.b-step-1 .b-tube.color:hover .filling-all,
	.b-step-1 .b-tube.color:hover .img,
	.b-step-1 .b-tube.color:hover img {
		transform: rotate(6deg);
	}
	.b-step-1 .b-tube.t1 {
		bottom: -10px;
		left: 367px;
	}
	.b-step-1 .b-tube.t2 {
		bottom: -10px;
		left: 433px;
	}
	.b-step-1 .b-tube.t3 {
		bottom: -10px;
		left: 499px;
	}
	.b-step-1 .b-tube.t4 {
		bottom: -10px;
		left: 565px;
	}
	.b-step-1 .b-tube.t5 {
		bottom: -10px;
		left: 631px;
	}
	.b-step-1 .b-arrow {
		height: 30px;
		transform: rotate(-45deg);
		top: 54px;
		left: 150px;
	}
	.b-step-1 .b-img-box {
		height: 276px;
	}
	.b-step-1 .b-img-box.active .b-tube.color {
		transform: translateY(-37px);
	}
	.b-step-1 .b-img-box.active .b-tube.color .filling-all,
	.b-step-1 .b-img-box.active .b-tube.color .img,
	.b-step-1 .b-img-box.active .b-tube.color img {
		transform: rotate(6deg);
	}
	.b-step-1 .b-img-box.active .b-tube.t1:hover,
	.b-step-1 .b-img-box.active .b-tube.t2:hover,
	.b-step-1 .b-img-box.active .b-tube.t3:hover,
	.b-step-1 .b-img-box.active .b-tube.t4:hover,
	.b-step-1 .b-img-box.active .b-tube.t5:hover {
		transform: translateY(-22px);
	}
	.b-step-1 .b-img-box.active .b-tube.t1.click:hover,
	.b-step-1 .b-img-box.active .b-tube.t2.click:hover,
	.b-step-1 .b-img-box.active .b-tube.t3.click:hover,
	.b-step-1 .b-img-box.active .b-tube.t4.click:hover,
	.b-step-1 .b-img-box.active .b-tube.t5.click:hover {
		transform: none;
	}
	.b-step-1 .b-p2 {
		width: 100%;
	}
	.b-step .b-flex-box {
		min-height: 286px;
	}
	.b-step .b-flex-box .b-p {
		margin-bottom: auto;
		width: 430px;
	}
	.b-step .b-flex-box .b-p2 {
		margin-top: 20px;
		width: 470px;
	}
	.b-step .b-flex-box .b-tube {
		width: 37px;
		top: -50px;
		left: 257px;
	}
	.b-step .b-comp-box {
		position: absolute;
		margin: 0;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
	}
	.b-step-2 {
		padding: 32px 0 64px;
	}
	.b-step-2 .b-img-1 {
		width: 455px;
		top: 330px;
		left: 223px;
		transform: rotate(-86.24deg);
	}
	.b-step-2 .b-img-2 {
		width: 393px;
		top: -39px;
		right: 518px;
		transform: rotate(-43.167deg) scaleY(-1);
	}
	.b-step-3 {
		padding: 32px 0 64px;
	}
	.b-step-3 .b-img-1 {
		width: 368px;
		/* transform: rotate(-14.92deg); */
		left: 229px;
		top: 225px;
	}
	.b-step-3 .b-img-2 {
		width: 324px;
		/* transform: rotate(-174.3deg); */
		top: 218px;
		left: 558px;
	}
	.b-step-3 .b-img-3 {
		width: 515px;
		/* transform: rotate(149.376deg); */
		top: -132px;
		right: 551px;
	}
	.b-step-4 {
		padding: 32px 0 64px;
	}
	.b-step-4 .b-img-1 {
		width: 391px;
		top: 169px;
		left: 0;
	right: unset;
	}
	.b-step-4 .b-img-2 {
		width: 228px;
		top: 213px;
		left: 555px;
	}
	.b-step-4 .b-img-3 {
		width: 372px;
		transform: none;
		top: -90px;
		right: 560px;
		transform: scale(-1);
	}
	
	.b-step-4 .b-img-4 {
		width: 377px;
		transform: rotate(6.636deg);
		top: -150px;
		right: 640px;
	}
	.b-step-5 {
		padding: 32px 0 64px;
	}
	.b-step-5 .b-img-1 {
		/* width: 599px; */
		left: 241px;
		top: 219px;
		/* transform: rotate(-145.34deg); */
	}
	.b-step-5 .b-img-2 {
		/* width: 448px; */
		top: 138px;
		left: 547px;
		/* transform: rotate(-139.84deg); */
	}
	.b-step-5 .b-img-3 {
		/* width: 488px; */
		display: block;
		top: -110px;
		right: 555px;
		/* transform: scaleY(-1); */
	}
	.b-step-5 .b-img-4 {
		/* width: 382px; */
		display: block;
		top: 314px;
		left: 286px;
		/* transform: rotate(148.42deg) scaleY(-1); */
		z-index: 1;
	}
	.b-step-6 {
		padding: 32px 0 64px;
	}
	.b-step-6 .b-img-1 {
		left: 0px;
        top: 100px;
	}
	.b-step-6 .b-img-2 {
		top: 140px;
        left: 365px;
	}
	.b-step-6 .b-img-3 {
		display: block;
		top: -127px;
		left: 673px;
	}
	.b-effect {
		padding: 32px 0 44px;
	}
	.b-effect .b-conteiner {
		padding: 0 45px;
	}
	.b-effect .b-h1 {
		color: #152435;
	}
	.b-effect .b-h3 {
		width: 740px;
		color: #375c89;
	}
	.b-effect .b-box {
		margin-top: 36px;
		padding: 20px 24px;
		width: 51.575%;
		position: relative;
		z-index: 3;
	}
	.b-effect .b-box-item {
		margin-bottom: 28px;
	}
	.b-effect .b-box .b-p2 {
		margin-bottom: 32px;
	}
	.b-effect .b-progressbar {
		margin-top: 7px;
		padding: 4px 5px;
	}
	.b-effect .b-progressbar span {
		height: 24px;
	}
	.b-effect .b-bg-1,
	.b-effect .b-bg-2 {
		display: none;
	}
	.b-effect .b-bg-3 {
		display: block;
		position: absolute;
		transform: none;
		width: 1066px;
		left: -996px;
		top: -229px;
		z-index: 0;
	}
	.b-effect .b-img {
		width: 883px;
		transform: rotate(-12.44deg) scaleY(-1);
		top: 78px;
		left: 58%;
	}
	.b-effect .b-img-box {
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		z-index: 0;
	}
	.b-effect .b-girl {
		width: 590px;
		top: auto;
		bottom: -44px;
		right: 55.5%;

	}
	.b-result {
		padding: 60px 0 85px;
		background: url(../img/bg.jpg) center -30px;
	}
	.b-result .b-conteiner {
		display: flex;
		justify-content: space-between;
		        flex-direction: row-reverse;
	}
	.b-result .b-item {
		margin-right: 18px;
		margin-bottom: 0;
	}
	.b-result .b-item::before {
		background: url(../img/result_line_2.svg) no-repeat;
		width: 108px;
		height: 13px;
		transform: none;
		top: 106px;
		left: -63px;
	}
	.b-result .b-item:last-child {
		margin-right: 0;
	}
	.b-result .b-item .b-p {
		max-width: 229px;
		margin: 0 auto;
	}
	.b-order {
		padding: 52px 0 96px;
	}
	.b-order .b-bg-1 {
		width: 831px;
		top: -130px;
		right: -858px;
		transform: none;
	}
	.b-order .b-bg-2 {
		display: none;
	}
	.b-order .b-bg-3 {
		width: 923px;
		transform: rotate(-174.78deg);
		top: -9px;
		left: -1016px;
	}
	.b-order .b-bg-4 {
		width: 1008px;
		transform: rotate(-176.49deg);
		top: 553px;
		right: 179px;
	}
	.b-order .b-h3 {
		text-align: left;
	}
	.b-order .b-conteiner {
		display: flex;
		justify-content: space-between;
	}
	.b-order .b-form {
		margin-top: 7px;
		height: max-content;
	}
	.b-order .b-progress {
		width: max-content;
		max-width: 100%;
		padding: 20px 24px;
		margin: 41px 0 36px 0;
	}
	.b-order .b-left {
		width: 35%;
	}
	.b-order .b-product {
		width: 250px;
		margin: 40px auto 0;
	}
	.b-order .b-product-box {
		width: 35%;
		margin: 0 -3% 0 0;
	}
	.b-order .b-mark {
		width: 50px;
		margin: 0 16px 0 0;
	}
	.b-order .b-mark-box {
		justify-content: flex-start;
		margin-top: 30px;
	}
	.b-order .b-mark-box.mob {
		display: none;
	}
	.b-order .b-mark-box.desc {
		display: flex;
	}
	.mob {
		display: none;
	}
	.desc {
		display: block;
	}
}

.br {
	display: block;
}

.blue {
	color: #375c89;
}

.bold {
	border-radius: 3px;
	background: linear-gradient(99deg, #2c4d79 7.15%, #346793 84.29%);
	color: #fff;
	padding: 2px 4px;
	display: inline-block;
}

.a-o {
	animation: a-o ease-in 0.4s both;
}

.a-o-2 {
	animation: a-o ease-in 0.4s both 0.3s;
}

@keyframes a-o {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.a-top-in-1 {
	animation: a-top-in ease-in 0.4s both;
}

.a-top-in-2 {
	animation: a-top-in ease-in 0.4s both 0.3s;
}

.a-top-in-3 {
	animation: a-top-in ease-in 0.4s both 0.6s;
}

@keyframes a-top-in {
	0% {
		opacity: 0;
		transform: translateY(20px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.a-left-in {
	animation: a-left-in ease-in 0.4s both 0.6s;
}

@keyframes a-left-in {
	0% {
		opacity: 0;
		transform: translateX(20px);
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}
option{color:black;}