@charset "utf-8";

.mod-productDrag .layout {overflow: hidden; width: 1200px; height: 278px; position: relative; margin: 0 auto;}
.mod-productDrag .drag-list { min-width: 1200px; position: relative; box-sizing: content-box; margin-top: 5px; }
.mod-productDrag .drag-items { box-sizing: border-box; background: #FFF; float: left; margin-bottom: 10px; margin-left: 10px; position: relative; -webkit-transition: all .2s linear 0s; -moz-transition: all .2s linear 0s; -ms-transition: all .2s linear 0s; -o-transition: all .2s linear 0s; transition: all .2s linear 0s; width: 240px; height: 268px; z-index: 1; border-left: 1px solid #eaeaea; border-top: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; margin: 0; }
.mod-productDrag .thumb { display: inline-block; width: 100%; height: 100%; text-align: center; }
.mod-productDrag a:hover { text-decoration: none; }
.mod-productDrag .drag-img { height: 120px; width: 120px; margin: 36px auto 0; position: relative; }
.mod-productDrag .drag-img img { height: 120px; width: 120px; }
.mod-productDrag .drag-title { font-size: 17px; font-weight: 400; margin: 14px 20px 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #3a3a3a; line-height: 24px; }
.mod-productDrag .drag-desc { font-size: 12px; font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #a4a4a4; margin: 0 20px 0; line-height: 18px; }
.mod-productDrag .drag-price { font-size: 14px; font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 3px 20px 0; line-height: 40px; }
.mod-productDrag .drag-img .drag-tip { position: absolute; width: 48px; height: 48px; bottom: -8px; right: -8px; }
.mod-productDrag .drag-btn { background: #CCC; background: rgba(204, 204, 204, 0.9); cursor: pointer; height: 75px; left: 0; margin-top: -38px; width: 22px; position: absolute; top: 50%; z-index: 3; }
/*.mod-productDrag .drag-btn.disabled { background: #f0f0f0 !important; cursor: not-allowed; }*/
.mod-productDrag .drag-btn.swiper-button-disabled { background: #f0f0f0 !important; cursor: not-allowed;pointer-events: auto;opacity: 1;filter:alpha(opacity=100);}
.mod-productDrag .drag-btn:hover { background: #999; background: rgba(153, 153, 153, 0.9); }
.mod-productDrag .drag-btn.btn-next { left: auto; margin-top: -37.5px; right: 0; top: 50%; }
.mod-productDrag .drag-btn span { display: block; margin: 28px auto; height: 16px; width: 11px; background: url('../img/icon-common.png'); }
.mod-productDrag .drag-btn.btn-prev span { background-position: -101px -1px; }
.mod-productDrag .drag-btn.btn-next span { background-position: -112px -1px; }
.mod-productDrag .drag-items.current { -webkit-box-shadow: 0 10px 15px rgba(0, 0, 0, 0.07); -moz-box-shadow: 0 10px 15px rgba(0, 0, 0, 0.07); box-shadow: 0 10px 15px rgba(0, 0, 0, 0.07); -webkit-transform: translate3d(0px, -2px, 0px); -moz-transform: translate3d(0px, -2px, 0px); -ms-transform: translate3d(0px, -2px, 0px); -o-transform: translate3d(0px, -2px, 0px); transform: translate3d(0px, -2px, 0px); z-index: 2 }
.mod-productDrag .coupon { padding: 5px 14px; font-size:14px;border-radius: 2px;background: #fff; margin-left: 7px; overflow: hidden; text-align: center; box-sizing: content-box; cursor: pointer;line-height: 1.2;}
.mod-productDrag .coupon:hover {color: #fff}
.mod-productDrag .drag-items:last-child {border-right: 1px solid #eaeaea;}


.mod-productDrag .drag-items:before{content:"";width:0;height:4px;display:block;background:#900;position:absolute;top:0;right:auto;bottom:auto;left:0;z-index:10;transition:width .2s ease-out 0s}
.mod-productDrag .drag-items.active:before{width:100%;padding-left:2px;}