/* normalize */
*, *::after, *::before{margin:0;padding:0;box-sizing:border-box}

/* Переменный */
:root {
	/* color norm */
	--bag: #FFFFFF;
	--red: #B90000;

	/* transparent */
	--tr: transparent;
	--trw: rgba(255,255,255,0);
	--trb: rgba(0,0,0,0);

	/* color white  */
	--wh: #FFFFFF;
	--wh1: rgba(255,255,255,.1);
	--wh2: rgba(255,255,255,.2);
	--wh3: rgba(255,255,255,.3);
	--wh4: rgba(255,255,255,.4);
	--wh5: rgba(255,255,255,.5);
	--wh6: rgba(255,255,255,.6);
	--wh7: rgba(255,255,255,.7);
	--wh8: rgba(255,255,255,.8);
	--wh9: rgba(255,255,255,.9);

	/* color black */
	--bl: #1C1F22;
	--bl1: rgba(28,31,34,.1);
	--bl2: rgba(28,31,34,.2);
	--bl3: rgba(28,31,34,.3);
	--bl4: rgba(28,31,34,.4);
	--bl5: rgba(28,31,34,.5);
	--bl6: rgba(28,31,34,.6);
	--bl7: rgba(28,31,34,.7);
	--bl8: rgba(28,31,34,.8);
	--bl9: rgba(28,31,34,.9);

	/* color grey */
	--gr: #EDEFF2;
	--gr1: rgba(237,239,242,.1);
	--gr2: rgba(237,239,242,.2);
	--gr3: rgba(237,239,242,.3);
	--gr4: rgba(237,239,242,.4);
	--gr5: rgba(237,239,242,.5);
	--gr6: rgba(237,239,242,.6);
	--gr7: rgba(237,239,242,.7);
	--gr8: rgba(237,239,242,.8);
	--gr9: rgba(237,239,242,.9);

	/* color #1 */
	--cl: #248B76;
	--cl1: rgba(36,139,118,.1);
	--cl2: rgba(36,139,118,.2);
	--cl3: rgba(36,139,118,.3);
	--cl4: rgba(36,139,118,.4);
	--cl5: rgba(36,139,118,.5);
	--cl6: rgba(36,139,118,.6);
	--cl7: rgba(36,139,118,.7);
	--cl8: rgba(36,139,118,.8);
	--cl9: rgba(36,139,118,.9);

	/* color #2 */
	--cm: #95C43E;
	--cm1: rgba(149,196,62,.1);
	--cm2: rgba(149,196,62,.2);
	--cm3: rgba(149,196,62,.3);
	--cm4: rgba(149,196,62,.4);
	--cm5: rgba(149,196,62,.5);
	--cm6: rgba(149,196,62,.6);
	--cm7: rgba(149,196,62,.7);
	--cm8: rgba(149,196,62,.8);
	--cm9: rgba(149,196,62,.9);


	/* box-shodow */
	--bx1: 0 0 10px -2px var(--bl1);
	--bx2: 0 0 10px -2px var(--bl2);
	--bx3: 0 0 10px -2px var(--bl3);
	--bx4: 0 0 10px -2px var(--bl4);
	--bx5: 0 0 10px -2px var(--bl5);
	--bx6: 0 0 10px -2px var(--bl6);
	--bx7: 0 0 10px -2px var(--bl7);
	--bx8: 0 0 10px -2px var(--bl8);
	--bx9: 0 0 10px -2px var(--bl9);

	/* box-shodow top */
	--bx_t1: 0 -4px 10px -4px var(--bl1);
	--bx_t2: 0 -4px 10px -4px var(--bl2);
	--bx_t3: 0 -4px 10px -4px var(--bl3);
	--bx_t4: 0 -4px 10px -4px var(--bl4);
	--bx_t5: 0 -4px 10px -4px var(--bl5);
	--bx_t6: 0 -4px 10px -4px var(--bl6);
	--bx_t7: 0 -4px 10px -4px var(--bl7);
	--bx_t8: 0 -4px 10px -4px var(--bl8);
	--bx_t9: 0 -4px 10px -4px var(--bl9);

	/* box-shodow bottom */
	--bx_b1: 0 4px 10px -4px var(--bl1);
	--bx_b2: 0 4px 10px -4px var(--bl2);
	--bx_b3: 0 4px 10px -4px var(--bl3);
	--bx_b4: 0 4px 10px -4px var(--bl4);
	--bx_b5: 0 4px 10px -4px var(--bl5);
	--bx_b6: 0 4px 10px -4px var(--bl6);
	--bx_b7: 0 4px 10px -4px var(--bl7);
	--bx_b8: 0 4px 10px -4px var(--bl8);
	--bx_b9: 0 4px 10px -4px var(--bl9);


	/* white box-shodow */
	--bxw1: 0 0 10px -2px var(--wh1);
	--bxw2: 0 0 10px -2px var(--wh2);
	--bxw3: 0 0 10px -2px var(--wh3);
	--bxw4: 0 0 10px -2px var(--wh4);
	--bxw5: 0 0 10px -2px var(--wh5);
	--bxw6: 0 0 10px -2px var(--wh6);
	--bxw7: 0 0 10px -2px var(--wh7);
	--bxw8: 0 0 10px -2px var(--wh8);
	--bxw9: 0 0 10px -2px var(--wh9);

	/* white box-shodow_t */
	--bxw_t1: 1px -4px 10px -4px var(--wh1);
	--bxw_t2: 1px -4px 10px -4px var(--wh2);
	--bxw_t3: 1px -4px 10px -4px var(--wh3);
	--bxw_t4: 1px -4px 10px -4px var(--wh4);
	--bxw_t5: 1px -4px 10px -4px var(--wh5);
	--bxw_t6: 1px -4px 10px -4px var(--wh6);
	--bxw_t7: 1px -4px 10px -4px var(--wh7);
	--bxw_t8: 1px -4px 10px -4px var(--wh8);
	--bxw_t9: 1px -4px 10px -4px var(--wh9);

	/* white box-shodow_b */
	--bxw_b1: 1px 4px 10px -4px var(--wh1);
	--bxw_b2: 1px 4px 10px -4px var(--wh2);
	--bxw_b3: 1px 4px 10px -4px var(--wh3);
	--bxw_b4: 1px 4px 10px -4px var(--wh4);
	--bxw_b5: 1px 4px 10px -4px var(--wh5);
	--bxw_b6: 1px 4px 10px -4px var(--wh6);
	--bxw_b7: 1px 4px 10px -4px var(--wh7);
	--bxw_b8: 1px 4px 10px -4px var(--wh8);
	--bxw_b9: 1px 4px 10px -4px var(--wh9);


	/* text-shodow */
	--tx1: 1px 4px 10px var(--bl1);
	--tx2: 1px 4px 10px var(--bl2);
	--tx3: 1px 4px 10px var(--bl3);
	--tx4: 1px 4px 10px var(--bl4);
	--tx5: 1px 4px 10px var(--bl5);
	--tx6: 1px 4px 10px var(--bl6);
	--tx7: 1px 4px 10px var(--bl7);
	--tx8: 1px 4px 10px var(--bl8);
	--tx9: 1px 4px 10px var(--bl9);

	/* text-shodow white */
	--txw1: 1px 4px 10px var(--wh1);
	--txw2: 1px 4px 10px var(--wh2);
	--txw3: 1px 4px 10px var(--wh3);
	--txw4: 1px 4px 10px var(--wh4);
	--txw5: 1px 4px 10px var(--wh5);
	--txw6: 1px 4px 10px var(--wh6);
	--txw7: 1px 4px 10px var(--wh7);
	--txw8: 1px 4px 10px var(--wh8);
	--txw9: 1px 4px 10px var(--wh9);


	--tm: .5s;
}

/* html - body */
html{}
html, body{
	min-width: 100%;
	min-height: 100vh;
	overflow-x: hidden;
	position: relative;
	scroll-behavior: smooth;
   -webkit-overflow-scrolling: touch;
   -webkit-font-smoothing: antialiased;
}
body{
	background: var(--bag);
	font-family: 'Nunito Sans', sans-serif;
	font-size: 16px;
	font-weight: 400;
	color: var(--bl);
}
::-webkit-scrollbar{
	width:7px;
	height:7px;
	background: var(--tr);
}
::-webkit-scrollbar-button{display:none}
::-webkit-scrollbar-thumb{
	background: var(--bl);
	/* border-radius: 10px; */
}
::-webkit-scrollbar-thumb:hover{background:var(--cl)}
::-webkit-scrollbar-track{background: var(--tr)}
::-webkit-scrollbar-track-piece{background:var(--tr)}
@media(max-width:780px){::-webkit-scrollbar{display:none}}

.ovr_h{overflow: hidden; height: 100vh;}







/* css tag */
input, textarea{
	outline: none;
	border: 1px solid var(--tr);
	height: 44px;
	/* border-radius: 10px; */
}
::-moz-placeholder{color: var(--gr)}
::-webkit-input-placeholder{ color: var(--gr)}
::-ms-input-placeholder{color: var(--gr)}
::placeholder{color: var(--gr)}

a{
	text-decoration: none;
	color: var(--bl);	
}
a:focus{
	outline: 1px auto var(--bl);
}

ul, li{list-style: none;}

/* text */
h1{font-size:42px}
h2{font-size:38px}
h3{font-size:32px}
h4{font-size:28px}
h5{font-size:24px}
h6{font-size:18px}
p{font-size:16px}

/* css classes */
.dsp_n{display:none !important}
.dsp_b{display:block !important}

.txt_l{text-align:left}
.txt_c{text-align:center}
.txt_r{text-align:right}






/* block_center */
.bl_c{
	width: calc(100% - 30px);
	display: flow-root;
	position: relative;
	margin: auto;
	max-width: 1240px;
	z-index: 11;
}

/*  */
.head_c{
	position: relative;
	width: 100%;
	padding: 80px 0;
	padding-bottom: 50px;
}
.head_c p{
	margin-top: 15px;
	font-weight: 500;
	color: var(--bl8);
}





.top_head{
	position: relative;
	width: calc(100% - 30px);
	height: 54px;
	margin: auto;
	display: none;
	justify-content: flex-start;
	align-items: center;
	z-index: 100;
}
@media (max-width: 768px) {
	.top_head{
		display: flex;
	}
}

.top_head .back{
	background: var(--tr);
	color: var(--bl);
}

.top_head_name{
	width: calc(100% - 118px);
	margin: 0 15px;
	height: 54px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.top_head_name:first-child{
	margin-left: 59px;
}
.top_head_name h5{
	font-size: 20px;
	font-weight: 600;
}
.top_head_rg{
	width: 44px;
	height: 44px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 20px;
}




/* css head text */
.txt_head{
	width: 100%;
	text-align: center;
	padding: 50px 0;
	color: var(--cl);
	text-shadow: var(--tx_sh1);
}
.txt_head h2{
	margin-bottom: 30px;
	font-size: 30px;
}
@media (max-width: 480px) {
	.txt_head{
		padding-bottom: 15px;
	}
	.txt_head h2{
		margin-bottom: 15px;
		font-size: 24px;
	}
}




.search_bl{
	position: relative;
	width: 100%;
	margin-top: 15px;
}
.search_bl input{
	width: 100%;
	padding: 0 30px;
	padding-right: 74px;
	height: 54px;
	font-size: 16px;
	font-weight: 500;
}

.search_bl .btn{
	width: 44px;
	height: 44px;
	position: absolute;
	z-index: 2;
	right: 5px;
	top: 5px;
}








.form_mn{}
.form_c{
	margin: 5px 0;
	position: relative;
	width: 100%;
	display: flow-root;
	transition: .3s;
}
.form_mn .form_c{
	margin-top: 0;
	margin-bottom: 20px;
}
.form_mn .form_c:last-child{
	margin-bottom: 0;
}
@media (max-width: 480px) {
	.form_c{
		margin-top: 0;
		margin-bottom: 20px;
	}
	.form_c:last-child{
		margin-bottom: 0;
	}
}


.form_c input{
	width: 100%;
	font-size: 16px;
	font-weight: 500;
	transition: var(--tm);
	padding: 17px 60px;
	/* border-radius: 10px; */
	user-select: none;

	border: 1px solid var(--cl);
	background: var(--tr);
	color: var(--cl);
	box-shadow: var(--bx_b2), var(--bx_b4) inset;
	position: relative;
	z-index: 3;
}
.form_icon{
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	padding: 0 18px;
	display: flex;
	align-items: center;
	background: var(--cl1);
	border-radius: 10px 50% 50% 10px;
	color: var(--cl);
	font-size: 20px;
}
.form_prv_n, .form_prv_y{
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	padding: 0 18px;
	display: flex;
	align-items: center;
	color: var(--red);
	font-size: 20px;
	opacity: 0;
}
.form_prv_y{
	color: var(--cl);
}
.form_pr_n .form_prv_n, .form_pr_y .form_prv_y{
	opacity: 1;
}
.form_pr_n .form_prv_n{
	animation: ta_da .5s;
}

@keyframes ta_da{
	0%, 25%, 50%, 75%, 100%{
		transform: translateX(0);
	}
	12.5%, 37.5%, 62.5%, 87.5%{
		transform: translateX(-5px);
	}
}



.form_prv_nm{
	position: absolute;
	right: 0;
	bottom: 0;
	height: 0;

	display: flex;
	align-items: center;
	padding: 0 12px;
	background: var(--cl1);
	font-size: 0;

	border-bottom-right-radius: 14px;
	border-bottom-left-radius: 12px;

	transition: .3s;
}
.form_prv_nm svg{
	position: absolute;
	right: 0;
	top: -14px;
	width: 0;
	height: 14px;
	transition: .3s;
}
.form_prv_nm .svg_ftg{
	fill: var(--cl1);
}

.form_pr_nm .form_prv_nm{
	height: 30px;
	bottom: -30px;
	font-size: 12px;
}

.form_pr_nm .form_prv_nm svg{
	width: 14px;
}


.form_mn .form_pr_nm{
	margin-bottom: 38px;
}
.form_mn .form_pr_nm:last-child{
	margin-bottom: 18px;
}

@media (max-width: 480px) {
	.form_pr_nm{
		margin-bottom: 38px;
	}
	.form_pr_nm:last-child{
		margin-bottom: 18px;
	}
}















/* preloader */










/* кнопки */
.btn{
	position: relative;
	height: 44px;
	padding: 0 26px;
	
	font-size: 14.6px;
	font-weight: 600;
	transition: .3s;
	
	display: inline-flex;
	justify-content: center;
	align-items: center;
	
	border-radius: 0;
	color: var(--wh);
	background: var(--cl);
	/* background: linear-gradient(90deg, var(--cl) 0%, var(--cm) 50%), var(--cl) 100%; */
	/* background-size: 200% 100%; */
	/* background-position: 0% 0%; */
	-webkit-box-shadow: 0 0 10px 0 var(--cl4);
	-moz-box-shadow: 0 0 10px 0 var(--cl4);
	box-shadow: 0 0 10px 0 var(--cl4);

	cursor: pointer;
	user-select: none;
	outline: none;
}
.btn:hover{
	/* background-position: 100% 0%; */
	background: var(--cl8);
}


.btn_ds{
	background: var(--gr);
	border-color: var(--gr);
}
.btn_ds:hover{
	background: var(--gr8);
	border-color: var(--gr8);
}


.btn_red{
	background: var(--red);
	border-color: var(--red);
}
.btn_red:hover{
	background: var(--red8);
	border-color: var(--red8);
}


.btn_back{
	background: var(--tr);
	color: var(--bl);
	border: none;
	box-shadow: none;
}
.btn_back:hover{
	color: var(--cl);
}



/*  */
.btn i{font-size:18px}
.btn i:first-child{margin-right:15px}
.btn i:last-child{margin-left:15px}


.cala_btn i{
	transition: .3s;
}
.cala_btn:hover i{
	font-size: 24px;
}


.btn_dd{
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
}




/*  */
.btn_whatsapp{
	background: #25D366;
	box-shadow: var(--bx_b3), inset var(--bx_t2);
}










/*  */
[data-title]:hover::after {
	opacity: 1;
	transition: var(--tm);
	visibility: visible;
}
[data-title]::after {
	content: attr(data-title);
	background: var(--wh);
	color: var(--bl);
	font-size: 14px;
	position: absolute;
	padding: 10px 15px;
	bottom: -30px;
	left: 100%;
	white-space: nowrap;
	box-shadow: var(--bx_b7);
	opacity: 0;
	z-index: 99999;
	visibility: hidden;
}
[data-title]{position:relative}
@media(max-width:768px){[data-title]::after{display:none}}











/*  */
.bl_mess{
	position: fixed;
	width: 100%;
	top: -260px;
	left: 0;
	z-index: 910;
	opacity: 0;
	transition: .5s;

	display: flex;
	justify-content: center;
}
.bl_mess_zak{
	top: 0;
	opacity: 1;
}


.bl_mess_sam{
	margin-top: 20px;
	min-width: 240px;
	padding: 20px;
	background: var(--wh);
	box-shadow: var(--bx5);

	/* border-radius: 10px; */
}


.preloader_mess{
	position: relative;
	height: 60px;
	display: flex;
	align-items: center;
}
.ms_circle{
	position: relative;
	width: 60px;
	height: 60px;
	margin-right: 20px;
	background: var(--cl);
	border-radius: 50%;
	animation: white-shadow 1s infinite;
	color: var(--wh);
	font-size: 34px;
	display: flex;
	justify-content: center;
	align-items: center;
}
@keyframes white-shadow {
	0% {
		box-shadow: 0 0 0 0 var(--gr7);
		transition: box-shadow 0.3s ease-in-out;
	}
	100% {
		box-shadow: 0 0 0 30px transparent;
		transform: translate3d(0, 0, 0);
		transition: box-shadow 0.4s ease-in-out;
	}
}
.ms_text{
	color: var(--cl);
	text-align: center;
}
















/*  */
.modal_cn{
	width: 100%;
    height: calc(100vh);
    position: fixed;
    top: -70px;
    left: 0;
    z-index: 9999;
    padding-bottom: 70px;
    transform: translateY(70px);
    transition: background var(--tm);
    -webkit-overflow-scrolling: touch;
}
.modal_bl{
	width: 100%;
	height: 100%;
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--bag);
	background-size: cover;
	transition: var(--tm);
	opacity: 0;
}

.modal_con{
	position: relative;
	width: calc(100% - 30px);
	margin: auto;
	z-index: 2;
	padding: 15px;
	max-width: 1170px;
	opacity: 0;
}

.modal_head{
	width: 100%;
	position: relative;
	padding-top: 5px;
	padding-bottom: 15px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.modal_foot{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	position: relative;
	padding: 15px 0 0 0;
}







/*  */
.form_cn{
	width: 100%;
	position: relative;
	margin-bottom: 15px;
	transition: var(--tm);
}
.form_cn:last-child{
	margin-bottom: 0;
}
.form_cn input{
	background: var(--wh);
	width: 100%;
	padding-left: 50px;
	padding-right: 10px;
	position: relative;
	z-index: 4;
	font-size: 16px;
	font-weight: 500;
}
.form_cn button{
	width: 100%;
}
.form_ic{
	top: 0;
	position: absolute;
	height: 100%;
	display: flex;
	align-items: center;
	left: 20px;
	color: var(--gr);
	transition: var(--tm);
	z-index: 5;
	font-weight: 500;
}
.form_act .form_ic{
	color: var(--bl);
}

.form_regui{
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 3;
	padding: 0 15px;
	height: 25px;
	padding-bottom: 10px;
	font-size: 13.4px;
	background: var(--wh);
	border-bottom-left-radius: 16px;
	border-bottom-right-radius: 16px;

	display: flex;
	align-items: center;
	color: var(--red);
	transition: var(--tm);
}
.form_pust{
	margin-bottom: 35px !important;
}
.form_pust input{
	border-bottom-right-radius: 0;
}
.form_pust .form_regui{
	bottom: -25px; 
}



.form_cn_code{
	width: 100%;
	height: 64px;
	display: flex;
	justify-content: center;
}
.form_cn_code input{
	width: 64px;
	height: 64px;
	padding: 0;
	margin: 0;
	margin-left: 10px;
	text-align: center;
	font-size: 24px;
}
.form_cn_code input:first-child{
	margin-left: 0;
}





.form_cn_ps{
	display: flex;
	justify-content: flex-end;
	margin-top: 30px;
	cursor: pointer;
}
.form_cn_ps p{
	font-size: 16px;
	font-weight: 700;
}






.form_btn{
	margin-top: 30px;
}



.form_cn_ch{
	display: flex;
	font-size: 14px;
}
.form_cn_ch input{
	width: 20px;
	height: 20px;
	/* border-radius: 10px; */
	margin-right: 10px;
}
.form_cn_ch span{
	color: var(--red);
}





.form_btn_flex {
	display: flex;
	justify-content: space-between;
}

.form_btn_flex .btn{
	width: 44px;
	padding: 0;
}

.form_btn_flex .btn:last-child{
	width: calc(100% - 54px);
}






/*  */
.form_im{
	position: relative;
	width: 100%;
	padding-bottom: 15px;
	display: flex;
	justify-content: flex-start;
	align-items: center;	
}
.form_im:last-child{
	margin-bottom: 0;
}
.form_im input{
	position: relative;
	width: 100%;
	height: 54px;
	padding: 0 35px;
	/* border-radius: 28px; */
	border: 1px solid var(--bl3);
	font-size: 16px;
	font-weight: 600;
	transition: var(--tm);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	user-select: none;
	outline: none;
}
.form_im input:focus{
	border-color: var(--bl);
}

.form_im input::placeholder{
	color: var(--bl3);
}











.form_sms{
	font-size: 16px;
	font-weight: 600;
	color: var(--red);
}















/* preloader */
.form_prg{
	position: relative;
    width: 220px;
    margin: auto;
    height: 64px;
    margin-top: -10px;
    transform: scale(0.25);

    display: flex;
    justify-content: center;
    align-items: center;
}

.🤚 {
  --skin-color: #E4C560;
  --tap-speed: 0.6s;
  --tap-stagger: 0.1s;
  position: relative;
  width: 109.28px;
  height: 81.96px;
  margin-left: 109.28px;
}
.🤚::before {
  content: '';
  display: block;
  width: 180%;
  height: 75%;
  position: absolute;
  top: 70%;
  right: 20%;
  background-color: black;
  border-radius: 54.64px 13.66px;
  -webkit-filter: blur(10px);
          filter: blur(10px);
  opacity: 0.3;
}

.🌴 {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--skin-color);
  border-radius: 13.66px 54.64px;
}

.👍 {
  position: absolute;
  width: 120%;
  height: 43.711999999999996px;
  background-color: var(--skin-color);
  bottom: -18%;
  right: 1%;
  -webkit-transform-origin: calc(100% - 27.32px) 27.32px;
          transform-origin: calc(100% - 27.32px) 27.32px;
  -webkit-transform: rotate(-20deg);
          transform: rotate(-20deg);
  border-radius: 40.98px 27.32px 27.32px 13.66px;
  border-bottom: 2px solid rgba(0, 0, 0, 0.1);
  border-left: 2px solid rgba(0, 0, 0, 0.1);
}
.👍::after {
  width: 20%;
  height: 60%;
  content: '';
  background-color: rgba(255, 255, 255, 0.3);
  position: absolute;
  bottom: -8%;
  left: 6.83px;
  border-radius: 60% 10% 10% 30%;
  border-right: 2px solid rgba(0, 0, 0, 0.05);
}

.👉 {
  position: absolute;
  width: 80%;
  height: 47.81px;
  background-color: var(--skin-color);
  bottom: 32%;
  right: 64%;
  -webkit-transform-origin: 100% 27.32px;
          transform-origin: 100% 27.32px;
  -webkit-animation-duration: calc(var(--tap-speed) * 2);
          animation-duration: calc(var(--tap-speed) * 2);
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-transform: rotate(10deg);
          transform: rotate(10deg);
}
.👉::before {
  content: '';
  position: absolute;
  width: 140%;
  height: 40.98px;
  background-color: var(--skin-color);
  bottom: 8%;
  right: 65%;
  -webkit-transform-origin: calc(100% - 27.32px) 27.32px;
          transform-origin: calc(100% - 27.32px) 27.32px;
  -webkit-transform: rotate(-60deg);
          transform: rotate(-60deg);
  border-radius: 27.32px;
}
.👉:nth-child(1) {
  -webkit-animation-delay: 0;
          animation-delay: 0;
  -webkit-filter: brightness(70%);
          filter: brightness(70%);
  -webkit-animation-name: tap-upper-1;
          animation-name: tap-upper-1;
}
.👉:nth-child(2) {
  -webkit-animation-delay: var(--tap-stagger);
          animation-delay: var(--tap-stagger);
  -webkit-filter: brightness(80%);
          filter: brightness(80%);
  -webkit-animation-name: tap-upper-2;
          animation-name: tap-upper-2;
}
.👉:nth-child(3) {
  -webkit-animation-delay: calc(var(--tap-stagger) * 2);
          animation-delay: calc(var(--tap-stagger) * 2);
  -webkit-filter: brightness(90%);
          filter: brightness(90%);
  -webkit-animation-name: tap-upper-3;
          animation-name: tap-upper-3;
}
.👉:nth-child(4) {
  -webkit-animation-delay: calc(var(--tap-stagger) * 3);
          animation-delay: calc(var(--tap-stagger) * 3);
  -webkit-filter: brightness(100%);
          filter: brightness(100%);
  -webkit-animation-name: tap-upper-4;
          animation-name: tap-upper-4;
}

@-webkit-keyframes tap-upper-1 {
  0%, 50%, 100% {
    -webkit-transform: rotate(10deg) scale(0.4);
            transform: rotate(10deg) scale(0.4);
  }
  40% {
    -webkit-transform: rotate(50deg) scale(0.4);
            transform: rotate(50deg) scale(0.4);
  }
}

@keyframes tap-upper-1 {
  0%, 50%, 100% {
    -webkit-transform: rotate(10deg) scale(0.4);
            transform: rotate(10deg) scale(0.4);
  }
  40% {
    -webkit-transform: rotate(50deg) scale(0.4);
            transform: rotate(50deg) scale(0.4);
  }
}
@-webkit-keyframes tap-upper-2 {
  0%, 50%, 100% {
    -webkit-transform: rotate(10deg) scale(0.6);
            transform: rotate(10deg) scale(0.6);
  }
  40% {
    -webkit-transform: rotate(50deg) scale(0.6);
            transform: rotate(50deg) scale(0.6);
  }
}
@keyframes tap-upper-2 {
  0%, 50%, 100% {
    -webkit-transform: rotate(10deg) scale(0.6);
            transform: rotate(10deg) scale(0.6);
  }
  40% {
    -webkit-transform: rotate(50deg) scale(0.6);
            transform: rotate(50deg) scale(0.6);
  }
}
@-webkit-keyframes tap-upper-3 {
  0%, 50%, 100% {
    -webkit-transform: rotate(10deg) scale(0.8);
            transform: rotate(10deg) scale(0.8);
  }
  40% {
    -webkit-transform: rotate(50deg) scale(0.8);
            transform: rotate(50deg) scale(0.8);
  }
}
@keyframes tap-upper-3 {
  0%, 50%, 100% {
    -webkit-transform: rotate(10deg) scale(0.8);
            transform: rotate(10deg) scale(0.8);
  }
  40% {
    -webkit-transform: rotate(50deg) scale(0.8);
            transform: rotate(50deg) scale(0.8);
  }
}
@-webkit-keyframes tap-upper-4 {
  0%, 50%, 100% {
    -webkit-transform: rotate(10deg) scale(1);
            transform: rotate(10deg) scale(1);
  }
  40% {
    -webkit-transform: rotate(50deg) scale(1);
            transform: rotate(50deg) scale(1);
  }
}
@keyframes tap-upper-4 {
  0%, 50%, 100% {
    -webkit-transform: rotate(10deg) scale(1);
            transform: rotate(10deg) scale(1);
  }
  40% {
    -webkit-transform: rotate(50deg) scale(1);
            transform: rotate(50deg) scale(1);
  }
}









.back{
	width: 44px;
	height: 44px;
	color: var(--wh);
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--cm);
	/* border-radius: 10px; */
	font-size: 20px;
}










/*  */
.preloader{
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	position: fixed;
	z-index: 99999;
	background:var(--wh);
	display: flex;
	justify-content: center;
	align-items: center;
}
.dot {
  background: var(--cl);
}
.dot, .dot::after {
  display: inline-block;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  animation: a 1.5s calc(((var(--i) + var(--o, 0))/var(--n) - 1)*1.5s) infinite;
}
.dot::after {
  --o: 1;
  background:var(--black1);
  content: "";
}

@keyframes a {
  0%, 50% {
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
  }
}






/*  */
.bl_mess{
	position: fixed;
	width: 100%;
	top: -260px;
	left: 0;
	z-index: 910;
	opacity: 0;
	transition: .5s;

	display: flex;
	justify-content: center;
}
.bl_mess_zak{
	top: 0;
	opacity: 1;
}
.bl_mess_sam{
	display: inline-block;
	margin-top: 30px;
	padding:20px 30px;
	background: var(--wh);
	box-shadow: var(--bx5);
	/* border-radius: 20px; */
	transition: var(--tm);
}







/*  */
.swiper-container {
	position: relative;
	width: 100%;
	height: 100%;
}
.swiper-slide {
	position: relative;
}
.swiper-button-next{}
.swiper-button-prev{}
.swiper-pagination-bullet-active{}









/*  */
.clc_top{
	width: 40px;
	height: 40px;
	position: absolute;
	left: -50px;
	top: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 3px solid var(--wh);
	border-radius: 50%;
	cursor: pointer;
}
.clc_ti{
	width: 30px;
	height: 30px;
	background: url('../img/icon/icons8-more-than-100_w.png');
	background-size: cover;
	border-radius: 50%;
    transform: rotate(-90deg);
	box-shadow: var(--bx_sh3);
}
.clc_ti:hover{
   animation:hoverWavew linear 1s infinite;
}
@media (max-width: 480px) {
	.clc_top{
		left: 10px;
		top: -60px;
		border: 1px solid var(--cl);
	}
	.clc_ti{
		background: url('../img/icon/icons8-more-than-100.png');
		background-size: cover;
	}
}













/*  */
@keyframes hoverWavew {
   0%{box-shadow:0 8px 10px var(--bl2),0 0 0 0 var(--bl1),0 0 0 0 var(--bl1)}
	40%{box-shadow:0 8px 10px var(--bl2),0 0 0 15px var(--bl1),0 0 0 0 var(--bl1)}
	80%{box-shadow:0 8px 10px var(--bl2),0 0 0 30px var(--trb),0 0 0 26.7px var(--bl1)}
	100%{box-shadow:0 8px 10px var(--bl2),0 0 0 30px var(--trb),0 0 0 40px var(--trb)}
}
@keyframes hoverWave {
   0%{box-shadow:0 8px 10px var(--cl3),0 0 0 0 var(--cl2),0 0 0 0 var(--cl2)}
	40%{box-shadow:0 8px 10px var(--cl3),0 0 0 15px var(--cl2),0 0 0 0 var(--cl2)}
	80%{box-shadow:0 8px 10px var(--cl3),0 0 0 30px var(--trb),0 0 0 26.7px var(--cl1)}
	100%{box-shadow:0 8px 10px var(--cl3),0 0 0 30px var(--trb),0 0 0 40px var(--trb)}
}
@keyframes shake {
	0%{transform: rotateZ(0deg)}
	10%{transform: rotateZ(-30deg)}
	20%{transform: rotateZ(15deg)}
	30%{transform: rotateZ(-10deg)}
	40%{transform: rotateZ(7.5deg)}
	50%{transform: rotateZ(-6deg)}
	60%{transform: rotateZ(5deg)}
	70%{transform: rotateZ(-4.28571deg)}
	80%{transform: rotateZ(3.75deg)}
	90%{transform: rotateZ(-3.33333deg)}
	100%{transform: rotateZ(0deg)}
}






/*  */
.swiper {
	position: relative;
	width: 100%;
}
.swiper-slide {
	position: relative;
	background: #fff;
}

.swiper-pagination{}
.swiper-pagination .swiper-pagination-bullet{
	background: var(--gr5);
	opacity: 1;
}
@media(max-width:500px){
	.swiper-pagination{
		height: 44px;
		padding: 18px 0;
	}
}


.swiper-pagination .swiper-pagination-bullet-active{background:var(--cl)}
.swiper-button-prev, .swiper-button-next{
	width: 54px;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	bottom: 0;
	margin: 0;
	padding: 0;
	top: auto;
	left: 0;
	background: var(--wh4);
	color: var(--bl);
	font-size: 20px;
	transition: .3s;
	opacity: 0 !important;
	outline: none;
}
.swiper-button-next{
	right: 0;
	left: auto;
}
.swiper-button-prev:hover, .swiper-button-next:hover{background:var(--wh8)}
.swiper-button-prev::after, .swiper-button-next::after{display:none}
@media(max-width:500px){
	.swiper-button-prev, .swiper-button-next{
		width: 44px !important;
		height: 44px !important;
		opacity: 1 !important;
		bottom: 0 !important;
		background: var(--tr) !important;
	}
}






























.footer{
	position: relative;
	width: 100%;
	padding: 60px 0 0 0;
	background: #F1F3F4;
}
.foot_c{
	position: relative;
	width: 100%;
	border-top: 1px solid var(--bl1);
	padding-top: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

.foot_i{
	position: relative;
	width: 33.3333%;
}
@media (max-width: 768px) {
	.foot_i{
		width: 100%;
		margin-bottom: 60px;
	}
	.foot_i:first-child{
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
	.foot_i:last-child{
		margin-bottom: 0;
	}
}

.foot_txt{
	position: relative;
	margin-top: 15px;
}





/*  */
.sos_set{
	position: relative;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.sos_set .top_site_si{
}
.sos_set .top_site_si a{
}






/*  */
.foot_n{
	position: relative;
	width: 100%;
}
.foot_nc{
	position: relative;
	width: 100%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
@media (max-width: 768px) {
	.foot_nc{
		justify-content: center;
	}
}

.foot_nc a{
	margin-left: 15px;
	transition: .3s;
}
.foot_nc a:hover{
	color: var(--cl);
}


.foot_nz{
	position: relative;
	width: 100%;
	height: 60px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-top: 15px;
}
@media (max-width: 768px) {
	.foot_nz{
		justify-content: center;
	}
}
.foot_ni{
	position: relative;
	width: 60px;
	height: 60px;
	background-size: cover;
	background-position: center;
	margin-right: 15px;
}
.foot_nz a{
	text-decoration: underline;
	transition: .3s;
}
.foot_nz a:hover{
	color: var(--cl);
}



/*  */
.footer_b{
	position: relative;
	width: 100%;
	border-top: 1px solid var(--gr);
	padding: 40px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.footer_bl{
	position: relative;
	width: 50%;
	font-weight: 400;
	font-size: 13.4px;
}
@media (max-width: 768px) {
	.footer_bl{
		width: 100%;
		margin-bottom: 20px;
		text-align: center;
	}
}

.footer_br{
	position: relative;
	width: 50%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
@media (max-width: 768px) {
	.footer_br{
		width: 100%;
		justify-content: center;
	}
}

/*  */
.gprog_bl{
	position: relative;
	display: inline-flex;
	justify-content: flex-end;
	align-items: center;
	font-size: 13.4px;
}
.gprog_heart{
	margin: 0 3px;
	color: var(--red);
	font-size: 16px;
	border-radius: 50%;
	width: 25px;
	height: 25px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.gprog_bl:hover .gprog_heart {
	-webkit-animation: heartAnimation .8s ease-in-out infinite;
	animation: heartAnimation .8s ease-in-out infinite;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
.gprog_heart:after, .gprog_heart:before {
	content: '';
	position: absolute;
	top: -15px;
	bottom: -15px;
	left: -15px;
	right: -15px;
	border-radius: 50%;
	opacity: 0;
	-webkit-box-shadow: 0 0 10px 15px rgb(242 69 61 / 55%);
	box-shadow: 0 0 10px 15px rgb(242 69 61 / 55%);
	pointer-events: none;
}
.gprog_bl:hover .gprog_heart:before {
	-webkit-animation: anim-effect-ivana-1 .8s infinite;
	animation: anim-effect-ivana-1 .8s infinite;
}
.gprog_bl:hover .gprog_heart:after {
	-webkit-animation: anim-effect-ivana-2 .8s infinite;
	animation: anim-effect-ivana-2 .8s infinite;
}


.gprog_ab{
	min-width: 207px;
	background: var(--wh);
	border-radius: 30px;
	padding: 30px;

	position: absolute;
	bottom: 105%;
	left: 50%;
	-webkit-transform: translateX(calc(-50%));
	-ms-transform: translateX(calc(-50%));
	transform: translateX(calc(-50%));
	-webkit-transition: all .4s;
	-o-transition: all .4s;
	transition: all .4s;
	opacity: 0;
	pointer-events: none;
	-webkit-box-shadow: 2px 15px 20px rgb(0 0 0 / 15%);
	box-shadow: 2px 15px 20px rgb(0 0 0 / 15%);
}
@media(max-width:768px){.gprog_ab{display:none}}
.gprog_bl:hover .gprog_ab{
	-webkit-transform: translateX(calc(-50%)) translateY(-2vh);
	-ms-transform: translateX(calc(-50%)) translateY(-2vh);
	transform: translateX(calc(-50%)) translateY(-2vh);
	opacity: 1;
}
.gprog_ab:before {
	content: '';
	position: absolute;
	bottom: -4px;
	right: 0;
	left: 0;
	margin: auto;
	transform: rotate(45deg);
	background: var(--wh);
	width: 14px;
	height: 14px;
	border-radius: 4px;
}
.gprog_lg{
	position: relative;
	width: 100%;
	height: 74px;
	margin: auto;
	display: flex;
	justify-content: center;
	align-items: center;
}
.gprog_lg div{
	position: relative;
	width: 74px;
	height: 74px;
	background-size: 100% auto;
	background-position: center center;
	background-repeat: no-repeat;
}
.gprog_h{
	position: relative;
	width: 100%;
	font-size: 24px;
	font-weight: 500;
	color: var(--bl);
	text-align: center;
	margin-bottom: 5px;
}
.gprog_p{
	position: relative;
	width: 100%;
	font-size: 14px;
	color: var(--bl);
	text-align: center;
	padding-left: 6px;
}