@charset "UTF-8";
.cloth-display-wrap{
    position: relative;
    width: 100%;
    background-color: #272727;
}

.cloth-display-wrap .cloth-pattern{
    position: relative;
    width: 100%;
    margin: 0 auto;
    clear: both;
    overflow: hidden;
}

.cloth-pattern table {
    width: 100%;
}

.cloth-pattern td{
    position: relative;
    width: 20%;
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    box-sizing: border-box;
}

.cloth-pattern tr td:last-child{
    border-right: 0;
}

.cloth-pattern td .figure{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: all .4s ease-in-out;
    -ms-transform: scale(0);
    transform: scale(0);
}

.cloth-pattern .figure img{
    width: 100%;
    height: 100%;
}

.cloth-pattern td:hover .figure {
    visibility: visible;
    opacity: 1;
    -ms-transform: scale(1);
    transform: scale(1);
}

.cloth-pattern td .pattern{
    position: relative;
    width: 100%;
    opacity: 1;
    transition: all .4s ease-in-out;
    -ms-transform: scale(1);
    transform: scale(1);
}

.cloth-pattern td:hover .pattern {
    opacity: 0;
    -ms-transform: scale(0);
    transform: scale(0);
}

.cloth-pattern .icon img{
    position: relative;
    display: inline-block;
    margin: 0 auto 10px;
    width: 160px;
    height: 160px;
    /**background: url("../img/icon/cloth-pattern.png") no-repeat; 临时注释掉**/ 
}

.cloth-pattern .plaid{
    background-position: 0 0;
}

.cloth-pattern .striped{
    background-position: -160px 0;
}

.cloth-pattern .mesh{
    background-position: -320px 0;
}

.cloth-pattern .woolen{
    background-position: -480px 0;
}

.cloth-pattern .spherical-pattern{
    background-position: -640px 0;
}

.cloth-pattern .coarse-grain{
    background-position: 0 -160px;
}

.cloth-pattern .jacquard{
    background-position: -160px -160px;
}

.cloth-pattern .jersey{
    background-position: -320px -160px;
}

.cloth-pattern .flannel{
    background-position: -480px -160px;
}

.cloth-pattern .add{
    background-position: -640px -160px;
}

.cloth-pattern p{
    text-align: center;
    /*font-size: 18px;*/
    font-size: 16px;
    color: #656565;
}

.cloth-pattern .add{
    font-size: 48px;
    color: #c91277;
}