시계위키: 대문: 두 판 사이의 차이
보이기
	
	
편집 요약 없음  | 
				편집 요약 없음  | 
				||
| 11번째 줄: | 11번째 줄: | ||
   </div>  |    </div>  | ||
</div>  | </div>  | ||
/* 배경(히어로) 영역 */  | |||
.main-hero {  | |||
  position: relative;  | |||
  padding: 48px 16px;            /* 위아래 여백 */  | |||
  background: linear-gradient(180deg,#0f1220 0%, #171b29 100%); /* 배경색/그라데이션 */  | |||
}  | |||
/* 배경 이미지를 쓰고 싶다면(선택) — 이미지 경로만 바꾸면 됩니다 */  | |||
.main-hero {  | |||
  background: url(/images/site/hero.jpg) center/cover no-repeat fixed;  | |||
}  | |||
/* 가운데 카드 박스(본문) */  | |||
.main-card {  | |||
  max-width: 980px;              /* 카드 최대 가로 폭 */  | |||
  margin: 0 auto;                /* 가운데 정렬 */  | |||
  background: #fff;              /* 박스 배경색(라이트) */  | |||
  border: 1px solid rgba(0,0,0,.06);  | |||
  border-radius: 16px;  | |||
  box-shadow: 0 8px 24px rgba(0,0,0,.12);  | |||
  padding: 28px;  | |||
}  | |||
/* 다크 모드 대응(선택) */  | |||
@media (prefers-color-scheme: dark) {  | |||
  .main-card {  | |||
    background: #161a22;  | |||
    border-color: rgba(255,255,255,.06);  | |||
    box-shadow: 0 8px 24px rgba(0,0,0,.28);  | |||
  }  | |||
}  | |||
/* 반응형(선택) — 모바일은 여백만 살짝 줄이기 */  | |||
@media (max-width: 720px) {  | |||
  .main-hero { padding: 28px 12px; }  | |||
  .main-card { padding: 20px; border-radius: 12px; }  | |||
}  | |||
2025년 8월 31일 (일) 02:00 판
시계위키에 오신 것을 환영합니다
대문은 커다란 문을 의미하지만, 실제로는 그렇게 크지 않은 경우가 대부분이다. 문이 너무 크면 열고 닫는것이 불편하기 때문이라고 전해진다.
/* 배경(히어로) 영역 */ .main-hero {
position: relative; padding: 48px 16px; /* 위아래 여백 */ background: linear-gradient(180deg,#0f1220 0%, #171b29 100%); /* 배경색/그라데이션 */
}
/* 배경 이미지를 쓰고 싶다면(선택) — 이미지 경로만 바꾸면 됩니다 */ .main-hero {
background: url(/images/site/hero.jpg) center/cover no-repeat fixed;
}
/* 가운데 카드 박스(본문) */ .main-card {
max-width: 980px; /* 카드 최대 가로 폭 */ margin: 0 auto; /* 가운데 정렬 */ background: #fff; /* 박스 배경색(라이트) */ border: 1px solid rgba(0,0,0,.06); border-radius: 16px; box-shadow: 0 8px 24px rgba(0,0,0,.12); padding: 28px;
}
/* 다크 모드 대응(선택) */ @media (prefers-color-scheme: dark) {
 .main-card {
   background: #161a22;
   border-color: rgba(255,255,255,.06);
   box-shadow: 0 8px 24px rgba(0,0,0,.28);
 }
}
/* 반응형(선택) — 모바일은 여백만 살짝 줄이기 */ @media (max-width: 720px) {
 .main-hero { padding: 28px 12px; }
 .main-card { padding: 20px; border-radius: 12px; }
}