/*+++++hj_go_40+++++*/ /*+++++hj_end_40+++++*/ /*+++++hj_go_41+++++*/ /*+++++hj_end_41+++++*/ /*+++++hj_go_86+++++*/ template_hj_86 *{ padding:0; margin:0; box-sizing:border-box } template_hj_86 ul, template_hj_86 li{ list-style: none } template_hj_86 .hj_mk_86_clear { clear:both } template_hj_86 .hj_mk_86_container { width:1200px; margin:20px auto; padding:20px 0; } template_hj_86 .hj_mk_86_container .hj_mk_86_product { width:100%; } template_hj_86 .hj_mk_86_container .hj_mk_86_item{ position: relative; float: left; width:24%; height:220px; margin-bottom: 20px; margin-right:1.5%; z-index: 2; overflow: hidden; } template_hj_86 .hj_mk_86_container .hj_mk_86_item:nth-child(4n){ margin-right:0 } template_hj_86 .hj_mk_86_container .hj_mk_86_item::before,template_hj_86 .hj_mk_86_container .hj_mk_86_item::after{ position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; content: ''; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, -webkit-transform 0.35s; -o-transition: opacity 0.35s, -o-transform 0.35s; -moz-transition: opacity 0.35s, transform 0.35s, -moz-transform 0.35s; transition: opacity 0.35s, transform 0.35s; transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s, -moz-transform 0.35s, -o-transform 0.35s; transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s; z-index: 2; } template_hj_86 .hj_mk_86_container .hj_mk_86_item::before{ border-top: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: scale(0, 1); -moz-transform: scale(0, 1); -ms-transform: scale(0, 1); -o-transform: scale(0, 1); transform: scale(0, 1); } template_hj_86 .hj_mk_86_container .hj_mk_86_item::after{ border-left: 1px solid #fff; border-right: 1px solid #fff; -webkit-transform: scale(1, 0); -moz-transform: scale(1, 0); -ms-transform: scale(1, 0); -o-transform: scale(1, 0); transform: scale(1, 0); } template_hj_86 .hj_mk_86_container .hj_mk_86_item:hover:before,template_hj_86 .hj_mk_86_container .hj_mk_86_item:hover:after{ opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } template_hj_86 .hj_mk_86_container .hj_mk_86_item a{ text-decoration:none; margin: 0; padding: 0; display: block; width: 100%; height: 100%; } template_hj_86 .hj_mk_86_container .hj_mk_86_hjtuwenlisttype4ullitudiv { width: 100%; height: 100%; display: flex !important; justify-content: center; align-items: center; overflow: hidden; } template_hj_86 .hj_mk_86_container .hj_mk_86_hjtuwenlisttype4ullitudivimg { width: 100%; height: 100%; object-fit: cover; padding: 0; margin: 0px; border: none; overflow:hidden; webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } template_hj_86 .hj_mk_86_container .hj_mk_86_hjtuwenlisttype4ullitudivimg:hover { transform: scale(1.2, 1.2); -moz-transform: scale(1.2, 1.2); /* Firefox 4 */ -webkit-transform: scale(1.2, 1.2); /* Safari and Chrome */ -o-transform: scale(1.2, 1.2); /* Opera */ } template_hj_86 .hj_mk_86_container .hj_mk_86_item:hover a img { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } template_hj_86 .hj_mk_86_container .hj_mk_86_item a .hj_mk_86_title{ position: absolute; left: 0; top: 0; padding: 30px; width: 100%; height: 100%; opacity:0; display: flex; flex-direction: column; justify-content: center; } template_hj_86 .hj_mk_86_container .hj_mk_86_item a .hj_mk_86_title p{ margin: 0; padding: 0; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; padding: 0 16px; font-family: Tahoma; font-size: 24px; color: #fff; font-weight: normal; font-style: normal; text-decoration: none; text-align: center; line-height: 24px; display: block; opacity:0; transform: translateY(-16px); -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } template_hj_86 .hj_mk_86_container .hj_mk_86_item:hover a .hj_mk_86_title{ background-color: rgba(0, 0, 0, 0.6); background-image: none; background-repeat: no-repeat; background-position: 50% 50%; background: linear-gradient(none, none); background: -webkit-linear-gradient(none, none); background: -moz-linear-gradient(none, none); background: -ms-linear-gradient(none, none); background: -o-linear-gradient(none, none); background-size: auto; opacity:1; } template_hj_86 .hj_mk_86_container .hj_mk_86_item:hover a .hj_mk_86_title p{ opacity:1; transform: translateY(0); } /*+++++hj_end_86+++++*/ /*+++++hj_go_87+++++*/ /*+++++hj_end_87+++++*/