/*左边图片*/
.leftLogo{
    margin-top: 30px;
}
.leftLogo a img{
    width: 100%;
}

/*welcome渐变效果*/
#Welcomediag{
    color: #fff;
    background-color: rgba(0,0,0,0.2);
    -webkit-animation-name: anim;
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: alternate;
    -webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes anim {

    100% {
        background:rgba(0,0,0,1);
    }
}

/*中间部分*/
.middle{
    position: relative;
    overflow: hidden;
    padding: 0;
}
.middle img{
    width: 100%;
}
.middle ul{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.middle ul li{
    height: 100%;
    padding-top: 15%;
}
.middle ul li div{
    width: 70%;
    margin: 0 auto;
    text-align: center;
    color: #fff;
}
#Welcomediag h2{
    font-size: 18px;
}

/*右侧图标*/
.rightLogo{
    /*padding: 20px 25px 0px 25px;*/
    margin-top: 25px;
}
.box{
    position: relative;
    width:100%;
}
.box-img img{
    width: 100%;
}
.box .box-img{
    transform: rotateY(0);
    transition: all 0.50s ease-in-out 0s;
}
.box:hover .box-img{
    transform: rotateY(-90deg);
}
.box .box-img img{
    width: 100%;
    height: auto
}
.box .box-content{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;

    text-align: center;
    padding-top:30%;
    background: rgba(0,0,0,0.7);
    transform: rotateY(90deg);
    transition: all 0.50s ease-in-out 0s;

}
.box:hover .box-content{
    transform: rotateY(0);
}
.box .title{
    font-size: 0.9em;
    color: #fff;
    text-align:center
}