@charset "utf-8";
/* form */
input,
label,
select,
button
{
    margin:0;
    border:0;
    padding:0;
    display:inline-block;
    vertical-align:middle;
    white-space:normal;
    background:none;
    line-height:1;
    font-family: 'Pretendard';
}
textarea
{
    margin:0;
    border:0;
    padding:0;
    display:inline-block;
    vertical-align:middle;   
    background:none;
    line-height:1;
    font-family: 'Pretendard';
}


/* Input Reset  */
input[type="checkbox"]{-webkit-appearance:none; -webkit-border-radius:0; background-color:transparent;}
input[type="radio"]{-webkit-appearance:none; -webkit-border-radius:0; background-color:transparent;}
input[type="file"] {border:0px solid #ccc;}
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="image"], input[type="tel"], input[type="number"], textarea {border-radius: 0px;-ms-border-radius: 0;-webkit-border-radius: 0;-moz-border-radius: 0;-webkit-appearance: none;}

input:not([type='checkbox,radio']):focus::-webkit-input-placeholder {color: transparent;}
input:hover {border-radius:0px}
input:focus {outline: none;background-color:#fff;border-color:var(--concept-color);}

/* Mobile Reset */
*{-webkit-text-size-adjust:none}

input::placeholder {color:#888;font-size:15px;}
input:-ms-input-placeholder {color:#888;font-size:15px;}
input::-ms-input-placeholder { color:#888;font-size:15px;}
input::-webkit-input-placeholder {color:#888;font-size:15px;}
input::-moz-placeholder {color:#888;font-size:15px;}

textarea::placeholder {color:#888;font-size:15px;}
textarea:-ms-input-placeholder {color:#888;font-size:15px;}
textarea::-ms-input-placeholder {color:#888;font-size:15px;}
textarea::-webkit-input-placeholder {color:#888;font-size:15px;}
textarea::-moz-placeholder {color:#888;font-size:15px;}

select{-webkit-border-radius:0}

button {font-family: 'Pretendard', sans-serif; font-style: normal;font-weight:500; cursor:pointer;}
button * { margin:0; padding:0;}
button::-moz-focus-inner { padding:0; border:0;}

input[type=checkbox] { display: none;  }
input[type=checkbox] + label{display: inline-block;  cursor: pointer;  position: relative;padding-left:30px;margin-right:0px; font-size: 15px; line-height:20px;font-weight: 400; color:#545454;vertical-align:top;}
input[type=checkbox]+ label:before {content: "";  display: inline-block;width:20px;height:20px;transition:all .2s;position:absolute; left:0; top:0;background:url(/images/layout/i_chkbox_wh.png) 50% 50% no-repeat #d9d9d9;border:0px solid #d9d9d9;border-radius:4px;} 
input[type=checkbox]:checked + label:before { background:url(/images/layout/i_chkbox_wh.png) 50% 50% no-repeat var(--concept-color);border:0px solid var(--concept-color);}  

input[type=radio] { display: none;  }
input[type=radio] + label{display: inline-block;  cursor: pointer;  position: relative;padding-left:24px;margin-right:0px; font-size:15px; line-height:16px;font-weight: 400;color:#545454;vertical-align:top;}
input[type=radio]+ label:before {content: "";  display: inline-block;width:16px;height:16px;transition:all .2s;position:absolute; left:0; top:0; border:4px solid #ccc; border-radius:50%;} 
input[type=radio]:checked + label:before {border:5px solid var(--concept-color); text-align: center;} 

button,
input[type=reset],
input[type=button],
input[type=submit],
input[type=checkbox],
input[type=radio],
select, 
input,
textarea
{
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
}

input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=range],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week]
{
    
}

input[type=search]
{
    -webkit-appearance:textfield;
    -webkit-box-sizing:content-box;
}

::-webkit-search-decoration
{
    display:none;
}

button,
input[type="reset"],
input[type="button"],
input[type="submit"]
{
    overflow:visible;
    width:auto;
}

::-webkit-file-upload-button
{
    padding:0;
    border:0;
    background:none;
}

textarea
{
    vertical-align:top;overflow:auto;
}
select
{
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    outline-width:0;    
}
select::-ms-expand {
    display: none;
}
select[multiple]
{
    vertical-align:top;
}
input[type=text]::-ms-clear {
    display:none;
}

/* @@@@@ form new @@@@@ */
.form-style-k {position: relative;/* margin-top: 2.25rem;margin-bottom: 2.25rem; */ }
.form-style-k input {height: 35px;box-sizing: border-box;}
.form-style-k textarea {resize: none; height:150px; }
.form-style-k select {width: 100%;font-size:16px;height:35px;padding:0px 30px 0px 5px; background: none; border: none; line-height: 1.9; box-shadow: none;box-sizing: border-box;}
.select-arrow-k{position: absolute;top: 40%;right:0px;width: 0;height: 0;pointer-events: none;border-style :solid;border-width: 8px 5px 0 5px;border-color: #3e4358 transparent transparent transparent;}

.form-style-k .control-label {position: absolute;top: 4px; pointer-events: none; padding-left: 2px; z-index: 1;color: #aaa;font-size:16px;font-weight: normal; -webkit-transition: all 0.28s ease; transition: all 0.28s ease;}
.form-style-k .bar { position: relative;border-bottom: 1px solid #999;display: block;}
.form-style-k .bar::before {content: '';height: 2px; width: 0;left: 50%;bottom: -1px; position: absolute;background: var(--concept-color); -webkit-transition: left 0.28s ease, width 0.28s ease; transition: left 0.28s ease, width 0.28s ease;z-index: 2;}
.form-style-k input,
.form-style-k textarea {display: block;background: none;padding: 2px 2px 1px; font-size: 16px; border-width: 0; border-color: transparent; line-height: 1.9; width: 100%; color: transparent; -webkit-transition: all 0.28s ease; transition: all 0.28s ease; box-shadow: none;box-sizing: border-box; }

.form-style-k input[type="file"] {line-height: 1;}
.form-style-k input[type="file"] ~ .bar {display: none;}
.form-style-k select, .form-style-k input:focus, .form-style-k input:valid,  .form-style-k input.form-file,  .form-style-k input.has-value,  .form-style-k textarea:focus,  .form-style-k textarea:valid,  .form-style-k textarea.form-file,  .form-style-k textarea.has-value {color: #333;}
.form-style-k select ~ .control-label,  .form-style-k input:focus ~ .control-label, .form-style-k input:valid ~ .control-label,  .form-style-k input.form-file ~ .control-label,  .form-style-k input.has-value ~ .control-label,  .form-style-k textarea:focus ~ .control-label,  .form-style-k textarea:valid ~ .control-label, .form-style-k textarea.form-file ~ .control-label,  .form-style-k textarea.has-value ~ .control-label {font-size: 16px; color: #aaa; top: -16px; left: 0;}

.form-style-k span.required{position:relative;display: inline-block;padding-left:15px;}
.form-style-k span.required::before{position:absolute; right:0; top:0;content: '*';width:10px;height:10px;border-radius: 0%;font-size:14px;color: #ff0000;}

.form-style-k select:focus, .form-style-k input:focus,  .form-style-k textarea:focus {outline: none;}
.form-style-k select:focus ~ .control-label,  .form-style-k input:focus ~ .control-label,  .form-style-k textarea:focus ~ .control-label { color: var(--concept-color);}
.form-style-k select:focus ~ .bar::before,  .form-style-k input:focus ~ .bar::before, .form-style-k textarea:focus ~ .bar::before { width: 100%;left: 0;}

.has-error .legend.legend, .has-error.form-style-k .control-label.control-label {color: #d9534f; }
.has-error.form-style-k .form-help, .has-error.form-style-k .helper, .has-error.checkbox .form-help,  .has-error.checkbox .helper, .has-error.radio .form-help, .has-error.radio .helper, .has-error.form-radio .form-help,  .has-error.form-radio .helper { color: #d9534f;}
.has-error .bar::before {  background: #d9534f;left: 0; width: 100%;}

/* select custom */
.select-wrap { position: relative;display: block;}
.select-wrap .nice-select { position: relative; -webkit-tap-highlight-color: transparent; background-color: #fff; clear: both;cursor: pointer; display: block; font-size:15px;color: #333;height: 40px; line-height: 38px; border: 1px solid var(--second-color); outline: none; padding-left:20px;  padding-right: 35px; text-align: left; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; width:100%;  box-sizing: border-box; z-index:1;}

.select-wrap .nice-select > span.current {display: block;overflow: hidden; text-overflow: ellipsis;}
.select-wrap .nice-select > span.current.placeholder {color:#888;font-size:14px;}
.select-wrap .nice-select.open {border-color: var(--concept-color); border-bottom-left-radius: 0; border-bottom-right-radius: 0; box-sizing: border-box;font-weight:600; z-index:6;}
.select-wrap .nice-select.disabled { opacity: 0.5;}

/* .select-wrap .nice-select:after {  content: ""; width: 8px; height: 8px; border: 1px solid #666; border-top: none; border-left: none; display: block; margin-top: -6px; pointer-events: none; position: absolute; right: 16px;top: 50%; transform: rotate(45deg); -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out;}
.select-wrap .nice-select.open:after {transform: rotate(225deg);margin-top: -2px;}
 line  */

.select-wrap .nice-select:after{position:absolute;right:16px;top:50%;content: '';width:10px;height:10px;/*border-top: 2px solid var(--concept-color);border-right: 2px solid var(--concept-color);*/ border: 2px solid var(--concept-color); border-top: none; border-left: none;transform: rotate(45deg);-webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out;pointer-events:none; margin-top: -7px;}
/*.select-wrap .nice-select:after {  content: ""; width: 0;height: 0;border-style :solid;border-width: 9px 6px 0 6px;border-color: var(--concept-color) transparent transparent transparent; display: block; margin-top:-5px; pointer-events: none; position: absolute; right: 16px;top: 50%; -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out;} */
.select-wrap .nice-select.open:after {transform: rotate(225deg);margin-top: -2px;}

.select-wrap .nice-select.open .list { opacity: 1; pointer-events: auto; border-color: var(--concept-color); -webkit-transform: scale(1) translateY(0); -ms-transform: scale(1) translateY(0); transform: scale(1) translateY(0); z-index: 6;}
.select-wrap .nice-select.disabled {background: #f5f5f5; color: #888; pointer-events: none;}
.select-wrap .nice-select.disabled:after { border-color: #cccccc;}
.select-wrap .nice-select .list {display: block; width:calc(100% + 2px);background: #fff; border: 1px solid transparent;border-top: none;box-sizing: border-box;opacity: 0; overflow: hidden;padding: 0; pointer-events: none; position: absolute;top: 100%; left: -1px;right: -1px;-webkit-transform-origin: 50% 0; -ms-transform-origin: 50% 0;transform-origin: 50% 0; -webkit-transform: scale(0.75) translateY(-21px); -ms-transform: scale(0.75) translateY(-21px);transform: scale(0.75) translateY(-21px); z-index:6; }
.select-wrap .nice-select .list:hover .option:not(:hover) { background-color: transparent;}
.select-wrap .nice-select .option {display: block;width:100%; cursor: pointer;font-weight: 400;line-height: 40px; list-style: none; min-height: 40px;outline: none;padding: 0 20px;font-size: 14px; text-align: left;box-sizing: border-box; -webkit-transition: all 0.2s;transition: all 0.2s;}
.select-wrap .nice-select .option:hover,
.select-wrap .nice-select .option.focus,
.select-wrap .nice-select .option.selected.focus { background-color: #f1f1f1;}
.select-wrap .nice-select .option.selected {font-weight: bold;}
.select-wrap .nice-select .option.disabled {background-color: transparent;color: #999;cursor: default;}

/* line */
.select-wrap.line .nice-select {background-color: transparent; border: 1px solid #ccc;border-width:0 0 1px 0; padding-left:0px;  padding-right:20px;}
.select-wrap.line .nice-select .list {border: 1px solid var(--concept-color);border-top:1px solid var(--concept-color);}
.select-wrap.line .nice-select .option {padding: 0 10px;}
.select-wrap.line .nice-select:after{right:5px;}

/* @@@@@ form new END @@@@@ */

.select_sty{position:relative;display:inline-block;vertical-align:middle;background:#fff;}
.select_sty select{width:100%;height:40px;padding:0px 30px 0px 10px;border:1px solid #dfdfdf;background:#fff;color:#000;font-size:15px;cursor: pointer;  border-radius:4px;box-sizing:border-box;}
.select_sty.lg select{height:50px;}
.select_sty.sm select{height:26px;font-size:14px;}
.select_sty.line select{border-width:0 0 1px 0;background: transparent;border-radius:0px;}

.select__arrow{position: absolute;top: 40%;right:15px;width: 0;height: 0;pointer-events: none;border-style :solid;border-width: 8px 5px 0 5px;border-color: #3e4358 transparent transparent transparent;}
.select__arrow_2{position: absolute;top: 40%;right:5px;pointer-events: none;width:9px; height:9px;border: 2px solid #3e4358;border-top: none;border-right: none; transform: rotate(-45deg);} /* line */

.input_sty{display:inline-block;vertical-align:middle;transition: all 0.3s ease-out}
.input_sty input{width:100%;height:40px;padding:0 10px;border:1px solid #dfdfdf;background:#fff;color:#000;font-size:15px;border-radius:4px;box-sizing:border-box;}
.input_sty input:focus {outline: none;background:#fff;border-color:var(--concept-color);}
.input_sty input:disabled, .input_sty input:read-only {background:#f1f1f1;}
.input_sty input:disabled:focus, .input_sty input:read-only:focus {border-color:#dfdfdf; }
.input_sty.lg input{height:50px;}
.input_sty.sm input{height:26px;}
.input_sty.line input{padding:0 0px;border:1px solid #ccc;border-width:0 0 1px 0; border-radius:0px;}

.input_search{position:relative;display:inline-block;vertical-align:middle;transition: all 0.3s ease-out}
.input_search input{width:100%;font-size:15px;color:#444;height:40px;padding:0px 40px 0 10px;border:1px solid #dfdfdf;background:#fff;border-radius:4px;box-sizing:border-box;}
.input_search input:focus {outline: none;background-color: transparent;border-color:var(--concept-color);}
.input_search .btn__search{ position: absolute;top:0;right:15px;width:18px;height:40px;background:url(/images/layout/i_search_18.png) 0 50% no-repeat;text-indent: -9999px; /* top:50%;transform:translateY(-50%); */}

.textArea_sty1{}
.textArea_sty1 textarea{display: inline-block;width:100%;border:1px solid #dfdfdf;height:200px;font-weight: 400;color:#000;font-size:15px;padding:10px;background:#fff;border-radius:4px;box-sizing: border-box;}
.textArea_sty1 textarea:focus {outline: none;border-color:var(--concept-color);}

.input_id{vertical-align:middle;height:40px;border-bottom:1px solid #d1d1d1;box-sizing:border-box;transition: all 0.3s ease-out} /* id */
.input_id input{width:100%; height:38px;padding:5px 5px 5px 35px;background:url(/images/layout/login-id.png) 5px 50% no-repeat;color:#666;box-sizing:border-box;}

.input_pw{vertical-align:middle;height:40px;border-bottom:1px solid #d1d1d1;box-sizing:border-box;transition: all 0.3s ease-out} /* pw */
.input_pw input{width:100%; height:38px;padding:5px 5px 5px 40px;background:url(/images/layout/login-pw.png) 5px 50% no-repeat;color:#666;box-sizing:border-box;}

.input_mail{vertical-align:middle;height:40px;border-bottom:1px solid #d1d1d1;box-sizing:border-box;transition: all 0.3s ease-out} /* pw */
.input_mail input{width:100%; height:38px;padding:5px 5px 5px 40px;background:url(/images/layout/icon-mail.png) 5px 50% no-repeat;color:#666;background-size:20px auto;  box-sizing:border-box;}

.input_calendar{position: relative;display:inline-block;vertical-align:middle;height:35px;border:0px solid #d9d9d9;background-color: transparent;border-radius:0px;box-sizing:border-box;transition: all 0.3s ease-out}
.input_calendar input{height:35px;padding:0px 25px 0px 2px;text-align:center;box-sizing:border-box;color:#666;font-size:13px;font-family: 'NotoSansKR'; font-style: normal; font-weight: 400;border-radius:0px;width:100%;}
.input_calendar input:focus {outline: none;background-color: transparent;border-color:var(--concept-color);}
.input_calendar input:disabled {background:#f1f1f1;}
.input_calendar .i_calendar{position: absolute;right:5px;top:0;border:0;display: inline-block;width:16px; height:20px;background:url(/images/layout/icon_calendar.png) 0 50% no-repeat;text-indent: -9999px;}

.checkbox{position:relative;}


/* btn-type -------------------------------------------------------------------*/
.btn-group { display: flex; margin:4rem 0; gap:10px}
.btn-group.mw150 > * {min-width:150px;}
.btn-group.mw200 > * {min-width:200px;}
.btn-group.mw250 > * {min-width:250px;}
.btn-group.center { display: flex;justify-content: center;}
.btn-group.space-between {justify-content: space-between;}
.btn-group.right { justify-content: flex-end;}

.btn-group.wrap { display: flex;flex-wrap: wrap; margin:3rem 0; gap:10px}
.btn-group.wrap > * {min-width:260px;}

.btn-type {display:inline-flex;align-items: center; position:relative;cursor:pointer;transition:all 0.3s; line-height:1;padding:0 20px;font-family: 'Pretendard';text-align:center; justify-content: center;text-transform:capitalize;/*text-transform:uppercase;*/ border-radius:4px;box-sizing: border-box;}
.btn-type.btn {height:40px;font-weight:500;font-size:14px;} /* basic */
.btn-type.btn-lg {height:46px;font-weight:500;font-size:16px;}
.btn-type.btn-m {height:35px;font-weight:500;font-size:14px;}
.btn-type.btn-s {height:26px;font-weight:500;font-size:13px;padding:0 15px;}

.btn-type.rbtn {height:40px;font-weight:500;font-size:14px;border-radius:24px;}
.btn-type.rbtn-lg {height:50px;font-weight:500;font-size:16px;border-radius:24px;padding:0 30px;}
.btn-type.rbtn-m {height:35px;font-weight:500;font-size:14px;border-radius:24px;}
.btn-type.rbtn-s {height:26px;font-weight:500;font-size:13px;border-radius:24px;}

.btn-type.rbtn-1 {position: relative;height:40px;padding:0px 30px 0px 25px;justify-content:flex-start; font-size:16px;text-transform:uppercase;font-weight:600; border-radius:24px;}
.btn-type.rbtn-1::after { content: ' ';position: absolute; top: 50%;right: 20px; width: 8px; height: 2px; margin-top: -1px;background:#777; }
.btn-type.rbtn-1::before { content: ' ';position: absolute; top: 50%;right: 20px; width: 8px; height: 2px; margin-top: -1px;background:#777; transform: rotate(90deg);}

.btn-type.rbtn-2 {position: relative;height:40px;padding:0px 30px 0px 25px;justify-content:flex-start; font-size:16px;text-transform:uppercase;font-weight:600; border-radius:24px;}
.btn-type.rbtn-2::after { content: ' ';position: absolute; top: 50%;right: 20px; width: 8px; height: 2px; margin-top: -1px;background:var(--concept-color); }
.btn-type.rbtn-2::before { content: ' ';position: absolute; top: 50%;right: 20px; width: 8px; height: 2px; margin-top: -1px;background:var(--concept-color); transform: rotate(90deg);}

.btn-type.rbtn-3 {position: relative;height:45px;padding:0px 30px 0px 25px;justify-content:flex-start; font-size:16px;text-transform:uppercase;font-weight:600; border-radius:24px;}
.btn-type.rbtn-3::after { content: ' ';position: absolute; top: 50%;right: 20px; width: 8px; height: 2px; margin-top: -1px;background:var(--concept-color); }
.btn-type.rbtn-3::before { content: ' ';position: absolute; top: 50%;right: 20px; width: 8px; height: 2px; margin-top: -1px;background:var(--concept-color); transform: rotate(90deg);}

.i-arrow-wh{display: inline-block;min-height:15px;padding-right:40px;background:url(/images/layout/i-arrow-wh.png) right center no-repeat; }
.i-arrow-wh > em{font-style: normal;font-weight: 900;}

.i-arrow-b{display: inline-block;min-height:5px;padding-right:50px;background:url(/images/layout/i-arrow-b.png) right center no-repeat; }
.i-arrow-b > em{font-style: normal;font-weight:700;font-size:18px;margin-right:5px;}


.btn-type.off {color:#fff !important;border:1px solid #d3d5d7;background:#d3d5d7; paint-order:none; cursor:not-allowed;}

.i_right_arrow_wh {position: relative; padding-right:20px; text-align: left;}
.i_right_arrow_wh::after { content: ' ';position: absolute; top: 50%;right: 0px; width: 8px; height: 8px; margin-top: -4px;border: 1px solid #fff;border-top: none;border-right: none; transform: rotate(-135deg);}

.i_left_arrow {position: relative; padding-left:15px; text-align: left;}
.i_left_arrow::after { content: ' ';position: absolute; top: 50%;left: 0px; width: 8px; height: 8px; margin-top: -4px;border: 1px solid #666;border-top: none;border-right: none; transform: rotate(45deg);}

.i_right_arrow {position: relative; padding-right:15px; text-align: left;}
.i_right_arrow::after { content: ' ';position: absolute; top: 50%;right: 0px; width: 8px; height: 8px; margin-top: -4px;border: 1px solid #666;border-top: none;border-right: none; transform: rotate(-135deg);}
.i_right_arrow.point::after {border: 1px solid var(--point-color);border-top: none;border-right: none; transform: rotate(-135deg);}

.i_download {display:inline-block;min-height:12px; padding-right:30px;background:url(/images/layout/i_filedown.png) right center no-repeat;}
.i_right_w{display: inline-block;height:4.3rem;padding-right:34px;background:url(/images/layout/i_right_w.png) right center no-repeat;}
.i_edit{display: inline-block;min-height:20px;padding-left:30px;background:url(/images/layout/i_edit.png) left center no-repeat;line-height:20px;}
.i-print{display: inline-block;min-height:18px;padding-left:28px;background:url(/images/layout/i_print-w.png) left center no-repeat;line-height:18px;}
.i_list_wh{display:inline-block;height:14px;padding-left:28px;background:url(/images/layout/ico_list_wh.png) left center no-repeat; line-height:14px;}
.i_edit_wh{display: inline-block;min-height:20px;padding-left:30px;background:url(/images/layout/i_edit_wh.png) left center no-repeat;line-height:20px;}
.i_phone{display: inline-block;min-height:20px;padding-left:24px;background:url(/images/layout/icon-phone.png) left center no-repeat;line-height:20px;}
.i_phone_wh{display: inline-block;min-height:20px;padding-left:20px;background:url(/images/layout/icon-phone-wh.png) left center no-repeat;line-height:20px; background-size:auto 14px; font-family: 'Pretendard';font-weight:400;font-size:14px;color:#fff; margin-right:10px;}
.i_download_wh {display:inline-block;width:15px;height:12px;background:url(/images/layout/i_filedown_wh.png) 50% 50% no-repeat;}

button:disabled,
button[disabled]{
    border: 1px solid #dfdfdf !important;
    background-color: #dfdfdf !important;
  color: #fff !important;
  pointer-events: none;
}


/* color */
.btn-type.black {color:#fff !important;border:1px solid #000;background:#000}
.btn-type.blue {color:#fff !important;border:1px solid #337bcc;background:#337bcc}
.btn-type.dblue {color:#fff !important;border:1px solid #2f3858;background:#2f3858}
.btn-type.dgray {color:#fff !important;border:1px solid #3c3e44;background:#3c3e44}
.btn-type.gray {color:#fff !important;border:1px solid #717379;background:#717379}
.btn-type.lgray {color:#fff !important;border:1px solid #a3a5aa;background:#a3a5aa}
.btn-type.white{color:#323232 !important;border:1px solid #707070;background:#fff}
.btn-type.red {color:#fff !important;border:1px solid #e60012;background:#e60012}
.btn-type.orange {color:#fff !important;border:1px solid #fb9347;background:#fb9347}
.btn-type.green {color:#fff !important;border:1px solid #1fb25a;background:#1fb25a}
.btn-type.black_line {color:#262729 !important;border:1px solid #262729;background:#fff}
.btn-type.gray_line {color:#717379 !important;border:1px solid #717379;background:#fff}
.btn-type.lgray_line {color:#a3a5aa !important;border:1px solid #a3a5aa;background:#fff}
.btn-type.white_line {color:#fff !important;border:1px solid #fff;background-color:transparent; }
.btn-type.concept-color {color:#fff !important;border:1px solid var(--concept-color);background:var(--concept-color);}
.btn-type.concept-line {color:var(--concept-color);border:1px solid var(--concept-color);background:#fff}
.btn-type.second-color{color:#fff !important;border:1px solid var(--second-color);background:var(--second-color);}
.btn-type.second-line {color:var(--second-color);border:1px solid var(--second-color);background:#fff}
.btn-type.point-color{color:#fff !important;border:1px solid var(--point-color);background:var(--point-color);}
.btn-type.point-line {color:var(--point-color);border:1px solid var(--point-color);background:#fff}

/* hover */
.btn-type:hover {/* box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2); */ filter:alpha(opacity=70);-moz-opacity:0.7;-khtml-opacity:0.7;opacity:0.7; }
/*
.btn-type.black:hover {background:#fff !important;color:#262729 !important;}
.btn-type.blue:hover {background:#fff !important;color:#337bcc !important;}
.btn-type.dblue:hover {background:#fff !important;color:#2f3858 !important;}
.btn-type.dgray:hover {background:#fff !important;color:#3c3e44 !important;}
.btn-type.gray:hover {background:#fff !important;color:#717379 !important;}
.btn-type.lgray:hover {background:#fff !important;color:#a3a5aa !important;}
.btn-type.white:hover {background:#707070 !important;color:#fff !important;}
.btn-type.red:hover {background:#fff !important;color:#e60012 !important;}
.btn-type.orange:hover {background:#fff !important;color:#fb9347 !important;}
.btn-type.green:hover {background:#fff !important;color:#1fb25a !important;}
.btn-type.black_line:hover {background:#262729 !important;color:#fff !important;}
.btn-type.gray_line:hover {background:#717379 !important;color:#fff !important;}
.btn-type.lgray_line:hover {background:#a3a5aa !important;color:#fff !important;}
.btn-type.white_line:hover {background:#262729 !important;color:#fff !important;}
.btn-type.concept-color:hover {background:#fff !important;color:var(--concept-color) !important;}
.btn-type.second-color:hover {background:#fff !important;color:var(--second-color) !important;}
.btn-type.point-color:hover {background:#fff !important;color:var(--point-color) !important;}
.btn-type.concept-line:hover {background:var(--concept-color);color:#fff !important;}
.btn-type.second-line:hover {background:var(--second-color);color:#fff !important;}
.btn-type.point-line:hover {background:var(--point-color);color:#fff !important;}
*/
.btn-type.off:hover { paint-order:none; cursor:not-allowed;}

.btn-type.black_line:hover .i-arrow-b{display: inline-block;min-height:5px;padding-right:50px;background:url(/images/layout/i-arrow-b-on.png) right center no-repeat; }
.btn-type.black:hover span.i_arrow::after{border: 1px solid #262729;}
.btn-type.blue:hover span.i_arrow::after{border: 1px solid #007dc6;}
.btn-type.dblue:hover span.i_arrow::after{border: 1px solid #2f3858;}
.btn-type.dgray:hover span.i_arrow::after{border: 1px solid #3c3e44;}
.btn-type.gray:hover span.i_arrow::after{border: 1px solid #717379;}
.btn-type.red:hover span.i_arrow::after{border: 1px solid #e60012;}

.btn-type.black_line:hover .i_right_arrow::after {border: 1px solid #fff;border-top: none;border-right: none; transform: rotate(-135deg)}
.btn-type.gray_line:hover .i_right_arrow::after {border: 1px solid #fff;border-top: none;border-right: none; transform: rotate(-135deg)}
.btn-type.lgray_line:hover .i_right_arrow::after {border: 1px solid #fff;border-top: none;border-right: none; transform: rotate(-135deg)}
.btn-type.white_line:hover .i_right_arrow::after {border: 1px solid #fff;border-top: none;border-right: none; transform: rotate(-135deg)}

.btn-type.concept-color:hover .i_edit_wh{background:url(/images/layout/i_edit.png) left center no-repeat;}
.btn-type.concept-color:hover .i-print{background:url(/images/layout/i_print-b.png) left center no-repeat;}

.ico-type {position:relative;display:inline-flex;justify-content: center;align-items: center;transition:all 0.3s;line-height:1;font-family: 'Pretendard'; text-align:center;text-transform:capitalize;/*text-transform:uppercase;*/ border-radius:4px;box-sizing: border-box;}
.ico-type.ibtn {height:24px;font-weight:700;font-size:13px;padding:0 16px;}
.ico-type.ibtn-m {height:24px;font-weight:400;font-size:13px;padding:0 10px;}

/* color */
.ico-type.black {color:#fff !important;border:1px solid #000;background:#000}
.ico-type.blue {color:#fff !important;border:1px solid #337bcc;background:#337bcc}
.ico-type.dblue {color:#fff !important;border:1px solid #2f3858;background:#2f3858}
.ico-type.dgray {color:#fff !important;border:1px solid #3c3e44;background:#3c3e44}
.ico-type.gray {color:#fff !important;border:1px solid #717379;background:#717379}
.ico-type.lgray {color:#fff !important;border:1px solid #a3a5aa;background:#a3a5aa}
.ico-type.white{color:#323232 !important;border:1px solid #707070;background:#fff}
.ico-type.red {color:#fff !important;border:1px solid #e60012;background:#e60012}
.ico-type.orange {color:#fff !important;border:1px solid #fb9347;background:#fb9347}
.ico-type.black_line {color:#262729 !important;border:1px solid #262729;background:#fff}
.ico-type.gray_line {color:#717379 !important;border:1px solid #717379;background:#fff}
.ico-type.lgray_line {color:#a3a5aa !important;border:1px solid #a3a5aa;background:#fff}
.ico-type.white_line {color:#fff !important;border:1px solid #fff;background-color:transparent; }
.ico-type.concept-color {color:#fff !important;border:1px solid var(--concept-color);background:var(--concept-color);}
.ico-type.concept-line {color:var(--concept-color) !important;border:1px solid var(--concept-color);background:#fff}
.ico-type.second-color{color:#fff !important;border:1px solid var(--second-color);background:var(--second-color);}
.ico-type.second-line {color:var(--second-color);border:1px solid var(--second-color);background:#fff}
.ico-type.point-color{color:#fff !important;border:1px solid var(--point-color);background:var(--point-color);}
.ico-type.point-line {color:var(--point-color);border:1px solid var(--point-color);background:#fff}

.ico-type.orange-line {color:#fb9347;border:1px solid #fb9347;background:#fff;} 
.ico-type.green-line {color:#38bb42;border:1px solid #38bb42;background:#fff;} 
.ico-type.purple-line {color:#5c20cb;border:1px solid #5c20cb;background:#fff;} 
.ico-type.red-line {color:#e60012;border:1px solid #e60012;background:#fff;} 


.left-more {display:inline-block; text-align:right; height: auto;}
.left-more .circle {transition: all 0.2s cubic-bezier(0.65, 0, 0.076, 1); position: relative;  display: block; margin: 0;  width:4.2rem;  height: 4.2rem; background: var(--concept-color);  border-radius:2.1rem;}
.left-more .circle .icon { transition: all 0.2s cubic-bezier(0.65, 0, 0.076, 1); position: absolute; top: 0; bottom: 0; margin: auto; background: #fff;animation: button-text-Ani 0.6s 0.1s both;}
.left-more .circle .icon.arrow {transition: all 0.2s cubic-bezier(0.65, 0, 0.076, 1); left:1.2rem; width:1.8rem;  height:.2rem;background: #fff;}
.left-more .circle .icon.arrow::before { position: absolute;  content: ""; top:-.8rem; right:.9rem; width: .2rem; height:1.8rem;background: #fff; }
.left-more .button-text {transition: all 0.2s cubic-bezier(0.65, 0, 0.076, .5);  position: absolute;  top: 0;  left: 0; right: 0;  bottom: 0; padding: 1.4rem 0 0;font-size:1.8rem;color: #fff;  line-height:1; text-align: center;
 text-transform: uppercase; display:none;opacity: 0;}
.left-more:hover .circle { width: 20.0rem;}
.left-more:hover .circle .icon{display:none;}
.left-more:hover .button-text {display:inline-block !important;opacity: 1; animation: button-text-Ani 1s 0.1s both;}

.right-more {display:inline-block; text-align:right; height: auto;}
.right-more .circle {transition: all 0.2s cubic-bezier(0.65, 0, 0.076, 1); position: relative;  display: block; margin: 0;  width:4.2rem;  height: 4.2rem; background: var(--concept-color);  border-radius:2.1rem;}
.right-more .circle .icon { transition: all 0.2s cubic-bezier(0.65, 0, 0.076, 1); position: absolute; top: 0; bottom: 0; margin: auto; background: #fff;animation: button-text-Ani 0.6s 0.1s both;}
.right-more .circle .icon.arrow {transition: all 0.2s cubic-bezier(0.65, 0, 0.076, 1); left:1.2rem; width:1.8rem;  height:.2rem;background: #fff;}
.right-more .circle .icon.arrow::before { position: absolute;  content: ""; top:-.8rem; right:.9rem; width: .2rem; height:1.8rem;background: #fff; }
.right-more .button-text {transition: all 0.2s cubic-bezier(0.65, 0, 0.076, .5);  position: absolute;  top: 0;  left: 0; right: 0;  bottom: 0; padding: 1.4rem 0 0;font-weight: 600; font-size:1.8rem;color: #fff;  line-height:1; text-align: center;
 text-transform: uppercase; display:none;opacity: 0;}
.right-more:hover .circle { width: 21.0rem;}
.right-more:hover .circle .icon{display:none;}
.right-more:hover .button-text {display:inline-block !important;opacity: 1; animation: button-text-Ani 1s 0.1s both;}


.right-more.wh .circle {background:#fff;}
.right-more.wh .circle .icon {background: var(--concept-color);}
.right-more.wh .circle .icon.arrow {background: var(--concept-color);}
.right-more.wh .circle .icon.arrow::before {background: var(--concept-color);}
.right-more.wh .button-text {color: var(--concept-color);}

@keyframes button-text-Ani {
    0% {opacity: 0;}
    100% {opacity: 1;}
}



@media screen and (max-width: 768px) {
html{font-size: 50%;}

input[type=checkbox] + label{font-size:14px;line-height:18px;padding-left:28px;} 
input[type=checkbox]+ label:before {width:18px;height:18px;} 

input[type=radio] + label{font-size:14px;}

.btn-group {gap:5px}
.btn-group.mw150 > * {min-width:auto; flex:1;}
.btn-group.mw200 > * {min-width:auto; flex:1;}
.btn-group.mw250 > * {min-width:auto; flex:1;}

.btn-type.btn {height:40px;font-size:14px;} /* basic */
.btn-type.btn-lg {height:42px;font-size:15px;}
.btn-type.btn-m {height:35px;font-size:13px;}
.btn-type.btn-s {height:26px;font-size:12px;padding:0 15px;}

.btn-type.rbtn {height:40px;font-size:14px;}
.btn-type.rbtn-lg{height:45px;font-size:15px;}
.btn-type.rbtn-m {height:35px;font-size:13px;}
.btn-type.rbtn-s {height:26px;font-size:12px;padding:0 15px;}


/* 모바일 오버기능 삭제 */
.btn-type.black:hover {color:#fff !important;border:1px solid #000;background:#000}
.btn-type.blue:hover {color:#fff !important;border:1px solid #337bcc;background:#337bcc}
.btn-type.dblue:hover {color:#fff !important;border:1px solid #2f3858;background:#2f3858}
.btn-type.dgray:hover {color:#fff !important;border:1px solid #3c3e44;background:#3c3e44}
.btn-type.gray:hover {color:#fff !important;border:1px solid #717379;background:#717379}
.btn-type.lgray:hover {color:#fff !important;border:1px solid #a3a5aa;background:#a3a5aa}
.btn-type.white:hover{color:#323232 !important;border:1px solid #707070;background:#fff}
.btn-type.red:hover {color:#fff !important;border:1px solid #e60012;background:#e60012}
.btn-type.orange:hover {color:#fff !important;border:1px solid #fb9347;background:#fb9347}
.btn-type.green:hover {color:#fff !important;border:1px solid #1fb25a;background:#1fb25a}
.btn-type.black_line:hover {color:#262729 !important;border:1px solid #262729;background:#fff}
.btn-type.gray_line:hover {color:#717379 !important;border:1px solid #717379;background:#fff}
.btn-type.lgray_line:hover {color:#a3a5aa !important;border:1px solid #a3a5aa;background:#fff}
.btn-type.white_line:hover {color:#fff !important;border:1px solid #fff;background-color:transparent; }
.btn-type.concept-color:hover {color:#fff !important;border:1px solid var(--concept-color);background:var(--concept-color);}
.btn-type.concept-line:hover {color:var(--concept-color);border:1px solid var(--concept-color);background:#fff}
.btn-type.second-color:hover{color:#fff !important;border:1px solid var(--second-color);background:var(--second-color);}
.btn-type.second-line:hover {color:var(--second-color);border:1px solid var(--second-color);background:#fff}
.btn-type.point-color:hover{color:#fff !important;border:1px solid var(--point-color);background:var(--point-color);}
.btn-type.point-line:hover {color:var(--point-color);border:1px solid var(--point-color);background:#fff}

.left-more .circle { width: 20.0rem;}
.left-more .circle .icon{display:none;}
.left-more .button-text {display:inline-block !important;opacity: 1; animation: button-text-Ani 1s 0.1s both;}

.right-more:hover .circle { width:4.2rem;}
.right-more:hover .circle .icon{display:inline-block !important;}
.right-more:hover .button-text {display:none !important;}
.right-more.w1:hover .circle { width:4.2rem;}

}

@media screen and (max-width: 540px) {

    .select_sty select{font-size:14px;}
    .input_sty input{font-size:14px;}

.textArea_sty1 textarea{font-size:14px; height:200px; }

input::placeholder {color:#888;font-size:14px;}
input:-ms-input-placeholder {color:#888;font-size:14px;}
input::-ms-input-placeholder { color:#888;font-size:14px;}
input::-webkit-input-placeholder {color:#888;font-size:14px;}
input::-moz-placeholder {color:#888;font-size:14px;}

textarea::placeholder {color:#888;font-size:14px;}
textarea:-ms-input-placeholder {color:#8886;font-size:14px;}
textarea::-ms-input-placeholder {color:#888;font-size:14px;}
textarea::-webkit-input-placeholder {color:#888;font-size:14px;}
textarea::-moz-placeholder {color:#888;font-size:14px;}


.btn-type.btn-lg {font-size:14px;}
.btn-type.rbtn-lg{font-size:14px;}

}

@media screen and (max-width: 320px) {
    html{font-size: 44%;}

    input[type=checkbox] + label{padding-left:24px;line-height:18px;font-size:13px;}
    input[type=radio] + label{font-size:13px;}   

    .select_sty select{font-size:13px;}
    .input_sty input{font-size:13px;}

    .textArea_sty1 textarea{font-size:13px;}
    
    input::placeholder {font-size:13px;}
    input:-ms-input-placeholder {font-size:13px;}
    input::-ms-input-placeholder {font-size:13px;}
    input::-webkit-input-placeholder {font-size:13px;}
    input::-moz-placeholder {font-size:13px;}
    
    textarea::placeholder {font-size:13px;}
    textarea:-ms-input-placeholder {font-size:13px;}
    textarea::-ms-input-placeholder {font-size:13px;}
    textarea::-webkit-input-placeholder {font-size:13px;}
    textarea::-moz-placeholder {font-size:13px;}

    
    }