@media screen and (max-width:321px){
    button{
        font-size: 14px;
    }
    #recommend>p{
        color: #000;
        font-size: 16px;
        margin:  0 0 0.3rem 0.2rem;
    }
    #pro_name{
        font-size: 20px;
        padding-top: 0.1rem;
    }
}
@media screen and (min-width: 321px) and (max-width:400px){
    button{
        font-size: 16px;
    }
    #recommend>p{
        color: #000;
        font-size: 18px;
        margin: 0 0 0.3rem 0.2rem;
    }
    #pro_name{
        font-size: 20px;
        padding-top: 0.1rem;
    }
}
@media screen and (min-width:400px)and (max-width:600px){
    button{
        font-size: 17px;
    }
    #recommend>p{
        color: #000;
        font-size: 19px;
        margin: 0 0 0.3rem 0.2rem;
    }
    #pro_name{
        font-size: 20px;
        padding-top: 0.1rem;
    }
}
@media screen and (min-width:600px){
    button{
        font-size: 18px;
    }
    #recommend>p{
        color: #000;
        font-size: 22px;
        margin:0 0 0.3rem 0.2rem;
    }
    #pro_name{
        font-size: 30px;
        padding-top: 0.3rem;
    }
}
body{
    padding:0;
    margin: 0;
}
#pro_name{
    height:1rem;
    color: #000;
    text-align: center;
    box-shadow:
            0 -0.1rem  0.5rem #efefef inset;
}
#pro_name>p{
    height:0.6rem;
    /*padding-bottom:0.1rem;*/
}
#s12{
    text-align: center;
    /*height:4.45rem;
    padding-top: 0.35rem;*/
}
#pro_content{
    box-shadow: 0 0.1rem 0.5rem  #efefef inset,
    0 -0.1rem  0.5rem #efefef inset;
    padding: 0.6rem 0 0.4rem 0;
}
#pro_content>.pro_btn>button{
    width:3.35rem;
    height:0.84rem;
    color: #fff;
    background-color:#646464 ;
    border: 0;
    position: relative;
    outline:0;
}
#pro_content>.pro_btn>button:first-child{
    margin-right: 0.15rem;
}
.pro_btn .tri{
    position: absolute;
    top:0.84rem;
    left:1.55rem;
    display: none;
}
#pro_content>.pro_btn{
    text-align: center;
}
#pro_tb,.par{
    border: 1px solid #bfbfbf;
    width:7rem;
    margin: 0.4rem auto;
    font-size: 14px;
    border-collapse:collapse;
}
#pro_tb tr:not(:last-child),.par tr:not(:last-child){
    border-bottom: 1px solid #bfbfbf;
}
.par tr td:first-child{
    border-right: 1px solid #bfbfbf;
    width:2rem;
    text-align: center;
}
tr:nth-child(odd){
    background-color:#ededed;
}
#pro_content tr td{
    height:1.2rem;
    padding:0 0.2rem;
    width:7rem;
}
#turn{
    padding:0 0.2rem;
    font-size: 14px;
    margin-top: 0.3rem;
}
#turn:after{
    content:'';
    display: block;
    clear:both;
}
#turn .pro_up{
    float: left;
    color:#adadad;
}
#turn .pro_down{
    float: right;
    color:#adadad;
}
#recommend{
    margin-top: 0.4rem;
}
#pro_content .pro_btn .tb_active{
    background-color: #379fe1;!important;
}
#pro_content  .tb_check{
    display: block;
}
/*#pro_content table{
   display: none; 
}*/
