:root {
	--hu-bong: 0 22px 44px -18px rgba(0, 45, 95, .32), 0 6px 14px -6px rgba(0, 0, 0, .10);
	--hu-cham: cubic-bezier(.2, .7, .2, 1);
}

.img_prod, .img_prod_ajax {
	position: relative;
	border-radius: 8px;
	background: radial-gradient(ellipse 70% 75% at 50% 42%, #fff 38%, #eef2f8 100%);
}
.img_prod img, .img_prod_ajax img {
	mix-blend-mode: multiply;
	position: relative;
	z-index: 1;
	transition: transform .55s var(--hu-cham);
	transform-origin: 50% 70%;
}
.img_prod::after, .img_prod_ajax::after {
	content: "";
	position: absolute;
	left: 18%; right: 18%; bottom: 4%;
	height: 12%;
	border-radius: 50%;
	background: radial-gradient(ellipse at center, rgba(0, 30, 70, .22) 0%, rgba(0, 30, 70, 0) 70%);
	transition: transform .55s var(--hu-cham), opacity .55s var(--hu-cham);
	pointer-events: none;
}

.ul_prod > li, .ul_prod_ajax > li, .ul_adv_bottom > li {
	background: #fff;
	transition: transform .45s var(--hu-cham), box-shadow .45s var(--hu-cham);
	transform: perspective(900px) rotateX(var(--hu-rx, 0deg)) rotateY(var(--hu-ry, 0deg)) translateY(var(--hu-ty, 0));
	will-change: transform;
}
.ul_prod > li::before, .ul_prod_ajax > li::before, .ul_adv_bottom > li::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
	opacity: 0;
	background: radial-gradient(circle at var(--hu-gx, 50%) var(--hu-gy, 0%), rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 45%);
	transition: opacity .35s ease;
}

@media (hover: hover) and (pointer: fine) {
	.ul_prod > li:hover, .ul_prod_ajax > li:hover, .ul_adv_bottom > li:hover {
		--hu-ty: -4px;
		z-index: 5;
		box-shadow: var(--hu-bong);
	}
	.ul_prod > li:hover::before, .ul_prod_ajax > li:hover::before, .ul_adv_bottom > li:hover::before { opacity: 1; }
	.ul_prod > li:hover .img_prod img, .ul_prod_ajax > li:hover .img_prod_ajax img { transform: translateY(-2%) scale(1.04); }
	.ul_prod > li:hover .img_prod::after, .ul_prod_ajax > li:hover .img_prod_ajax::after { transform: scale(1.25, .8); opacity: .65; }
	.ul_adv_bottom > li:hover figure img { transform: scale(1.07); }
}

.swiper1 .swiper-slide > a, .adv_row_1 > li, .adv_c > a, .ul_adv_bottom > li figure,
.ul_news_xn_sb figure, .r_news_bottom figure, .news_spec figure, .ul_ns_2 figure, .l_news_bottom figure {
	display: block;
	position: relative;
	overflow: hidden;
}
.swiper1 .swiper-slide > a img, .adv_row_1 > li img, .adv_c > a img, .ul_adv_bottom > li figure img,
.ul_news_xn_sb figure img, .r_news_bottom figure img, .news_spec figure img, .ul_ns_2 figure img, .l_news_bottom figure img {
	transition: transform .8s var(--hu-cham);
}
.swiper1 .swiper-slide > a img {
	transform: translate3d(var(--hu-px, 0), var(--hu-py, 0), 0) scale(1.06);
	transition: transform .9s var(--hu-cham);
}
.swiper1 .swiper-slide > a::after, .adv_row_1 > li::after, .adv_c > a::after, .ul_adv_bottom > li figure::after,
.news_spec figure::after, .l_news_bottom figure::after {
	content: "";
	position: absolute;
	top: 0; bottom: 0;
	left: -60%;
	width: 40%;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .45) 50%, rgba(255, 255, 255, 0) 100%);
	transform: skewX(-18deg);
}
@media (hover: hover) and (pointer: fine) {
	.swiper1 .swiper-slide > a:hover::after, .adv_row_1 > li:hover::after, .adv_c > a:hover::after, .ul_adv_bottom > li:hover figure::after,
	.news_spec figure:hover::after, .l_news_bottom figure:hover::after {
		left: 130%;
		transition: left .9s ease;
	}
	.adv_row_1 > li:hover img, .adv_c > a:hover img,
	.ul_news_xn_sb figure:hover img, .r_news_bottom figure:hover img, .news_spec figure:hover img, .ul_ns_2 figure:hover img, .l_news_bottom figure:hover img {
		transform: scale(1.06);
	}
	.adv_row_1 > li, .adv_c > a { transition: box-shadow .45s var(--hu-cham); }
	.adv_row_1 > li:hover, .adv_c > a:hover { box-shadow: var(--hu-bong); }
}

.hu-an {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
}
.ul_prod > li.hu-an, .ul_prod_ajax > li.hu-an, .ul_adv_bottom > li.hu-an {
	transform: perspective(900px) translate3d(0, 28px, 0);
}
.hu-an.hu-hien {
	opacity: 1;
	transform: none;
	transition: opacity .7s var(--hu-cham) var(--hu-tre, 0s), transform .7s var(--hu-cham) var(--hu-tre, 0s);
}
.ul_prod > li.hu-an.hu-hien, .ul_prod_ajax > li.hu-an.hu-hien, .ul_adv_bottom > li.hu-an.hu-hien {
	transform: perspective(900px) rotateX(var(--hu-rx, 0deg)) rotateY(var(--hu-ry, 0deg)) translateY(var(--hu-ty, 0));
	transition: opacity .7s var(--hu-cham) var(--hu-tre, 0s), transform .45s var(--hu-cham), box-shadow .45s var(--hu-cham);
}

@media (prefers-reduced-motion: reduce) {
	.ul_prod > li, .ul_prod_ajax > li, .ul_adv_bottom > li, .img_prod img, .img_prod_ajax img, .swiper1 .swiper-slide > a img { transition: none !important; transform: none !important; }
	.swiper1 .swiper-slide > a::after, .adv_row_1 > li::after, .adv_c > a::after, .ul_adv_bottom > li figure::after, .news_spec figure::after, .l_news_bottom figure::after { display: none; }
	.hu-an { opacity: 1; transform: none; }
}