@charset "utf-8";
.banner{background:url(../images/banner-bg.jpg) no-repeat center top #102e50;background-size: 100% 100%;height: 4rem;}
.container{padding-bottom:0.8rem;background:url(../images/bg.jpg) repeat-y center top #102e50;background-size: 100% auto; }
.item{ width:100%; max-width:11.2rem; margin:0 auto 0.8rem; padding:0 0.2em; }
.item:last-child{ margin-bottom:0; }
.item > div{ position:relative; height:8rem;margin-bottom:.4rem }
.item > div:last-child{margin-bottom:0}
.item > div > img{ width:100%; height:100%; }
.item .video-view{position: absolute;width: 9.25rem;top: 0;left: 0;right: 0;margin: 0 auto; height:100%;}
.video-view>img{width: 100%;height: auto;display: block;margin: .9rem auto 0;}
.video-view>p,
.box-3d .btn-view>a{position:absolute; top:0.9rem; left:5%; overflow:hidden; width:90%; height:0.8rem; font-size:0.4rem; line-height:0.8rem; color:#fff; text-align:center; white-space:nowrap; text-overflow:ellipsis; text-shadow:2px 1px 1px #00eff1;}
.video-view>p{font-size:.36rem}
.video-view .video{z-index: 7; width: 8.68rem !important;height: 4.88rem !important;margin: .54rem auto 0;position: relative;}
.box-3d .video-view .video{background: url(../images/virtual/poster/心肺复苏综合训练线上3D.jpg) no-repeat center center;background-size: cover;}
.phone .video-view .video{width: 8.38rem !important;height: 4.71rem !important;margin: .54rem auto 0;}
.video-view .video.xgplayer-nostart .xgplayer-poster::after{display: block;position: absolute;content: ' ';width: 100%;height: 100%;background-color: rgba(2, 25, 50, .6);z-index: 8;top: 0;left: 0;}
.video-view ul{width: calc(8.68rem + .16rem);margin: .24rem 0 0 -.08rem; height: auto;padding: 0;display: table;list-style: none;text-decoration: none;}
.phone .video-view ul {width: 8.58rem;margin: .24rem auto 0;}
.video-view ul li{width: 25%;padding: 0 .08rem;float: left;}
.video-view ul li{padding: 0 .1rem;}
.video-view ul li a{display: block;width: 100%;height: auto;position: relative;}
.video-view ul li a::after{position: absolute;top: 0;left: 0;z-index: 2; display: block;content: ' ';width: 100%;height: 100%;background-color: rgba(0,0,0,.65);transition: opacity .5s;}
.video-view ul li.active a::after{opacity: 0;}
.video-view ul li a img{width: 100%;height: auto;display: block;}
.video-view ul li a p{position: absolute;z-index: 3; bottom: 0; left: 0;padding: .08rem;display: block;margin: 0; width: 100%;height: auto;font-size: .18rem;line-height: .18rem;background: linear-gradient(180deg,transparent,#000000 80%);color: #FFFFFF;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.phone .video-view ul li a p{font-size: .35rem;line-height: .35rem;padding: .1rem;}
.item .btn-view{position: absolute;top: .9rem;height: auto; width: 8.68rem; left: 0;right: 0; margin: 0 auto;}
.item .btn-view img{width: 100%;height: auto;}
.item .btn-view a{display: block; margin:  .8rem auto 0; width: 4.76rem;height: 1.36rem;border-radius: .2rem;background: url(../images/virtual/btn.png) no-repeat center top; background-size: 100% 100%;box-shadow: 0px .08rem .05rem 0px rgba(0, 23, 23, 0.58);transition: background-image,box-shadow .2s;}
.item .box-3d .btn-view{
  width: 4.76rem;
}
.box-3d .btn-view a{
  padding: 0;
  margin: 0 auto;
  left: 0;
  line-height: 1.36rem;
  background: linear-gradient(0deg,#16bfc2,#00eff1);
}
.box-3d .btn-view a:active{
  background:#00eff1
}
.phone .item .btn-view a{margin-top: .7rem;}
.pc .item .btn-view a::after{display: block;content: ' ';width: 100%;height: 100%;background: url(../images/virtual/btn-a.png) no-repeat center top;background-size: 100% 100%;opacity: 0;border-radius: .2rem;transition: opacity .2s;}
.pc.box-3d .btn-view a::after{
  background: none;
}
.pc .item .btn-view a:active::after{opacity: 1;}
.item .btn-view a:hover{box-shadow: 0px .26rem .46rem 0px rgba(0, 0, 0, 0.65);}


/* 移动端 */
.phone .container{ padding-bottom:2.5rem; }