@charset "utf-8";

/*---------- font ----------*/
/* Pretendard */
@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 100;
  src: url(../../../fonts/Pretendard-Thin.woff) format('woff');
}
@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 200;
  src: url(../../../fonts/Pretendard-ExtraLight.woff) format('woff');
}
@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 300;
  src: url(../../../fonts/Pretendard-Light.woff) format('woff');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 400;
  src: url(../../../fonts/Pretendard-Regular.woff) format('woff');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 500;
  src: url(../../../fonts/Pretendard-Medium.woff) format('woff');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 600;
  src: url(../../../fonts/Pretendard-SemiBold.woff) format('woff');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 700;
  src: url(../../../fonts/Pretendard-Bold.woff) format('woff');
}
@font-face {
  font-family: 'Pretendard';
  font-style: bold;
  font-weight: 800;
  src: url(../../../fonts/Pretendard-Black.woff) format('woff');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 900;
  src: url(../../../fonts/Pretendard-ExtraBold.woff) format('woff');
}
/* S-Core */
@font-face {
  font-family: "S-Core";
  font-weight: 100;
  src: url(../../../fonts/S-Core1.woff) format("woff");
}
@font-face {
  font-family: "S-Core";
  font-weight: 200;
  src: url(../../../fonts/S-Core2.woff) format("woff");
}
@font-face {
  font-family: "S-Core";
  font-weight: 300;
  src: url(../../../fonts/S-Core3.woff) format("woff");
}
@font-face {
  font-family: "S-Core";
  font-style: normal;
  font-weight: 400;
  src: url(../../../fonts/S-Core4.woff) format("woff");
}
@font-face {
  font-family: "S-Core";
  font-weight: 500;
  src: url(../../../fonts/S-Core5.woff) format("woff");
}
@font-face {
  font-family: "S-Core";
  font-weight: 600;
  src: url(../../../fonts/S-Core6.woff) format("woff");
}
@font-face {
  font-family: "S-Core";
  font-style: bold;
  font-weight: 700;
  src: url(../../../fonts/S-Core7.woff) format("woff");
}
@font-face {
  font-family: "S-Core";
  font-weight: 8800;
  src: url(../../../fonts/S-Core8.woff) format("woff");
}
@font-face {
  font-family: "S-Core";
  font-weight: 900;
  src: url(../../../fonts/S-Core9.woff) format("woff");
}
/*---------- Reset ----------*/
/*basic*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, button {margin:0; padding:0; border:0; vertical-align:baseline; box-sizing:border-box;}
input, select, textarea {margin:0; padding: 0 .5rem; font-size: .9rem; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; color: var(--gray);}
input::placeholder {color: #ccc; font-weight: 300;}
textarea {resize:none;}
select {-webkit-appearance:none; -moz-appearance:none; appearance:none }/* arrow none */

/* input, select */
input[type=text], input[type=password] {padding: 0 10px 0; border: 1px solid #ddd; font-size: .95em; color: #333; border-radius: 2px; -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 32px; line-height: 32px;}
input[type=checkbox] {width: 15px; height: 15px; display: inline-block; vertical-align: middle; margin-right: 5px; background: #fff; border: 1px solid var(--blue); margin-top: -2px; }
input[type=checkbox]:checked {padding: 2px;}
input[type=checkbox]:checked::before {content: ''; width: 100%; height: 100%; display: block; background: url(../../../images/domain/SI17600001/ico_checkbox.png) 50% 50% no-repeat #7B90A7;}
input[type=radio] {width: 15px;height: 15px;border: 1px solid #ddd; border-radius: 15px;vertical-align: middle;background: #fff;margin-right: 5px;margin-top: -3px;}
input[type=radio]::after {content: ''; border: 2px solid #fff; background: #ddd; display: block; box-sizing: border-box; width: 100%; height: 100%; border-radius: 12px;}
input[type=radio]:checked {/*border: 1px solid #FF522C;*/}
input[type=radio]:checked::after {content: ''; border: 2px solid #fff; background: var(--blue); display: block; box-sizing: border-box; width: 100%; height: 100%; border-radius: 12px;}
select{border: 1px solid #ddd; height: 32px; line-height: 32px; background: url(../../../images/domain/SI17600001/ico_select_arrow.png) no-repeat calc(100% - .5rem) 50% #fff; box-sizing: border-box; padding: 0 20px 0 10px; vertical-align: middle; appearance: none; -webkit-appearance: none; width: 100%; text-align: left; cursor: pointer; }
select::-ms-expand {display: none;}
select.placeholder {color: #ddd;}

.custom-form-group {display: flex; flex-flow: row wrap; gap: 10px;}
.custom-form-group.hd {width: 20px; overflow: hidden; margin: 0 auto; padding: 0;}
.custom-checkbox-item {display: flex; flex-flow: row wrap;}
.custom-radio-item input[type="radio"],
.custom-checkbox-item input[type="checkbox"] {-webkit-appearance: none; -moz-appearance: none; appearance: none; position: absolute; opacity: 0;  z-index: -1; }
.custom-radio-item label, .custom-checkbox-item label {display: flex; align-items: center; cursor: pointer; font-size: 14px; color: #666; line-height: 1.5; font-weight: 400;}
.custom-radio-item label::before {content: ''; display: block; width: 16px; height: 16px; border: 2px solid #ccc; border-radius: 50%; margin-right: 4px; transition: all 0.2s ease; background-color: #fff; box-sizing: border-box; flex-shrink: 0;}
.custom-radio-item input[type="radio"]:checked + label::before {border-color: #007bff; background-color: #fff; border-width: 5px;}
.custom-radio-item input[type="radio"]:checked + label {color: #121212;}
.custom-checkbox-item label::before {content: ''; display: block; width: 16px; height: 16px; border: 2px solid #ccc; border-radius: 4px; margin-right: 8px; transition: all 0.2s ease; background-color: #fff; box-sizing: border-box; flex-shrink: 0;}
.custom-checkbox-item input[type="checkbox"]:checked + label::before {background-color: #007bff; border-color: #007bff; content: '✓'; color: #fff; font-size: 12px; line-height: 12px; text-align: center; font-weight: bold;}

/* file custom */
.filebox {display: flex; flex-wrap: wrap;}
.filebox .upload-name {display: inline-block; height: 40px; padding: 0 10px; vertical-align: middle; border: 0; background-color: #f6f6f6; color: #999; flex: 1; border-radius: .25rem;}
.filebox label {display: inline-block; padding: 0; color: #fff; vertical-align: middle; background-color: #999; border-radius: .25rem; cursor: pointer; width: 100px; text-align:center; height: 40px; line-height: 40px; margin-left: 10px;}
.filebox input[type="file"] {position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
i, em {font-style:normal;}
blockquote, q {quotes:none;}
sub {vertical-align:sub; font-size:smaller; line-height:0; color: var(--red);}
sup {vertical-align:super; font-size:smaller; line-height:0; color: var(--red);}
img, fieldset {vertical-align:middle;}
a {color:inherit; vertical-align:inherit; text-decoration:none;}
a:link, a:hover {text-decoration:none;}
h1,h2,h3,h4,h5,h6 {color:inherit; font-weight:inherit; font-size: inherit;}
ol, ul, li {list-style:none;}
table {width:100%; border-collapse:collapse; border-spacing:0; word-break:normal;}
th, td {text-align:center; vertical-align:middle;}
caption, legend {width:1px; height:1px; margin:-1px 0 0 0; padding:0; border:0; overflow:hidden; font-size:0; color:transparent; line-height:0;}
fieldset, legend {border:0; background-color:transparent;}
hr {height:0; border:0; background-color:transparent;}
button {display:inline-block; border:0; background-color:transparent; font-size:inherit; text-align:center; cursor:pointer; overflow:visible;}
[role="button"], [role="submit"] {cursor:pointer !important;}
a {cursor: pointer;}
a[href^=tel] {cursor:text; pointer-events:none;}
a[href^=tel]:hover {color:currentColor; text-decoration:none;}
button:focus-visible, [role="button"]:focus-visible {outline:2px solid #000;}
html, body {width: 100%; margin: 0; padding: 0; font-family: var(--fonttype-1); font-size:16px; min-width: 320px;}
body {min-height:100%; color:#111;font-weight:400;} 
/* *{margin:0;padding:0;font:inherit;color:inherit;} */
*{margin:0;padding:0;;color:inherit;}
*, :after, :before {box-sizing:border-box;flex-shrink:0;}
*:focus-visible{outline:2px dotted #000;}
/* chrome blue line */
input:-webkit-autofill {-webkit-box-shadow:0 0 0 30px #fff inset ; -webkit-text-fill-color:#000;}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {transition:background-color 600000s ease-in-out 0s, color 600000s 0s;}

#wrap {font-family: var(--fonttype-1);}
html {scroll-behavior: smooth;}/* 클릭시 부드럽게 스크롤 */
@media (prefers-reduced-motion: reduce) {
    html {scroll-behavior: auto;}
}

/* width(rem) */
.w50{width:5rem !important;}
.w55{width:5.5rem !important;}
.w60{width:6rem !important;}
.w65{width:6.5rem !important;}
.w70{width:7rem !important;}
.w75{width:7.5rem !important;}
.w80{width:8rem !important;}
.w85{width:8.5rem !important;}
.w90{width:9rem !important;}
.w95{width:9.5rem !important;}
.w100{width:10rem !important;}
.w150{width:15rem !important;}
.w200{width:20rem !important;}
.w250{width:25rem !important;}
.w300{width:30rem !important;}
.w350{width:35rem !important;}
.w400{width:40rem !important;}
.w450{width:45rem !important;}
.w500{width:50rem !important;}
/* width(%) */
.w10p{width:10% !important;}
.w15p{width:15% !important;}
.w20p{width:20% !important;}
.w25p{width:25% !important;}
.w30p{width:30% !important;}
.w35p{width:35% !important;}
.w40p{width:40% !important;}
.w45p{width:45% !important;}
.w47p{width:47% !important;}
.w49p{width:49% !important;}
.w50p{width:50% !important;}
.w55p{width:55% !important;}
.w60p{width:60% !important;}
.w65p{width:65% !important;}
.w70p{width:70% !important;}
.w75p{width:75% !important;}
.w80p{width:80% !important;}
.w85p{width:85% !important;}
.w90p{width:90% !important;}
.w95p{width:95% !important;}
.w100p{width:100% !important;}

/* height */
.h10 {height: 10px !important;}
.h20 {height: 20px !important;}
.h30 {height: 30px !important;}
.h40 {height: 40px !important;}
.h50 {height: 50px !important;}
.h60 {height: 60px !important;}
.h70 {height: 70px !important;}
.h80 {height: 80px !important;}
.h90 {height: 90px !important;}
.h100 {height: 100px !important;}
.h200 {height: 200px !important;}
.h300 {height: 300px !important;}
.h400 {height: 400px !important;}
.h500 {height: 500px !important;}
.h100p {height: 100% !important;}
.hauto {height: auto !important}
/* margin */
.mg0{margin:0 !important;}
.mg5{margin:.5rem !important;}
.mg10{margin:1rem !important;}
.mg15{margin:1.5rem !important;}
.mg20{margin:2rem !important;}
.mg25{margin:2.5rem !important;}
.mg30{margin:3rem !important;}
.mg35{margin:3.5rem !important;}
.mg40{margin:4rem !important;}
.mg45{margin:4.5rem !important;}
.mg50{margin:5rem !important;}
.mg55{margin:5.5rem !important;}
.mg60{margin:6rem !important;}
.mgb0{margin-bottom: 0 !important;}
.mgb5{margin-bottom:.5rem !important;}
.mgb10{margin-bottom:1rem !important;}
.mgb15{margin-bottom:1.5rem !important;}
.mgb20{margin-bottom:2rem !important;}
.mgb25{margin-bottom:2.5rem !important;}
.mgb30{margin-bottom:3rem !important;}
.mgb35{margin-bottom:3.5rem !important;}
.mgb40{margin-bottom:4rem !important;}
.mgb45{margin-bottom:4.5rem !important;}
.mgb50{margin-bottom:5rem !important;}
.mgb55{margin-bottom:5.5rem !important;}
.mgb60{margin-bottom:6rem !important;}

.mgl0{margin-left:0 !important;}
.mgl5{margin-left:.5rem !important;}
.mgl10{margin-left:1rem !important;}
.mgl15{margin-left:1.5rem !important;}
.mgl20{margin-left:2rem !important;}
.mgl25{margin-left:2.5rem !important;}
.mgl30{margin-left:3rem !important;}
.mgl35{margin-left:3.5rem !important;}
.mgl40{margin-left:4rem !important;}
.mgl45{margin-left:4.5rem !important;}
.mgl50{margin-left:5rem !important;}
.mgl55{margin-left:5.5rem !important;}
.mgl60{margin-left:6rem !important;}
.mgr0{margin-right:0 !important;}
.mgr5{margin-right:.5rem !important;}
.mgr10{margin-right:1rem !important;}
.mgr15{margin-right:1.5rem !important;}
.mgr20{margin-right:2rem !important;}
.mgr25{margin-right:2.5rem !important;}
.mgr30{margin-right:3rem !important;}
.mgr35{margin-right:3.5rem !important;}
.mgr40{margin-right:4rem !important;}
.mgr45{margin-right:4.5rem !important;}
.mgr50{margin-right:5rem !important;}
.mgr55{margin-right:5.5rem !important;}
.mgr60{margin-right:6rem !important;}


.mgt0{margin-top:0 !important;}
.mgt5{margin-top:.5rem !important;}
.mgt10{margin-top:1rem !important;}
.mgt15{margin-top:1.5rem !important;}
.mgt20{margin-top:2rem !important;}
.mgt25{margin-top:2.5rem !important;}
.mgt30{margin-top:3rem !important;}
.mgt35{margin-top:3.5rem !important;}
.mgt40{margin-top:4rem !important;}
.mgt45{margin-top:4.5rem !important;}
.mgt50{margin-top:5rem !important;}
.mgt55{margin-top:5.5rem !important;}
.mgt60{margin-top:6rem !important;}

/* Padding */
.pd0 {padding:0 !important;}
.pt0 {padding-top:0 !important;}
.pb0 {padding-bottom:0 !important;}
.pl0 {padding-left:0 !important;}
.pr0 {padding-right:0 !important;}
.pt10 {padding-top:10px !important;}
.pt20 {padding-top:20px !important;}
.pt30 {padding-top:30px !important;}
.pt40 {padding-top:40px !important;}
.pt50 {padding-top:50px !important;}
.pt60 {padding-top:60px !important;}
.pt70 {padding-top:70px !important;}
.pt80 {padding-top:80px !important;}
.pt90 {padding-top:90px !important;}
.pt100 {padding-top:100px !important;}
.pb10 {padding-bottom:10px !important;}
.pb20 {padding-bottom:20px !important;}
.pb30 {padding-bottom:30px !important;}
.pb40 {padding-bottom:40px !important;}
.pb50 {padding-bottom:50px !important;}

/* etc px */
.mb4 {margin-bottom: 4px !important;}
.mb16 {margin-bottom: 16px !important;}
.mr6 {margin-right: 6px !important;}
.w80p {width: 80px !important;}
.mgb4p {margin-bottom: 4px !important;}
.mgr6p {margin-right: 6px !important;}

/* align */
.ta_l {text-align:left !important;}
.ta_c {text-align:center !important;}
.ta_r {text-align:right !important;}
.va_t {vertical-align:top !important;}
.va_m {vertical-align:middle !important;}
.va_b {vertical-align:bottom !important;}

/* border-no */
.bd_n {border: none !important;}
.bd_n_t {border-top: none !important;}
.bd_n_b {border-bottom: none !important;}
.bd_n_l {border-left: none !important;}
.bd_n_r {border-right: none !important;}
.b1 {border: 1px solid #ddd !important;}

/* float */
.f-right {float: right !important;}
.f-left {float: left !important;}

/* show hide */
.show, .block {display:block !important;}
.hide {display:none !important;}
.inblock {display: inline-block !important;}

/* display */
.dinblock {display: inline-block !important;}
.dblock {display: block !important;}
/* clear */
.clear {display: block !important; min-height: 1% !important;}
.clear::after {content: " "; height: 0; display: block; visibility: hidden; clear: both;}
.f-clear {display: block; min-height: 1%;}
.f-clear:after {content: ''; height: 0; display: block; visibility: hidden; clear: both;}

/* overflow */
.ov_hidden {overflow-x: hidden !important; overflow-y: hidden !important;}
.ov_hidden_y {overflow-y: hidden !important;}
.ov_hidden_x {overflow-x: hidden !important;}
.ov_scroll {overflow: scroll !important;}
.ov_scroll_y {overflow-y: scroll !important;}
.ov_scroll_x {overflow-x: scroll !important;}
.no_scroll {overflow: hidden !important; padding-right: 18px;}
/*---------- root ----------*/
:root {
  /* color */
  --black: #121212;
  --gray: #797979;
  --lightgray: #f5f5f5;
  --darkgray: #454545;
  --white: #ffffff;
  --red: #dc3545;
  --orange: #EB6A2D;
  --yellow: #FFE064;
  --gold: #e0b413;
  --green: #0a9d02;
  --lightgreen: #00AD50;
  --blue: #1256CA;
  --indigo: #172B62;
  --royalblue: #468AFF;
  --sapphire: #0ab9bc;
  --iceblue: #F4FAFF;
  --violet: #724598;
  --purple : #A16BCF;
  --brown : #483936;
  --pink : #FF0073;
  /* text */
  --text-title-lg: 5rem;
  --text-title-md: 3rem;
  --text-title-sm: 2.25rem;
  --text-content-1: 2rem;
  --text-content-2: 1.875rem;
  --text-content-3: 1.25rem;
  --text-content-4: 1rem;
  --text-content-5: .9rem;
  --text-content-6: .8rem;
  /* transition */
  --transition-2: all 0.2s ease-in-out;
  --transition-4: all 0.4s ease-in-out;
  --transition-8: all 0.8s ease-in-out;
  --transition-12: all 0.12s ease-in-out;
  /* font bisic */
  --fonttype-1:'Pretendard', 'Malgun Gothic', '맑은 고딕', sans-serif;
  --fonttype-2:'S-Core';

}


.text-red {color: var(--red) !important;}
.text-black {color: var(--black) !important;}
.text-green {color: var(--green) !important;}
.text-blue {color: var(--blue) !important;}
.text-orange {color: var(--orange) !important;}
.text-violet {color: var(--violet) !important;}
.text-white {color: var(--white) !important;}
.text-yellow {color: var(--yellow) !important;}

.bg-red {background-color: var(--red) !important;}
.bg-black {background-color: var(--black) !important;}
.bg-green {background-color: var(--green) !important;}
.bg-blue {background-color: var(--blue) !important;}
.bg-orange {background-color: var(--orange) !important;}
.bg-violet {background-color: var(--violet) !important;}
.bg-white {background-color: var(--white) !important;}
.bg-yellow {background-color: #ecba0a !important;}

/*---------- text ellipsis ----------*/
.text-el-1 {text-overflow: ellipsis; white-space:nowrap; word-wrap:normal; width:100%; overflow:hidden;}/* line1 */
.text-el-2 {text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.4em; height: 1.8em; -webkit-line-clamp: 2;}/* line2 */
.text-el-3 {text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.4em; height: 4.2em; -webkit-line-clamp: 3;}/* line3 */
.text-el-4 {text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.4em; height: 5.6em; -webkit-line-clamp: 4;}/* line4 */

/*---------- button ----------*/
.btn_wrap {display: block; margin: 2rem 0;}
.btn_wrap select {display: inline-block; width: auto; border-radius: 3px; padding: 0 1.5rem 0 .8rem;}
button[type=button], button[type=submit], input[type=submit], input[type=button] {cursor: pointer !important; transition: all .2s;}
button[type=button]:hover, button[type=submit]:hover, input[type=submit]:hover, input[type=button]:hover, .btn:hover {opacity: .8 !important;}
button[type=button]:disabled, button[type=submit]:disabled, input[type=submit]:disabled, input[type=button]:disabled {cursor: default;}
.btn {border: 0; text-align: center; letter-spacing: -0.02em; display: inline-block; border-radius: 3px; vertical-align: middle; height: 2rem; line-height: 2rem; padding: 0 1em; color: #fff; background: #666; font-size: .9em; white-space: nowrap; transition: all .2s;}
.btn i {margin: -1px 5px 0 -5px;}
.btn i img {vertical-align: middle; width: 17px; height: 17px;}
.btn-round {border-radius: 6px !important;}
.btn > strong {font-weight: 800;}
.btn > small {font-weight: 500;font-size: .7em;}
.btn-lg {height: 2.8em; line-height: 3em; padding: 0 1em; font-size: 1em; box-sizing: content-box;}
.btn-md {height: 2.2em; line-height: 2.2em; padding: 0 1em; font-size: .85em; box-sizing: content-box;}
.btn-sm {height: 2em; line-height: 2em; padding: 0 .6em; font-size: .8em; box-sizing: content-box;}
.btn-xsm {height: 1.5em; line-height: 1.5em; padding: 0 .4em; font-size: .8em; box-sizing: content-box;}
.btn-blue {background-color: var(--blue);}
.btn-royalblue {background-color: var(--royalblue);}
.btn-lightgray {background-color: #999;}
.btn-gray {background-color: #666;}
.btn-darkgray {background-color: var(--darkgray);}
.btn-orange {background-color: var(--orange);}
.btn-green {background-color: var(--green);}
.btn-red {background-color: var(--red);}
.btn-violet {background-color: var(--violet);}
.btn-brown {background-color: var(--brown);}
.btn-indigo {background-color: var(--indigo);}
.btn-white {border: 1px solid #999; background-color: var(--white); color: #222; box-sizing: border-box;}
.btn_resultdown {height: auto !important; line-height: 1.4 !important; padding: 2rem; font-size: 1.1rem !important;}

/* tabs */
.tabs {position: relative;}
.tabs ul {display: flex; position: relative; gap: 0;}
.tabs li {flex: 1;}
.tabs li a {display: block; padding: 0; text-align: center; white-space: nowrap; font-weight: 300;}
.tabs li a.active {font-weight: 500;}

/*---------- responsive ----------*/
@media (max-width:1680px){
  html, body {font-size: 17px;}
}
@media (max-width:1280px){
  html, body {font-size: 16px;}
}
@media (max-width:1080px){
  :root {
    --text-title-lg: 4rem;
    --text-title-md: 2rem;
    --text-title-sm: 1.8rem;
    }
}
@media (max-width:680px){
  html, body {font-size: 15px;}
  .filebox .upload-name {height: 32px;}
  .filebox label {width: 80px; height: 32px; line-height: 32px;}
  :root {
    --text-title-lg: 3.4rem;
    --text-title-md: 1.6rem;
    --text-title-sm: 1.3rem;
    --text-content-1: 1.6rem;
    --text-content-2: 1.25rem;
    --text-content-3: 1rem;
    }
  .btn-lg {height: 2.6em; line-height: 2.6em; padding: 0 .8em; font-size: .9em;}
  .btn-md {height: 2em; line-height: 2em; padding: 0 .6em; font-size: .8em;}
  .btn-sm {height: 1.6em; line-height: 1.6em; padding: 0 .4em;}
  .tbl_comment2 {margin-bottom: 1em;}
  .btn_wrap {margin: 1rem 0;}
  .btn_wrap select {height: 24px; line-height: 24px;}
  
button[type=button]:hover, button[type=submit]:hover, input[type=submit]:hover, input[type=button]:hover, .btn:hover {opacity: 1 !important;}

}
@media (max-width:480px){
}




/*---------- custom add ----------*/

/* skip */
.skip a {display: block; position: absolute; left: 0; top: -9999px; overflow: hidden; width: 100%; background: black; color: #fff; font-size: 1em; font-weight: bold; text-align: center;}
.skip a:focus {position: absolute; top: 0; padding: 10px 0; z-index: 99999; outline: none !important;}

/* monthpicker */
.monthpicker {
    background-image: url(../../../images/domain/SI17600001/bg_callendar.svg) !important;
    background-position: calc(100% - 6px) 50% !important;
    background-color: #fff !important;
    background-size: 14px auto !important;
    background-repeat: no-repeat !important;
} 

/* multiselect */
sb-menu {width:100%;vertical-align: middle;}
.sb-menu .selectview {display: block; font-size: .9em; border: 1px solid #ddd; background: url(../../../images/inner/bg_select01.png) no-repeat calc( 100% - 10px ) 50% ; background-color: #fff; transition: all .5s ease; color:#333; position: relative;height: 34px;}
.sb-menu .selectview:hover {color: #666;}
.sb-menu .selectview > a {display: block; padding: 0 0 0 8px; height: 30px; line-height: 30px; color: #666; font-size: .9rem;}
.sb-menu .selectview .selectview-menu {display: block; background: #ffffff; margin: 0; padding: 0; max-height: 0; overflow: hidden; position: absolute; top: 30px; left: 0; width: 100%;box-sizing: border-box;}
.sb-menu .selectview.active .selectview-menu, .sb-menu .selectview.on .selectview-menu {max-height: 150px; overflow-y: auto;  border: 1px solid #ddd; }
.sb-menu .selectview .selectview-menu > li {line-height: 1.4em; background: url(../../../images/cmmn/bl_1.png) no-repeat 0px 11px; }
.sb-menu .selectview .selectview-menu > li > a:hover {color: #c5e9ff;}
.sb-menu .selectview .selectview-menu > li.active, .sb-menu .selectview .selectview-menu > li.on { background: url(../../../images/inner/bl_1_on.png) no-repeat 0px 11px;}
.sb-menu .selectview .selectview-menu > li .listwrap {padding: 0 5px 0; display: block; max-height: 0; overflow: hidden;}
.sb-menu .selectview .selectview-menu > li.active .listwrap, .sb-menu .selectview .selectview-menu > li.on .listwrap {padding: 2px 5px 10px; max-height: 500px;}
.sb-menu .selectview .selectview-menu > li .listwrap > li {font-size: .9em; line-height: 22px; background: url(../../../images/inner/bl_2.gif) no-repeat 0px 6px; padding-left: 8px;}
.sb-menu .selectview .selectview-menu ul li {float: left; color: #333; display: block; width: 100%; padding: 0; box-sizing: border-box;}
.sb-menu .selectview .selectview-menu ul li:hover {background:#ddd;}
.sb-menu .selectview .selectview-menu label {display: inline-block; margin: 4px 8px; width: calc(100% - 3em);}
.sb-menu .selectview .selectview-menu label input[type=checkbox]:checked::before,
.sb-menu .selectview .selectview-menu label input[type=radio]:checked::before{background-size: cover;}
.sb-menu .selectview .selectview-menu button.btn-delete {width: 13px; height: 20px; text-align: center; opacity: .4; }
.sb-menu .selectview .selectview-menu button.btn-delete:hover {opacity: 1;}
.sb-menu .selectview .selectview-menu button.btn-delete img {width: 9px; vertical-align: middle; margin: -2px auto 0; display: block;}
.sb-menu .selectview .selectview-menu > li .listwrap > li a {font-weight: 200; color: rgba(255,255,255,.8); display: block; line-height: 16px; margin-bottom: 4px; margin-right: 20px;}
.sb-menu .selectview .selectview-menu > li .listwrap > li a:hover {color: #fff;}
.sb-menu .selectview .selectview-menu > li .listwrap > li.active, .sb-menu .selectview .selectview-menu > li .listwrap > li.on {color: #9bd9ff; background-image: url(../../../images/inner/bl_2_on.gif);}
.sb-menu .selectview .selectview-menu > li .listwrap > li.active a, .sb-menu .selectview .selectview-menu > li .listwrap > li.on a {color: #9bd9ff;}

/* table top select */
.header-item .select-2 {position: relative; display: inline-block; width: 120px; top: 0; right: 0; margin: 0 2px; background: url(../../../images/inner/bg_select01.png) no-repeat calc( 100% - .5em) 50% #fff; height: 25px; line-height: 25px; }
.tbl-btn-wrap .select-2 {position: relative; display: inline-block; width: 120px; top: 0; right: 0; margin: 0 2px; background: url(../../../images/inner/bg_select01.png) no-repeat calc( 100% - .5em) 50% #fff; height: 25px; line-height: 25px; }

/* loading */
.loading {
    background: url(../../../images/domain/SI17600001/loading.svg) rgba(0,0,0,.4) center no-repeat;
    background-size: 100px 100px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100000;
}
.loading > p {
    position: absolute;
    left: calc(50% - 100px);
    top: calc(50% + 35px);
    color: #fff;
    font-weight: 800;
    font-size: 1.3em;
    width: 200px;
    height: 30px;
    line-height: 50px;
    text-align: center;
}

/* board input essential  */
.star {vertical-align:super; font-size:smaller; line-height:0; color: var(--red);}



/* GIS 지도 우측 영역 */
.right-wrap {position: relative; right: 0; top: 0; height: 100%; z-index: 6; background: #f2f5f9; border-left: 1px solid #d2d2d2; width:100%;}
.right-wrap.folded {width: 0; right: -1px;}
.right-handle {background: url(../../../images/domain/SI67602841/ico_inquery_handle_right.png) no-repeat 50% 50% #f2f5f9; width: 15px; height: 50px; position: absolute; top: calc(50% - 25px); left: -15px; cursor: pointer; border: 0; text-indent: -200px; overflow: hidden; border: 1px solid #ddd; border-right: 0;}
.right-wrap.folded .right-handle {background: url(../../../images/domain/SI67602841/ico_inquery_handle_left.png) no-repeat 50% 50% #fff;}
.right-content-wrap {height: 100%; overflow-y: auto;}
.right-wrap  li.treeview2 {display: block; font-size: 14px; transition: all .1s ease; text-align: left;}
.right-wrap  li.treeview2.active, .right-wrap  li.treeview2.on {color: #064993; background: #d3e3fd;}
.right-wrap  li.treeview2 > a {display: block; padding: 0 0 0 15px; height: 30px; line-height: 28px; position: relative; font-weight: 400; background: url(../../../images/inner/ico_rightmenu.png) calc(100% - 12px) 50% no-repeat #758eb1; color: #fff; border-bottom: 1px solid #fff; font-size: 13px; box-sizing: border-box;}
.right-wrap  li.treeview2 > a:hover {background: url(../../../images/inner/ico_rightmenu_active.png) calc(100% - 12px) 50% no-repeat #5878a6;}
.right-wrap  li.treeview2 > a img {margin-right: 5px; margin-top: -4px;}
.right-wrap  li.treeview2.active > a {background: url(../../../images/inner/ico_rightmenu_active.png) calc(100% - 12px) 50% no-repeat #5878a6;}
.right-wrap  li.treeview2 ul.treeview-menu2 {display: block; background: #e9f1ff; margin: 0; max-height: 0; overflow: hidden; }
.right-wrap  li.treeview2.active ul.treeview-menu2, .right-wrap  li.treeview2.on ul.treeview-menu2 {padding: 0; max-height: 380px; overflow-y: auto; background: #f2f5f9;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li {box-sizing: border-box; text-indent: 8px; border-bottom: 1px solid #dae4ef; box-sizing: border-box;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li > a {font-size: 12px; color: #5878a6; font-weight: 400; display: block; background-color: transparent; line-height: 2.6; background: url(../../../images/domain/SI67602841/ico_rightmenu2.png) calc(100% - 12px) 50% no-repeat; padding-left: 5px;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li > a:hover {color: #2f67cb;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li.active > a {background: url(../../../images/inner/ico_rightmenu2_active.png) calc(100% - 12px) 50% no-repeat;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li.active, .right-wrap  li.treeview2 ul.treeview-menu2 > li.on {color: #2f67cb; font-weight: 600;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li.active a, .right-wrap  li.treeview2 ul.treeview-menu2 > li.on a {color: #2f67cb; font-weight: 600;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li ul.listwrap {padding: 0 5px 0; display: block; max-height: 0; overflow: hidden;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li.active ul.listwrap, .right-wrap  li.treeview2 ul.treeview-menu2 > li.on ul.listwrap {padding: 15px; max-height: 250px; background: #dae4ef; box-sizing: border-box; overflow-y: auto;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li .listwrap > li {font-size: 12px; line-height: 20px; }
.right-wrap  li.treeview2 ul.treeview-menu2 > li .listwrap > li  {font-weight: 200; color: #5a759a; display: block; line-height: 16px; text-indent: 0; position: relative; padding-left: 8px;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li .listwrap > li::before {position: absolute; content:''; left: 0; top: 4px; width: 2px; height: 8px; background: #5a759a;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li .listwrap > li  {font-size: 0;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li .listwrap > li  p {display: inline-block; width: 65%; font-size: 13px; vertical-align: top; padding-right: 5px; box-sizing: border-box; font-weight:500;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li .listwrap > li  span {display: inline-block; width: 35%; font-size: 13px; vertical-align: top; padding-left: 5px; box-sizing: border-box;font-weight:300;}
.right-wrap  li.treeview2 ul.treeview-menu2 > li .listwrap > li.active, .right-wrap  li.treeview2 ul.treeview-menu2 > li .listwrap > li.on {color: #5a759a; font-weight: 400;}