Greeting
Greeting003
挨拶用のテンプレートです。breakpoint「md」以下はレイアウトが変わり、アイテムの並びが変更されます。
↓
コード
index.astro
---
import DemoLayout from '@/layouts/DemoLayout.astro';
import { Container, Grid, HTML, Frame, Media, Stack, Flow, Layer, Center } from 'lism-css/astro';
import './_style.css';
---
<DemoLayout title='Greeting003'>
<Container isWrapper='l' py='50' hasGutter>
<Grid gtc={['auto', null, 'auto 1fr']} g='50 60'>
<Frame ar='5/2' gc='1 / -1' pos='rel'>
<Media src='https://cdn.lism-css.com/img/random-2510' alt='' />
<Layer bgc='rgb(0 0 0 / 30%)'>
<Center h='100%' c='white'>
<HTML.span class='u-trim' fz='3xl' fw='light' ff='accent' lts='l' px='20' py='10'>代表からご挨拶</HTML.span>
</Center>
</Layer>
</Frame>
<Stack g='40' max-w={['stretch', null, '24rem']}>
<HTML.h lv='2' class='u-trim' fz='3xl' fw='bold'>目指す世界に向けて<br />提供する未来のために</HTML.h>
<HTML.p class='u-trim' fz='xl' o='-20'>代表取締役 CEO 神宮寺 慧</HTML.p>
</Stack>
<Flow class='u-trim' fz='m'>
<p>
私たちが生きる21世紀は、かつて人類が経験したことのない、指数関数的な速度でテクノロジーが進化する時代です。
AIが創造性を持ち始め、物理空間とデジタル空間の境界が溶け合う今、私たち「ものづくり」に携わる者の役割は、
単に便利な「モノ」を供給することから、未来の「体験」そのものを構想し、提案することへとシフトしています。
私たちのデザインは、未来への問いかけです。
</p>
<p>
「テクノロジーが真に人間を拡張する時、私たちの暮らしはどう変わるのか?」「心地よさや豊かさの定義は、どう進化していくのか?」
——その答えを探求するための、思考の具現化です。
</p>
<p>
だからこそ、私たちの製品は、時にラディカルで、既成概念を揺さぶるような姿をしているかもしれません。
それは、未来の可能性の一端を、皆様の日常に届けたいという強い想いの表れなのです。
私たちのスタジオには、デザイナーだけでなく、エンジニア、社会学者、そしてアーティストまで、多様な才能が集結しています。
彼らが日々交わす対話と、異分野の知見の衝突から生まれる火花こそが、私たちのイノベーションの源泉です。
バイオミミクリーから着想を得た新素材、人の感情を読み取るインターフェース、循環型経済を前提としたプロダクトエコシステム。
これらはすべて、未来の日常を形作るための、小さな、しかし重要な布石です。
</p>
<p>
私たちが創り出すのは、単なる製品ではありません。それは、皆様が未来を想像し、語り合うための「触媒」です。
私たちの製品に触れることで、少し先の未来を垣間見て、これからの社会や暮らしについて考えるきっかけが生まれること。
それこそが、デザイナーとして、そして企業としての最高の喜びです。
これからも、私たちは未知なるデザインの地平を目指し、大胆な問いを立て、果敢な挑戦を続けていくことをお約束します。
皆様と共に、より人間的で、より刺激的な未来を創造していけることを、心から楽しみにしています。
</p>
</Flow>
</Grid>
</Container>
</DemoLayout> style.css