@charset "utf-8";

@import url("https://cdn.jsdelivr.net/npm/@fontsource/nunito@5.2.7/latin.css");

@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/100.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/200.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/300.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/400.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/500.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/600.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/700.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/800.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/montserrat@5.2.8/900.css");

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-gov.min.css');

:where(*), :where(*::before), :where(*::after) {margin: 0;padding: 0;box-sizing: border-box;}

html, body {height: 100%; font-family: 'Nunito', 'Pretendard GOV', sans-serif; line-height: 1.5; letter-spacing: -0.3px; color: #333; background: #fff; min-width: 360px; rotate(0.03deg);}

article, aside, footer, header, nav, section {display: block;}

h1, h2, h3, h4, h5, h6, strong {font-weight: 700;}

a {text-decoration: none; color: inherit; display: flex; align-items: center;}

ul, ol, li {list-style: none;}

img, video {max-width: 100%; height: auto; vertical-align: top;}

table {  border-collapse: collapse; border-spacing: 0;}

.inner {max-width: 1280px; display: flex; margin: 0 auto; align-items: center; box-sizing: border-box;}
.section_area {padding: 100px 0;}

button {display: flex; align-items: center; border: none; background: none; font-size: 16px; cursor: pointer;}

button a {border: 1px solid #000; padding: 10px 20px; border-radius: 50px; font-weight: 400;}

.mobile_br {display: none;}

@media screen and (max-width: 1199px) {
  .inner {padding: 0 20px;}
}
@media screen and (max-width: 768px) {
  br {display: none;}
  .mobile_br {display: block;}
}

@media screen and (max-width: 370px) {
  
  .section_area {padding: 50px 0;}
}

/* 포트폴리오 제출용 보정 : 한글 단어 중간 줄바꿈 방지 */
body {word-break: keep-all; overflow-wrap: break-word;}
/* 닫힌 모바일 메뉴가 화면 오른쪽에 남아 가로 스크롤이 생기던 문제 */
html {overflow-x: clip;}
/* AOS fade-left/right가 시작 위치에서 화면 밖으로 밀려 가로 스크롤을 만들던 문제 */
section, .main_product_feature {overflow-x: clip;}