Image Radio for Contact form 7

Image-Radio-for-Contact form-7.css

/*
	Image Radio for Contact form 7
=============================*/
.pf4_form_image_fields{
	display:flex;
	flex-wrap:wrap;
	margin-left: -20px;
	margin-right: -20px;
}
.pf4_form_image_field{
	width:33.33%;
	box-sizing:border-box;
	padding: 20px;
}
.pf4_form_image_field p{
	margin:0;
}
.pf4_form_image_field_in{
	position:relative;
}
.pf4_form_image_field_in input{
    margin:0;
    padding:0;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}
.pf4_form_image_field_in span.wpcf7-list-item{
	margin:0;
	display:block;
}
.pf4_form_image_field_in label{
	font-size:0;
	display:block;
	height:194px;
	width:100%;
	background-position:center;
	border: solid 6px #fff;
	box-sizing: border-box;
	background-color: #FFFFFF;
	cursor: pointer;
	background-repeat: no-repeat;
}
.pf4_form_image_field:hover .pf4_form_image_field_in label{
	border-color:#a9a9a9;
}
.pf4_form_image_field.checked .pf4_form_image_field_in label{
    border-color:#f48900;
}


.pf4_form_image_field_in .title_head{
	position:absolute;
	top: -8px;
	left: -8px;
	background-color: #99c1eb;
	font-size: 11px;
	font-weight: normal;
	line-height: 1.3;
	letter-spacing: 0.8px;
	text-align: center;
	color: #ffffff;
	text-transform:uppercase;
	padding: 6px 12px;
}

Image-Radio-for-Contact form-7.html

<!--Use this code in content form 7 editor-->

<h3>Artificial Intelligence</h3>

<div class="pf4_form_image_fields pf4_form_image_field__ai" data-uid=".pf4_form_image_field__ai">
    <div class="pf4_form_image_field" data-bg="/wp-content/uploads/2018/08/beagle_logo.jpg">
        <div class="pf4_form_image_field_in">
            [radio artificial_intelligence use_label_element  "Beagle"]
            <div class="title_head">Beagle</div>
        </div>
    </div>
    <div class="pf4_form_image_field" data-bg="/wp-content/uploads/2018/08/IBM_Watson_logo.jpg">
        <div class="pf4_form_image_field_in">
            [radio artificial_intelligence use_label_element  "IBM Watson"]
            <div class="title_head">IBM Watson</div>
        </div>
    </div>
    <div class="pf4_form_image_field" data-bg="/wp-content/uploads/2018/08/trensant_logo.jpg">
        <div class="pf4_form_image_field_in">
            [radio artificial_intelligence use_label_element  "Trensant"]
            <div class="title_head">Trensant</div>
        </div>
    </div>
</div>

[submit "Submit"]

Image-Radio-for-Contact form-7.js

/*
	Contact form 7 image redio button
-------------------------------*/
jQuery(document).ready(function($) {
	
	$( ".pf4_form_image_field" ).each(function( index ) {
		var get_bg_img_url = $(this).attr('data-bg');
		$( this ).children().children().children().children().children().css( "background-image", "url("+get_bg_img_url+")" );
	});
	
	$( "body" ).on( "click", ".pf4_form_image_fields label", function() {
		
		var parent_div = $( this ).parent().parent().parent().parent().parent();
		var items_div = parent_div.parent().attr('data-uid') + " .pf4_form_image_field";
		
		$(items_div).removeClass('checked');
  		parent_div.addClass('checked');
	});
});

Hi! This works really well for me, except I'm not sure in which file to place the code in the form-7.js file. Could you help me out? Thanks!