ACFのチェックボックスで、CLASSを付与してアイコンを表示

<div class="allergies_box">
	<div class="al_heading">ALLERGEN</div>
	<div class="allergenicon_box">
		<!-- 乳　-->
		<figure class="allergenicon 
			<?php
  				$colors = get_field('allergen_addclass');
  				if( $colors && in_array('addnyu', $colors)){
    				echo 'add_iconclass';
  				}
			?>
		"> 
			<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/svg/allergen_milk_icon01.svg" alt="milk icon" />
			<figcaption>MILK</figcaption>
		</figure>
		<!-- 卵　-->
		<figure class="allergenicon 
			<?php
  				$colors = get_field('allergen_addclass');
  				if( $colors && in_array('addtamago', $colors)){
    				echo 'add_iconclass';
  				}
			?>
		"> 
			<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/svg/allergen_egg_icon01.svg" alt="egg icon" />
			<figcaption>EGG</figcaption>
		</figure>
		<!-- 小麦　-->
		<figure class="allergenicon 
			<?php
  				$colors = get_field('allergen_addclass');
  				if( $colors && in_array('addkomugi', $colors)){
    				echo 'add_iconclass';
  				}
			?>
		"> 
			<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/svg/allergen_komugi_icon01.svg" alt="komugi icon" />
			<figcaption>WHEAT</figcaption>
		</figure>
		<!-- 落花生　-->
		<figure class="allergenicon 
			<?php
  				$colors = get_field('allergen_addclass');
  				if( $colors && in_array('addrakkasei', $colors)){
    				echo 'add_iconclass';
  				}
			?>
		"> 
			<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/svg/allergen_nats_icon01.svg" alt="nats icon" />
			<figcaption>PEATUT</figcaption>
		</figure>
		<!-- えび　-->
		<figure class="allergenicon 
			<?php
  				$colors = get_field('allergen_addclass');
  				if( $colors && in_array('addebi', $colors)){
    				echo 'add_iconclass';
  				}
			?>
		"> 
			<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/svg/allergen_ebi_icon01.svg" alt="ebi icon" />
			<figcaption>SHRIMP</figcaption>
		</figure>
		<!-- かに　-->
		<figure class="allergenicon 
			<?php
  				$colors = get_field('allergen_addclass');
  				if( $colors && in_array('addkani', $colors)){
    				echo 'add_iconclass';
  				}
			?>
		"> 
			<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/svg/allergen_kani_icon01.svg" alt="kani icon" />
			<figcaption>CRAB</figcaption>
		</figure>
		<!-- そば　-->
		<figure class="allergenicon 
			<?php
  				$colors = get_field('allergen_addclass');
  				if( $colors && in_array('addosoba', $colors)){
    				echo 'add_iconclass';
  				}
			?>
		"> 
			<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/svg/allergen_soba_icon01.svg" alt="soba icon" />
			<figcaption>SOBA</figcaption>
		</figure>
	</div>
</div>												

.allergies_box{
	width: 100%;
	padding-right:10%;
	padding-left:10%;
	background:none;
}

.allergies_box .al_heading{
	margin: auto;
	margin-bottom: 1.5em;
	border-bottom: solid 1px #272727;
	font-size:1.7em;
	font-weight:500;
	letter-spacing:0.1em;
}

.allergenicon_box{
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	width: 100%;
}

.allergenicon{
	width: 100px;
	height: auto;
	text-align: center;
	color: #000;
	opacity: 0.1;
	font-weight: 400;
	padding: 0.5em;
}

.allergenicon.add_iconclass {
	opacity: 1;
	background: #fff;
	border-radius: 10px;
}