.equipment {
  ul.equip {
    > li {
      float:left; width:calc(33.3% - 20px); margin-right:30px; margin-bottom:50px; border-top:1px solid #707070;padding-top:20px; height:473px;
      &:nth-child(3n) {
        margin-right:0;
      }
      .img-box {
        width: 100%; height:170px; position: relative; overflow: hidden; text-align:center; margin:0 auto;background:#fff;margin-bottom:20px;
        img {
          max-width: 100%; max-height: 100%;position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform: translate(-50%,-50%);padding:7px;
        }
      }
      .tit-wrap {
        text-align: center; position: relative; background: #f7f7f7; padding: 15px 5px;
        p.tit {
          color:#333; font-size:1.5rem; font-weight:600; @include ellipsis; width:100%; position:relative;          
        }
        .hover-area {
          display:none;position: absolute; background:rgba(61,91,193,.8); width: 100%; font-size: 1.2rem; padding: 10px; z-index: 1; color: #fff; border-radius: 5px; left:50%; transform: translateX(-50%); top:100%;
          &:after {
            content:'';
            position:absolute; top:-7px;left:50%; transform: translateX(-50%); width: 0px; height: 0px; border-bottom: 7px solid rgba(61,91,193,.8); border-left: 7px solid transparent; border-right: 7px solid transparent;
          }
        }
        &:hover {
          .hover-area {
            display:block;
          }
        }
        p.eng-name {
          color:#666; @include ellipsis; width:100%;
        }
      }
      ul {
        padding-top:20px;
        > li {
          margin-bottom:10px;
          .label {
            width:78px; text-align: center; background:#ebedf4; color:#7a85ab; border-radius:5px; padding:8px; font-size:1.1rem; font-weight:600; display:inline-block; margin-right:5px;                  
            }
        }
      }
      .btn-wrap {       
        margin-top:25px;
        .btn-center {
          width:100%;
          button {height:37px; font-size:1.2rem; width:100%}
        }
      }
    }
  }
}

@media(max-width:1024px) {
  .equipment {
    ul.equip {
      > li {
        width:calc(50% - 5px); margin-right:10px;
        &:nth-child(3n) {
          margin-right:10px
        }
        &:nth-child(2n) {
          margin-right:0;
        }       
        ul {
          > li {
            margin-bottom:10px; font-size:1.2rem
          }
        }
      }
    }
  }
}

@media(max-width:650px) {
  .equipment {
    ul.equip {
      > li {
        width:100%; margin-right:0px; height:auto;
        &:nth-child(3n) {
          margin-right:0px
        }
        &:nth-child(2n) {
          margin-right:0;
        }       
      }
    }
  }
}