/*폰트불러오기*/
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}


/* 초기화 */
html {font-size:10px;}
body {margin:0;padding:0;font-family: 'Pretendard', sans-serif;color:#000;font-weight:300;font-size: 1.6rem;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul, dl,dt,dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;}
input, button {margin:0;padding:0;font-family: 'Pretendard', sans-serif;}
input[type="submit"] {cursor:pointer}
button {cursor:pointer}
textarea, select {font-family: 'Pretendard', sans-serif;}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
a {color:#000;text-decoration:none}
a:hover{color:#000;text-decoration: none;}
a, button{
	transition:all .1s linear;
	-o-transition:all .1s linear;
	-moz-transition:all .1s linear;
	-webkit-transition:all .1s linear;
}
button{appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;/*아이폰 버튼 스타일 제거*/}
a:hover, button:hover{
	transition:all .1s linear;
	-o-transition:all .1s linear;
	-moz-transition:all .1s linear;
	-webkit-transition:all .1s linear;
}

*, :after, :before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

input[type=text],input[type=password], textarea {
-webkit-transition:all 0.30s ease-in-out;
-moz-transition:all 0.30s ease-in-out;
-ms-transition:all 0.30s ease-in-out;
-o-transition:all 0.30s ease-in-out;
outline:none;
}
input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus, .btn:focus {box-shadow:none;outline: none;}
input::-webkit-input-placeholder {color: #aaa !important;}
input:-ms-input-placeholder {color: #aaa !important;}
textarea::-webkit-input-placeholder {color: #9EA0B9 !important;}
textarea:-ms-input-placeholder { color: #9EA0B9 !important;}
img{max-width:100%;display:block;height: auto;}


:root {
	--main: #494599;
	--main-hover: #3B378E;
	--second: #E3E3E3;
	--second-hover: #ddd;
	--second-in: #888;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --breakpoint-xxl: 1400px;
    --max-width-sm: 540px;
    --max-width-md: 720px;
    --max-width-lg: 960px;
    --max-width-xl: 1140px;
    --max-width-xxl: 1320px;
}




.line_h1{line-height:1.0rem;}
.line_h1_1{line-height:1.1rem;}
.line_h1_2{line-height:1.2rem;}
.line_h1_3{line-height:1.3rem;}
.line_h1_4{line-height:1.4rem;}
.line_h1_5{line-height:1.5rem;}
.line_h1_6{line-height:1.6rem;}
.line_h1_7{line-height:1.7rem;}
.line_h1_8{line-height:1.8rem;}
.line_h1_9{line-height:1.9rem;}
.line_h2{line-height:2.0rem;}
.line_h100{line-height:100%;}
.line_h110{line-height:110%;}
.line_h120{line-height:120%;}
.line_h140{line-height:140%;}
.line_h170{line-height:170%;}


/*폰트커스텀 기본사이즈 10px*/
.fs_8 {font-size: 0.8rem;}
.fs_9 {font-size: 0.9rem;}
.fs_10 {font-size: 1.0rem;}
.fs_11 {font-size: 1.1rem;}
.fs_12 {font-size: 1.2rem;}
.fs_13 {font-size: 1.3rem;}
.fs_14 {font-size: 1.4rem;}
.fs_15 {font-size: 1.5rem;}
.fs_16 {font-size: 1.6rem;}
.fs_17 {font-size: 1.7rem;}
.fs_18 {font-size: 1.8rem;}
.fs_19 {font-size: 1.9rem;}
.fs_20 {font-size: 2.0rem;}
.fs_21 {font-size: 2.1rem;}
.fs_22 {font-size: 2.2rem;}
.fs_23 {font-size: 2.3rem;}
.fs_24 {font-size: 2.4rem;}
.fs_25 {font-size: 2.5rem;}
.fs_26 {font-size: 2.6rem;}
.fs_27 {font-size: 2.7rem;}
.fs_28 {font-size: 2.8rem;}
.fs_29 {font-size: 2.9rem;}
.fs_30 {font-size: 3.0rem;}
.fs_31 {font-size: 3.1rem;}
.fs_32 {font-size: 3.2rem;}
.fs_33 {font-size: 3.3rem;}
.fs_34 {font-size: 3.4rem;}
.fs_35 {font-size: 3.5rem;}
.fs_36 {font-size: 3.6rem;}
.fs_37 {font-size: 3.7rem;}
.fs_38 {font-size: 3.8rem;}
.fs_39 {font-size: 3.9rem;}
.fs_40 {font-size: 4.0rem;}
.fs_41 {font-size: 4.1rem;}
.fs_42 {font-size: 4.2rem;}
.fs_43 {font-size: 4.3rem;}
.fs_44 {font-size: 4.4rem;}
.fs_45 {font-size: 4.5rem;}
.fs_46 {font-size: 4.6rem;}
.fs_47 {font-size: 4.7rem;}
.fs_48 {font-size: 4.8rem;}
.fs_49 {font-size: 4.9rem;}
.fs_50 {font-size: 5.0rem;}
.fs_51 {font-size: 5.1rem;}
.fs_52 {font-size: 5.2rem;}
.fs_53 {font-size: 5.3rem;}
.fs_54 {font-size: 5.4rem;}
.fs_55 {font-size: 5.5rem;}
.fs_56 {font-size: 5.6rem;}
.fs_57 {font-size: 5.7rem;}
.fs_58 {font-size: 5.8rem;}
.fs_59 {font-size: 5.9rem;}
.fs_60 {font-size: 6.0rem;}
.fs_61 {font-size: 6.1rem;}
.fs_62 {font-size: 6.2rem;}
.fs_63 {font-size: 6.3rem;}
.fs_64 {font-size: 6.4rem;}
.fs_65 {font-size: 6.5rem;}
.fs_66 {font-size: 6.6rem;}
.fs_67 {font-size: 6.7rem;}
.fs_68 {font-size: 6.8rem;}
.fs_69 {font-size: 6.9rem;}


.fw_100 {font-weight: 100;}
.fw_200 {font-weight: 200;}
.fw_300 {font-weight: 300;}
.fw_400 {font-weight: 400;}
.fw_500 {font-weight: 500;}
.fw_600 {font-weight: 600;}
.fw_700 {font-weight: 700;}
.fw_800 {font-weight: 800;}
.fw_900 {font-weight: 900;}

.fc_wh{color:#fff;}
.fc_or{color:#F47D63;}
.fc_pup{color:#494599;}
.fc_graaa{color:#aaa;}
.fc_gr999{color:#999;}
.fc_gr888{color:#888;}
.fc_gr777{color:#777;}
.fc_gr666{color:#666;}
.fc_gr444{color:#444;}
.fc_gr222{color:#222;}
.fc_bk{color:#000;}
.fc_bl{color:#4669D8;}


.text-primary{color:#494599 !important;}
.text-warning{color:#F47D63 !important;}

.wh_pre{white-space:pre-line;}
.word_keep{word-break: keep-all;}


.bg-primary {background-color: var(--main) !important;}
.bg_gr888{background:#888;}
.bg_gr999{background:#999;}
.bg-dark{background:#353A3E;}
.bg-transparent{background:transparent;}
.bg-dark{background:#353A3E;}
.bg-white{background:#fff;}
.bg-light{background:#F6F6F6;}
.bg-info {background-color: #0d6efd!important;}


/*border 선 커스텀*/
.border,
.border-top,
.border-bottom,
.border-left,
.border-right{border-color:#e3e3e3 !important;}



.border-primary {border-color: var(--main) !important;}

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

.cont_wr{max-width:1230px;margin:0 auto;padding: 0 15px; position: relative;}
.cont_wr:after{content:""; display:block; clear:both;}

.badge {padding: 0.5em 0.9em;font-size: 1.4rem;font-weight: 500;border-radius: 0.5rem;}
.badge-secondary {
    color: #494599;
    background-color: #ECEFFF;
}

.line_text{
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.line_text2{
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    line-height: 1.4em;
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/*버튼커스텀*/

.btn-primary {
	color: #fff;
	background-color: var(--main);
	border-color: var(--main);
}

.btn-primary:hover {
	color: #fff;
	background-color: var(--main-hover);
	border-color: var(--main-hover);
}

.btn-primary:focus, 
.btn-primary.focus {
	color: #fff;
	background-color: var(--main-hover);
	border-color: var(--main-hover);
	box-shadow: 0 0 0 0.1rem var(--main-hover);
}

.btn-primary.disabled, 
.btn-primary:disabled {
	color: #fff;
	background-color: var(--main);
	border-color: var(--main);
}

.btn-primary:not(:disabled):not(.disabled):active, 
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
	color: #fff;
	background-color: var(--main-hover);
	border-color: var(--main-hover);
}


.btn-secondary {
	color: #757575;
	background-color: var(--second);
	border-color: var(--second);
}

.btn-secondary:hover {
	color: #444;
	background-color: var(--second-hover);
	border-color: var(--second-hover);
}

.btn-secondary:focus, 
.btn-secondary.focus {
	color: #444;
	background-color: var(--second-hover);
	border-color: var(--second-hover);
	box-shadow: 0 0 0 0.1rem var(--second-hover);
}

.btn-secondary.disabled, 
.btn-secondary:disabled {
	color: #444;
	background-color: var(--second);
	border-color: var(--second);
}

.btn-secondary:not(:disabled):not(.disabled):active, 
.btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
	color: #444;
	background-color: var(--second-hover);
	border-color: var(--second-hover);
}



.btn-outline-primary {
	color: var(--main) ;
	background-color:#fff;
	border-color: var(--main);
}

.btn-outline-primary:hover {
	color: var(--main-hover);
	background-color:#fff;
	border-color: var(--main-hover);
}
.btn-outline-primary:not(:disabled):not(.disabled):active, 
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
	color: #fff;
	background-color: var(--main);
	border-color: var(--main);
}

.btn-outline-secondary {
	color: var(--second-in) ;
	background-color:#fff;
	border-color: var(--second);
}

.btn-outline-secondary:hover {
	color:  var(--second-in);
	background-color:#fff;
	border-color: var(--second-in);
}
.btn-outline-secondary:not(:disabled):not(.disabled):active, 
.btn-outline-secondary:not(:disabled):not(.disabled).active,
.show > .btn-outline-secondary.dropdown-toggle {
	color: #fff;
	background-color: var(--second);
	border-color: var(--second);
}

.btn{border-radius:0;font-size:1.6rem;padding:1.0rem 2.184rem;}
.btn-lg{padding: 1.45rem 7.0rem;}
.btn-sm{padding: 0.35rem 1.4rem;}




/*입력 인풋 input*/
.ip_wr{margin-bottom:2.0rem;}
.ip_tit{font-size:1.6rem;color:#000;font-weight:700;}
.form-control {
    padding: 0 2rem;
    font-size: 1.6rem;
    height: calc(2.2rem + 2.2rem + 2px);
    border-radius: 0;
    border-color: #e3e3e3;
    color: #222;
    font-weight: 200;
}
.form-control:focus{color: #222;border-color: #000;}
.form-control:disabled, .form-control[readonly] {
    background-color: #F6F6F6;
    opacity: 1;
}
textarea.form-control {
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.input-group:not(.has-validation)>.form-control:not(:last-child){
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin-right: 0.7rem;
}
.input-group>.input-group-append>.btn{border-top-left-radius:0; border-bottom-left-radius: 0;width:12.0rem;padding-left:1.0rem;padding-right:1.0rem;}
.input-group>.btn{}

input.form-control[type="date"]{background:url(../img/calendar_ic.png)no-repeat right 2.0rem center;background-size:2.4rem auto;}
input.form-control[type="date"]::before {content:attr(data-placeholder);width:100%;color:#c3c3c3;line-height:2.0rem;}
input.form-control[type="date"]:focus:before, input[type="date"]:valid:before{display: none;}
input.form-control[type="date"]::-webkit-calendar-picker-indicator{opacity:0;z-index: 1;cursor: pointer;}
.custom-select {
    height: calc(2.2rem + 2.2rem + 2px);
    padding: 0 2rem;
    font-size: 1.6rem;
	background:url(../img/sel_arrow.png) right 2.0rem center/1.4rem auto no-repeat;
	color: #000;
	border-radius: 0;
	border-color: #e3e3e3;
}
.ip_wr .custom-select{margin-right: 0.7rem;}
.custom-select.border-0{padding:0 2.5rem 0 0;background-position: right center;text-align: right;}

.custom-file{height: calc(2.2rem + 2.2rem + 2px);}
.custom-file-input{height: calc(2.2rem + 2.2rem + 2px);}
.custom-file-label{height: calc(2.2rem + 2.2rem + 2px);border-radius:0;padding: 1rem 0.75rem;}

.custom-file-label::after {
    height: calc(2.2rem + 2.0rem + 2px);
    padding: 1rem 0.75rem;
    content: "이미지업로드";
    background-color: #ffffff;
    border-radius: 0;
    border: 1px solid #494599;
    color: #494599;
}

/*페이저*/
.pagination .page-link {
    padding: 0;
    border: 0;
    color: #999;
    width: 4.6rem;
    height: 4.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
	background:#eee;
	border-radius: 50%;
	margin:0 0.5rem;
}
.page-item.active .page-link {z-index: 3;color: #fff;background-color: #494599;border: 0;border-radius: 50%;}
.page-item:last-child .page-link, .page-item:first-child .page-link {border: 0;border-radius: 50% !important;}
.page-item .page-link:hover {background-color: #494599;color: #fff;}

/*체크박스*/
.checks {position: relative;}
.checks input[type="checkbox"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }
.checks input[type="checkbox"] + label {
    display: inline-block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
	color: #000;
	padding-top: 1px;
	margin: 0;
}
.checks input[type="checkbox"] + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 2px;
    width: 20px;
    height: 20px;
    text-align: center;
    background: url(./../img/check_off.png)no-repeat center;
	background-size:100%;
}
.checks input[type="checkbox"] + label:active:before, .checks input[type="checkbox"]:checked + label:active:before {color:#000;}
.checks input[type="checkbox"]:checked + label:before {}
.checks input[type="checkbox"]:checked + label:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 0;
    width: 20px;
    height: 20px;
    background: url(./../img/check_on.png)no-repeat center;
	background-size:100%;
}


/*라디오*/
.checks {position: relative;}
.checks input[type="radio"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }
.checks input[type="radio"] + label {
    display: inline-block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
	color: #37383A;
	padding-top: 2px;
	margin: 0;
}
.checks input[type="radio"] + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 2px;
    width: 20px;
    height: 20px;
    text-align: center;
    background: url(./../img/check_off.png)no-repeat center;
	background-size:100%;
}
.checks input[type="radio"] + label:active:before, .checks input[type="radio"]:checked + label:active:before {color:#000;}
.checks input[type="radio"]:checked + label:before {}
.checks input[type="radio"]:checked + label:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 0;
    width: 20px;
    height: 20px;
    background: url(./../img/check_on.png)no-repeat center;
	background-size:100%;
}

/*너비 넓이*/
.w-5{width:5%;}
.w-10{width:10%;}
.w-15{width:15%;}
.w-20{width:20%;}
.w-30{width:30%;}
.w-35{width:35%;}
.w-40{width:40%;}
.w-45{width:45%;}
.w-55{width:55%;}
.w-60{width:60%;}
.w-65{width:65%;}
.w-70{width:70%;}
.w-80{width:80%;}
.w-85{width:85%;}
.w-90{width:90%;}
.w-95{width:95%;}

.card-img, .card-img-top{box-sizing: border-box;}

/*모달*/
.modal-open .modal {padding: 0 !important;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
.modal-open .modal::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}

.modal-header{border-bottom: 1px solid #e3e3e3;border-top-left-radius: calc(0.5rem - 1px);border-top-right-radius: calc(0.5rem - 1px);padding: 1.3rem 3.0rem;}
.modal-header .close {font-size: 2.4rem;opacity:1; padding: 1rem 0;margin: -0.9rem -1rem -1rem auto;}
.modal-body{padding:3.0rem;}
.modal-dialog-scrollable .modal-body{
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
.modal-dialog-centered.modal-dialog-scrollable {
    height: calc(100% - 3rem);
}
.modal-dialog-centered {
    min-height: calc(100% - 3rem);
}
.modal-dialog-scrollable .modal-body::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}
.modal-content{border:0;}
.modal-footer{border-top:0;justify-content: center;border-bottom-right-radius: calc(0.5rem - 1px);border-bottom-left-radius: calc(0.5rem - 1px);padding: 1rem 3rem 3rem;}
.modal-sm {max-width: 400px;}

@media (min-width: 1199.98px) {
	.container, .container-sm, .container-md, .container-lg, .container-xl {
		max-width: 1200px;
	}
	.badge {padding: 0.4em 0.74em;}
}

/*반응형 max 1200 xl*/
@media (max-width: 1199.98px) {

}

/*반응형 max 992px lg*/
@media (max-width: 991.98px) {
	body {font-size:1.4rem;}
	.btn-lg {padding: 1rem 3rem;font-size: 1.4rem;}
	.form-control {padding: 0 1.3rem;font-size: 1.4rem;}
	
	.btn {font-size: 1.4rem;}
	.ip_tit{font-size:1.5rem;}

	.pagination .page-link {
		width: 3.6rem;
		height: 3.6rem;
		margin: 0 0.3rem;
	}
}


/*반응형 max 767px md*/
@media (max-width: 767.98px) {
	input.form-control[type="date"] {
		background: url(../img/calendar_ic.png)no-repeat right 1.5rem center;
		background-size: 1.6rem auto;
	}

}

/*반응형 max 576px sm*/
@media (max-width: 575.98px) {
	.input-group>.input-group-append>.btn {
		padding-left: 0.5rem;
		padding-right: 0.5rem;
		width: 9rem;
	}
	.form-control {height: calc(1.9rem + 2.2rem + 2px);}
	.custom-select {padding: 0 1rem;font-size: 1.4rem;background: url(../img/sel_arrow.png) right 1rem center/1rem auto no-repeat;height: calc(1.9rem + 2.2rem + 2px);}

	.ip_wr .fs_14{font-size:1.3rem;}

	.modal-header { padding: 1.0rem 2rem;}
	.modal-title{font-size: 1.6rem !important;}
	.modal-header .close {font-size: 2.0rem; margin: -0.8rem -1rem -1rem auto;}
	.modal-body {padding: 2rem;}
	.modal-dialog { margin: 1.5rem;}
	.modal-footer {padding: 0.8rem 1.7rem 2rem;}


	.badge {
		padding: 0.5em 0.3em;
		font-size: 1.2rem;
	}

	.f_reac .fs_35{font-size:2.6rem;}
	.f_reac .fs_28{font-size:2.4rem;}
	.f_reac .fs_26{font-size:2.3rem;}
	.f_reac .fs_25{font-size:2.2rem;}
	.f_reac .fs_20{font-size:1.8rem;}
	.f_reac .fs_19{font-size:1.6rem;}
	.f_reac .fs_18{font-size:1.6rem;}
	.f_reac .fs_16{font-size:1.4rem;}
	.f_reac .fs_15{font-size:1.3rem;}
	.f_reac .fs_14{font-size:1.2rem;}

/*반응형 max 320px*/
@media (max-width: 320px) {
	body {font-size:1.3rem;}
	.f_reac .fs_35{font-size:2.5rem;}
	.f_reac .fs_28{font-size:2.3rem;}
	.f_reac .fs_26{font-size:2.2rem;}
	.f_reac .fs_25{font-size:1.9rem;}
	.f_reac .fs_20{font-size:1.7rem;}
	.f_reac .fs_19{font-size:1.5rem;}
	.f_reac .fs_18{font-size:1.4rem;}
	.f_reac .fs_16{font-size:1.3rem;}
	.f_reac .fs_15{font-size:1.2rem;}
	.f_reac .fs_14{font-size:1.1rem;}
}



