#page-wrap {width: 1200px;margin: 0 auto;overflow: hidden;height: 540px;}
.info-col {float: left;width: 150px;height: auto;}
.info-col h2 {text-align: center;font-weight: normal;padding: 25px 0;}
.image {height: 100px;text-indent: -9999px;display: block;border-right: 1px solid white;}
.batman {background: url(../images/batman.jpg) center center no-repeat;}
.spiderman {background: url(../images/spiderman.jpg) center center no-repeat;}
.aquaman {background: url(../images/aquaman.jpg) center center no-repeat;}
.ironman {background: url(../images/ironman.jpg) center center no-repeat;}
.superman {background: url(../images/superman.jpg) center center no-repeat;}
dt {padding: 5px;background: #900;color: white;border-bottom: 1px solid white;border-right: 1px solid white;}
dd {position: absolute;left: -9999px;top: -9999px;width: 395px;background: #900;padding: 10px;color: white;border-right: 1px solid white;}
 dt:nth-of-type(1) {background: #9ccb2a;}
dd:nth-of-type(1) {background: #9ccb2a;}
 dt:nth-of-type(2) {background: #139bc1;}
dd:nth-of-type(2) {background: #139bc1;}
 dt:nth-of-type(3) {background: #ffb03b;}
dd:nth-of-type(3) {background: #ffb03b;}
 dt:nth-of-type(4) {background: #c2a25c;}
dd:nth-of-type(4) {background: #c2a25c;}
 dt:nth-of-type(5) {background: #4c443c;}
dd:nth-of-type(5) {background: #4c443c;}
 dt:nth-of-type(6) {background: #656b60;}
dd:nth-of-type(6) {background: #656b60;}
.wrapper{margin: 0 auto;max-width: 1200px;}
.cols{display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
.col{
  width: calc(25% - 2rem);
  margin: 1rem;
  cursor: pointer;
}

.container{
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
	-webkit-perspective: 1000px;
	        perspective: 1000px;
}

.front,
.back{
  background-size: cover;
	background-position: center;
	-webkit-transition: -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	transition: -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	-o-transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1), -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	-webkit-backface-visibility: hidden;
	        backface-visibility: hidden;
	text-align: center;
	min-height: 235px;
	height: auto;
	border-radius: 10px;
	color: #fff;
	font-size: 0.9rem;
}

.back{
  background: #cedce7;
  background: -webkit-linear-gradient(45deg,  #cedce7 0%,#3466a2 100%);
  background: -o-linear-gradient(45deg,  #cedce7 0%,#3466a2 100%);
}

.front:after{
	position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    content: '';
    display: block;
    opacity: .4;
    background-color: #000;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    border-radius: 10px;
}
.container:hover .front,
.container:hover .back{
    -webkit-transition: -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
    transition: -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
    -o-transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
    transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
    transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1), -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
}

.back{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.inner{
    -webkit-transform: translateY(-50%) translateZ(60px) scale(0.94);
            transform: translateY(-50%) translateZ(60px) scale(0.94);
    top: 50%;
    position: absolute;
    left: 0;
    width: 100%;
    padding: 2rem;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    outline: 1px solid transparent;
    -webkit-perspective: inherit;
            perspective: inherit;
    z-index: 2;
}

.container .back{
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg);
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.container .front{
    -webkit-transform: rotateY(0deg);
            transform: rotateY(0deg);
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.container:hover .back{
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

.container:hover .front{
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

.front .inner p{
  font-size: 1.7rem;
  margin-bottom: 2rem;
  position: relative;
}

.front .inner p:after{
  content: '';
  width: 4rem;
  height: 2px;
  position: absolute;
  background: #C6D4DF;
  display: block;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -.75rem;
}

.front .inner span{
  color: rgba(255,255,255,0.7);
  font-family: 'Montserrat';
  font-weight: 300;
}

@media screen and (max-width: 64rem){
  .col{
    width: calc(33.333333% - 2rem);
  }
}

@media screen and (max-width: 48rem){
  .col{
    width: calc(50% - 2rem);
  }
}

@media screen and (max-width: 32rem){
  .col{
    width: 100%;
    margin: 0 0 2rem 0;
  }
}
.curCol {-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);z-index: 1;position: relative;}
/*预算*/
.budget{width:100%;height:400px;position: absolute;z-index: 101;top:1260px;}
.budget .ys-box{padding-top:70px;}
.budget .ys-box .print{float:left}
.budget .ys-box .print img{height:230px;}
.budget .ys-box .content{width:800px;height:230px;float:left;font-family:黑体;background:#fff;}
.budget .ys-box .content table{width:550px;height:230px;background:#fff;font-family:黑体;margin-left:20px;}
.budget .ys-box .content table button{width: 110px;height: 32px;background: #039A57;color: #fff;font-size: 15px;border: 0px;margin-left: 40px;}
.budget .ys-box .content .pattern{position:absolute;top:86px;margin-left: 555px; border:0px;}
.budget .ys-box .content .pattern img{border:0px;}
.budget .ys-box .content .pattern-text{position:absolute;top:125px; margin-left: 561px; border:0px;}
.budget .ys-box .content .pattern-text h1{background: url(../images/phone.png) 12px center no-repeat;padding-left: 52px;font-family: Georgia;color: #fff;font-size: 22px;line-height: 28px;margin: 15px 0 10px 0;}
.budget .ys-box .content .pattern-text h1 span{font-size: 14px;font-family: '宋体';font-weight: normal;}
.budget .ys-box .content .pattern-text p{background: #8ac889 url(../images/lb.png) 10px center no-repeat;width: 187px;height: 31px;line-height: 31px;padding-left: 40px;margin: auto;font-size: 12px;border-radius: 3px;}
.budget .ys-box .content .pattern-text p span{color:rgb(202, 103, 79)}
/*工程案例*/
.case{background: rgba(255, 255, 255, 0.47);padding-bottom: 20px;padding-top: 10px;}
.case .al-box .case-title{width:1160px;height:40px;margin: 10px 10px 10px 20px;}
.case .al-box .case-title h1{float:left;line-height:40px;color:#139bc1;}
.case .al-box .case-title .tit1{line-height:50px;color:#139bc1;}
.case .al-box .case-title a{float:right;line-height:40px;font-size:14px;margin-right:20px;color:#139bc1}
.case .al-box .case-title .tit2{float:right;line-height:40px;margin-right:10px;float:right;line-height:40px;margin-right:10px;}
.case .al-box .case-content{width:1160px;height:350px;margin-bottom:10px;padding:0px 20px;}
.case .al-box .case-content .single{width:380px;height:350px;float:left;}
.anli{position:relative;overflow:hidden;cursor:pointer;}
.re .anli:nth-child(1){width:380px;height:170px;background-color:#5a5454;}
.re .anli:nth-child(2){width:380px;height:350px;margin-left:10px;background-color:#5a5454;float:left;}
.re .anli:nth-child(3){width:100%;height:170px;margin-bottom:10px;background-color:#5a5454;}
.re .anli:nth-child(4){width:100%;height:170px;background-color:#5a5454;}
.anli-key1{color:#fff;background-color:#9ccb2a;font-size:14px;padding:2px 6px;border-radius:2px;}
.anli-key2{color:#fff;background-color:#139bc1;font-size:14px;padding:2px 6px;border-radius:2px;}
.anli-key2:hover,.anli-key1:hover{color:#fff;}
.txt,.txt1{background:rgba(0,0,0,0.6);position:absolute;left:0;bottom:0;color:#333;font-family:"微软雅黑";}
.txt h3,.txt1 h3{font-size:20px;font-weight:100;height:45px;text-align:center;line-height:45px;color: #fff;}