.banner {
    overflow: hidden;
}
.banner {
    position: relative;
}
.banner img{
	width:100%;
}

/*开始*/
.hf{background:#eee;padding-bottom:58px;}
.hf *{box-sizing: content-box;}
.hf .cf{padding-top:48px;}
.hf .cf .left{width:153px;background:#2b78d9;height:85px;vertical-align: middle;}
.hf .cf .right{width:1047px;background:#fff;padding-bottom:22px;}
.hf .cf .left p{text-align:center;font-size: 18px;color:#fff;line-height: 85px;_line-height:85px;height:85px;}
.hf .cf .left p img{padding-right:13px;}
.hf .cf .left .img{padding-top:16px;text-align: center;}
.hf .cf .left a{font-size: 14px;color:#7e7e7e;line-height: }
.hf .cf .right ul{padding-top:23px;padding-left:36px;}
.hf .cf .right li{font-size:14px;width:200px;height:32px;line-height: 32px;padding-top:1px;padding-bottom:1px;float: left;}
.hf .cf .right li a{padding:0 22px;display: inline-block;*display: inline;*zoom:1;vertical-align: middle;color:#7e7e7e;}
.hf .cf .right li a:hover{color:#fff;background:#2b78d9;-moz-border-radius: 15px;-ms-border-radius: 15px;-webkit-border-radius: 15px;-o-border-radius: 15px;border-radius: 15px;}
.hf .cf .right .active a{color:#fff;background:#2b78d9;-moz-border-radius: 15px;-ms-border-radius: 15px;-webkit-border-radius: 15px;-o-border-radius: 15px;border-radius: 15px;}
.hf .list{padding-top:42px;padding-bottom:30px;}
.hf .cf .op .right li{width:auto;margin-right:17px;font-size: 14px;}
.hf .cf .op .right{padding-bottom:28px;}
.hf .cf .op .right li.last{margin-right: 0;}
.hf .cf .op{margin-bottom:1px;}
.hf .list li,.design .case li{float:left;width:277px;height:267px;position: relative;margin-right: 30px;margin-bottom: 26px;background:#fff;}
.hf .list ul li{height: 300px !important;}
.hf .list .last{margin-right: 0;}
.hf .list .txt{padding-left:15px;padding-top:18px;}
.hf .list .p1{font-size: 16px;color:#444;line-height: 48px;background:url(../images/cgal_07.jpg) no-repeat left top;}
.hf .list .p2{font-size: 12px;color:#898989;line-height: 18px;}
.hf .list .con{position: absolute;left:0;top:0;width:100%;height:100%;text-align: center;background:url(../images/cgal_06.png);-moz-transition:0.5s;-ms-transition:0.5s;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;opacity: 0;}
.hf .list .bl .con{opacity: 1;}
.hf .list .tit,.design .case .con .li_tit{font-size: 21px;color:#fff;line-height: 36px;padding-top:80px;padding-bottom:12px;}
.hf .list .hy,.design .case .con .hy{font-size: 14px;color:#fff;line-height: 30px;padding-bottom:33px;}
.hf .list a,.design .case .con a{display: block;width:120px;font-size: 16px;margin:0 auto;line-height: 44px;background:#2b78d9;border-radius: 5px;color:#fff;}


.hf .list li .img, .design .case li .img{overflow: hidden;}

.hf .list li .con,.design .case li .con{ -webkit-transform: perspective(600px) rotateY(90deg);
    -moz-transform: perspective(600px) rotateY(90deg);
    -ms-transform: perspective(600px) rotateY(90deg);
    -o-transform: perspective(600px) rotateY(90deg);
    transform: perspective(600px) rotateY(90deg);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;}
.hf .list li.bl .con,.design .case li.bl .con{visibility: visible;
    -webkit-transform: perspective(600px) rotateY(0deg);
    -moz-transform: perspective(600px) rotateY(0deg);
    -ms-transform: perspective(600px) rotateY(0deg);
    -o-transform: perspective(600px) rotateY(0deg);
    transform: perspective(600px) rotateY(0deg);}
.hf .list li .con .tit,.hf .list li .hy,.hf .list li .con a,.design .case li .con .li_tit,.design .case li .con .hy,.design .case li a{position:relative;opacity: 0;left:50px;-moz-transition: 0.5s;-o-transition: 0.5s;-webkit-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5s;}
.hf .list .bl .con .tit,.hf .list .bl .hy,.hf .list .bl .con a,.design .case li.bl .li_tit,.design .case li.bl .hy,.design .case li.bl a{opacity: 1;left:0;;}
.banner_1 .banner_con{overflow: visible;}
.banner_1{overflow: visible;}
.banner_1 .right{width:600px;}
.banner_1 .img1{overflow: hidden;}
.banner_1 .right .p1 .img12{position: absolute;left:112px;bottom:0;display: block;overflow: hidden;}
.banner_1 .p1 .img12{width:122px;height:82px;}
.banner_1 .p1 .img2{position:absolute;bottom:0;left:8px;}
.banner_1 .p1 .img3{top:0;left:-5px;position:absolute;}
.banner_1 .p2{position: relative;}
.banner_1 .p2 .img2{position: absolute;top:0px;left:433px;}

.wrap{overflow: hidden;}
.smenu .wrap{overflow: initial;}

.hf .list li,.design .case li{-moz-animation:hfli 1.5s ease-out both;-ms-animation:hfli 1.5s ease-out both;-webkit-animation:hfli 1.5s ease-out both;-o-animation:hfli 1.5s ease-out both;animation:hfli 1.5s ease-out both;}
@keyframes hfli{
    0%{
        opacity: 0;
        -moz-transform:rotateY(90deg);
        -ms-transform:rotateY(90deg);
        -webkit-transform:rotateY(90deg);
        -o-transform:rotateY(90deg);
        transform:rotateY(90deg);
    }
    100%{
        opacity: 1;
        -moz-transform:rotateY(0deg);
        -ms-transform:rotateY(0deg);
        -webkit-transform:rotateY(0deg);
        -o-transform:rotateY(0deg);
        transform:rotateY(0deg);}
}
.hf .list .li2,.design .case .li2{-moz-animation-delay:0.2s;-ms-animation-delay:0.2s;-webkit-animation-delay:0.2s;-o-animation-delay:0.2s;animation-delay:0.2s;}
.hf .list .li3,.design .case .li3{-moz-animation-delay:0.4s;-ms-animation-delay:0.4s;-webkit-animation-delay:0.4s;-o-animation-delay:0.4s;animation-delay:0.4s;}
.hf .list .li4,.design .case .li4{-moz-animation-delay:0.6s;-ms-animation-delay:0.6s;-webkit-animation-delay:0.6s;-o-animation-delay:0.6s;animation-delay:0.6s;}
/*结束*/