/* CSS Document */ .shop-class{ max-width: 1200px; margin: 0 auto;} .shop-class li{ margin-right: 10px; display: inline-block;} .shop-class a{ color:#000; padding: 3px 10px; border-radius: 5px; display: block;} .shop-class a.curr{ color:#fff; background-color: #065db3;} .shop-list{ max-width: 1200px; margin: 35px auto;} .shop-list li{ padding: 0 15px; margin-bottom: 25px;} .shop-list li a{ display: block; position: relative;} .shop-list .pic { display:block; width:100%; height:245px; display:table-cell; vertical-align:middle;} .shop-list img{ width: 100%; height: 110px; display: block;} .shop-list p{ font-size: 16px; line-height: 45px; color:#065db3; text-align: center; background-color: transparent; margin: 0; transition:all .3s;} .shop-list div{width:100%; height:230px; color:#fff; background-color: rgba(6,93,179,.49); padding:25px 35px; opacity: 0; transition:opacity .3s; position: absolute; top:0; left: 0;} .shop-list li p:before{content:""; width: 100%; height:1px; background-color: #065db3; display: block; transition:height .3s; position: absolute; left: 0; top:246px; z-index: -1} .shop-list li:hover p{ color:#fff;} .shop-list li:hover p:before{ height:45px;} .shop-list li:hover div{ opacity: 1;} .shop-list li:hover div:before{ content:""; width: 180px; height: 190px; border:#fff 1px solid; display: block; position: absolute; top:19px; left: 19px; }