@charset "utf-8";

/* CSS Document */
/*=================================================================================

* Reset

=================================================================================*/
html {
   font-size: 100%;
   font-weight: 400;
   letter-spacing: -0.025em;
}
body {
   word-wrap: break-word;
   word-break: keep-all;
   box-sizing: border-box;
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
textarea,
p,
blockquote,
th,
td,
input,
select,
textarea,
button {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   /*	-webkit-backface-visibility: initial;
 -moz-backface-visibility: initial;
 -webkit-transform: translate3d(0, 0, 0);
 -moz-transform: translate3d(0, 0, 0);*/
   transition: all ease 0.1s;
}

fieldset,
img {
   border: 0 none;
}

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

blockquote,
q {
   quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
   content: "";
   content: none;
}

input,
select,
textarea,
button {
   vertical-align: middle;
}

input::-ms-clear {
   display: none;
}

input::-webkit-contacts-auto-fill-button {
   visibility: hidden;
   display: none !important;
   pointer-events: none;
   position: absolute;
   right: 0;
}

input {
   -webkit-appearance: none;
   -webkit-border-radius: 0;
   appearance: none;
   border-radius: 0;
}

input[type="text"],
input[type="search"],
input[type="email"],
input[type="date"],
input[type="password"],
select {
   border: 1px solid #aeaeb2;
   height: 46px;
   line-height: 46px;
   background: #fff;
   text-indent: 8px;
   outline: none;
   border-radius: 6px;
   font-size: 1.4rem;
   font-weight: 500;
}
input[type="search"] {
   background: #f3f3f3;
}
/* 체크박스 스타일 초기화  */
input[type="checkbox"] {
   appearance: none;
   -webkit-appearance: none;
}

select {
   text-indent: 0;
   padding: 0;
   border-radius: 6px;
}

input:focus,
select:focus {
   border-color: var(--color-basic);
   outline: 0;
   border-width: 1px;
   box-shadow: 0 0 0 4px rgba(29, 86, 188, 0.1);
}

button {
   border: 0 none;
   border-radius: 0;
   background-color: transparent;
   cursor: pointer;
}

a {
   color: #121212;
   text-decoration: none;
   box-sizing: border-box;
   transition: all ease 0.1s;
}

a:hover,
a.line {
   color: var(--color-basic);
}

address,
caption,
cite,
code,
dfn,
em,
var {
   font-style: normal;
   font-weight: 300;
}

table {
   border-collapse: collapse !important;
}

html[data-useragent*="mac"] body * {
   font-family: "Apple SD Gothic NEO", helvetica, sans-serif !important;
}

::-moz-selection {
   background: #0066ff;
   color: #fff;
}

::selection {
   background: #0066ff;
   color: #fff;
}

strong,
b {
   font-weight: 700;
}

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

figure {
   margin: 0;
}

hr {
   margin: 10px 0;
   border: 0;
   height: 1px;
   background-color: #e1e1e1;
}

textarea {
   width: 100%;
   height: 115px;
   overflow-y: auto;
   background: #fff;
   border: 1px solid #e1e1e1;
   border-radius: 5px;
   resize: none;
   padding: 12px;
}

input[type="password"] {
   font-family: "Pretendard GOV Variable", "Pretendard GOV", -apple-system, BlinkMacSystemFont, system-ui, Roboto,
      "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}

::placeholder {
   color: #999;
   font-weight: 400;
   font-size: 1.4rem;
}

input::-webkit-input-placeholder {
   color: #999;
   font-weight: 400;
   font-size: 1.4rem;
   letter-spacing: -0.025em;
}

input::-moz-placeholder {
   color: #999;
   font-weight: 400;
   font-size: 1.4rem;
}

input:-ms-input-placeholder {
   color: #999;
   font-weight: 400;
   font-size: 1.4rem;
}

input:-moz-placeholder {
   color: #999;
   font-weight: 400;
   font-size: 1.4rem;
}

input::placeholder {
   color: #999;
   font-weight: 400;
   font-size: 1.4rem;
}

img {
   max-width: 100%;
   -webkit-perspective: 1;
}

.cf:after {
   display: block;
   clear: both;
   content: "";
}

#skipNav {
   position: absolute;
   width: 100%;
}

#skipNav a {
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   top: 0;
   transform: translateY(-100%);
   width: 100%;
   height: 50px;
   background: #000;
   color: #fff;
}

#skipNav a:focus,
#skipNav a:active {
   transform: translateY(0);
}