Greeting002

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

import { Wrapper, Grid, Flex, Frame, Media, Stack, HTML, Flow } from 'lism-css/astro';
import './_style.css';
---

<DemoLayout title="Greeting002">
	<Wrapper contentSize="l" py="50" bgc="base" setGutter>
		<Stack g="50">
			<Stack class="u--trimChildren" g="40">
				<HTML.span fz="min(22vw, 10rem)" fw="bold" ff="accent" mx-s="-.5rem" c="gray" o="-30" whspace="nowrap">Greeting</HTML.span>
				<HTML.h lv="2" fz="3xl" fw="bold" ff="accent">代表メッセージ</HTML.h>
			</Stack>
			<Flow fz="l" lh="l">
				<p>
					あらゆるモノがインターネットに繋がり、膨大なデータが生成される現代において、
					そのデータをいかに安全に、そして有効に活用するかが企業競争力の源泉となっています。
				</p>
				<p>
					私たちは創業以来、情報セキュリティ分野における技術開発に注力し、
					お客様の大切な情報資産をあらゆる脅威から守る、堅牢なシステムとソリューションを提供してまいりました。
					技術は日々進化しますが、お客様からの「信頼」こそが私たちの事業の根幹であるという信念は、
					決して揺らぐことはありません。最高水準のセキュリティ技術とコンサルティングを通じて、
					お客様が安心してデータを活用し、新たな価値を創造できる社会基盤の構築に貢献してまいります。
				</p>
			</Flow>
			<Flex jc="flex-e">
				<Grid gtc="6rem auto" g="30" ai="center" px="40">
					<Frame as="figure" ar="1/1" bdrs="99">
						<Media src="https://cdn.lism-css.com/img/random-2510?category=ceo" alt="" width="960" height="640" objectPosition="50% 20%" />
					</Frame>
					<Stack g="20" class="u--trimChildren" ff="accent">
						<HTML.span fz="l">代表取締役社長</HTML.span>
						<HTML.span fz="xl" fw="bold">田中　誠二</HTML.span>
					</Stack>
				</Grid>
			</Flex>
		</Stack>
	</Wrapper>
</DemoLayout>