.lanmub_jz_case {position: relative;padding: 40px 0;width: 100%;background-image: url(../image/casebg.png);background-position: center bottom;background-size: 100% 85%;background-repeat: no-repeat; }
.lanmub_jz_case .case-title{text-align: center;}
.lanmub_jz_case .case-title h1{ font-family: "SourceHanSansCN Bold";font-size: 30px;font-weight: bold;background: rgba(0, 0, 0, 0) url("../image/line.png") no-repeat scroll center center;}
.lanmub_jz_case .case-title i{ width:60px; height:4px;margin:10px auto; display:block}
.lanmub_jz_case .case-title dt {color: #999; font-size: 14px;line-height: 36px;}
.lanmub_jz_case .case-container{width:1200px; position:relative; margin:0 auto}
.lanmub_jz_case .tabs {
    position: relative;
    margin-top: 30px;
}

.lanmub_jz_case .menus {
    display: block;
    height: 32px;
    padding: 0;
    list-style: none;
}

.lanmub_jz_case .menus li {
    float: left;
    display: block;
    line-height: 30px;
    height: 30px;
    color: #333;
    width: calc(25% - 26px);
    cursor: pointer;
    padding: 0 13px;
    box-sizing: border-box;
    transition-duration: 0.4s;
    overflow: hidden;
}

.lanmub_jz_case .menus li p {
    margin: 0;
}

.lanmub_jz_case .menus li span {
    display: block;
    width: 100%;
    height: 30px;
    text-align: center;
}

.lanmub_jz_case .menus li:hover::after,
.lanmub_jz_case .menus li::after {
    position: relative;
    display: block;
    top: -3px;
    content: "";
    transition: all .3s ease-in-out 0s;
    cursor: pointer;
    border-top: 3px solid #0054a7;
    width: 0;
}

.lanmub_jz_case .menus li:hover::after { width: 100%; margin: 0 auto;}

.lanmub_jz_case .menus li:hover p,
.lanmub_jz_case .menus li:checked p {
    font-weight: bold;
    letter-spacing: 3px;
    color: #0054A7;
}

.lanmub_jz_case .menus li:hover p {
    transform: translateY(-120%);
    transition-duration: .5s;
}
.lanmub_jz_case .selectTab {
    display: inline-block;
    width: 100%;
    height: 30px;
    text-align: center;
}

.lanmub_jz_case .selectTab p {
    font-weight: bold;
    letter-spacing: 3px;
    color: #0054A7;
}


.lanmub_jz_case .selectTab::after {
    position: relative;
    display: block;
    top: -3px;
    content: "";
    transition: all .3s ease-in-out 0s;
    cursor: pointer;
    border-top: 3px solid #0054a7;
    width: 100%;
}

.lanmub_jz_case .selectTab p {
    transform: translateY(-100%);
    transition-duration: .5s;
}

.lanmub_jz_case .case-more {
    width: 150px;
    height: 40px;
    z-index: 1;
    border-radius: 50px;
    color: #666;
    overflow: hidden;margin:0 auto;line-height: 40px;text-align: center;
}

.lanmub_jz_case .case-more a { width:100%; height:100%; display:block; color: #fff;}



@keyframes rotation {
  from {
    transform: rotateY(0deg); }

  to {
    transform: rotateY(-360deg); } 
}  
@keyframes rotation1 {
  from {
    transform: rotateY(0deg); }

  to {
    transform: rotateY(-360deg); } }

@keyframes rotation2 {
  from {
    transform: rotateY(-45deg); }

  to {
    transform: rotateY(-405deg); } }

@keyframes rotation3 {
  from {
    transform: rotateY(-90deg); }

  to {
    transform: rotateY(-450deg); } }

@keyframes rotation4 {
  from {
    transform: rotateY(-135deg); }

  to {
    transform: rotateY(-495deg); } }

@keyframes rotation5 {
  from {
    transform: rotateY(-180deg); }

  to {
    transform: rotateY(-540deg); } }

@keyframes rotation6 {
  from {
    transform: rotateY(-225deg); }

  to {
    transform: rotateY(-585deg); } }

@keyframes rotation7 {
  from {
    transform: rotateY(-270deg); }

  to {
    transform: rotateY(-630deg); } }

@keyframes rotation8 {
  from {
    transform: rotateY(-315deg); }

  to {
    transform: rotateY(-675deg); } } 

.lanmub_jz_case .caursel3d-container {position: relative; height:600px;}
.lanmub_jz_case .caursel3d {
  display: block;
  position: relative;
  margin: auto; width: 336px;
  height: 258px;
  top: 100px;
  perspective: 2100px;
}

.lanmub_jz_case #carousel {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: auto; 
  transform-style: preserve-3d;
  animation-duration: 30s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-name: rotation; }

.lanmub_jz_case #carousel:hover {
    animation-play-state: paused;
}

.lanmub_jz_case #carousel figure {
	width: 336px;
        height: 258px;
    display: block;
    position: absolute;
    left: 10px;
    top: 10px;
    overflow: hidden;
}
.lanmub_jz_case #carousel figure:nth-child(1) {
	transform: rotateY(0deg) translateZ(480px);
}

.lanmub_jz_case #carousel figure:nth-child(2) {
	transform: rotateY(45deg) translateZ(480px);
}

.lanmub_jz_case #carousel figure:nth-child(3) {
	transform: rotateY(90deg) translateZ(480px);
}

.lanmub_jz_case #carousel figure:nth-child(4) {
	transform: rotateY(135deg) translateZ(480px);
}

.lanmub_jz_case #carousel figure:nth-child(5) {
	transform: rotateY(180deg) translateZ(480px);
}

.lanmub_jz_case #carousel figure:nth-child(6) {
	transform: rotateY(225deg) translateZ(480px);
}

.lanmub_jz_case #carousel figure:nth-child(7) {
	transform: rotateY(270deg) translateZ(480px);
}

.lanmub_jz_case #carousel figure:nth-child(8) {
	transform: rotateY(315deg) translateZ(480px);
}


.lanmub_jz_case .caursel3d img{
  cursor: pointer;
  transition: all .5s ease;  
  width: 100%;
  height: 100%; 
}
.lanmub_jz_case .caursel3d img:hover{
  transform: scale(1.2, 1.2); }