37 lines
1.6 KiB
TypeScript
37 lines
1.6 KiB
TypeScript
// app/main/_sections/Hero.tsx
|
|
import Image from "next/image";
|
|
import styles from "../../reuse.module.css";
|
|
|
|
export default function Hero() {
|
|
return (
|
|
<section id="main" className={styles.hero}>
|
|
<div className={styles.heroBg} aria-hidden />
|
|
<div className={styles.heroOverlay} aria-hidden />
|
|
|
|
<div className="absolute inset-0 z-10 flex items-center justify-center">
|
|
<div className="flex flex-col items-center justify-items-center gap-[40px] mx-auto max-w-[1520px] px-6 text-center text-white">
|
|
<h1 className="text-5xl font-bold tracking-tight">물 재이용</h1>
|
|
<p className="text-xl font-medium leading-6 text-white/85 max-w-[720px] mx-auto">
|
|
빗물, 오수, 하수처리수, 폐수처리수, 발전소 온배수를 재이용처리하여<br />
|
|
생활, 공업, 농업, 조경, 하천유지 등의 용도로 재이용합니다.
|
|
</p>
|
|
<p className="text-lg leading-6 text-white/85 max-w-[720px] mx-auto">
|
|
전국 하수 재이용률 15.6%(2024년 통계 기준),<br />
|
|
물재이용 활성화를 위한 재이용 수요신청, 매칭을 추진하고 있습니다.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div className="absolute inset-x-0 bottom-[120px] flex flex-col items-center justify-items-center gap-2 mt-10">
|
|
<Image
|
|
src="/images/landing/scroll_down.svg"
|
|
alt=""
|
|
width={26}
|
|
height={40}
|
|
className="w-[26px] h-[40px]"
|
|
/>
|
|
<span className="text-white/80 text-base tracking-[.25em]">scroll down</span>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|