@charset "utf-8";

/* font */
@font-face {
	font-family: 'Pretendard';
	font-style: normal;
	font-weight: 400;
	src: url(../font/Pretendard-Regular.woff2) format('woff2'),
		 url(../font/Pretendard-Regular.woff) format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-style: normal;
	font-weight: 600;
	src: url(../font/Pretendard-SemiBold.woff2) format('woff2'),
		 url(../font/Pretendard-SemiBold.woff) format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-style: normal;
	font-weight: 800;
	src: url(../font/Pretendard-ExtraBold.woff2) format('woff2'),
		 url(../font/Pretendard-ExtraBold.woff) format('woff');
}

/* reset */
*, *::before, *::after {
	padding:0px; margin:0px; box-sizing:border-box;
}
:focus-visible {
  outline:1px dashed #555;
}

html, body, div, span, img, iframe, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, pre, form, input, button, textarea, blockquote, abbr, address, em, cite, fieldset, label, legend, select, table, caption, thead, tbody, tfoot, th, tr, td, header, footer, section, article, nav, aside, figure {
	margin:0px; padding:0px; box-sizing:border-box;
}
h1, h2, h3, h4, h5, h6 {
	font-family:inherit;
}
pre, code, address, figcaption, caption, em, code, samp, cite {
	font-family:inherit; font-size:inherit; line-height:1.5; font-style:normal; font-weight:normal;
}
input, button, select, optgroup, textarea {
    font-family:inherit; font-size:inherit; line-height:inherit;
}
button {
	cursor:pointer;
}
img {
	border:0; vertical-align:top;
}
iframe, table {
	border:none;
}
table {
	border-spacing:0; border-collapse:collapse;
}
caption {
	display:none;
}
th {
	font-weight:normal; text-align:inherit; vertical-align:middle;
}
td {
	font-weight:normal; text-align:inherit; vertical-align:middle;
}
article, aside, figcaption, figure, footer, header, main, nav, section {
	display:block;
}
a, a:link, a:visited, a:hover, a:active {
	text-decoration:none;
}
textarea {
	resize:none;
}

/* common */
html, body {
	font-family:'Pretendard','Malgun Gothic','맑은 고딕',sans-serif; font-size:16px; line-height:1.4; color:#333; word-break:break-all; word-wrap:break-word; font-feature-settings:"tnum","ss01";
}
.dp-block {
	display:block !important;
}
.dp-hide {
	display:none !important;
}
::placeholder {
	color:#aaa !important;
}
table {
	width:100%; table-layout:fixed; border-collapse:collapse;
}
ul {
	list-style:none;
}
.ta-l {
	text-align:left;
}
.ta-c {
	text-align:center;
}
.ta-r {
	text-align:right;
}

/* custom scrollbar */
.cu-csb::-webkit-scrollbar {
	width:6px;
}
.cu-csb::-webkit-scrollbar-button {
	display:none;
}
.cu-csb::-webkit-scrollbar-thumb {
	background:#aaa; border-radius:3px;
}
.cu-csb::-webkit-scrollbar-thumb:hover {
	background:#777;
}
.cu-csb::-webkit-scrollbar-track {
	background:#eee; border-radius:3px;
}
.cu-csb::-webkit-scrollbar-track-piece {
	background:transparent;
}
.cu-csb::-webkit-scrollbar-corner {
	background:#999;
}
.cu-csb::-webkit-resizer {
	background:#999;
}

/* form element */
.form-checkbox {
	display:inline-flex; align-items:center; position:relative;
}
.form-checkbox input {
	position:absolute; top:0; left:0; opacity:0;
}
.form-checkbox .checkmark {
	position:relative; width:15px; height:15px; margin-right:7px; border:1px solid #ccc; border-radius:3px; background-color:#fff;
}
.form-checkbox .checkmark.circle {
	border-radius:50%;
}
.form-checkbox input:checked + .checkmark {
	border:0; background-color:#258fff;
}
.form-checkbox input:checked + .checkmark::before {
	content:""; position:absolute; width:5px; height:9px; top:2px; left:5px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:rotate(45deg);
}
.form-checkbox .contxt {
	font-size:14px; line-height:1.2; color:#222; font-weight:400;
}
.form-checkbox input:focus-visible + .checkmark {
	outline:1px dashed #555;
}

.form-input {
	width:100%; height:30px; font-size:14px; color:#222; padding:0 8px; border:1px solid #ccc; border-radius:3px;
}
select.form-input {
	appearance:none; background:url("../images/icon-form-select-arrow.png") calc(100% - 5px) 50% no-repeat;
}

/* modal */
.sc-modal {
	position:fixed; display:none; width:100%; height:100%; top:0; left:0; z-index:999; overflow:hidden;
}
.sc-modal::after {
	content:""; position:fixed; width:100%; height:100%; top:0; left:0; background-color:rgba(0,0,0,0.5); z-index:-1;
}
.sc-modal.sc-show {
	display:block;
}
.sc-modal-dialog {
	position:relative; display:flex; width:auto; max-width:360px; min-height:calc(100% - 60px); align-items:center; margin:30px auto;
}
.sc-modal-content {
	position:relative; display:flex; flex-direction:column; width:100%; border-radius:4px; background-color:#fff; box-shadow:0 2px 6px 0 rgba(0,0,0,0.2); overflow:hidden;
}
.sc-modal-header {
	display:flex; align-items:center; justify-content:flex-end; padding:10px 10px 5px 10px;
}
.sc-modal-header .sc-btn-close {
	position:relative; width:20px; height:20px; border:0; background:transparent;
}
.sc-modal-header .sc-btn-close::before {
	content:""; position:absolute; top:50%; left:0; width:100%; height:1px; background-color:#999; transform:rotate(45deg); transition:all 0.25s;
}
.sc-modal-header .sc-btn-close::after {
	content:""; position:absolute; top:50%; left:0; width:100%; height:1px; background-color:#999; transform:rotate(-45deg); transition:all 0.25s;
}
.sc-modal-header .sc-btn-close:hover::before {
	background-color:#555;
}
.sc-modal-header .sc-btn-close:hover::after {
	background-color:#555;
}
.sc-modal-body {
	position:relative; flex:1 1 auto; display:flex; align-items:center; justify-content:center; min-height:120px; padding:0 15px 15px 15px;
}
.sc-modal-body .sc-inner {
	text-align:center;
}
.sc-modal-body .sc-complete-message {
	font-size:20px; line-height:1.4; color:#222; font-weight:400;
}
.sc-modal-body .sc-addtional-message {
	font-size:16px; line-height:1.4; color:#222; font-weight:400; margin-top:15px;
}
.sc-modal-footer {
	display:flex; height:42px; border-top:1px solid #d3d7dc;
}
.sc-modal-footer .sc-btn {
	flex:1; border:0; background:#eaeff4; transition:all 0.25s;
}
.sc-modal-footer .sc-btn:hover {
	background:#d8e5f2;
}
.sc-modal-footer .sc-btn:not(:first-child) {
	border-left:1px solid #d3d7dc;
}
