.main{
    position: relative;
    .search{
        display: flex;
        justify-content: space-between;
        padding: 20px;
        padding-bottom: 50px;
    }
    .up_search{
        color: $color_main;
        font-size: $font_size;
        position: absolute;
        right: 20px;
    }
    .hot {
        padding: 0 20px;
        .hot_header {
            width:100%;
            display: flex;
            justify-content: space-between;
            font-size: $font_size_medium;
            .hot_header_title {
                font-size: $font_size;
                color: $color_font_one;
                font-weight: 700;
            }
           
        }
        
        .list{
            display: flex;
            font-size:  $font_size_medium;
            flex-wrap: wrap;
            padding: 20px 0;
            .item{
                margin-right: 20px;
                margin-bottom: 20px;
                padding: 10px 20px;
                background-color: #F0F0F0;
                color: $color_font_three;
                border-radius: 50px;
            }
        }
    }
    .history {
        padding: 0 20px;
        .history_header {
            width:100%;
            display: flex;
            justify-content: space-between;
            font-size: $font_size_medium;
            .history_header_title {
                font-size: $font_size;
                color: $color_font_one;
                font-weight: 700;
            }
            .miconfont{
                font-size: 30px;
                color: $color_font_three;
            }
        }
        .list{
            display: flex;
            font-size:  $font_size_medium;
            flex-wrap: wrap;
            padding: 20px 0;
            .item{
                margin-right: 20px;
                margin-bottom: 20px;
                padding: 10px 20px;
                background-color: #F0F0F0;
                color: $color_font_three;
                border-radius: 50px;
            }
        }
    }
}