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" class="set--bdrsInner" as="figure" ar="16/9" pos="relative" bdrs="20" bxsh="20" bgc="base" p="10">
        <Media
          class="-bdrs:inner"
          src="https://images.unsplash.com/photo-1578637387939-43c525550085?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>