.main{
    min-height: 100%;
    background-color: $color_bg_one;
    padding-bottom: 100px;
    .product_header{
        padding: 0 20px;
        display: flex;
        align-items: center;
        height: 163.57px;
        background-color: #fff;
        .title{
            flex:1;
            .name{
                font-size: 32px;
                font-weight: 700;
                color: $color_font_one;
                @include common_ellipsis(1);
            }
            .des{
                font-size: $font_size_medium;
                color: $color_font_three;
                @include common_ellipsis(1);
                margin-top: 20px;
            }
        }
        .share, .collect {
            width: 76px;
            font-size: $font_size_min;
            text-align: center;
            color: $color_font_three;
            position: relative;
            .text{
                margin-top: 10px;
                font-size: $font_size_medium;
            }
        }
        .shareBtn {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
        }
        .miconfont{
            font-size: 45px;
        }
        .collected{
            color: #FFC300;
        }
    }
    .des_data{
        background-color: #fff;
        padding: 20px;
        margin-top: 16px;
        .title{
            font-size: $font_size;
            font-weight: 700;
            color: $color_font_one;
            margin-bottom: 20px;
        }
        .con{
            display: grid;
            grid-template-columns: 260px auto;
            font-size: $font_size_medium;
            color: $color_font_three;
            .des_text{
                display: flex;
                margin-bottom: 16px;
                text{
                    flex:1;
                    @include common_ellipsis(1);
                }
            }
        }
    }
    .product_color{
        background-color: #fff;
        margin-top: 16px;
        padding: 30px 20px 0;
        color: $color_font_one;
        font-size: $font_size_medium;
        .title{
            
        }
        .list{
            margin-top: 30px;
            display: grid;
            grid-template-columns: 210px 210px 210px ;
            justify-content: space-between;
            .item {
                width:210px;
                margin-bottom: 20px;
                .item_color{
                    width:210px;
                    height: 210px;
                    border-radius: 20px;
                    image{
                        width: 100%;
                        height: 100%;
                        border-radius: 20px;
                    }
                }
                .item_name{
                    text-align: center;
                    margin-top: 10px;
                }
            }
        }
    }
    .product_detail{
        // padding: 20px;
        background-color: #fff;
        margin-top: 16px;
    }
    .product_buy{
        display: flex;
        justify-content: space-between;
        align-items: center;
        height:95px;
        width: 100vw;
        position: fixed;
        bottom: 0;
        left: 0;
        background-color: #fff;
        padding-bottom: constant(safe-area-inset-bottom);
        padding-bottom: env(safe-area-inset-bottom);
        .buy_cart{
            width: 150px;
            color: $color_font_three;
            text-align: center;
            .text{
                font-size: $font_size_min;
            }
            .miconfont{
                font-size: 36px;
            }
        }
        .buy_btn{
            display: flex;
            justify-content: center;
            align-items: center;
            width: 297px;
            height: 100%;
            background-color: $color_main;
            font-size: $font_size;
            color: #fff;
            position: relative;
            .phoneBtn{
                background-color: rgba(0, 0, 0, 0);
                position: absolute;
                width: 100%;
                height: 100%;
            }
        }
    }
}