.detail { padding-top: 80px; width: 100%; background: #f8f8f8; } .detail .detail-router { line-height: 50px; text-align: left; margin: 0 auto; color: #333; width: 1180px; height: 50px; background: white; } .detail .detail-router .detail-router-list { list-style: none; margin: 0; padding: 0; font-size: 14px; color: #888888; font-weight: bold; display: flex; } .detail .detail-router .detail-router-list .detail-router-item { margin: 0 10px; } .detail .detail-router .detail-router-list .detail-router-item:hover { cursor: pointer; color: #207cfb; text-decoration: underline; } .detail .goods-show { background: #cfddd6; height: 300px; padding-top: 35px; } .detail .goods-show .goods-show-info { width: 1180px; margin: 0 auto; display: flex; justify-content: space-between; } .detail .goods-show .goods-show-info .goods-show-body { display: flex; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-img { perspective: 300px; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-img img { transform-origin: left center; transform: rotateY(10deg) rotateX(5deg); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); border-radius: 20px; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text { padding-top: 20px; padding-left: 30px; margin-left: 50px; width: 600px; text-align: left; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-title { line-height: 35px; font-size: 30px; font-weight: bold; color: #777; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages { margin-top: 15px; color: #888; display: flex; justify-content: left; flex-wrap: wrap; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages .goods-show-advantage-not-icon { width: 85px; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages .goods-show-advantage-icon { width: 110px; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages .goods-show-advantage-icon .goods-show-tag { padding-left: 0px; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages .goods-show-advantage { padding: 5px; margin-bottom: 5px; margin-right: 10px; display: flex; align-items: center; border-radius: 5px; border: 1px solid #b0c0bf; background-color: #c0d0ca; user-select: none; text-align: center; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages .goods-show-advantage img { width: 25px; height: 25px; border-radius: 50%; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages .goods-show-advantage .goods-show-tag { width: 100%; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages .goods-show-advantage .goods-show-tag .goods-show-name { font-size: 16px; line-height: 20px; color: #666666; font-weight: bold; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-advantages .goods-show-advantage .goods-show-tag .goods-show-desc { font-size: 12px; } .detail .goods-show .goods-show-info .goods-show-body .goods-show-text .goods-show-des { margin-top: 30px; color: #aaa; height: 140px; text-indent: 2em; text-overflow: ellipsis; overflow: hidden; } .detail .goods-show .goods-show-info .goods-show-count { display: flex; width: 150px; } .detail .goods-show .goods-show-info .goods-show-count .goods-show-price-text { font-size: 12px; width: 150px; line-height: 34px; text-align: center; border-radius: 15px; height: 34px; background: rgba(255, 255, 255, 0.3); } .detail .goods-show .goods-show-info .goods-show-count .goods-show-price-text span:nth-child(1) { color: #999; } .detail .goods-info { width: 1180px; display: flex; padding-bottom: 40px; justify-content: space-between; margin: 20px auto 0 auto; } .detail .goods-info .info-left { width: 760px; } .detail .goods-info .info-left .info-left-select-btns { padding: 15px; width: 730px; border: #dddddd solid; border-width: 1px 1px 0 1px; border-radius: 5px 5px 0 0; display: flex; justify-content: left; flex-wrap: wrap; background: white; } .detail .goods-info .info-left .info-left-select-btns .info-left-select-btn { margin: 0 10px 20px 0; height: 35px; line-height: 35px; text-align: center; border-radius: 15px; border: #8b8b8b 1px solid; padding: 5px 15px; color: #8b8b8b; cursor: pointer; transition: background-color 0.2s ease; user-select: none; } .detail .goods-info .info-left .info-left-select-btns .info-left-select-btn:hover { background: #888888; color: white; } .detail .goods-info .info-left .info-left-select-btns .info-left-select-btn:active { background: #dddddd; color: #888888; } .detail .goods-info .info-left .info-left-select-param { padding: 15px; border-radius: 0 0 5px 5px; border: #dddddd 1px solid; background: white; margin-bottom: 20px; width: 730px; display: flex; justify-content: space-between; flex-wrap: wrap; } .detail .goods-info .info-left .info-left-select-param .info-left-select-param-btn { user-select: none; width: 300px; height: 35px; line-height: 35px; padding: 5px 15px; cursor: pointer; border: #8b8b8b 1px solid; border-radius: 15px; transition: background-color 0.2s ease; display: flex; font-size: 12px; margin-bottom: 10px; } .detail .goods-info .info-left .info-left-select-param .info-left-select-param-btn .ilspb-selector { line-height: 35px; width: 20px; height: 20px; background: #888888; border-radius: 50%; margin: 7px 0; display: flex; align-items: center; justify-content: center; } .detail .goods-info .info-left .info-left-select-param .info-left-select-param-btn span { margin-left: 10px; } .detail .goods-info .info-left .info-left-select-param .info-left-select-param-btn .ilspb-tag { margin-top: -15px; margin-left: 0; padding: 0 10px; background: rgba(248, 217, 209, 1); font-size: 12px; height: 20px; line-height: 20px; border-radius: 5px; position: absolute; color: rgba(223, 30, 28); border: rgba(223, 30, 28) 1px solid; } .detail .goods-info .info-left .info-left-select-param .info-left-select-param-btn:hover .ilspb-tag { background: rgba(248, 217, 209, 0.3); } .detail .goods-info .info-left .info-left-select-param .info-left-select-param-btn .it { margin: -15px 0 0 180px; } .detail .