Feature009

---
import DemoLayout from '@/layouts/DemoLayout.astro';

import { Stack, Container, Frame, Grid, Media, HTML } from 'lism-css/astro';
import './_style.css';
---

<DemoLayout title='Feature009'>
	<Container isWrapper='m' py='50' hasGutter>
		<Stack g='50'>
			<HTML.h lv='2' class='u-trim' fz='2xl' fw='bold' ta='center'>私たちの取り組み</HTML.h>
			<Grid layout='fluidCols' cols='300px' gtr='auto auto auto' g='40'>
				<Grid gtr='subgrid' gr='span 2' g='30'>
					<Frame tag='figure' ar='og' bdrs='10'>
						<Media src='https://cdn.lism-css.com/img/random-2510?r=1' alt='' width='960' height='640' />
					</Frame>
					<Stack g='20'>
						<HTML.p class='u-trim' fz='m' fw='bold'>自然と共に、生きる</HTML.p>
						<HTML.p class='u-trim' fz='s' o='-10'>
							人と自然が豊かに共存する社会を目指して。次世代に美しい地球を残すため、事業のあらゆる場面で環境への配慮を最優先に考えています。
						</HTML.p>
					</Stack>
				</Grid>
				<Grid gtr='subgrid' gr='span 2' g='30'>
					<Frame tag='figure' ar='og' bdrs='10'>
						<Media src='https://cdn.lism-css.com/img/random-2510?r=2' alt='' width='960' height='640' />
					</Frame>
					<Stack g='20'>
						<HTML.p class='u-trim' fz='m' fw='bold'>大地からの、贈り物</HTML.p>
						<HTML.p class='u-trim' fz='s' o='-10'>
							私たちの製品は、自然への敬意から生まれます。農薬を使わずに育てられたオーガニック素材や、持続可能な資源だけを厳選しています。
						</HTML.p>
					</Stack>
				</Grid>
				<Grid gtr='subgrid' gr='span 2' g='30'>
					<Frame tag='figure' ar='og' bdrs='10'>
						<Media src='https://cdn.lism-css.com/img/random-2510?r=3' alt='' width='960' height='640' />
					</Frame>
					<Stack g='20'>
						<HTML.p class='u-trim' fz='m' fw='bold'>自然に触れる、週末</HTML.p>
						<HTML.p class='u-trim' fz='s' o='-10'>
							都会の喧騒を離れ、土や緑に触れる時間を提供します。週末の農業体験や森歩きなど、五感で自然を感じるプログラムをご用意しています。
						</HTML.p>
					</Stack>
				</Grid>
				<Grid gtr='subgrid' gr='span 2' g='30'>
					<Frame tag='figure' ar='og' bdrs='10'>
						<Media src='https://cdn.lism-css.com/img/random-2510?r=4' alt='' width='960' height='640' />
					</Frame>
					<Stack g='20'>
						<HTML.p class='u-trim' fz='m' fw='bold'>同じ想いを、持つ仲間</HTML.p>
						<HTML.p class='u-trim' fz='s' o='-10'>
							このサービスは、同じ価値観を持つ人々のコミュニティです。作り手のストーリーや愛用者の声を発信し、想いの輪を広げています。
						</HTML.p>
					</Stack>
				</Grid>
			</Grid>
		</Stack>
	</Container>
</DemoLayout>