/*---------------------------------------------------------
  프론트 페이지 스타일 정의
  
  !! 주의사항 !!
  모든 경로는 상대경로로 작성되어 있습니다.
  배포 시 절대경로로 재작성을 권장합니다.
  예) https://cdn.leeartconsulting.com/img/img.jpg -> /assets/img/img/jpg

  !! 주의사항 !!
  본 CSS는 기본 스타일을 제외하고 HTML DOM 구조와 매우 타이트하게 동작하도록 작성되었습니다.
  이는 혹시 모를 하위 엘리먼트에 영향을 끼치는 위험을 제거하기 위함입니다.
  따라서 엘리먼트 계층 구조를 가급적 변경하지 않는 것이 좋습니다.
  변경이 필요한 경우 CSS도 DOM 경로에 맞춰 변경해 주시기 바랍니다.
---------------------------------------------------------*/

#divFrontPageWrap {
    position: relative;
    width: 100%;
    height: 100vh;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-color: var(--color-lac-50);

    /* Fallback background image */
    background-image: url("https://cdn.leeartconsulting.com/img/front/bg_1.jpg");
    color: var(--color-lac-50);

    cursor: pointer;
}

#divFrontPageWrap>.imgTitle {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 690px;
    max-width: 75%;
}

#divFrontPageWrap>.divLink {
    position: absolute;
    bottom: 6rem;
    right: 50%;
    transform: translate(50%, 0);

    font-family: var(--font-family-serif);
    font-size: var(--font-size-large);
    font-weight: 500;
    text-align: center;

    padding-bottom: 2.6rem;
}

#divFrontPageWrap>.divLink>a {
    color: var(--color-lac-50);
    text-decoration: none;
}

#divFrontPageWrap>.divLink>a:hover {
    color: var(--color-lac-400);
}