hoverで拡大する写真・CSSのみ・使い方

<ul class="spot_list">
		<li class="green_li f_box"><a href="#spot03">
			<figure><img src="img/spot03_a.jpg" alt="河口湖（富士山）"/></figure></a>
			<p class="spot_name"><span class="sp01">山梨県</span><span class="sp02">河口湖（富士山）</span></p>
		</li>
                <li></li>
</ul>

.spot_list>li {
    width: 22%;
    margin: 0 10px 20px;
    min-width: 220px;
    position: relative;
}
.spot_list figure {
    overflow: hidden;
}
.spot_list figure img {
    display: block;
    transition-duration: 0.3s;
}
.spot_list figure img:hover {
    transform: scale(1.1);
    transition-duration: 0.3s;
}