@charset "utf-8";
/**************************************
 * reset.css
 * font 설정
 * html 기본 스타일 초기화
 * 2024/12 By "PARK EUN HEE"
/**************************************/

/* NotoSans-Regular */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Noto Sans Regular'), local('NotoSans-Regular'), url('/assets/fonts/NotoSans-Regular.woff2') format('woff2');
}

/* NotoSans-Medium */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 500;
  src: local('Noto Sans Medium'), local('NotoSans-Medium'), url('/assets/fonts/NotoSans-Medium.woff2') format('woff2');
}

/* NotoSans-Bold */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Noto Sans Bold'), local('NotoSans-Bold'), url('/assets/fonts/NotoSans-Bold.woff2') format('woff2');
}

/**************************************
 S: reset
/**************************************/
* {
  margin: 0px;
  padding: 0px;
}

*,
::after,
::before {
  box-sizing: border-box;
  background-repeat: no-repeat;
  background-position: center;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 1.6rem;
  font-family: 'Noto Sans', sans-serif;
  line-height: 1.3;
  font-weight: 400;
  color: var(--fc-default);
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: none; /* for mobile 모바일에서  PC버전 보기 시(뷰포트가 변경되었을때) 폰트크기 변경되지 않도록 함*/
  -webkit-touch-callout: none; /* 모바일 요소 오래 클릭시 불필요한 현상 제거 for IOS */
  -webkit-overflow-scrolling: touch;
  -webkit-tap-highlight-color: transparent;
  min-height: calc((var(--vh) * 100));
  background-color: #fff;
  min-width: 280px;
  overflow-y: auto;
}

div,
p {
  word-wrap: break-word;
  word-break: keep-all;
}

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

b,
strong {
  font-weight: 700;
}

ins {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

hr {
  height: 0;
  border-bottom: 1px solid #dfe2e5;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

em,
address,
i {
  font-style: normal;
}

button,
input[type='button'] {
  border: 0;
  -webkit-appearance: none;
  appearance: none;
  color: var(--fc-default);
  background-color: transparent;
}

button:not(:disabled) {
  cursor: pointer;
}

a {
  text-decoration: none;
  color: var(--fc-default);
  vertical-align: middle;
}

button,
a,
button::before,
button::after,
a::before,
a::after {
  transition: 0.1s;
}

textarea {
  width: 100%;
  resize: none;
  border-radius: 0; /* IOS radius 기본 스타일 제거 */
  overflow-y: auto; /* IE11이하 기본 스타일 제거 */
}

table {
  /* table-layout: fixed; */
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

td,
th {
  padding: 0;
}

legend,
.hidden {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  visibility: hidden;
}

/*caption을 position으로 숨기면 사파리에서 caption이 깨져 보이는 경우가 있어 position을 제외하고 숨김.*/
caption {
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  text-indent: -9999px;
}

img {
  max-width: 100%;
}

img,
fieldset {
  vertical-align: middle;
  border: none;
}

input[type='text']::-ms-clear {
  display: none; /* input의 x 버튼 제거 for IE 또는  input::-ms-clear {display: none;} */
}

input:-webkit-autofill {
  /*크롬브라우저에서 자동완성 기능이 작동할 때 input의 배경색이 변하는 현상 제거 */
  -webkit-box-shadow: 0 0 0 100px #fff inset;
  -moz-box-shadow: 0 0 0 100px #fff inset;
  box-shadow: 0 0 0 100px #fff inset;
}

/* input type="number" 기본 스타일 제거 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type='number'] {
  -moz-appearance: textfield;
  appearance: textfield;
}

input:-ms-input-placeholder,
input::-moz-input-placeholder,
input::-webkit-input-placeholder,
input::placeholder {
  color: var(--fc-placeholder);
}

select::-ms-expand {
  display: none;
}

/* 접근성 포커스
button:focus-visible,
button:focus-visible {
	outline: 2px dotted #70b6ff;
}
*/

*:focus {
  outline: 0;
}

*:focus-visible {
  outline: 2px solid #000;
  outline-offset: -2px;
}

/* 텍스트를 선택했을때 bg컬러 및 폰트 컬러 변경 */
::selection,
::-moz-selection {
  background-color: #eee7dd;
  color: #666;
}

/* 스크롤바 */
::-webkit-scrollbar {
  width: 8px;
  height: 10px;
  border: 4px solid #fff;
  transition: 0.4s;
}

::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
  display: none;
  height: 0;
  width: 0;
  background: #fff;
}

::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.05);
  border-radius: 2px;
}
::-webkit-scrollbar-thumb {
  background: var(--color-grayCool-200);
  border-radius: 4px;
}

.modal ::-webkit-scrollbar {
  width: 12px;
  border: 2px transparent;
}

.modal ::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 2px;
  width: 8px;
  padding: 2px;
}

.modal ::-webkit-scrollbar-thumb {
  border-radius: 6px;
  width: 4px;
  border: 4px solid #fff;
}

/**************************************
E: reset
/**************************************/
