body, html { background-color: #f0f0f0; } .score-detail-c { .eps { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cover-bg { display: none; width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #000; opacity: 0.4; } &.active { .cover-bg { display: block; } } .tab { height: 86px; border-bottom: solid 1px #e0e0e0; padding: 18px 0; background-color: #fff; position: relative; z-index: 1; .tab-item { width: 250px; height: 50px; line-height: 50px; float: left; text-align: center; font-size: 30px; color: #1a1a1a; border-right: solid 1px #e0e0e0; .down { display: inline-block; } .up { display: none; } .iconfont { font-size: 12px; } &:last-child { border-right: 0; } .list { display: none; width: 750px; text-align: left; position: absolute; padding: 0 30px; background-color: #fff; top: 86px; left: 0; li { line-height: 90px; border-bottom: solid 1px #e0e0e0; color: #b0b0b0; position: relative; } li.chosen { color: #000; } .tick { width: 30px; height: 22px; background: url("img/home/family/chosen.png"); background-size: 100%; position: absolute; top: 34px; right: 30px; display: none; } li:last-child { border-bottom: 0; } } li.chosen { .tick { display: block; } } &.active { .list { display: block; } .down { display: none; } .up { display: inline-block; } } } } .result { padding: 0 34px; background-color: #fff; .result-item { height: 125px; border-bottom: solid 1px #e0e0e0; padding: 20px 0 10px; .top { font-size: 28px; float: left; line-height: 45px; width: 100%; .pic { width: 40px; height: 40px; border-radius: 5px; overflow: hidden; float: left; margin-right: 10px; background-size: 100% 100%; } .pic.coffee { background-image: url("img/home/family/ico-coffee.png"); } .pic.green { background-image: url("img/home/family/ico-green.png"); } .pic.little { background-image: url("img/home/family/ico-little.png"); } .pic.mars { background-image: url("img/home/family/ico-mars.png"); } .pic.yohobuy { background-image: url("img/home/family/ico-yohobuy.png"); } .pic.store { background-image: url("img/home/family/ico-yohobuy.png"); } .pic.yohonow { background-image: url("img/home/family/ico-yohonow.png"); } .title { float: left; width: 500px; } .num { float: right; color: #b0b0b0; } .num.minus { color: #43b98a; } } .bottom { width: 100%; line-height: 50px; float: left; color: #b0b0b0; font-size: 24px; } &:last-child { border-bottom: 0; } } } }