

.clearfix:after{content:".";display:block;height:0;visibility:hidden}
.clearfix{display:inline-block}
* html .clearfix{height:1%}
.clearfix{display:block}
.clearfix:after,.fix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{zoom:1}

.mr20{margin-right:20px}

.card-area{margin:0 auto;height:600px;width:100%;position:relative;}
.card-area .card-item{z-index:4;transition:all .5s cubic-bezier(.4,0,.2,1),z-index 0s .12s;position:relative;float:left;width:9%;height:100%;background-color:transparent;}
.card-area .card-item+.card-item{margin-left:-1px}
.card-area .card-item .card{display:block;transition:all .3s cubic-bezier(.4,0,.2,1),z-index 0s .12s;width:100%;height:100%;text-align:center;background:#fff;border-radius: 0;border:none}
.card-area .card-item .card .card-content{width:100%;line-height:2}
.card-area .card-item .card .card-content.content-first{transition:all .12s cubic-bezier(.4,0,.2,1) .18s;z-index:3;opacity:1;filter:alpha(opacity=100);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=(100))}
.card-area .card-item .card .card-content.content-second{transition:all .12s cubic-bezier(.4,0,.2,1) 0s;z-index:2;opacity:0;filter:alpha(opacity=0);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=(0));line-height:2}
.card-area .card-item .card .card-content.content-second li{float:left;width:50%}
.card-area .card-item .card .card-content,.card-area .card-item .card .card-title{position:absolute;left:0;right:0;bottom:0px;z-index:1}
.card-area .card-item .card .card-title{margin:0}
.card-area .card-item .card .card-content .other-info .other-desc{margin-top:2px;font-size:12px;color:#999}
.card-area .card-item.active{z-index:6;box-shadow:0 0 30px rgba(0,0,0,.2);width:46%;height:100%;border-right:1px #fff solid;border-left:1px #fff solid;}
.card-area .card-item.active .card{height: 103%;margin-top:-18px}
.card-area .card-item.active .card .card-title{height:100%;border:none;}
.card-area .card-item.active .card .card-title .content .short-info{position: absolute;bottom: 0;left: 0;right:0;}
.card-area .card-item.active .card .block-cover{opacity: .4;}
.business-section3 ul li .card {
    background-size: 105%;
    background-repeat: no-repeat;
}
.business-section3 ul li:nth-child(1) .card{
    background: url(../image/2.png);
}
.business-section3 ul li:nth-child(2) .card{
    background: url(../image/3.png);
}
.business-section3 ul li:nth-child(3) .card{
    background: url(../image/4.png);
}
.business-section3 ul li:nth-child(4) .card{
    background: url(../image/5.png);
}
.business-section3 ul li:nth-child(5) .card{
    background: url(../image/6.png);
}
.business-section3 ul li:nth-child(6) .card{
    background: url(../image/7.png);
}
.business-section3 ul li:nth-child(7) .card{
    background: url(../image/1.png);
}


.business-section3 .block-cover {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(22%,transparent),to(#000));
    background-image: linear-gradient(180deg,transparent 0%,rgba(10, 10, 10, 0.8));
    z-index: 0;
    -webkit-transition: all .4s;
    transition: all .4s;
}


.swipe h1 {
    font-size:36px;
    margin:15px;
    text-align:center;
    color:#666;
}
.swipe h2 {
    font-size:14px;
    font-weight:bold;
    color:#3c3c3c;
    margin:20px 10px 10px;
}

.swipe {
margin-bottom:20px;
overflow:hidden;
position:relative;
width:100%;
}
.swipe ul{
    overflow:hidden;
}
.swipe li div, .swipe div div div {
padding:80px 10px;
background:#1db1ff;
font-weight:bold;
color:#fff;
font-size:20px;
text-align:center;
}
.swipe li  img{
    max-width:100%;
}
.swipe li{
    margin:10px;
}
#slider2 li{
    width:230px;
}
#slider4{
    line-height:0;
    text-align:center;
}
#slider4 ul{
    -webkit-transition:left 800ms ease-in 0;
    -moz-transition:left 800ms ease-in 0;
    -o-transition:left 800ms ease-in 0;
    -ms-transition:left 800ms ease-in 0;
    transition:left 800ms ease-in 0;
}
#pagenavi a.active{
    color:red;
}
#copyright{
    text-align:center;
    font-size:14px;
    padding:30px 0;
}
#copyright a{
    font-size:14px;
}

#slider li{
    width:300px;
    float:left;
}
#slider li:first-child{
    width:100px;
    margin:10px 40px;
}
#slider li:last-child{
    width:500px;
    border:3px solid #111;
}
#slider li:nth-child(2){
    width:200px;
}
#slider li:nth-child(3){
    width:300px;
}
#slider li:nth-child(4){
    width:400px;
}
#slider1 li{
    width:240px;
}
small {
margin:0 10px 30px;
display:block;
font-size:12px;
}
#slider1 li a{
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}
#slider1 li a p{
    position: absolute;
    width: 100%;
    font-size: 24px;
    text-align: center;
    left: 50%;
    top: 50%;
    z-index: 3;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,0);
    transform: translate(-50%,-50%);
    padding-bottom: 3px;
    transition: border-bottom 0.3s ease-out;
    padding-bottom: 5px;
    -webkit-transition: width 1s linear;
}
.business-section4{
    display: none;
}

#slider1 li a .block-cover {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    background: rgba(0,0,0,.1)

}
