@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/static/pretendard.css");
@import url('https://fonts.googleapis.com/css2?family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/* Copyright Ⓒ Hanmaceng Corp. All Rights Reserved. */
/* 기술개발센터 김건우A 연구원 b25013@hanmaceng.co.kr */

/* -- ↓ -- style -- ↓ -- */

/* 색상 및 시스템 정의 ===== ===== ===== ===== ===== */
:root {
    --color-red: #F21D0D;
    --color-pink: #E8175E;
    --color-magenta: #B92ED1;
    --color-purple: #6D3DC2;
    --color-navy: #4255bd;
    --color-blue: #0D8DF2;
    --color-cyan: #03AEFC;
    --color-green: #4DB251;
    --color-yellow: #FFBF00;
    --color-orange: #FF9800;
    --color-dahong: #FF3D00;
    --color-brown: #A0705F;
    --color-iron: #7F7F7F;
    --color-steel: #688897;

    --color-red-light: #FEE9E7;
    --color-pink-light: #FDE8EF;
    --color-magenta-light: #F8EBFB;
    --color-purple-light: #F1ECF9;
    --color-navy-light: #EDEEF9;
    --color-blue-light: #E7F4FE;
    --color-cyan-light: #E6F7FF;
    --color-green-light: #EEF8EE;
    --color-yellow-light: #FFF9E6;
    --color-orange-light: #FFF5E6;
    --color-dahong-light: #FFECE6;
    --color-brown-light: #F6F1EF;
    --color-iron-light: #F3F3F3;
    --color-steel-light: #F0F4F5;

    --color-red-medium: #FAA59E;
    --color-pink-medium: #F6A2BF;
    --color-magenta-medium: #E3ABEC;
    --color-purple-medium: #C5B1E7;
    --color-navy-medium: #B3BBE5;
    --color-blue-medium: #9ED1FA;
    --color-cyan-medium: #9ADFFE;
    --color-green-medium: #B8E0B9;
    --color-yellow-medium: #FFE599;
    --color-orange-medium: #FFD699;
    --color-dahong-medium: #FFB199;
    --color-brown-medium: #D9C6BF;
    --color-iron-medium: #CCCCCC;
    --color-steel-medium: #C3CFD5;

    /* 프라이머리컬러스케일 */
    --primary-lv-0: #E9EEED;
    --primary-lv-1: #D2DCDB;
    --primary-lv-2: #A5B9B6;
    --primary-lv-3: #789792;
    --primary-lv-4: #4B746D;
    --primary-lv-5: #35635C;
    --primary-lv-6: #1E5149;
    --primary-lv-7: #1B443D;
    --primary-lv-8: #193833;
    --primary-lv-9: #162A27;
}


/* 컴포넌트 정의 ===== ===== ===== ===== ===== */
html {
    /* font-size: 0.4vw; */
    /* font-size: 0.4333333vw; */
    /* 4k / 사이니지 */
}

@media screen and (max-width: 1920px) {
    html {
        /* font-size: 0.8vw; */
        font-size: 0.8333333vw;
        /* 데스크탑 / 대형 렙탑 */
    }
}

@media screen and (max-width: 960px) {
    html {
        /* font-size: 1.8vw; */
        font-size: 1.8333333vw;
        /* 소형 렙탑 / 태블릿 */
    }
}

@media screen and (max-width: 480px) {
    html {
        /* ❌ 모바일 지원 일시중단 ❌ */
        /* font-size: 3.8333333vw; */
        /* 모바일 */
    }
}

body {
    font-family: 'Pretendard';
    color: #111;
    user-select: none;
}

/* 한줄 강조 emphasize-20px */
h1 {
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.25rem;
    letter-spacing: -0.0175rem;
}

/* 프로젝트 제목 project-title-16px */
h2 {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.25rem;
    letter-spacing: -0.0175rem;
}

/* 본문 제목 title-14px */
h3 {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.25rem;
    letter-spacing: -0.0175rem;
}

/* 본문 body-14px */
h4 {
    font-size: 0.875rem;
    font-weight: 300;
    line-height: 1.25rem;
    letter-spacing: -0.0175rem;
}

/* 알약형 capsule-12px */
h5 {
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.25rem;
    letter-spacing: -0.0175rem;
}

/* 소본문 body-12px */
h6 {
    font-size: 0.75rem;
    font-weight: 300;
    line-height: 1.25rem;
    letter-spacing: -0.0175rem;
}

/* 주석 caption */
p {
    font-size: 0.75rem;
    font-weight: 300;
    line-height: 1.25rem;
    letter-spacing: -0.0175rem;
    color: #777;
}