.btns_list{ width: 100%; // margin-top: 30px; display: flex; align-content: center; .more{ font-size: 28px; width: 143px; display: flex; align-items: center; color: $color_font_two; padding-left: 20px; position: relative; .more_list{ position: absolute; background-color: #fff; width: 226px; box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.06); border-radius: 10px; padding: 0 20px; box-sizing: border-box; z-index:999; &::before{ z-index: 1; position: absolute; bottom: -7px; left: 50px; width: 15px; height: 15px; content: " "; transform: rotate(45deg); background: #fff; box-sizing: border-box; box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1); } .more_item{ font-size: 28px; height: 70px; line-height: 70px; text-align: center; &:nth-last-child(n+2) { border-bottom: 1PX solid #F0F0F0; } } } .more_bg{ position:fixed; width: 100vw; height: 100vh; top: 0; left: 0; } } .scroll{ white-space: nowrap; width: 100%; } .list_scroll{ white-space: nowrap; width: 100%; text-align: right; } .btns_item{ padding: 0 15px; width: 130px; border: 2px solid #dddddd; border-radius: 38px; text-align: center; line-height: 60px; font-size: $font_size; color: $color_font_three; display:inline-block; &:nth-child(n+2) { margin-left: 32px; } &:nth-last-child(1) { border: 2px solid $color_main; color: $color_main; } } .end_btn{ border: 2px solid $color_main; color: $color_main; } }