検索

Section

Section012

セクション用のテンプレートです。breakpoint「md」以下は1カラムで表示され、アイテムが縦に並びます。

大きい画面で見る
コード
index.astro
---
import DemoLayout from '@/layouts/DemoLayout.astro';

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

<DemoLayout title="Section012">
  <Grid gtr="auto" gtc={['auto', null, 'auto 1fr']} pos="relative">
    <Layer>
      <Frame h="100%">
        <Media src="https://cdn.lism-css.com/random/img" alt="" width="960" height="640" />
        <Layer bgc="black:30%" />
      </Frame>
    </Layer>
    <Container isWrapper="m" gr="1" gc="1" set="gutter" pos="relative" z="1">
      <Grid gtc={['auto', null, 'auto 1fr']} c="white" g="50" py="50">
        <Heading level="2" class="u--trim" fz="3xl" fw="bold" hl="l">自然素材が生み出す<br />癒やしのひととき</Heading>
        <Stack class="u--trimChildren" g="40">
          <p>
            目を閉じれば、まるで森の木漏れ日の中にいるかのような、圧倒的な臨場感。
            このスピーカーは、録音された自然音を、立体的に、そして限りなくリアルに再現するために生まれました。
          </p>
          <p>
            本体のエンクロージャー(筐体)には、調湿性や消臭性で知られる「珪藻土」を特殊な技術で固めた、
            多孔質の自然素材を採用。この珪藻土が、音の余計な反響を吸収し、驚くほどクリアで、 角の取れた、柔らかく自然な音響特性を実現しました。
            専用アプリには、屋久島の森や、沖縄の波音など、日本各地で収録された高音質なバイノーラル音源を多数用意。
          </p>
          <p>
            左右のスピーカーから流れるわずかに異なる音が、脳内で立体的な音像を結び、
            あなたを深いリラクゼーションへと導きます。音楽を聴くためのスピーカーとは一線を画す、
            「音の風景」を日常に取り入れるための装置。自然の響きで、心と身体を調律する時間をお過ごしください。
          </p>
        </Stack>
      </Grid>
    </Container>
  </Grid>
</DemoLayout>
style.css