/* Layout */
#center { width: 100%; max-width: 2100px; margin: auto; transition: padding .5s ease-in-out, top .3s ease-in-out; }
#center.opened { padding: 170px 10% 0 415px; }
#center.closed { padding: 170px 10% 0 9%; }
#top { width: 100%; padding-left: 2%; height: auto; margin-bottom:2rem;}
#industryTree { position: fixed; z-index: 0; top: 165px; width: 400px; transition: left .5s ease-in-out, top .5s ease-in-out, height .3s ease-in-out, width .5s ease-in-out;
  height: calc(100% - 165px); overflow-y: scroll; overflow-x: hidden; font-size: 13px; }
#industryTree.opened {left: 0; }
#industryTree.closed {left: -400px; }
#industryTree * {  font-weight: 700; }
#industryTree h5 { padding-left: 10px; font-size: 1rem; }
#industryCdTree { width: 90%; }
.treeToggleBtn { display: flex; flex-direction: row; position: fixed; top: 50vh; cursor: pointer; justify-content: center; align-items: center; transition: left .5s ease-in-out; gap: 10px; padding-left: 8px}
.treeToggleBtn.treeOpen { left: 5px }
.treeToggleBtn.start::after { content: ""; position: absolute; top: -40px; left: 5px; width: 138px; display: block; opacity: 1; color: #afafae; transform: scaleX(1); line-height: 1rem; transition: opacity 0.3s ease, transform 0.5s ease; word-break: keep-all}
.treeToggleBtn.treeClose { left: 400px; gap: 0 }
.treeToggleBtn.start.treeClose::after { opacity: 0; transform: scaleX(0);}
.treeToggleBtn .right_arrow2,
.treeToggleBtn .right_arrow3 { transition: transform 0.5s ease, opacity 0.5s ease; display: block; transform: scaleX(1); opacity: 1}
.treeToggleBtn div div { position: relative; width: 4px; height: 12px; background: #afafae; visibility: visible; transition: transform .5s ease, visibility 0.5s ease-in-out, right 0.5s ease; border-radius: 10px; animation: fade-arrow 1s infinite; }
.treeToggleBtn .right_arrow1 div:nth-child(1) { transform: translateY(0.15rem) rotate(-30deg) translateZ(0px); }
.treeToggleBtn .right_arrow1 div:nth-child(2) { transform: translateY(-0.15rem) rotate(30deg) translateZ(0px); }
.treeToggleBtn .right_arrow2 div:nth-child(1) { transform: translateY(0.15rem) rotate(-30deg) translateZ(0px); }
.treeToggleBtn .right_arrow2 div:nth-child(2) { transform: translateY(-0.15rem) rotate(30deg) translateZ(0px); }
.treeToggleBtn .right_arrow3 div:nth-child(1) { transform: translateY(0.15rem) rotate(-30deg) translateZ(0px); }
.treeToggleBtn .right_arrow3 div:nth-child(2) { transform: translateY(-0.15rem) rotate(30deg) translateZ(0px); }
.treeToggleBtn div.right_arrow1 div { animation-delay: .2s; animation-direction: alternate; }
.treeToggleBtn div.right_arrow2 div { animation-delay: .4s; animation-direction: alternate; }
.treeToggleBtn div.right_arrow3 div { animation-delay: .6s; animation-direction: alternate; }
.treeToggleBtn.treeClose .right_arrow2,
.treeToggleBtn.treeClose .right_arrow3 { transform: scaleX(0); opacity: 0}
.treeToggleBtn.treeClose .right_arrow2 div,
.treeToggleBtn.treeClose .right_arrow3 div { visibility: hidden; }
#searchWrapParent { width: 100%; }
#searchWrap { position: absolute; left: 50%; transform: translateX(-50%); }
#searchOpt { width: 100%; height: auto; overflow: auto; padding: 1.5rem; border: 1px solid var(--border-color);  border-radius: 5px; }
#searchOptWord.loading { display: flex; align-items: center }
#searchTable { width: 59%; height: auto; overflow: auto; padding: 1.5rem; border: 1px solid var(--border-color);  border-radius: 5px;}
#searchTable.loading { display: flex; align-items: center }
#supportSearch { height: 100%; width: 100%; border: 1px solid var(--border-color); border-radius: 5px;}
#searchResult { height: auto; width: 100%; padding-left: 2%; padding-right: 2%; font-size: 15px; flex-direction: column; margin-top: 1rem; }
#searchOptTop { display: flex; align-items: center; justify-content: space-between; font-size: 15px; }
#searchResult > #SICode, #searchResult > #CCode, #searchResult > #HSCode { width: 100%; height: 100%; border: 1px solid var(--border-color);
  overflow: auto; margin-top: 10px; padding: .75rem 1.5rem; position: relative; background-color: #FFF; border-radius: 5px; }
#searchResult .search-result-title { border-bottom: 2px solid #000; padding-bottom: .5rem; margin-bottom: 0}
#searchResult .pdf-btn { display: flex; align-items: center; flex: 1; cursor: pointer; }
#searchResult .code-change { position: relative; border-bottom: 1px solid var(--border-color); margin-top: 2rem}
#searchResult .code-change > div { display: inline-flex; gap: 2px; width: 100%; justify-content: left; }
#searchResult .code-change .clickable-text { padding: 0 1rem; }
#searchResult .code-shortcut-change { border-bottom: 2px solid #000; padding: 2rem 0; display: flex; flex-direction: column; gap: 1rem; position: relative}
#searchResult .code-shortcut-change > div { display: flex; position: relative}
#searchResult .code-shortcut-change > div span.clickable-text { position: relative; width: 25%; height: 2rem; padding-right: 5%; z-index: 1; border-radius: 10px; border: 1px solid #7F8080;}
#searchResult .code-shortcut-change > div span.clickable-text.onCode { border: 1px solid var(--color-new-orange)}
#searchResult .code-shortcut-change > div div.code-shortcut-div { position: absolute; display: block; width: 80%; height: 2rem; right: 0; z-index: 2; background-color: #fff; border: 1px solid #7F8080; border-radius: 10px; padding: 4px 1.5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
#searchResult .code-shortcut-change > div div.code-shortcut-div.onCode { border: 1px solid var(--color-new-orange)}
#searchResult .code-shortcut-change > div div.code-shortcut-div a.code-shortcut { display: inline-block; }
#searchResult .code-shortcut-change > div div.code-shortcut-div a.code-shortcut:not(:first-of-type) { margin-left: 1rem }
#searchResult .code-shortcut-change > div div.code-shortcut-div a.code-shortcut:hover { cursor: pointer }
#searchResult .code-shortcut-change > div div.code-shortcut-div a.code-shortcut p { color: #3E3A39; font-weight: 700; margin-bottom: 0;}
#searchResult .code-shortcut-change > div div.code-shortcut-div a.code-shortcut p span { color: var(--color-new-orange); font-weight: 700; margin-right: 0.5rem; }
#searchResult .code-shortcut-change > div.code-shortcut-hs-div div.code-shortcut-div a.code-shortcut p span { margin-right: 0.2rem; }
#searchResult.special .code-shortcut-change { padding: 1.5rem 0; }
#searchResult.special .code-shortcut-change > .code-shortcut-sec-div { display: none }
#searchResult.special .code-shortcut-change > .code-shortcut-hs-div { display: none }
#searchResult.special .code-change .revenue { display: none }
#searchResult.special .code-change .customs { display: none }
.hs-table pre { white-space: pre-line; max-height: 600px; }
.hs-table pre p { font-size: 14px; margin: 8px 0 0 0; }
.hs-table pre .title { font-weight: bold; font-size: 17px; }
.hs-table pre .center { text-align: center; }
.hs-table pre .subtitle { text-align: center; font-weight: bold; font-size: 17px; }
.hs-table pre p.hotype4_ke { margin-left: 79px; text-indent: -12px; }
.hs-table pre p.hotype2_ke { text-indent: -60px; margin: 0px 0px 0px 68px; }
.hs-table pre p.hotype1_ke { font-weight: bold; margin: 15px 0px 25px 0px; }
.hs-table pre a { color: #1D94D0; text-decoration: underline; }
.hs-table pre a:hover { color: #1985b9; }
.no-data-tab td { text-align: center;  font-weight: 700; }
#goExpert { display: flex; align-items: center; margin: 3rem auto 4rem auto; }
#goExpert a { margin: auto }
#goExpert img { height: auto;}
#goConsulting { height: 80px; display: flex; align-items: center; }
#goConsulting a { display: inline-block; padding: 10px 20px; background-color: var(--font-green); color: #fff;
  text-decoration: none; border-radius: 15px; box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.30), 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
  transition: background-color 0.3s ease; cursor: pointer; }
#goConsulting a:hover { background-color: var(--hover-green); }
#goConsulting a img { height: 40px; padding-right: 10px; }
.form-check input, .form-check label { cursor: pointer; }
#datatableDiv {border: 1px solid #e9e9e9; border-radius: 5px; padding: 0.5rem 1rem; overflow-y: auto; max-height: 508.656px}
#datatable { margin-bottom: 0; font-size: .9rem}
#datatable .form-check-input, #datatable2 tbody tr { cursor: pointer; }
#datatable label { cursor: pointer; }
#datatable tbody tr:nth-child(1) td { border-top: none; }
#datatable2 { font-size: 1rem; }
#datatable2 * { font-weight: 600; }
#datatable2 thead tr th:nth-child(1) {width: 80%;}
#datatable2 thead tr th:nth-child(2) {width: 20%;}
#datatable2 tbody td:nth-child(1) { padding-left: 1.5rem; padding-right: 5rem; position: relative }
#datatable2 tbody td:nth-child(1)::after { background-image: url("../../img/icon/popup_icon.svg"); position: absolute; top: calc(50% - 10px); right: 1.5rem; display: inline-block; content: ""; width: 20px; height: 20px}
#datatable2 tbody td:nth-child(2) { vertical-align: middle; }
#datatable2 .tdExample { font-size: 15px; white-space: nowrap; text-overflow: ellipsis; }
#excelDownload { cursor: pointer; }
#industryTitle { display: flex; margin-left: 5rem; align-items: center; position: relative; top : 3px; }
#industryTitle p { display: inline-block; font-weight: 700; color: #1D192B; font-size: 1.2rem; margin-bottom: 0;}
#industryTitle select { margin-left: 7px; height: 28px; border:none; background: none; text-decoration: underline; cursor: pointer; font-size: 1.2rem; text-align: center}
#industryTitle select option { font-size: 1rem}
#industryTitle select:focus { outline: none}

/* 로그인 유도 모달 */
.dark-overlay { position: fixed; top: 130px; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); z-index: 4; }
.guide-div { color: black; position: fixed; z-index: 4; top: 46%; left: 50%; transform: translate(-50%, -46%); background-color: #FFF; border-radius: 16px; width: 550px; height: 440px; text-align: center; padding: 3rem;}
.guide-div .guide-title-div { margin-top:1rem }
.guide-div .guide-title-div img { width: 164px; height: 32px }
.guide-div .guide-content-div { margin-top: 3.5rem }
.guide-div .guide-foot-div { margin-top: 4.5rem }
.guide-div .guide-foot-div button { width: 150px; height: 42px; border-radius: 50px; margin: 0 0.5rem ; font-size: 1.1rem; transition: 0.3s ease-in-out}
.guide-div .guide-foot-div button:first-child { background-color: var(--color-new-orange); color: white; border: 2px solid var(--color-new-orange-active) }
.guide-div .guide-foot-div button:first-child:focus
, .guide-div .guide-foot-div button:first-child:active { outline: none; border-color: var(--color-new-orange-active)}
.guide-div .guide-foot-div button:last-child { background-color: white; color: var(--color-new-orange); border: 2px solid var(--color-new-orange-active) }
.guide-div .guide-foot-div button:last-child:focus
, .guide-div .guide-foot-div button:last-child:active { outline: none; border-color: var(--color-new-orange-active)}
.guide-div p { font-weight: 500; font-size: 1rem;}
.guide-div .guide-content-div-1 p {
  font-family: Freesentation-8ExtraBold, Helvetica; font-weight: 800; font-size: 32px; letter-spacing: 0; line-height: 40px; white-space: nowrap; color: var(--color-new-orange); word-break: keep-all}
.guide-div .guide-content-div-2 p { font-family: Freesentation-5Medium, Helvetica; font-weight: 500; font-size: 20px; letter-spacing: 0; line-height: 26px; text-align: center; margin-bottom: 0; word-break: keep-all; color: #1a1a1a}
.login-button { position: fixed; top: 61%; left: 50%; transform: translate(-50%, -61%); z-index: 4; font-size: 1rem; }

/* hs pop */
#hsPop { height: auto; width: 100%; padding: 2%; font-size: 13px; flex-direction: column; }
#hsPop > #HSCode { width: 100%; height: 100%; overflow: auto; padding: 0 10px; position: relative; background-color: #FFF; }
#hsPop .div-title { font-weight: 600; }
#hsPop .flexibleTd { width: 70px; }
#hsPop .flexibleTd2 { width: 130px; }
#hsPop .hs-table pre { height: 485px; overflow-y: scroll; }
#hsPop .top-category { border-bottom: 1px solid #d7d7d7; }
#hsPop ul a { background-color: #ededed; border-radius: 0; border: 1px solid #cfd2d2; border-left: 1px solid #dee1e1;
  color: #000; padding: .41875rem .9375rem; line-height: 21px; }
#hsPop ul a.active { background-color: #1D94D0; color: #FFF; border: 1px solid #1D94D0; }
#hsPop .top-li { width: 100px; text-align: center; font-size: 14px; height: 36px; }
#hsPop .general-li a { padding: .31875rem .9375rem; line-height: 19px; margin-right: 3px; }
#hsPop .table-bordered th, #hsPop .table-bordered td { border: 1px solid #cfd2d2; }
#hsPop .hs-input-div { background-color: antiquewhite; border-radius: 5px; margin: 30px 10px 10px 10px; padding: 1rem;
  border: 1px solid #cfd2d2; }
#hsPop .hs-input-div label { margin: 0 1rem; font-family: 'Pretendard Variable'; font-weight: 700; }
#hsPop .hs-input-div input { width: 300px; border: 1px solid #CDCDCD; height: 29px; outline: none; padding-left: 10px; }
#hsPop .hs-search { padding: .25rem .7rem; margin-left: .5rem; }
#hsPop .category-div { position: absolute; top: 66px; right: 15px; }
#hsPop .highlight { background: yellow; color: red;  font-weight: 700; }
.mt-44px { margin-top: 44px; }

/* pdf result */
.pdf-result { position: relative }
.pdf-result > h4 { margin-top: 2rem; border-bottom: 1px solid var(--border-color) }
.pdf-result #표준-색인어5 > div { max-height: none; }
.pdf-result .hs-table pre { max-height: none !important; }
.pdf-result .div-title-pdf { width: 100%; margin: 0 auto 20px auto; border-bottom: 2px solid #222; padding-bottom: 1rem;
  display: flex; align-items: center; justify-content: center; text-align: center; line-height: 30px; letter-spacing: 1px;  }
.pdf-result .div-title-pdf p { display: flex; justify-content: center; align-items: center; width: 200px; height: 40px; font-weight: 700; font-size: 25px; color: #222; margin-bottom: 0;}
.pdf-result .pdf-title-img-div { position: absolute; left: 3rem; top: 0.5rem; }
.pdf-result .pdf-title-img-div img { width: 120px }
.pdf-result .pdf-title-text-div { position: absolute; right: 2rem; top: 1.5rem; font-size: 12px; line-height: 0.5px; text-align: right }
.pdf-result .pdf-title-text-div p:nth-child(1) { font-weight: 700 }
.pdf-result .clickable-text-pdf{ background-color: var(--color-new-orange); color: #fff; text-decoration: none; display: inline-block;
  padding: 8px 15px; border-radius: 5px 5px 0 0; transition: background-color 0.3s ease; cursor: pointer; font-size: 1rem; font-weight: 700}
.pdf-result .pdf-bottom-div { width: 100%; display: block; margin-top :1rem; text-align: right}
.pdf-result .pdf-bottom-div p { margin-bottom: 0}

/* Popover */
.search-open-popover { border-radius: 100%; background-color: #d5d5d5; padding: 0.1rem 0.5rem;
  line-height: 19px; position: absolute; top: 21px; right: -22px; color: #FFF; }
.search-popover { max-width: none; }

/* OverRide */
input.form-check-input { margin-top: 0.1rem; }
#datatable input.form-check-input { margin-left: 0; }

/*searchOpt*/
#center .div-title { flex: 12; height: 50px; display: flex; align-items: center; justify-content: start; margin: 0.75rem;
  color: #1D192B; text-align: left;  font-weight: 700; font-size: 24px !important; line-height: 30px; letter-spacing: 1px; position: inherit; }
.selectBtn { height: 35px; width: 70px; display: flex; align-items: center; border-radius: 15px; cursor: pointer;
  justify-content: center; background-color: #cbcbcb; color: #FFF; }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: transparent; }
.btnSelected{ background-color: var(--color-new-orange); }
.search-title { width: 100%; background-color: deepskyblue; color: white; padding-left: 15px; }
.filter-sub-title { display: flex; align-items: center; justify-content: space-between; }
.filter-sub-title > div { display: flex; align-items: center; font-weight: 700; }
.filter-sub-title .left-rect { color: #cbcbcb; font-size: 12px; padding-right: 5px; }
#searchResultBox .card { border-radius: 10px; border-bottom: 1px solid var(--border-color); font-size: .9rem}
#searchAiBtn {position: absolute; top: -7px; right: 1rem; width: 310px; height: 40px; background-color: var(--color-new-orange); border-radius: 20px; display: flex; justify-content: center; align-items: center; color: white; font-family: 'Freesentation-8ExtraBold', Helvetica; font-size: 1rem;}
#searchAiBtn:hover {cursor: pointer}
#searchAiBtn img:nth-of-type(1) {width: 1.3rem}
#searchAiBtn img:nth-of-type(2) {margin-left: 1rem; width: 0.6rem}
#searchAiBtn p {margin-bottom: 0; margin-left: 5px;}
#searchAiBtn p strong {font-weight: 700}
.div-search-menu { display: flex; align-items: center; justify-content: space-between; font-size: 15px; font-weight: 600}
.div-search-menu .search-menu-btn {height: 35px;  width: 110px;  display: flex;  align-items: center;  border-radius: 15px;  cursor: pointer;  justify-content: center; font-size: 15px; letter-spacing: normal; border: 2px solid}
.div-search-menu .search-menu-btn:nth-child(2) { margin-left: 5px;}
.div-search-menu .search-menu-btn.keyword-menu { background-color: #cbcbcb; border-color: #cbcbcb; color: #fff; font-weight: 500; border:none}
.div-search-menu .search-menu-btn.keyword-menu:hover { background-color: #cbcbcb; }
.div-search-menu .search-menu-btn.keyword-menu.selected { background-color: var(--color-new-orange); color: #fff; font-weight: 500 ; cursor: inherit}
.div-search-menu .search-menu-btn.keyword-menu:focus
, .div-search-menu .search-menu-btn.keyword-menu:active { outline: none }
.div-search-menu .search-menu-btn.ai-menu { background-color: #cbcbcb; border-color: #cbcbcb; color: #fff; font-weight: 500; border: none}
.div-search-menu .search-menu-btn.ai-menu:hover { background-color: #cbcbcb;}
.div-search-menu .search-menu-btn.ai-menu.selected { background-color: var(--color-new-orange);  color: #fff; font-weight: 500; cursor: inherit}
.div-search-menu .search-menu-btn.ai-menu:focus
, .div-search-menu .search-menu-btn.ai-menu:active { outline: none }
#defaultDiv h4 { font-weight: 600 }
#defaultDiv h4 span { font-weight: 600 }

/* search result Table */
#resultCount { margin-bottom: 2.3rem; height: 40px; font-size: 20px; }
#resultCount span { font-weight: 600; }
.sort-select-p { font-weight: bold; }
#searchTable .code-sort-div { position: relative; display: inline-block; float: right; top: -5px; font-size: 15px; }
#searchTable .select-sort { border: 1px solid var(--border-color); height: 40px; width: 100px; cursor: pointer;
  position: relative; padding: 10px 15px; border-radius: 5px; line-height: 16px; }
#searchTable .select-sort::before { content: url("../../img/cust/select_icon.png"); position: absolute; right: 20px; top: 10px;
  width: 10px; height: 20px; }
#searchTable .select-sort.open::before { right: 22px; top:9px; transform: rotate(180deg); }
#searchTable .code-sort-div-select { border: 1px solid #eeeeee; width: 100px; height: fit-content; position: absolute;
  left: 0px; z-index: 10; display: none; background-color: white; border-bottom: 1px solid lightgray;
  border-radius: 5px; box-shadow: 0px 2px 5px rgba(0,0,0,0.1); }
#searchTable .code-sort-div-select.open { display: block; }
#searchTable .code-sort-select { display: inline-block; width: 100%; height: 2.5rem; padding: 10px 15px;
  font-size: 1rem; cursor: pointer; }
#searchTable .code-sort-select:hover { background-color: #ebebeb; }
#searchTable .code-sort-select:last-child { border-bottom: none; }

.limit-select-p { font-weight: bold; }
#searchTable .code-limit-div { position: relative; display: inline-block; float: right; top: -5px; font-size: 15px; }
#searchTable .select-limit { border: 1px solid var(--border-color); height: 40px; width: 100px; cursor: pointer;
  position: relative; padding: 10px 15px; border-radius: 5px; line-height: 16px; }
#searchTable .select-limit::before { content: url("../../img/cust/select_icon.png"); position: absolute; right: 20px; top: 10px;
  width: 10px; height: 20px; }
#searchTable .select-limit.open::before { right: 22px; top:9px; transform: rotate(180deg); }
#searchTable .code-limit-div-select { border: 1px solid #eeeeee; width: 100px; height: fit-content; position: absolute;
  left: 0px; z-index: 10; display: none; background-color: white; border-bottom: 1px solid lightgray;
  border-radius: 5px; box-shadow: 0px 2px 5px rgba(0,0,0,0.1); }
#searchTable .code-limit-div-select.open { display: block; }
#searchTable .code-limit-select { display: inline-block; width: 100%; height: 2.5rem; padding: 10px 15px;
  font-size: 1rem; cursor: pointer; }
#searchTable .code-limit-select:hover { background-color: #ebebeb; }
#searchTable .code-limit-select:last-child { border-bottom: none; }

#searchTable .div-title { justify-content: space-between; }
#searchTable .div-title p { margin-top: 0; margin-bottom: 0; font-weight: 700 }
#searchOpt .div-title { justify-content: space-between; }
#searchOpt .div-title p { margin-top: 0; margin-bottom: 0; font-weight: 700 }

#datatable td { vertical-align: middle; padding: 0.6rem 0.5rem}
#datatable td label { margin-bottom: 0;}
#datatable .form-check-input {position: relative}
#datatable .show-middle-category { cursor: pointer; background-repeat: no-repeat; background-size: 10px 10px; background-position: center; padding: 0 1rem}
#datatable .show-middle-category.opened { background-image: url(../../img/icon/minus.svg);}
#datatable .show-middle-category.closed { background-image: url(../../img/icon/plus.svg);}
#datatable .show-middle-category:hover {  font-weight: 700; }
#datatable tbody tr[class^="show-middle-"] td:nth-child(1) {text-align: center; position: relative; left: 5%}
#datatable tbody tr[class^="show-middle-"] td:nth-child(2), #datatable tbody tr[class^="show-middle-"] td:nth-child(3) { display: none !important;}
#datatable tbody tr[class^="show-middle-"] td:nth-child(4) {text-align: left; padding-left: 6%}
#datatable2 .selectData { background: rgba(255, 182, 146, 0.2); }
#datatable2 tbody tr:hover { background: rgba(153, 221, 255, 0.2); }
#searchResult .flexibleTd { width: 100px; text-align: center; background-color: #EDEDED; vertical-align: middle; word-break: keep-all}
#searchResult .flexibleTd2 { width: 150px; text-align: center; background-color: #EDEDED; }
#searchResult .flexibleTd *, #searchResult .flexibleTd2 * { font-weight: 700; }
#searchResult .zoom-div { flex: 1; display: flex; align-items: center; justify-content: center; }
#searchResult .zoom-div > div { height: 45px; width: 45px; display: flex; align-items: center; justify-content: center;
  background-color: #EDEDED; border-radius: 8px; cursor: pointer; }
#searchResult .upper-code-td > span { display: none; }
#searchResult .round-brackets:before { content: "("; }
#searchResult .round-brackets:after { content: ")"; }
b.highlight, b.highlighter {  font-weight: 800 !important;}
b.synonym_highlight { text-decoration: underline; }
.code-shortcut-change b.synonym_highlight { font-weight: 700 }
#searchResult .nav-pills { gap: 1rem; display: flex; }
#searchResult .changeBtn { height: 35px; display: flex; align-items: center; border-radius: 15px; cursor: pointer;
  justify-content: center; color: #000; background-color: #EDEDED; width: 95px; }
#searchResult .changeBtn.active { background-color: var(--color-new-orange); color: #FFF; }
#searchResult .hs-detail-btn.changeBtn.active { background-color: var(--color-new-orange); }
#searchResult .description { padding: .40rem 1rem; }
#searchResult .description > pre { margin: 0 !important; }

#표준-색인어5 > div { max-height: 400px; overflow: auto; }
#표준-연계코드1 a, #표준-연계코드2 a, #표준-연계코드3 a, #표준-연계코드4 a, #표준-연계코드5 a {color: var(--color-new-orange)}
#표준-연계코드1 a:hover, #표준-연계코드2 a:hover, #표준-연계코드3 a:hover, #표준-연계코드4 a:hover, #표준-연계코드5 a:hover { text-decoration: none; }

  /* code post */
#codePostSide { width: 375px; height: calc(100% - 130px); position: fixed; z-index: 1; top: 130px; background: white;
  left: 15px; border-right: 1px solid #cacdcd; transition: left .5s ease-in-out, top .5s ease-in-out; padding-top: 1rem}
#codePostSide.opened { left: 415px }
#codePostSide.closed { left: 22px }
.code-side-content { background-color: #f6f6f6; overflow-y: auto; height: calc(100% - 100px); }
.code-post { border-radius: 10px; margin-top: 2rem; margin-bottom: 2rem; margin-left: 2%; width: 98%; height: auto; background-color: #f6f6f6; }
.code-post-title { width: 100%; height: 50px; border-radius: 10px; margin: auto 0;
  display: flex; justify-content: space-around; align-items: center; position: relative; padding-top: 1rem}
.code-post-title * {  font-weight: 700; }
.code-post-title .code-post-left-side { position: absolute; left: 25px; }
.code-post-title .code-post-left-side img { width: 30px; cursor: pointer; }
.carousel-control-button { background: transparent; border: none; width: 5%; top: 50px; }
.carousel-control-button > span { filter: invert(1) grayscale(100); }
.code-post .code-post-inner { width: 100%; height: auto; padding: 20px 1% 10px 1%; overflow-x: auto; }
.code-post-inner .code-post-div { width: 100%; white-space: nowrap; overflow-x: auto; text-align: center; }
.code-post-inner .code-card-title { text-align: left; color: rgb(125, 125, 125); }
.code-post-inner .code-card-title > svg { opacity: 0.5; }
.code-post-inner .code-card-title-content { padding: 4% 3% 1% 0%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: left;}
.code-post-inner .code-card-title-content > div { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700}
.code-post-inner .code-card-content { padding: 3% 0 5% 0; height: 40%; min-height: 84px; overflow-y: auto; text-align: left; }
.code-post-inner .code-card-content > div { overflow: auto; word-break: break-all; max-height: 100px; scrollbar-width: thin}
.code-post-inner .code-card-time { height: 21px; font-size: 14px; text-align: left; color: rgba(148,148,148,0.9); margin-bottom: 10px;}
.code-post-inner .code-post-card { background-color: #FFF; border-radius: 5px; width: 32%; min-width: 360px;
  display: inline-block; margin: 0 5px; padding: 3% 3% 2% 3%; white-space: normal; }
.code-card-time .like-div { position: absolute; right: 0; color: rgb(100, 100, 100); cursor: pointer; }
#codePostSide .code-post-inner .code-card-title-content { font-size: 14px }
#codePostSide .code-post-inner .code-card-content { font-size: 14px }
.like-img-large { width: 20px; opacity: 0.7; cursor: pointer; }
.like-img-small { width: 15px; opacity: 0.7; cursor: pointer; }
.like-count[data-val="0"] { display: none; }
.more-img-medium { width: 15px; opacity: 0.3; cursor: pointer; }
.more-img-small { width: 13px; opacity: 0.3; cursor: pointer; }
.code-post-inner b.community { font-size: 2rem; padding: 1rem; }
.code-post-inner p.green-line { height: 1rem; width: 4rem; border-bottom: 1px solid var(--font-green); margin: 1rem auto; }
.code-post-inner .code-card-input { padding-top: 10px; position: relative; }
.code-post-inner .code-card-input > textarea { color: #919191; box-sizing: border-box; width: 100%; padding: 11px 16px;
  line-height: 1.4; height: 42px; font-size: 14px; background-color: #FFF; resize: none; border-radius: 6px;
  border: 1px solid #E5E5E5; overflow: hidden; outline: none; }
.code-post-inner .code-card-input > .edit-svg { position: absolute; right: 10px; bottom: 18px; }
.code-post-inner .code-card-reply { color: #8C8C8C; }
.code-post-inner .code-card-reply[data-post-lv="1"] { padding-top: 15px; border-top: 1px solid #E6E6E6; }
.code-post-inner .code-card-reply[data-post-lv="2"] { font-size: 14px; padding-top: 3%; }
.code-post-inner .post-bottom-btn { text-align: center; margin: 2rem auto 1rem auto; display: flex; width: 300px;
  justify-content: center; align-items: center; border-radius: 25px; height: 52px; font-size: 16px; border: 1px solid;
  line-height: 21px; color: #FFF; background-color: #222223; cursor: pointer; font-weight: bold; }
.code-post-inner .post-bottom-btn:hover { background-color: #FFF; color: #222223; }
.code-side-content .code-post-card { background-color: #FFF; display: block; height: auto; width: 100%; margin: 7px auto; border-radius: 0;
  padding: 7%; white-space: normal; }
.code-side-content .code-post-card:nth-child(1) { margin-top: 0; }
.code-side-content .code-card-reply { text-align: left; color: #000 }
.code-side-content .code-card-reply-box { padding: 12px 15px; border-radius: 6px; background-color: #F0F0F0; }
.code-side-content .code-card-reply-title { opacity: 0.6; }
#codePostSide .reply-title { padding: 0 5px 5px 5px; }
#codePostSide .reply-title .reg-time { color: rgba(148,148,148,0.9); }
#codePostSide .reply-content { max-height: 100px; overflow: auto; scrollbar-width: thin; }
#codePostSide .sub-category { font-size: 12px; white-space: nowrap; color: var(--color-new-orange); }
#codePostSide .code-post-title { height: 45px; border-radius: initial; padding: 0 15px; background-color: #FFF; }
#codePostSide h3.m-0 { width: 80%; padding: 10px 0 5px 0; text-align: center; }
#codePostSide .code-post-inner .code-post-div { height: auto; font-size: 15px; }
#codePostSide .reply-open { color: #8C8C8C; text-align: center;}
#codePostModal * { font-size: 1rem; }
#codePostModal .code-post-modal-explain { background-color: #F6F6F6; padding: 15px; color: var(--color-new-orange); }
#codePostModal .btn-reg { color: #FFF; background-color: var(--color-new-orange); border-color: var(--color-new-orange); }
#codePostModal .btn-reg:hover { color: #FFF; background-color: var(--color-new-orange); border-color: var(--color-new-orange); }
#codePostModal .modal-title { font-size: 1.3rem; }
#codePostModal textarea { resize : none; height: 250px; }
#codePostModal .modal-body { padding: 0 1.25rem; }
#codePostModal .form-div { display: flex; }
#codePostModal .form-control { flex: 2; }
#codePostModal .col-form-label { flex: 1; text-align: center; }
#codePostModal .form-control:focus { border-color: var(--color-new-orange); }
#codePostModal .error-message { color: #FF3C2A;  font-weight: 700; font-size: 15px; }
.code-post-filter { background-color: #FFF; padding: 10px 0 10px 0; overflow: hidden; border-bottom: 1px solid var(--border-color);}
.code-post-filter > div { display: flex; padding: 0 15px; align-items: center; width: 188%; }
.code-post-filter > div > span { display: flex; align-items: center; transition: transform 0.6s ease-in-out; transform: translateX(-325px); }
.code-post-filter .input-span > div.side-input-div { flex: 3; opacity: 0; position: relative; }
.code-post-filter .input-span > .zoom-svg { flex: 1; }
.code-post-filter .input-span > .prev-svg { cursor: pointer; flex: 1; }
.code-post-filter .gap-5 { gap: 5px; }
.code-post-filter-button { display: flex; align-items: center; height: 30px; justify-content: center;
  background: #fff; border: 1px solid #dadce0; box-sizing: border-box; border-radius: 20px;
  min-width: 70px; line-height: 1; cursor: pointer; }
.code-post-filter-button.on { background: var(--color-new-orange); color: rgb(232, 240, 254); border: none; }
.code-post-filter .side-input-div { border-radius: 32px; border: 1px solid transparent; padding: 1px 30px 1px 10px;
  box-shadow: 0 2px 5px 1px rgba(64,60,67,.16); background: #FFF; height: 30px; width: 300px; }
.code-post-filter .side-input-div input { width: 225px; height: 90%; color: rgba(0, 0, 0, 0.50);
  border: none; outline: none; line-height: 19px; padding-top: 7px;}
.code-post-filter .side-input-div .cancel-div { position: absolute; right: 5px; top: 2px; cursor: pointer;
  display: none; opacity: 0.75; }
.code-reply:not[data-post-lv="2"] { padding-bottom: 10px; }
.code-reply .code-reply-card { background-color: #f3f3f3; border-radius: 10px; padding: 12px 15px; }
.code-reply .code-reply-card p { margin-bottom: 0 }
.code-card-input[data-post-lv="2"] { padding: 1% 0 0 40px; }
.code-reply[data-post-lv="3"] { font-size: 13px; margin-left: 40px; }
.code-reply .reply-button { padding: 5px 15px; color: rgb(93 93 93); font-size: 13px; }
.like-font-blue { color: #2196F3; }

/* AI 검색필터 */
.ai-filter { margin-top: 25px }
.ai-filter #datatableDiv { height: 462px }
.ai-result { height: 462px }

/*AI 검색결과 테이블 CSS*/
.ai-result table { width:100%; table-layout: fixed}
.ai-result table * { font-size: 1.1rem; font-weight: 600; }
.ai-result table th { vertical-align: middle }
.ai-result table tbody tr.on-click { cursor: pointer; background: rgba(255, 182, 146, 0.2); }
.ai-result table tbody tr:hover { cursor: pointer; background: rgba(153, 221, 255, 0.2); }
/*.ai-result table td { border:1px solid #66CCFF; padding: 10px; font-size: 1rem;}*/
.ai-result table td:nth-child(1) { text-align:center; }
.ai-result table td:nth-child(2) { text-align:center; }
.ai-result table td:nth-child(3) { padding: .40rem 4rem .40rem 1rem; position: relative; overflow:hidden; text-overflow: ellipsis; white-space: nowrap}
.ai-result table td:nth-child(3)::after { background-image: url("../../img/icon/popup_icon.svg"); position: absolute; top: calc(50% - 10px); right: 1.5rem; display: inline-block; content: ""; width: 20px; height: 20px}
.ai-result table td:nth-child(4) { text-align:center; padding: .40rem 1rem; }

/* 코드 번호 검색 */
#industryTree .selectCode button { height: 30px; color: #000; background: #fff; border: 1px solid #dadce0; outline: none;
  box-sizing: border-box; border-radius: 20px; min-width: 70px; line-height: 1; cursor: pointer; font: 13px 'Pretendard Variable'; font-weight: 400; }
#industryTree .selectCode button.selected { background: var(--font-green); color: rgb(232, 240, 254); border: none; }
.code-number-top th { font-size: 1rem; }
.code-number-top td { font-size: 0.8rem; }
.code-number-top .page-list { position: absolute; bottom: 35px; width: calc(100% - 20px); }
.code-num-table tbody tr.selectData { background: rgba(255, 153, 102, 0.2); }
.code-num-table tbody tr:hover:not(.no-data-tr) { cursor: pointer; background: rgba(102, 204, 255, 0.2); }
.nav-link.on { background-color: #886ab5; color: #FFF; }
#sectorCodeTree { width: 90%; min-height: 500px}

/* 엑셀 다운로드 버튼*/
#excelDiv { width: 100%; display: flex; justify-content: center; padding: 1rem; }

/* jstree css*/

.jstree .jstree-container-ul .jstree-node {
  position: relative;
  background: 0 0 !important
}

.jstree .jstree-container-ul .jstree-node:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 1px;
  left: .70312rem;
  border-left: 1px dotted #adb5bd
}

.jstree .jstree-container-ul .jstree-node:last-child:before {
  bottom: 11px
}

.jstree .jstree-container-ul .jstree-node > .jstree-icon.jstree-ocl {
  position: relative;
  background: 0 0
}

.jstree .jstree-container-ul .jstree-node > .jstree-icon.jstree-ocl:before {
  content: '';
  position: absolute;
  left: 50%;
  right: 1px;
  top: 50%;
  border-top: 1px dotted #adb5bd
}

.jstree .jstree-container-ul .jstree-node > .jstree-icon.jstree-ocl:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -3px;
  margin-top: -3px;
  border: 5px solid transparent;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor {
  color: #495057;
  font-weight: 500;
  margin: 3px 0 2px;
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor .jstree-icon.jstree-checkbox {
  background: 0 0
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor .jstree-icon.jstree-checkbox:before {
  content: '';
  position: absolute;
  left: 4px;
  top: 4px;
  right: 4px;
  bottom: 4px;
  border: 1px solid #ced4da;
  display: block;
  background: #fff;
  border-radius: 3px
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor .jstree-icon.jstree-checkbox:after {
  content: '';
  position: absolute;
  left: 7px;
  top: 7px;
  right: 7px;
  bottom: 7px;
  display: block;
  font-family: Font Awesome\ 5 Free, Font Awesome\ 5 Pro, FontAwesome !important;
  font-weight: 900;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor .jstree-icon.jstree-checkbox.jstree-undetermined:after {
  background: #c4cbd2
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor.jstree-clicked {
  color: #20252a
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor.jstree-clicked .jstree-icon.jstree-checkbox:after {
  content: '\f00c';
  font-size: 10px;
  line-height: 15px;
  color: #495057;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor.jstree-disabled {
  color: #8a98a6
}

.jstree .jstree-container-ul .jstree-node .jstree-anchor.jstree-disabled > .jstree-icon {
  opacity: .4;
  -webkit-filter: none;
  filter: none
}

.jstree .jstree-container-ul .jstree-node .jstree-hovered, .jstree .jstree-container-ul .jstree-node .jstree-wholerow-hovered {
  background: 0 0;
  color: #20252a;
  -webkit-box-shadow: none;
  box-shadow: none
}

.jstree .jstree-container-ul .jstree-node .jstree-clicked, .jstree .jstree-container-ul .jstree-node .jstree-wholerow-clicked {
  background: rgba(255, 153, 102, 0.2);
  -webkit-box-shadow: none;
  box-shadow: none
}

.jstree .jstree-container-ul .jstree-node.jstree-open .jstree-anchor > .fa-folder:before {
  content: '\f07c';
  color: #adb5bd
}

.jstree .jstree-container-ul .jstree-node.jstree-open .jstree-anchor.jstree-clicked > .fa-folder:before {
  color: #2d353c
}

.jstree .jstree-container-ul .jstree-node.jstree-open > .jstree-ocl:after {
  border-left-color: #adb5bd;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg)
}

.jstree .jstree-container-ul .jstree-node.jstree-closed > .jstree-ocl:after {
  border-left-color: #adb5bd;
  margin-top: -5px;
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -ms-transform: rotate(0);
  -o-transform: rotate(0);
  transform: rotate(0)
}


.nav.nav-tabs.nav-tabs-inverse {
  background-color: #20252a;
  border-radius: 4px 4px 0 0
}

.nav.nav-tabs.nav-tabs-inverse .nav-item .nav-link {
  color: rgba(255, 255, 255, .65)
}

.nav.nav-tabs.nav-tabs-inverse .nav-item .nav-link:focus, .nav.nav-tabs.nav-tabs-inverse .nav-item .nav-link:hover {
  color: #fff
}

.nav.nav-tabs.nav-tabs-inverse .nav-item .nav-link.active {
  color: #2d353c
}

.nav.nav-pills .nav-item .nav-link {
  padding: .61875rem .9375rem;
  font-weight: 500;
  color: #6f8293
}

.nav.nav-pills .nav-item .nav-link:focus, .nav.nav-pills .nav-item .nav-link:hover {
  color: #2d353c
}

.nav.nav-pills .nav-item .nav-link.active {
  color: #fff
}

@media (max-width: 767.98px) {
  .nav-wizards-container {
    overflow: scroll
  }

  .nav-wizards-container .nav.nav-wizards-1, .nav-wizards-container .nav.nav-wizards-2, .nav-wizards-container .nav.nav-wizards-3 {
    min-width: 600px
  }
}

.nav.nav-wizards-1 {
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap
}

.nav.nav-wizards-1 .nav-item {
  padding: 0
}

.nav.nav-wizards-1 .nav-item .nav-link {
  position: relative;
  color: #495057
}

.nav.nav-wizards-1 .nav-item .nav-link .nav-no {
  width: 40px;
  height: 40px;
  margin: 0 auto;
  font-weight: 500;
  background: 0 0;
  border: 2px solid #ced4da;
  position: relative;
  z-index: 10;
  font-size: .875rem;
  border-radius: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.nav.nav-wizards-1 .nav-item .nav-link .nav-text {
  text-align: center;
  margin-top: .46875rem;
  font-weight: 500;
  font-size: .75rem
}

.nav.nav-wizards-1 .nav-item .nav-link.active, .nav.nav-wizards-1 .nav-item .nav-link.completed {
  color: #348fe2
}

.nav.nav-wizards-1 .nav-item .nav-link.active .nav-no, .nav.nav-wizards-1 .nav-item .nav-link.completed .nav-no {
  border-color: #348fe2;
  color: #348fe2
}

.nav.nav-wizards-1 .nav-item .nav-link.active:after, .nav.nav-wizards-1 .nav-item .nav-link.active:before, .nav.nav-wizards-1 .nav-item .nav-link.completed:after, .nav.nav-wizards-1 .nav-item .nav-link.completed:before {
  background: #348fe2
}

.nav.nav-wizards-1 .nav-item .nav-link.active:after, .nav.nav-wizards-1 .nav-item .nav-link.completed:after {
  width: calc(50% - 20px)
}

.nav.nav-wizards-1 .nav-item .nav-link.active .nav-no {
  -webkit-box-shadow: 0 0 0 5px rgba(52, 143, 226, .2);
  box-shadow: 0 0 0 5px rgba(52, 143, 226, .2)
}

.nav.nav-wizards-1 .nav-item .nav-link.disabled {
  color: #adb5bd
}

.nav.nav-wizards-1 .nav-item .nav-link:after, .nav.nav-wizards-1 .nav-item .nav-link:before {
  content: '';
  position: absolute;
  top: 1.6875rem;
  height: 2px;
  background: #ced4da;
  left: 0;
  right: calc(50% + 20px)
}

.nav.nav-wizards-1 .nav-item .nav-link:after {
  left: calc(50% + 20px);
  right: 0;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.nav.nav-wizards-1 .nav-item:first-child .nav-link:after, .nav.nav-wizards-1 .nav-item:first-child .nav-link:before {
  left: calc(50% + 20px)
}

.nav.nav-wizards-1 .nav-item:last-child .nav-link:before {
  right: calc(50% + 20px)
}

.nav.nav-wizards-1 .nav-item:last-child .nav-link.active:before, .nav.nav-wizards-1 .nav-item:last-child .nav-link.completed:before {
  background: #348fe2
}

.nav.nav-wizards-1 .nav-item:last-child .nav-link:after {
  display: none
}

.nav.nav-wizards-2 {
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap
}

.nav.nav-wizards-2 .nav-item {
  padding: 0 1rem
}

.nav.nav-wizards-2 .nav-item .nav-link {
  position: relative;
  color: #2d353c;
  background: #e9ecef;
  border-radius: 60px
}

.nav.nav-wizards-2 .nav-item .nav-link .nav-text {
  text-align: center;
  font-weight: 500;
  font-size: .75rem;
  position: relative;
  z-index: 10;
  background: inherit;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.nav.nav-wizards-2 .nav-item .nav-link:after, .nav.nav-wizards-2 .nav-item .nav-link:before {
  content: '';
  position: absolute;
  left: -1rem;
  right: -1rem;
  height: 2px;
  top: 50%;
  margin-top: -1px;
  background-color: #e9ecef;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.nav.nav-wizards-2 .nav-item .nav-link:after {
  width: 0%;
  background: #348fe2
}

.nav.nav-wizards-2 .nav-item .nav-link.disabled {
  color: #ced4da
}

.nav.nav-wizards-2 .nav-item .nav-link.active, .nav.nav-wizards-2 .nav-item .nav-link.completed {
  background: #348fe2;
  color: #fff
}

.nav.nav-wizards-2 .nav-item .nav-link.active:after, .nav.nav-wizards-2 .nav-item .nav-link.completed:after {
  width: calc(100% + 2rem)
}

.nav.nav-wizards-2 .nav-item .nav-link.active {
  -webkit-box-shadow: 0 0 0 4px rgba(52, 143, 226, .2);
  box-shadow: 0 0 0 4px rgba(52, 143, 226, .2)
}

.nav.nav-wizards-2 .nav-item:first-child .nav-link:after, .nav.nav-wizards-2 .nav-item:first-child .nav-link:before {
  left: 50%
}

.nav.nav-wizards-2 .nav-item:last-child .nav-link:before {
  right: 50%
}

.nav.nav-wizards-2 .nav-item:last-child .nav-link.active:before, .nav.nav-wizards-2 .nav-item:last-child .nav-link.completed:before {
  background: #348fe2
}

.nav.nav-wizards-2 .nav-item:last-child .nav-link:after {
  display: none
}

.nav.nav-wizards-3 {
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap
}

.nav.nav-wizards-3 .nav-item {
  padding: 0
}

.nav.nav-wizards-3 .nav-item .nav-link {
  position: relative;
  color: #495057
}

.nav.nav-wizards-3 .nav-item .nav-link .nav-dot {
  width: 16px;
  height: 16px;
  margin: 0 auto;
  font-weight: 500;
  border: 3px solid #ced4da;
  position: relative;
  z-index: 10;
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.nav.nav-wizards-3 .nav-item .nav-link .nav-title {
  margin-top: .46875rem;
  font-weight: 500;
  text-align: center;
  font-size: .875rem
}

.nav.nav-wizards-3 .nav-item .nav-link .nav-text {
  text-align: center;
  font-size: .75rem;
  color: #6c757d;
  font-weight: 500
}

.nav.nav-wizards-3 .nav-item .nav-link.active, .nav.nav-wizards-3 .nav-item .nav-link.completed {
  color: #20252a
}

.nav.nav-wizards-3 .nav-item .nav-link.active .nav-dot, .nav.nav-wizards-3 .nav-item .nav-link.completed .nav-dot {
  border-color: #348fe2;
  color: #348fe2
}

.nav.nav-wizards-3 .nav-item .nav-link.active:after, .nav.nav-wizards-3 .nav-item .nav-link.active:before, .nav.nav-wizards-3 .nav-item .nav-link.completed:after, .nav.nav-wizards-3 .nav-item .nav-link.completed:before {
  background: #348fe2
}

.nav.nav-wizards-3 .nav-item .nav-link.active:after, .nav.nav-wizards-3 .nav-item .nav-link.completed:after {
  width: calc(50% - 8px)
}

.nav.nav-wizards-3 .nav-item .nav-link.active .nav-dot {
  -webkit-box-shadow: 0 0 0 5px rgba(52, 143, 226, .2);
  box-shadow: 0 0 0 5px rgba(52, 143, 226, .2)
}

.nav.nav-wizards-3 .nav-item .nav-link.disabled {
  color: #adb5bd
}

.nav.nav-wizards-3 .nav-item .nav-link.disabled .nav-text {
  color: inherit
}

.nav.nav-wizards-3 .nav-item .nav-link:after, .nav.nav-wizards-3 .nav-item .nav-link:before {
  content: '';
  position: absolute;
  top: .875rem;
  height: 3px;
  background: #ced4da;
  left: 0;
  right: calc(50% + 8px)
}

.nav.nav-wizards-3 .nav-item .nav-link:after {
  left: calc(50% + 8px);
  right: 0;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.nav.nav-wizards-3 .nav-item:first-child .nav-link:after, .nav.nav-wizards-3 .nav-item:first-child .nav-link:before {
  left: calc(50% + 8px)
}

.nav.nav-wizards-3 .nav-item:last-child .nav-link:before {
  right: calc(50% + 8px)
}

.nav.nav-wizards-3 .nav-item:last-child .nav-link.active:before, .nav.nav-wizards-3 .nav-item:last-child .nav-link.completed:before {
  background: #348fe2
}

.nav.nav-wizards-3 .nav-item:last-child .nav-link:after {
  display: none
}

.navbar.navbar-sticky {
  top: 70px;
  position: sticky;
  border-left: 1px solid #ced4da;
  padding: 0;
  padding-left: .46875rem;
  margin-left: .46875rem
}

.navbar.navbar-sticky .nav {
  width: 100%;
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column
}

.navbar.navbar-sticky .nav .nav-link {
  color: #6c757d;
  padding: .25rem 1rem
}

.navbar.navbar-sticky .nav .nav-link:hover {
  color: #495057
}

.navbar.navbar-sticky .nav .nav-link.active {
  color: #20252a;
  font-weight: 700
}

.fade {
  transition: opacity .15s linear
}

@media (prefers-reduced-motion: reduce) {
  .fade {
    transition: none
  }
}

.fade:not(.show) {
  opacity: 0;
  display: none;
}

.tab-content > .tab-pane {
  display: none
}

.tab-content > .active {
  display: block
}

/* bottom */
#bottom { width: 100%; padding: 50px;}
#ctrlLine { margin-top: 3rem; }
.box-subtitle > h2 {  font-weight: 700; }
.search-btn { font-size: 15px; display: inline-flex; flex-direction: column; justify-content: center;
  align-items: center; gap: 8px; border-radius: 10px; }
.search-btn > span { line-height: 1px; }
#searchHistoryBtn { width: 70px; height: 40px; color: white; background-color: var(--color-new-orange); border: none; }
/*#searchHistory { height: 500px; }*/
#searchHistory .search-input-box { width: 210px; height: 48px; border-top-left-radius: 4px; border-top-right-radius: 4px;
  flex-direction: column; justify-content: flex-start; align-items: flex-start; display: inline-flex; }
#searchHistory .search-input-box > div { align-self: stretch; height: 40px; border-radius: 4px; border: 3px var(--color-new-orange) solid;
  flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 10px; display: flex; }
#searchHistory .search-input-box > div > div { align-self: stretch; flex: 1 1 0; border-top-left-radius: 4px;
  border-top-right-radius: 4px; justify-content: flex-start; align-items: flex-start; display: inline-flex; }
#searchHistory .search-svg { width: 48px; height: 32px; flex-direction: column; justify-content: center;
  align-items: center; gap: 10px; display: inline-flex; }
#searchHistory .search-svg > div { border-radius: 100px; overflow: hidden; justify-content: center;
  align-items: center; gap: 10px; display: inline-flex; }
#searchHistory .search-svg > div > div { padding: 8px; justify-content: center; align-items: center; gap: 10px; display: flex; }
#searchHistory .search-input { flex: 1 1 0; height: 32px; padding-top: 4px; flex-direction: column; justify-content: center;
  outline: none; align-items: flex-start; display: inline-flex; font-size: 16px; border: none; width: 100%; }
.input-cancel svg { cursor: pointer; }

/* scroll */
#industryTree::-webkit-scrollbar,
.code-side-content::-webkit-scrollbar,
.code-post-inner .code-card-content::-webkit-scrollbar {
  width: 8px;
}
#industryTree::-webkit-scrollbar-thumb,
.code-side-content::-webkit-scrollbar-thumb,
.code-post-inner .code-card-content::-webkit-scrollbar-thumb {
  background-color: transparent; border-radius: 5px;
}
#industryTree::-webkit-scrollbar-track,
.code-side-content::-webkit-scrollbar-track,
.code-post-inner .code-card-content::-webkit-scrollbar-track {
  background-color: transparent;
}
#industryTree::-webkit-scrollbar-thumb:vertical,
.code-side-content::-webkit-scrollbar-thumb:vertical,
.code-post-inner .code-card-content::-webkit-scrollbar-thumb:vertical {
  height: 50px;
}
#industryTree::-webkit-scrollbar-button:vertical:start:decrement,
.code-side-content::-webkit-scrollbar-button:vertical:start:decrement,
.code-post-inner .code-card-content::-webkit-scrollbar-button:vertical:start:decrement {
  height: 15px;
  background-color: transparent;
}
#industryTree::-webkit-scrollbar-button:vertical:end:increment,
.code-side-content::-webkit-scrollbar-button:vertical:end:increment,
.code-post-inner .code-card-content::-webkit-scrollbar-button:vertical:end:increment {
  height: 15px;
  background-color: transparent;
}
.gray-scrollbar::-webkit-scrollbar-thumb { background-color: #dcdcdc !important; }
.gray-scrollbar::-webkit-scrollbar-thumb:hover { background-color: #cdcdcd !important; }


@media (max-width: 1679px) {
  #searchWrap { left: 55% }
}

@media (min-width: 768px) and (max-width: 1599px) {
  #top {display: block !important;}
  #searchOpt {width: 100% !important; margin-right: 0 !important;}
  #searchTable {width: 100%; margin-top : 1rem}
  #datatable2 tbody td:nth-child(1)::after { right: 2rem; }
  #datatable tbody tr[class^="show-middle-"] td:nth-child(1) {width: 20px; left: 3%}
  #datatable tbody tr td[class^="main-category-td"] {padding-left: 2%}
  #datatable .show-middle-category {padding: 0 0.5rem}
}

@media (max-width: 1279px) {
  #industryTitle {margin-left: 3rem;}
  .treeToggleBtn::after {display: none}
}

@media (min-width: 768px) and (max-width: 1151px) {
  #industryTitle {margin-left: 2rem;}
}

@media (min-width: 992px) and (max-width: 1023px) {
  #searchWrap { left: 60% }
}

/* 미디엄 디바이스용 스타일 */
@media (min-width: 768px) and (max-width: 991px) {
  /* 미디엄 디바이스에 적용할 스타일 */
  #center.opened { padding: 135px 10% 0 345px; }
  #center.closed { padding: 135px 10% 0 9% }
  #industryTree { width: 330px; top: 120px; }
  .treeToggleBtn.treeClose {left : 325px}
  .clickable-text {font-size: 16px}
  #codePostSide{ top: 80px; }
  #codePostSide.opened {left : 345px;}
  #center .div-title {font-size: 22px !important; word-break: keep-all}
  #industryTitle { display: none !important; }
  #searchResult .code-shortcut-change {padding: 1rem 0;}
  #datatable .show-middle-category {padding: 0 0.7rem}
  #searchWrap { left: 50%; width: 45% }
}

/* 스몰 디바이스용 스타일 */
@media (max-width: 767px) {
  html, body { margin: 0; padding: 0; height:calc(var(--vh, 1vh) * 100); }
  .mob-popover { display: none; }
  .dark-overlay { top: 60px; }
  .guide-div { width: 80%; }
  .guide-div p { font-size: 1.2rem; }
  .login-button { top: 64%; transform: translate(-50%, -64%); }
  /* mob search Keyword */
  #searchResult > #SICode, #searchResult > #CCode, #searchResult > #HSCode { padding: .3rem; }
  .mob-wrapper { height: calc(100% - 155px); position: relative; top: 65px; overflow: auto; background: #FAFAFA;
    display: flex; flex-direction: column; }
  #searchWrap { position: absolute; top: 80px; height: 40px; width: 70vw; left: 50%; margin: 0; transform: translateX(-50%); }
  #industryTitle { display: none !important;}
  #searchBox { padding-top: 0; margin-top: 2px; }
  #defaultDiv ul { padding: 0; }

  /* search Option */
  #searchOpt { width: 90vw; margin: 20px auto; border: 1px solid #cacdcd; overflow: auto; padding: 0;
    border-radius: 15px; position: relative; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); background: #FFF;}
  #searchOptTop { font-size: 13px; }
  .filter-sub-title { justify-content: initial; font-size: 1.2rem; font-weight: 600 }
  .d-flex.search-toggle-box.mb-1 { position: absolute; right: 15px; font-size: 11px; gap: 5px; }
  .selectBtn { width: 55px; height: 25px; }
  /* search Table */
  #searchTable { width: 90vw; position: relative; height: auto; border: 1px solid #cacdcd; overflow: auto; min-height: 250px;
    border-radius: 15px; bottom: 5px; margin: 0 auto; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); background: #FFF; padding: 0; padding-bottom: 1rem}
  #datatable tbody tr[class^="show-middle-"] td:nth-child(1) {left: 7%}
  #datatable tbody tr[class^="show-middle-"] td:nth-child(4) {padding-left: 10%; font-size: 0.8rem}
  #datatable .show-middle-category {padding: 0 1.5rem; background-size : 8px 8px;}
  #datatable2 { font-size: inherit; }
  #datatable2 .tdExample { white-space: normal; font-size: 13px; }
  #datatable2 th { white-space: nowrap; }
  #datatable2 tbody td { vertical-align: middle; }
  #datatable2 tbody td:nth-child(1) { padding-left: 1rem; padding-right: 0.5rem}
  #datatable2 tbody td:nth-child(1)::after { display: none }
  #searchTable .select-limit { height: 30px; padding: 5px 15px; }
  #searchTable .select-limit.open::before, #searchTable .select-limit::before { top: 4px; }
  #excelDownload { margin-top: 10px; }
  #excelDiv { padding-top: 0; }
  /* search Result */
  .clickable-text { padding: 7px 7px; font-size: 12px; }
  #searchResult { display: none; height: auto; padding: 0; font-size: 14px; }
  #searchResult .code-shortcut-change {padding: 1rem 0;}
  #searchResult .code-change { margin-top: 1rem }
  #searchResult .code-change > div { gap: 2px; }
  #searchResult .nav-pills { gap: 5px; }
  #searchResult .changeBtn { font-size: 3.3vw; width: 20.3vw; }
  #searchResult > div:not(#industryTree, #goConsulting) { width: 90vw; height: auto; margin: 15px auto; border-radius: 15px;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); }
  #resultCount { height: 30px; font-size: 18px; margin-bottom: 1rem;}
  .tab-content h4 { font-size: 0.9rem; }
  .hs-table pre { margin: auto !important; padding: 0; }
  .hs-table pre p { font-size: 13px; }
  .hs-table pre p img { width: 100% !important; }
  #goConsulting { display: none; }
  .mob-nodata-ul { padding-left: 6%; }
  #searchResult .description { padding: .5rem; }
  .associated-code .clickable-text { background: rgba(255, 93, 26, 0.08); border-radius: 10px; color: var(--color-new-orange);
    height: auto; padding: 7px 10px; justify-content: flex-start; }
  #searchResult .flexibleTd { width: 70px; }
  #searchResult .flexibleTd2 { width: 75px; }

  #업종-일반율1, #업종-초과율1, #업종-자가율1, #업종-일반율2, #업종-초과율2, #업종-자가율2, #업종-일반율3, #업종-초과율3, #업종-자가율3, #업종-일반율4, #업종-초과율4, #업종-자가율4, #업종-일반율5, #업종-초과율5, #업종-자가율5, #업종-일반율6, #업종-초과율6, #업종-자가율6 {vertical-align: middle}

  /* code-post */
  .code-post-filter > div { width: 197%; }
  .code-post-inner b.community { font-size: 6vw; }
  .code-post-inner .no-post-explain { font-size: 4vw; width: 90%; white-space: break-spaces; margin: 0 auto; }
  #codePostModal * { font-size: 0.9rem; }


  /* mob ai div */
  /* search Option */
  #searchOpt.ai-div { height: auto; }
  .ai-div #resultCount { font-size: 1.3rem; }
  .ai-div .ai-code { font-size: 1rem; padding-bottom: 0.5rem; }
  .ai-div .search-title { display: none; }
  .ai-div .card-body { padding-bottom: 10px !important; }
  .ai-div #aiResultTable th { white-space: nowrap; vertical-align: middle}
  .ai-div #aiResultTable tr td { vertical-align: middle ; word-break: keep-all}
  .ai-result table * { font-size: inherit; }
  .ai-div .ai-result table td { font-size: 14px; }
  .ai-result { height: auto}
  .ai-result table td:nth-child(3) { padding: .40rem; overflow: unset; text-overflow: unset; white-space: unset}
  .ai-result table td:nth-child(3)::after { display: none}
  .ai-result table colgroup col:nth-child(1) {width: 10% !important;}
  .ai-result table colgroup col:nth-child(2) {width: 20% !important;}
  .ai-result table colgroup col:nth-child(3) {width: 50% !important;}
  .ai-result table colgroup col:nth-child(4) {width: 20% !important;}
  .ai-filter { margin-bottom: 1rem }
  .ai-filter #datatableDiv { height: auto}

  /* hs code modal */
  #hsPop .hs-input-div input { width: 50%; }
  #hsPop .top-li { width: 25%; }

  /* code post */
  #codePostSide { border: 1px solid #cacdcd; overflow: auto; background-color: #FFF; position: static; }
  .code-post-card:last-child { margin: auto; }

  /* my page */
  #searchHistory .search-input-box { width: 100% }
}

@media (max-width: 575px) {
  /* 로그인 유도 모달 */
  .guide-div { padding: 1rem;}
  .guide-div .guide-title-div { margin-top: 3rem }
  .guide-div .guide-title-div img { width: 140px; height: 24px }
  .guide-div .guide-content-div { margin-top: 3.5rem }
  .guide-div .guide-foot-div { margin-top: 4rem }
  .guide-div .guide-foot-div button { width: 100px; height: 35px; border-radius: 50px; margin: 0 0.3rem ; font-size: 0.8rem; transition: 0.3s ease-in-out}
  .guide-div .guide-content-div-1 p { font-size: 20px}
  .guide-div .guide-content-div-2 p { font-size: 15px}
}

/* 출력 시 숨김 처리 */
.print-hide {
  display:block;
}

/* 출력 시 노출 처리 */
.print-show {
  display:none;
}

/* 출력 시 페이지 높이가 크면 자동으로 다음 페이지로 이동 */
.page-break {
  page-break-before: always;
}


/* 프린트 디자인 수정 */
@media print {
  .print-show { display:block;}
  .print-hide {display:none;}

  @page {margin:1.3cm 1.3cm}
  @page :first {margin:0 1.3cm}

  html {margin:1.3cm 0;}
}



/*앵커 태그 밑줄 제거*/
.nav-item > a {
  text-decoration: none;
}





