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" setGutter>
<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