@charset "utf-8";
/*------------ download ------------*/
.download-list .item .box{
}
.download-list .item .name{
}
.download-list .item .box:hover .name{
}
.download-list .item .text .download span{
    font-size: 0;
}
.download-list .item .text .download span:before{
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: #d7ccb7;
    color: #fff;
    font-size: 21px;
    text-align: center;
    border-radius: 50%;
    font-family: 'icon-font-13' !important;
    content: "\e900";
    display: block;
}
.download-list .item .box:hover .text .download span:before{
    background: #DB0079;
    -webkit-animation-duration: 0.6s;
    animation-duration: 0.6s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flipInY;
    animation-name: flipInY;
}
.download-list.type1 .item .text .download span{
    bottom: 5px;
}
.download-list .box:hover .text .download span{
    background-position: bottom;
}
@-webkit-keyframes flipInY{
    from{
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }
    40%{
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    60%{
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1;
    }
    80%{
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    }
    to{
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}
@keyframes flipInY{
    from{
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }
    40%{
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
    60%{
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1;
    }
    80%{
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    }
    to{
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}
/*------------ rwd ------------*/
@media screen and (max-width:767px){
    .download-list{
        margin: 0;
    }
    .download-list .item{
        padding: 0 0 25px;
        border-bottom: 1px solid #DDDDDD;
        margin-bottom: 25px;
    }
    .download-list.type1 .item .text .download span{
        font-size: 0;
    }
    .download-list .item .text .download span:before{
        margin-top: 0px;
    }
}
@media screen and (max-width:480px){
    .download-list .pic{
        max-width: 110px;
    }
    .download-list .item .text{
        max-width: calc(100% - 125px);
        padding: 10px 15px;
    }
}