
/*----------------------电脑板式样式----------------------*/
//* 图标特效 */
.imgStyle_11{position:relative; clear: both; width: 100%; height: 100%;}
.imgStyle_11 ul{display: flex; flex-wrap: wrap; margin: 0 -.15rem;}
.imgStyle_11 ul li.imgItems{position: relative; overflow: hidden !important; padding: .15rem; width: 33.3%;  object-fit: contain; box-sizing:border-box; 	}
.imgStyle_11 ul li.imgItems a{height: 4rem; display: block;}
.imgStyle_11 ul li.imgItems .name{
	text-align: center;
	padding: 10px 0;
	font-size: .18rem;
	line-height: 1.5em;
}
.imgStyle_11 ul li .ratio{margin-top: 100%;}
.imgStyle_11 ul li a{transition: all ease .2s;}
.imgStyle_11 ul li a:hover{z-index: 2; transform: scale(1.05);}
.imgStyle_11 ul li a img{position: absolute; width: auto; height: 100%; top: 50%; left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	-webkit-transition: all ease .2s;
	-moz-transition: all ease .2s;
	-ms-transition: all ease .2s;
	-o-transition: all ease .2s;
	transition: all ease .2s;
}


.imgStyle_11 .theimgtext{height:30px;line-height: 30px;font-size: 14px;color:black;width:100%;text-align: center;word-break: keep-all;overflow: hidden;text-overflow: ellipsis;}
.imgStyle_11 .theimgdiv{width:100%; height:100%; border: 1px solid #f1f1f1;background-repeat: no-repeat !important; background-position: center !important; background-size: cover !important;}
.imgShowBox{position: fixed; z-index: 99999; background-color: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); top: 0; left: 0; width: 100%; height: 100%;}
.imgShowBox img{ position: absolute; width: auto; max-width: 80%; height: 80%; top: 50%; object-fit: contain; left: 50%; transform: translate(-50%,-50%); transition: all ease .3s; }
.imgShowBox.scroll{overflow-y:scroll;overflow-x:hidden;}
.imgShowBox.scroll::-webkit-scrollbar {width: 6px; height: 6px; background: rgba(0,0,0,.05);}
.imgShowBox.scroll::-webkit-scrollbar{width: 6px; height: 6px; background: rgba(0,0,0,.02);}
.imgShowBox.scroll::-webkit-scrollbar-button{background: #f7f7f7; height: 0;}
.imgShowBox.scroll::-webkit-scrollbar-corner{background: rgba(0,0,0,.05);}
.imgShowBox.scroll::-webkit-scrollbar-thumb{background: rgba(255,255,255,.7); border-radius: 3px;}

.imgShowBox.scroll img{top:5%; margin-bottom: 5%; transform: translate(-50%,0%);}



.pos_fixed{position: fixed; width: 100%;}


.imgButton{position: fixed; width: 100%; height: 100%; bottom: 0%; left: 0%; padding: .5rem;
	display: -webkit-flex; display: -moz-flex; display: flex; flex-wrap:nowrap; justify-content:space-between; align-items:center;}
.imgButton span{display: block; position: relative; left: 0; right: 0; cursor:pointer;	transition: all ease .2s;}
.imgButton span i{font-size: inherit; line-height: inherit; color:inherit;}
.imgButton span.prevImg, .imgButton span.nextImg{ width: 70px; height:70px; box-sizing: border-box;}
.prevImg{background: url(/style/img/prev2.svg) no-repeat center; background-size: 50px;}
.prevImg:hover{background-position: left center;}
.nextImg{background: url(/style/img/next2.svg) no-repeat center; background-size: 50px;}
.nextImg:hover{background-position: right center;}

span.closeShowPic{position: absolute; cursor: pointer; right: 45px; top: 50px; z-index: 99; width: 50px; height:50px; line-height: 50px;  font-family: serif;text-align: center; box-sizing: border-box; transition: all ease .3s;}
span.closeShowPic i{font-size: 40px; }

span.closeShowPic:hover{ transform: rotate(90deg);}
span.closeShowPic:hover .iconfont{color: #E40012;}


.noimgLoadLate{display: none;}


@media screen and (max-width: 768px) {
	.imgStyle_11 ul{display: flex; margin: 0 -5px;}
	.imgStyle_11 ul li.imgItems{position: relative; overflow: hidden !important; padding: 5px; width: 50%;  box-sizing:border-box;	transition: all ease .2s;}
	.imgStyle_11 ul li.imgItems a{height: 35vw; display: block;}
	.imgStyle_11 ul li.imgItems .name{
		text-align: center;
		padding: 5px 0;
		font-size: .22rem;
	}
	
	.imgShowBox img{ position: absolute; width: auto; max-width: 100%; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }

	.imgButton span{display: block; position: relative; left: 0; right: 0; cursor:pointer;	transition: all ease .2s;}
	.imgButton span i{font-size: inherit; line-height: inherit; color:inherit;}
	.imgButton span.prevImg, .imgButton span.nextImg{ width: 70px; height:70px; box-sizing: border-box;}
	.prevImg{background: url(/style/img/prev.svg) no-repeat left center; background-size: 30px;}
	.prevImg:hover{background-position: left center;}
	.nextImg{background: url(/style/img/next.svg) no-repeat right center; background-size: 30px;}
	.nextImg:hover{background-position: right center;}

	span.closeShowPic{position: absolute; cursor: pointer; right: 3px; top: 3px; z-index: 99; width: 50px; height:50px; line-height: 50px;  font-family: serif;text-align: center; box-sizing: border-box; transition: all ease .3s;}
	span.closeShowPic i{font-size: 30px; }
}