@charset "utf-8";

html {
  font-size: 100px !important;
}
@media (max-width: 1400px) {
  html {
    font-size: 90px !important;
  }
}
@media (max-width: 1200px) {
  html {
    font-size: 80px !important;
  }
}
@media (max-width: 992px) {
  html {
    font-size: 70px !important;
  }
}
@media (max-width: 768px) {
  html {
    font-size: 60px !important;
  }
}
@media (max-width: 480px) {
}



.igoods .id {
	color:transparent;
	line-height:1;
	z-index:2;
	width:1.4rem;
	height:1.1rem;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center
}
.igoods .id.id1 {
	background-image:url('../images/no_01.png')
}
.igoods .id.id2 {
	background-image:url('../images/no_02.png')
}
.igoods .id.id3 {
	background-image:url('../images/no_03.png')
}
@media (min-width:992px) {
.igoods ul {
display:-webkit-flex;
display:flex;
display:-webkit-box;
display:box;
-webkit-align-items:center;
align-items:center;
-webkit-box-align:center;
box-align:center
}
.igoods li {
width:25%;
height:42vw;
transition:all .4s ease 0s;
overflow:hidden;
position:relative;
border:1px solid #fff;
background-repeat:no-repeat;
background-size:cover;
background-position:center
}
.igoods li::after {
content:'';
display:block;
position:absolute;
width:100%;
height:100%;
background-color:rgba(0, 0, 0, 0.5);
left:0;
top:0;
z-index:1;
opacity:1;
transition:all .4s ease 0s
}
.igoods li .info {
color:#fff;
width:50%;
position:absolute;
left:50%;
top:50%;
transition:.8s;
z-index:5;
transform:translateX(-50%) translateY(-50%) scale(1)
}
.igoods li .info h3 {
position:relative;
z-index:5
}
.igoods li .title, .igoods li h3 {
font-size:30px;
color:#fff;
display:block;
transition:.4s;
transition:all .4s ease 0s
}
.igoods li .title:hover {
transform:translateX(10px)
}
.igoods li .id {
font-size:1.4rem;
color:transparent;
position:absolute;
left:-0.7rem;
bottom:60%
}
.igoods .cover {
position:absolute;
left:0;
right:0;
top:100%;
transition:all .4s ease 0s;
transition-delay:.2s;
z-index:55
}
.igoods .active {
width:50%
}
.igoods .active::after {
opacity:0
}
.igoods .active .cover {
transform:translateY(-100%)
}
.igoods .active .info {
transform:scale(0)
}
}
@media (min-width:992px) and (max-width:1360px) {
.igoods li .title, .igoods li h3 {
font-size:26px
}
.igoods li .id {
font-size:1.2rem
}
.igoods li .desc {
font-size:16px
}
}
.igoods .cover {
padding:.4rem;
	background-color:rgba(0, 161, 230, 0.8);
	color:#fff
}
.igoods .cover .desc {
	font-size:18px;
	margin:20px 0;
	line-height:24px;
	max-height:72px;
	word-break:break-word;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	overflow:hidden;
	-webkit-line-clamp:3
}
@media (max-width:991px) {
.igoods {
width:88vw;
max-width:1440px;
margin-left:auto;
margin-right:auto;
padding:.4rem 0
}
.igoods li {
margin-bottom:.1rem;
color:#fff;
position:relative
}
.igoods li .id {
padding:1rem .3rem;
font-size:1rem;
margin-left:.1rem
}
.igoods li h3 {
display:none
}
.igoods .cover .title {
color:#fff;
font-size:22px
}
.igoods .cover .desc {
font-size:16px;
margin:10px 0 20px
}
}
@media (max-width:640px) {
.igoods .id {
padding-left:.2rem
}
.igoods .cover {
padding:.3rem .2rem .2rem
}
.igoods .cover .title {
font-size:20px
}
.igoods .cover .desc {
line-height:22px;
max-height:44px;
-webkit-line-clamp:2;
font-size:14px
}
