how customise Woocommerce style of custom theme

You can add your own css based on the classes created by WooCommerce.
If you are working in a (child)theme, you can add a stylesheet by adding this code in functions.php:

/**
 * Enqueue your own stylesheet
 */
function custom_wp_enqueue_woocommerce_style(){
    wp_register_style( 'mytheme-woocommerce', get_template_directory_uri() . '/css/woocommerce.css' );

    if ( class_exists( 'woocommerce' ) ) {
        wp_enqueue_style( 'mytheme-woocommerce' );
    }
}
add_action( 'wp_enqueue_scripts', 'custom_wp_enqueue_woocommerce_style' );

Create a ‘woocommerce.css’ file in the folder /css/ in your (child)theme and write your css in that file.