/* css 작성 규칙 
1. css 파일은 css 폴더 내에 작성합니다.
2. css 작명법은 kebab-case를 사용합니다.
3. css 작명시 숫자는 1, 2 등으로 작명하지 않고, 01, 02 등으로 작명합니다.
4. css 파일은 헤더, 메인, 섹션 등으로 구분하여 작성합니다.
5. css 작성시 중복되는 코드는 사용하지 않습니다.
*/






/*  <----------------------------- css reset start  -----------------------------> */
:root {
    --white: #f9f4ff;
    --black: #000000;
    --pink: #F74C94;
    --purple: #924FFF;
    --yellow: #FFE040;
    --transition: all 0.3s ease;
    --radius: 2rem;
}

*,
*::before,
*::after {
    border: 0;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'SUIT', sans-serif;
    font-optical-sizing: auto;
}

button {
    all: unset;
}

a {
    text-decoration: none;
}

h1,h2,h3,h4,h5,h6 {
    margin: 0;
    line-height: 1.5em;
}

input,
button,
textarea {
    outline: none;
}

button {
    cursor: pointer;
}

ul {
    list-style-type: none;
}

li {
    list-style-type: none;
    cursor: pointer;
}

img {
    pointer-events: none
}
/*  <----------------------------- css reset end  -----------------------------> */






/* <----------------------------- main css start -----------------------------> */
body {
    width: 100%;
    max-width: 2560px;
    height: 100vh;
    background: var(--black);
    overflow-x: hidden;
    line-height: 1.6;
}

main {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: var(--black);
    color: var(--white);
}

section {
    width: 100%;
    height: auto;
    margin-bottom: 200px;

}

.section-title {
    font-size: 2rem;
    font-weight: 500;
    text-align: left;
    color: var(--white);
    margin-bottom: 50px;
}
    
.section-p {
    font-size: 1.5rem;
    font-weight: 500;
    text-align: center;
    color: var(--white);
}

.purple-bg {
    background: var(--purple);
    color: var(--black);
}

.scroll {
    opacity: 0;
    transition: all .5s;
    transform: translateY(+100px);
}
/* <----------------------------- main css end -----------------------------> */