
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

*{
	font-family: 'Pretendard Variable', sans-serif;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

:root{
	/*	COLOR		*/
	--jb-main:#F48C36;
	--jb-blue:#3154A3;
	--jb-white:#FFFF;
	

	/*	TEXT	*/
	--jb-color-bright:#E1E5EA;
	--jb-color-pale:#C2CAD6;
	--jb-color-hazy:#A4B0C1;
	--jb-color-light:#7689A2;
	--jb-color-main:#5D6F89;
	--jb-color-bold:#333D4B;
	--jb-color-black:#15191E;
	--jb-color-remark:#6C9CE0;
	--jb-color-warning:#FF4713;

	/*	BACKGROUND	*/
	--jb-bg-scroll: #F9F9FB;
	--jb-bg-scroll-thumb: #C6CBD2;
	
	--jb-bg-white:#FFF;
	--jb-bg-hazy:#F4F5F7;
	--jb-bg-button:#F0F2F4;
	--jb-bg-button-hover:#D3D7DF;
	--jb-bg-main:#E1E4EA;
	--jb-bg-bold:#C4C9D4;
	--jb-bg-hover:#A6AEBF;

	--jb-bg-foot:#F9F9FB;
	--jb-bg-form:#E6F9FF;
	--jb-bg-form-hover:#F7FAEB;

	/*	BORDER	*/
	--jb-border-list:#E0E6EB;
	--jb-border-form:#C1CDD7;
	--jb-border-form-hover:#839BAF;
	--jb-border-button:#E2E6E9;

	
	/*	RADIUS	*/
	--jb-radius-page: 1.5rem;
	--jb-radius-window: 1rem;
	--jb-radius-button: 0.75rem;
	--jb-radius-form: 0.5rem;
	--jb-radius-inline: 0.25rem;

	/*	BUTTON	*/

}

html{
	font-size: 16px;
}

body{
	font-size: 0.875rem;
	color: var(--jb-color-main);
	letter-spacing: -0.03em;
	word-spacing: 0.1em;
}

table{
	width:100%;
	border-spacing:0px;
	padding:0px;
	border-collapse:collapse;
	table-layout:fixed;
}

a{
	display:inline-block;
	text-decoration:none;
	color:inherit;
}

.material-symbols-rounded,
.material-icons,
.material-icons-round, 
.material-icons-outlined{
	vertical-align:middle;
}

ul, dl, ol, li, dd, dt{
	list-style: none;
}


/******************************************************************
	SCROLL
******************************************************************/
body::-webkit-scrollbar { width: 12px;}
body::-webkit-scrollbar-track { background-color: var(--jb-bg-scroll); }
body::-webkit-scrollbar-thumb { background: var(--jb-bg-scroll-thumb); border-radius:6px;}
body::-webkit-scrollbar-thumb:hover { background: var(--jb-bg-hover); }
body::-webkit-scrollbar-thumb:active { background: var(--jb-bg-hover); }
body::-webkit-scrollbar-button { display: none; }

.term_box::-webkit-scrollbar { width: 6px;}
.term_box::-webkit-scrollbar-track { background-color: var(--jb-bg-scroll); }
.term_box::-webkit-scrollbar-thumb { background: var(--jb-bg-scroll-thumb); border-radius:3px;}
.term_box::-webkit-scrollbar-thumb:hover { background:  var(--jb-bg-hover); }
.term_box::-webkit-scrollbar-thumb:active { background: var(--jb-bg-hover); }
.term_box::-webkit-scrollbar-button { display: none; }

.gnb::-webkit-scrollbar { width: 6px;}
.gnb::-webkit-scrollbar-track { background-color: var(--jb-bg-croll); }
.gnb::-webkit-scrollbar-thumb { background:var(--jb-bg-scroll-thumb); border-radius:3px;}
.gnb::-webkit-scrollbar-thumb:hover { background: var(--jb-bg-hover); }
.gnb::-webkit-scrollbar-thumb:active { background: var(--jb-bg-hover); }
.gnb::-webkit-scrollbar-button { display: none; }


/************************************************
	SELECT2
************************************************/
.bg_white .select2-container--default .select2-selection--single{background-color: #F0F3F5;}

.req_place{color:#C4CCD4 !important;}
.select2-default{color:#C4CCD4 !important;}
.select2-results::-webkit-scrollbar{width:6px;background-color:transparent;}
.select2-results::-webkit-scrollbar-thumb{border-radius:3px;background-color:rgba(45, 94, 185, 0.4);}
.select2-results::-webkit-scrollbar-track{background-color:transparent;}

.select2-results__options::-webkit-scrollbar{width:6px;background-color:transparent;}
.select2-results__options::-webkit-scrollbar-thumb{border-radius:3px;background-color:rgba(45, 94, 185, 0.4);}
.select2-results__options::-webkit-scrollbar-track{background-color:transparent;}

.select2-container, .select2-dropdown, .select2-search, .select2-results {
	-webkit-transition: none !important;
	-moz-transition: none !important;
	-ms-transition: none !important;
	-o-transition: none !important;
	transition: none !important;
}

.select2-container--default .select2-selection--single{
	background-color: var(--jb-bg-hazy) !important;
	border: 1px SOLID var(--jb-border-form) !important;
	border-radius: var(--jb-radius-form) !important;
}

.select2-container .select2-selection--single {
	height: 48px !important;
}

.select2-container--default .select2-selection--multiple{
	background-color: var(--jb-bg-hazy) !important;
	border: 1px SOLID var(--jb-border-form) !important;
	border-radius: 6px !important;
	padding-bottom: 8px; 
	padding-right: 0px;
}

.select2-container .select2-selection--multiple {
	min-height: 48px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice{
	color:var(--color-bold);
	line-height: 32px;
	background-color: var(--jb-white);
	border: 1px solid var(--jb-border-form);
	margin-left: 8px;
	margin-top: 8px;
	padding-right:12px;
}


.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{
	border-right: none;
	border-radius: 0;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #656767;
	line-height: 46px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__arrow,
.select2-container--default .select2-selection--single .select2-selection__arrow{
	height: 46px !important;
}

.select2-container, .select2-dropdown, .select2-search, .select2-results {
	-webkit-transition: none !important;
	-moz-transition: none !important;
	-ms-transition: none !important;
	-o-transition: none !important;
	transition: none !important;
}

.select2-dropdown{
	overflow:hidden;
	border: 1px SOLID #BFC0C0 !important;
	border-radius:6px !important;
}

.select2-container--open .select2-dropdown--below{
	border-top-left-radius:6px !important;
	border-top-right-radius:6px !important;
}

.select2-results__option{
	line-height: 24px !important;
	padding-left:12px !important;
	padding-right:12px !important;
}

.select2-search input[type="search"]{
	background-color:var(--jb-white);
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	line-height:46px;
	padding: 0 12px;
}

/*
.select2-results__options > li:first-child{display:none;}
*/

/************************************************
	SWAL
************************************************/
.swal2-container{z-index:9000 !important;}

.swal2-popup .swal2-styled.swal2-confirm{background-color:#2CACED !important;}
.swal2-popup .swal2-styled.swal2-confirm:hover{background-color:#0E72A4 !important;}
.swal2-popup .swal2-title{margin:0;font-size:1.125rem;}
.swal2-popup .swal2-title .warning_color,
.swal2-popup .swal2-title .confirm_color{display:flex;}

.swal2-popup .swal2-title .material-icons-round,
.swal2-popup .swal2-title .material-icons-outlined,
.swal2-popup .swal2-title .material-icons{height:32px;font-size:2rem;line-height:32px;}
.swal2-popup .swal2-title .label,
.swal2-popup .swal2-title .text{height:32px;line-height:32px;font-size:1.25rem;padding-left:4px;}

.swal2-popup .swal2-content {font-size:1rem;padding-top:0.75rem;}


/************************************************
	DATEPICKER
************************************************/
.date-picker-wrapper{z-index:9999 !important;}
.datepicker-container{z-index:9999 !important;}



/************************************************
	dropzone
************************************************/
.dropzone {
	display:flex;
	justify-content: center;
	align-items: center;	
	position:relative;
	border-radius:4px;
	width:100%;
	border: 2px dashed var(--border-main) !important;
	background-color:#F9FAFB !important;
	padding: 12px;
}
.dropzone:hover{border: 2px dashed #2CACED !important;}

.dropzone .dropzone_message{
	display:inline-block;
	width:100%;
	font-size:1rem;
	color:rgba(15, 135, 166, 0.4);
	text-align:center;
	line-height:160%;
	margin:0 !important;
}

.dropzone .dropzone_message .fas{
	padding-right:4px;
}

body.dragging, body.dragging * {
	cursor: move !important;
}

.dragged {
	position: absolute;
	opacity: 0.5;
	z-index: 2000;
}

ol.sortable_list li.placeholder {
	position: relative;
}

ol.sortable_list li.placeholder:before {
	position: absolute;
}


/************************************************
	Material Symbols
************************************************/
.material-symbols-rounded {
	font-variation-settings:
	'FILL' 0,
	'wght' 200,
	'GRAD' 0,
	'opsz' 24
}


/************************************************
	FORM
************************************************/
.swal2-input,
.input_form{
	display:inline-block;
	position:relative;
	height:48px;
	font-size:0.875rem !important;
	line-height:46px;
	border-radius: var(--jb-radius-form);
	padding:0 0.75rem;
}

.textarea_form{
	display:inline-block;
	width:100%;
	font-size:0.875rem !important;
	line-height:160%;
	border-radius: var(--radius-form);
	padding: 0.75rem !important;
}

.swal2-input:not([disabled]),
.input_form:not([disabled]),
.textarea_form:not([disabled]),
.custom_upload_form:not(.disabled){
	border:1px SOLID var(--jb-border-form);
	background-color:var(--jb-bg-hazy);
}

.swal2-input:focus,
.input_form:focus, 
.textarea_form:focus, 
.custom_upload_form:focus{
	color: var(--jb-color-bold);
	border:1px SOLID var(--jb-border-form-hover);
	background-color:var(--jb-bg-form-hover) !important;
}

.swal2-input{margin-top:12px;}
.input_form{width:100%;}


/******************************************************************
	DOM
******************************************************************/

button{
	color:var(--jb-color-bold);
	border:none;
	border-radius:var(--jb-radius-button);
	background-color:var(--jb-bg-button);
}

button:hover{
	background-color:var(--jb-bg-button-hover);
}

.wide_button{
	padding-left:48px;
	padding-right:48px;
}

.wide_button{
	padding-left:48px;
	padding-right:48px;
}

.bold_button{
	color:var(--jb-white);
	background-color:var(--jb-main);
}

.bold_button:hover{
	background-color:var(--jb-sub);
}

.emphasis_button{
	color:var(--jb-white);
	background-color:var(--jb-sub);
}

.emphasis_button:hover{
	background-color:var(--jb-main);
}
