General01

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

import { Wrapper, Flex, Frame, Media, Stack, Text } from 'lism-css/astro';
import { Button } from '@lism-css/ui/astro/Button';
---

<DemoLayout title="General01">
  <Wrapper contentSize="s" py="50" bgc="base" hasGutter>
    <Stack ai="center" g="40">
      <h2 class="u--trim">暮らしを、もっと豊かに</h2>
      <Frame as="figure" ar="16/9" pos="relative" bdrs="20" bxsh="30">
        <Media src="https://images.unsplash.com/photo-1584412182057-c4c8a22ff533?auto=format&fit=max&w=1920&q=80" alt="" width="960" height="640" />
      </Frame>
      <Text class="u--trim" fz="m">
        都市の真ん中に、芝生の広場と木陰の散歩道を。私たちは、オフィスや住まいのすぐそばで緑に触れられるまちづくりを進めています。昼休みのひと息や週末のピクニックなど、毎日の暮らしが少しだけ豊かになる場所をつくっていきます。
      </Text>
      <Flex g="30" ai="center" jc="center">
        <Button href="#" min-w="250px" py="15" bdrs="10">View More</Button>
      </Flex>
    </Stack>
  </Wrapper>
</DemoLayout>