@charset "UTF-8";
@import url(./oneFont.css);    
/* 22-05-01 V0.1 */

/* common */
html, body {height:100%;}
body {margin:0px; font-family: 'Noto Sans Korean', Dotum, sans-serif; line-height:160%; letter-spacing:-0.06em; color:#666; font-weight:500;}
.skip {position:absolute; overflow:hidden; height:0; width:0; font-size:0; visibility:hidden;}
a, a:visited, a:link, a:hover {display:inline-block; text-decoration:none; box-sizing: border-box; color:inherit;}
ol, ul, li, dl, dt {margin:0px; padding:0px; list-style-type: none;}
ul:after {display:block; content:""; clear:both;}
header, main, footer, aside, nav, section {position:relative; display:block; box-sizing:border-box;}
address {font-style:normal;}



sub {position:relative; vertical-align:bottom; bottom:-0.2em;}
#skipnavigation a {position:absolute; left:-3000%;}
#skipnavigation a:focus { display:block; left:0; top:0; z-index:10000000000; width:100%; height:30px; line-height:30px; background:#039; color:#fff; text-align:center;}


/********** index **********/
.oneIndex {background:#eee; padding-bottom:60px; height: auto;}
.oneIndex h1 {font-size:30px; font-weight:bold; color:#000; margin:30px;}
.oneIndex h2 {font-size:24px; font-weight:bold; color:#000; margin:20px 30px; background:#eee; z-index: 10;}
.oneIndex h2::after {content:""; position:absolute; right:30px; border-top:1px dashed #ccc; margin-top:18px; z-index:1;}
.oneIndex .listLinkUl {margin:10px 30px; position:relative}
.oneIndex .listLinkUl li {display:block; height:30px; font-size:16px; line-height:30px; margin-bottom:3px; background:#fff; cursor:pointer; border-radius:4px; box-shadow:2px 2px 5px rgba(0,0,0,0.1); position:relative; padding-left:150px; transition:all 0.3s ease;}
.oneIndex .listLinkUl li:nth-child(even) {background:rgb(242, 247, 248);}
.oneIndex .listLinkUl li > strong {display:inline-block; width:130px; position:absolute; left:10px; font-size: 14px;}
.oneIndex .listLinkUl li > strong::after {content:""; position:absolute; height:20px; top:5px; border-right:1px dashed #ccc; right:0px;}
.oneIndex .listLinkUl li > span {font-size:12px; padding-left:5px; color:rgb(96, 189, 206);}
.oneIndex .listLinkUl li > .listStep {font-size:12px; height:20px; border-radius:4px; left:150px; line-height: 20px; top: 5px; padding: 0px 5px;  color: #fff; display: inline-block; margin-right: 10px;}
.oneIndex .listLinkUl li > .listStep.step1 {background:rgb(255, 160, 36);}
.oneIndex .listLinkUl li > .listStep.step2 {background: rgb(48, 142, 158);}
.oneIndex .listLinkUl li > .listStep.step3 {background: #ccc;}
.oneIndex .listLinkUl li > .listStep.step4 {background: #cf0000;}
.oneIndex .listLinkUl li > .listUrl {display:inline-block; font-size:12px;  position:absolute; height:30px; right:0px; text-align: right; margin:0px; padding:0px 10px; color:rgb(96, 189, 206);}
.oneIndex .listLinkUl li:hover {background:rgb(48, 142, 158); color:#fff;}
.oneIndex .listLinkUl li:hover strong {color:#fff;}
.oneIndex .listLinkUl li:hover span {color:#fff;}
.oneIndex .listLinkUl li:hover div {color:#fff;}
.oneIndex .listLinkUl li:hover .listStep {background-color:#fff; color:#000;}
.oneIndex .totalBox {position:absolute; top:20px; right:30px;}
.oneIndex .totalBox dl {margin:0px; text-align: right;}
.oneIndex .totalBox dl dt {display:inline-block; margin-left:20px; color:#777;}
.oneIndex .totalBox dl dd {display:inline-block; font-size:40px; margin: 0px 0px 0px 10px; font-weight: 600;}
.oneIndex .totalBox dl #total1 {color:rgb(255, 160, 36);}
.oneIndex .totalBox dl #total2 {color:rgb(48, 142, 158);}
.oneIndex .totalBox dl #total3 {color:#ccc;}
.oneIndex .totalBox dl #total4 {color: #cf0000;}
  
  /* 제목 */
  .cTitle1 {display:block; font-size:36px; color:#000; font-weight: 400; margin:0px 0px 20px 0px;line-height: 150%;}
  .cTitle2 {display:block; font-size:24px; color:#000; font-weight: 500; margin:0px 0px 16px 0px;line-height: 150%;}
  .cTitle3 {display:block; font-size:20px; color:#0065BA; font-weight: 500; margin:0px 0px 11px 0;line-height: 150%;}
  .cTitle4 {position:relative; display:block; padding-left:10px; font-size:18px; color:#666; font-weight: 500; margin:0px 0px 4px 0;line-height: 150%;}
  .cTitle4:after {position:absolute; left:0; top:50%; display:block; content:""; width:2px; height:18px; transform:translateY(-50%); background-color:#666;}
  .cTitle5 {display:block; font-size:17px; color:#0065BA; font-weight: 500; margin:0px 0px 4px 0;line-height: 150%;}

  .cTitle2 sup {font-size:16px; letter-spacing:0.08em;}
  
  /* 문단 > 단구성 */
  .titleBox {position:relative; display:inline-block; width:100%; overflow:hidden;}
  .danBox {line-height:35px; position:relative; overflow:hidden; width:100%; display:inline-block;}
  /* .danBox input {line-height: 30px;} */
  .danBoxL {float: left;}
  .danBoxR {float: right;}
  /* 문단 > 문단구성 */
  .conBox {position:relative; max-width:800px; font-size:17px; color:#555; font-weight:400; margin:0px 0px 39px 0px;}
  .conWideBox {position:relative; max-width:1000px; font-size:17px; color:#555; font-weight:400; margin:0px 0px 39px 0px;}
  .conBox .conBox {margin:0px 0px 28px 0px;}

  .al {text-align:left;} .ac {text-align:center;} .ar {text-align:right;} .aj {text-align:justify;}


  /* Font Size */
  .text_s {font-size:14px;}

  .conImg {position:relative; margin-top:24px;}
  .conImg > img {max-width:100%;}
  .conImg > img.auto {max-width:none;}
  .conImg > img.sizeXS {width:300px;}
  .conImg > img.sizeS {width:500px;}
  .conImg > img.sizeM {width:600px;}
  .conImg > img.sizeMax {width:100%;}
  .conImg > span {display:block; font-size:15px; font-weight:500; color:#555;}

  .conImg .request {position:absolute; top:20px; left:20px; padding:20px; color:#fff; font-size:30px; font-weight:bold; background-color:rgba(0, 0, 0, 0.7);}
  .conImg .request.center {left:50%; transform:translate(-50%);}
  .request {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); padding:20px; color:#fff; font-size:30px; font-weight:bold; white-space:nowrap; background-color:rgba(0, 0, 0, 0.7);}

  .conImg.img2 > img {width:calc(50% - 10px);}
  .conImg.img2 > img:nth-child(2) {float:right;}
  .conImg.img2 > span {display:inline-block; width:calc(50% - 10px);}
  .conImg.img2 > span:nth-of-type(2) {float:right;}
  
  .conImg.img3 {font-size:0;}
  .conImg.img3 > img {width:calc(33.3% - 8px); margin-right:12px;}
  .conImg.img3 > img:nth-of-type(3) {margin-right:0;}
  .conImg.img3 > span {padding-top:10px;}

  .conRBox {position:absolute; top:0; right:0;}
  .conP {font-size:17px; color:#555; font-weight:400; line-height:28px; margin:0px 0px 7px 0px; text-align:justify;}
  .conBracket {font-size:14px;}
  /* 문단 > 리스트구성 */
  .listUl {margin:0px 0px 20px 0px; padding-left:0.7em; font-size:16px; font-weight:400; line-height:24px; text-indent:-0.7em; color:#555;}
  .listUl > li {margin-bottom:8px;}
  .listUl > li:last-child {margin-bottom:0;}
  .listOl {margin:0px 0px 20px 0px; padding-left:0.7em; text-indent:-0.7em;}
  .listOl li {font-size:15px; color:#555; font-weight: 400;}
  .listBox:after {display:block; content:""; clear:both;}  
  .listBox li {float: left; width:33.3%; padding:20px 0; font-size:15px; text-align:center; background-color:#F5F5F5;}
  .listBox li strong {display:block; margin-bottom:10px; font-size:18px; font-weight:500; color:#0065BA;}

  /* guideBox */
  .guideBox {position:relative; margin-top:20px; border-left:2px solid #D7E5EF; background:#F5F5F5; padding:8px 20px; font-size:14px;}
  .guideBox > ol,
  .guideBox > ul {margin:0px 0px 0px 62px; padding-left:0.7em; text-indent:-0.9em;} 
  .guideBox > ul > li {margin-bottom:4px; font-size:14px; font-weight:400; line-height:22px; color:#666;} 
  .guideBox > ul > li:last-child {margin-bottom:0;}
  .guideBox > ul > li > ul {padding-left:20px;}
  .guideBox:after {position:absolute; top:6px; display:block; content:"주석"; font-size:15px; font-weight:500; color:#0065BA;}

  .guideNum {color:inherit;}
  .guideNum > sup {color:#0065BA;}
  .cTitle3 .guideNum {color:#0065BA;}
  /* .guideBox .listOl {margin:0px 0px 0px 62px;} 
  .guideBox .listOl li {margin-bottom:22px; font-size:14px; font-weight:400; line-height:22px; color:#666;} 
  .guideBox .listUl {margin:0px 0px 0px 62px;}
  .guideBox .listUl li {margin-bottom:22px; font-size:14px; font-weight:400; line-height:22px; color:#666;} */

    /* .guideTitle {position:absolute; display:block; content:"주석"; font-size:15px; font-weight:500; color:#0065BA;} */

/********** tabBox **********/
/* basic */
.tabBox {position:relative; margin-bottom:20px; border-spacing:0; z-index:1;}
.tabBox:after {display:block; content:""; clear:both;}
.tabBox li {position:relative; float:left; box-sizing:border-box;}
.tabBox li a {width:100%; height:45px; line-height:44px; font-size:16px; box-sizing:border-box; background:#f6f6f6; border:1px solid #d7d7d7; border-radius:3px; color:#444; text-align:center; vertical-align:middle; border-left:none; display:inline-block; padding:0px 44px; color:#666; font-weight:500;}
.tabBox li.on a {background:#fff; color:#0145B8; border:1px solid #0145B8; font-weight:500;}

/* column */
.tabBox.column2 > li {width:50%;}
.tabBox.column3 > li {width:33.3%;}
.tabBox.column4 > li {width:25%;}
.tabBox.column5 > li {width:20%;}
.tabBox.column6 > li {width:16.6%;}
.tabBox.column7 > li {width:14.2%;}
.tabBox.column8 > li {width:12.5%;}
.tabBox.column9 > li {width:11.1%;}
.tabBox.column10 > li {width:10%;}

/* color */
.tabBox.main li a {color:#666666; background-color:#F7F7F7;}
.tabBox.main li.on a {color:#fff; background-color:#0078B7;}
.tabBox.black li a {color:#000; background-color:#fff;}
.tabBox.black li.on a {color:#fff; background-color:#000;}
.tabBox.blue li a {color:#003082; background-color:#F7F7F7;}
.tabBox.blue li.on a {color:#fff; background-color:#003082;}
.tabBox.gray li a {color:#747474; background-color:#F7F7F7;}
.tabBox.gray li.on a {color:#fff; background-color:#747474;}

/* size */
.tabBox.s li a {height:30px; line-height:29px;}
.tabBox.m li a {height:45px; line-height:44px;}
.tabBox.l li a {height:60px; line-height:59px;}

/* tab top round */
.tabBox.topRound:before {position:absolute; right:0; bottom:0px; display:block; content:''; width:100%; height:1px; background-color:#000; z-index:3;}
.tabBox.topRound li a {border-radius:5px 5px 0 0; border:1px solid #E1E1E1; font-weight:500; z-index:2;}
.tabBox.topRound li.on {z-index:10;}
.tabBox.topRound li.on a {border:1px solid #000; border-bottom:none; z-index:3;}

.tabBox.topRound .btnBox {position:absolute; right:0; top:0;}
.tabBox.topRound .btnBox button span {margin-right:4px;}
.tabConAllView {position:absolute; right:0; border-radius: 30px;}

/* tab round */
.tabBox.round {margin:20px -3px;}
.tabBox.round li a {display:block; width:auto; margin:0 3px; border-radius:5px; border:none;}

/* tab line */
.tabBox.line {border-bottom:2px solid #D7D7D7;}
.tabBox.line li {margin-right:20px; font-size:16px; background-color:transparent;}
.tabBox.line li a {position:relative; padding:0 0 5px 0; font-weight:400; border:none; background-color:transparent;}
.tabBox.line li a:after {display:block;  content:''; width:0; height:2px; background-color:#000;position: absolute; bottom:0; transition:all .3s ease;}
.tabBox.line li.on a:after {display:block; width:100%;}

/* tab fit */
.tabBox.fit {border-top-left-radius:5px; border-top-right-radius:5px;}
.tabBox.fit > li a {border:none;}
.tabBox.fit > li.on a {border-radius:5px;}

/********** searchBox **********/
.inputLable {position: absolute; font-size: 12px; transform:scale(0); overflow:hidden; height:14px; padding:0px; line-height: 14px; color: #fff; border-radius: 3px; margin-top: -8px; vertical-align: middle; transition:all 0.3s ease;}
.inputLable.on {background: #000000; transform:scale(1); padding: 1px 3px;}
.searchBox {position:relative; background:#F5F6F8; padding:15px 64px 15px 20px; margin-bottom:40px; line-height: 37px; box-sizing:border-box;}
.searchBox .parag {margin-left:4px; display: inline-block;}
.searchBox select,
.searchBox input[type="number"],
.searchBox input[type="text"] {min-width: 190px; height: 30px; line-height: 30px;}
.searchBox label {display: inline-block; position: relative; vertical-align: middle; font-size: 15px; margin-right:65px; text-indent:2px; font-weight:500; color:#000;}
.searchBox label span {margin-right: 10px}
.searchBox .datepickerBox .datepicker {min-width: 0;}
.searchBox input.inputW[type='text'] {width:700px;}
.searchBox input[type='radio'] {margin:0 2px;} 
.searchBox .searchBu {position: absolute; padding: 0; top: 0; right: 20px; bottom: 0; margin: auto 0;}
.searchGroup {display:inline-block; height:38px; vertical-align:middle; margin:0px 10px 0px 0px; line-height: 34px;}
.lineBar::before { margin-left:15px; content:""; height:32px; border-left: 1px dashed #ccc; display:inline-block; vertical-align:middle; width:15px;}
.searchBuBox {display:inline-block; height:45px; vertical-align:middle; line-height: 45px; text-align: left;}
.searchBox .checkboxList {display:inline-block;}
.searchBox .checkboxList label {color:#666; font-weight:400;}
.searchBox .checkboxList label span {vertical-align:middle;}

.searchBox .radiolabel {color:#666; font-weight: 400; margin-right:8px;}
.searchBox .checkmark {top:9px; left:3px;}
.searchBox input[type="checkbox"]:checked + label:after {top:12px;}

.searchBox.type-left {text-align:left; padding:10px 60px 10px 25px;}
.searchBox.type-left .searchGroup {min-width:300px;}  
.searchBox.type-left .lineBar::before {display:none;}
.searchBox.type-left .searchBu {position: absolute; bottom: 15px; right: 15px;}
.searchBox.type-left .parag {min-width: 350px; margin:4px 0;}
.searchBox.type-left .searchBu {bottom:auto; top:50%; margin-top:-17px; right:30px;}
.searchBox.type-left .checkmark {top:10px; left:3px;}
.searchBox.type-left label {display: inline-block; min-width: 55px;}
.searchBox.type-left label.radiolabel {min-width: auto; color:#666;}
.searchBox.type-left input[type="checkbox"]:checked + label:after {top:19px; left:5px;}

.inputBox span {display:block;}

/********** table **********/
.tableHeader {position:relative; height:46px;}
.tableHeader:after {display:block; content:""; clear:both;}
.tableHeader .count {display:inline-block; margin-bottom:16px; font-size:15px; font-weight:500;}
.tableHeader .sortOption {all:unset; font-size:15px; line-height:normal;}
.tableHeader .sortOption a {margin-left:16px; font-weight:500; color:#888;}
.tableHeader .sortOption a.on {color:#000;}
  .tableHeaderLeft {float:left;}
  .tableHeaderRight {float:right;}
  .tableTitle {font-size:20px; font-weight:500; color:#0065BA;}
  .tableUpdate {display:block; margin-top:10px; font-size:14px; font-weight:400; color:#666666;}
 
.table_normal {width:100%; border-spacing:0px; border-top:1px solid #333; border-collapse:collapse; margin-bottom:50px; background-color:#fff;}
.table_normal thead tr th {color:#000; height:44px; padding:5px 2px; text-align:center; background:#f1f2f3; color:#000; font-weight:500; position:relative; font-size:14px; border-bottom:2px solid #E1E1E1;}
.table_normal thead tr th::before {content:""; position:absolute; top:50%; height:20px; border-left:1px dashed #ccc; left:0px; transform:translateY(-50%);}
.table_normal thead tr th:first-child::before {border:0px;}

.table_guide {width:100%; border-spacing:0px; border-top:1px solid #333; border-collapse:collapse; margin: 15px 0; background-color:#fff;}
.table_guide thead tr th {color:#000; height:30px; line-height: 30px; padding:5px 2px; text-align:center; background:#f1f2f3; color:#000; font-weight:500; position:relative; font-size:14px; border-bottom:2px solid #E1E1E1;}
.table_guide thead tr th::before {content:""; position:absolute; top:50%; height:20px; border-left:1px dashed #ccc; left:0px; transform:translateY(-50%);}
.table_guide thead tr th:first-child::before {border:0px;}

.table_normal tbody {line-height:24px;}
.table_normal tbody tr th {word-break:keep-all; color:#000; background:#f1f2f3; font-weight:500; border-bottom:1px solid #d7d7d7; font-size:14px; padding:0 16px; font-weight:500;}
.table_normal tbody tr td {border-bottom:1px solid #d7d7d7; height:38px; font-size:15px; transition:all 0.6s ease; padding:11px; word-break:keep-all;}
.table_normal tbody tr td > ul > li {text-indent:-15px; padding-left:15px;}
.table_normal tbody tr.select td {background-color:#f4f9fd;}
.table_normal tbody tr td strong {font-size:16px; font-weight 500; color:#000;}
.table_normal tbody tr td img {vertical-align: -4px;}

.table_guide tbody {line-height:24px;}
.table_guide tbody tr th {word-break:keep-all; color:#000; background:#f1f2f3; font-weight:500; border-bottom:1px solid #d7d7d7; font-size:14px; padding:0 16px; font-weight:500;}
.table_guide tbody tr td {border-bottom:1px solid #d7d7d7; height:15px; font-size:15px; transition:all 0.6s ease; padding:8px; word-break:keep-all;}
.table_guide tbody tr td > ul > li {text-indent:-15px; padding-left:15px;}
.table_guide tbody tr.select td {background-color:#f4f9fd;}
.table_guide tbody tr td strong {font-size:16px font-weight 500; color:#000;}
.table_guide tbody tr td img {vertical-align: -4px;}

.table_normal thead tr th.al {padding-left:43px; text-align:left;}
.table_normal thead tr th.ac {text-align:center;}
.table_normal thead tr th.ar {text-align:right;}
.table_normal tbody tr td.al {padding-left:43px; text-align:left;}
.table_normal tbody tr td.ac {text-align:center;}
.table_normal tbody tr td.ar {text-align:right;}
.table_normal caption {position:absolute; top:0; left:0; width:0; height:0; font-size:0;}

  .fileWrapBox {padding:10px 10px 5px 10px; background-color:#f0f0f0; margin-top:20px;}
  .fileWrapBox .fileWrapTitle {color:#000; }
  .fileList {margin:10px 0px;}
  .fileList li { margin:6px 0px;}
  .fileList li > a {color:#004bcb;}
  .fileList li > a > span {padding-left:8px;color:#000;}
  .fileList li > a:hover {color:#2B45C6;}
  .fileList li > a:hover span {color:#2B45C6;}

.table_normal.line {border:1px solid #d7d7d7; border-top: 1px solid #707070; border-left:none; border-bottom: 0; }
.table_normal.line thead tr th::before {display:none;}
.table_normal.line thead tr th {border-bottom:1px solid #d7d7d7; border-left:1px solid #d7d7d7;}
.table_normal.line tbody tr td {border-left:1px solid #d7d7d7;}
.table_normal.line tbody tr th {border-left:1px solid #d7d7d7;}

.table_normal .absorption_right {border-right:1px solid #d7d7d7;}
.table_normal .absorption_left {border-left:1px solid #d7d7d7;}
.table_normal input[type="text"],
.table_normal select {width: 100%;}

.tableBox > .topTable{margin-top: 65px;}

/* ========== Factbook Table ========== */
.oneT2 {margin:0px 0px 15px; font-size:24px; color:#000; font-weight: 500;}
  .unit {font-size: 15px; color:#666;}
.tableHead {margin-top:90px; line-height:35px; min-height:40px; position: relative; margin-bottom:5px;}
.tableHead.size_L {margin-top:140px;}
  .tableHeadL {position:absolute; line-height:35px; font-size:15px; bottom:0;}
  .tableHeadL .red {color:#FF3400;}
  .tableHeadR {line-height:35px; font-size:15px; text-align: right;}
  .tableHeadR select {background-color:#F4F4F4; border:1px solid #D7D7D7; border-radius: 5px; background-size: 20px; padding: 0px 20px 0px 10px; color:#000;}
  .tableHeadR .tableHeadRH {position:absolute; right:0px; bottom:0px; line-height: 160%;}

.table_normal.size_s tbody tr th {padding:9px; font-size:16px; background-color:transparent; text-align: left;}
.table_normal.size_s tbody tr td {padding:9px; text-align: left;}
.table_normal tbody td.leftPd  div{padding-left: 10px; font-size:15px;}
.table_normal tbody td.leftPd2 div {padding-left:25px; font-size:14px;}

.table_normal tfoot {background:#0087AD;}
.table_normal tfoot th {font-size: 16px; color: #fff; font-weight: 500; padding:15px;}
.table_normal tfoot td {font-size:16px; padding:15px; color:rgba(255,255,255,0.8);}
.table_normal tfoot td .numBox {background:rgba(0,0,0,0.1); color:#fff;}
  .numBox {display:block; min-width:100px; line-height:30px; border-radius:15px; text-align:right; padding:0px 20px;}
  .numBox.gray {background:#F4F4F4; color:#666666; font-weight: 500;}
  .numBox.blue {background:#F0FAFD; color:#0087AD; font-weight: 500;}
  .numBox_s {display:block; line-height:30px; border-radius:15px; text-align:right; padding:0px 10px; font-size:14px;}
  .numBox_s.gray {background:#F4F4F4; color:#666666; font-weight: 500;}
  .numBox_s.blue {background:#F0FAFD; color:#0087AD; font-weight: 500;}
/* ========== Factbook Table ========== */


.reWrite {position:relative; border:1px solid #D7D8D9; background:#F7F8F9; margin-bottom:50px; box-sizing:border-box; }
.reWrite textarea {resize:none;  width:calc(100% - 160px); height:120px; border:1px solid #D7D8D9; font-size:16px; margin:20px; padding:20px; box-sizing:border-box; 
  font-family: 'Noto Sans Korean','돋움', Dotum, sans-serif;}
.reWrite button {position:absolute; top:20px; right:20px; width:120px; height:120px;background:#791C4A; font-size:20px; color:#fff;}

.reListBox {border-top:1px solid #000; border-bottom:1px solid #000; }
.reListBox > ul > li {border-top:1px dashed #B1B1B1; padding-top:25px;}
.reListBox > ul > li:first-child {border-top:0;}
  .reListTop {padding-bottom:25px; min-height:25px;}
    .reListTopL {float:left;}
    .reListTopL strong {font-size:16px; font-weight:400; color:#000; padding-right:10px; line-height:25px;}
    .reListTopL span {font-size:13px; color:#666; line-height:25px;}
    .reListTopR {text-align:right;}
    .reListTopR a {display:inline-block; width:24px; height:24px; line-height:24px; color:#000; font-size:12px; text-align:center; border:1px solid #D7D8D9; transition:all 0.3s ease;}
    .reListTopR a:hover {background:#666; color:#fff; border:1px solid #666;}
  .reListText {font-size:15px; color:#666; padding-bottom:25px;}
  .reListBottom {min-height:25px;}
    .reListBottomT {padding-bottom:25px;}
    .reListBottomT li {display:inline-block; padding:0px 15px;}
    .reListBottomT li::before {content:""; position:absolute; height:13px; line-height:13px; border-left:1px dashed #666; width:1px; margin:6px 0px 0px -15px;}
    .reListBottomT li:first-child {padding-left:0px;}
    .reListBottomT li:first-child::before {border:0px;}
    .reListBottomT li i {font-size:18px; color:#333; padding-right:4px;}
    .reListBottomT li span {font-size:14px; color:#666;}
    .reListBottomT li a {font-size:14px; color:#666; position: relative; display:inline-block;}
    .reListBottomT li a:hover::before {content:""; position:absolute; border-bottom:1px solid #666; left:0px; right:0px; bottom:1px;} 
    .reListBottomT .iconS {font-size:12px; padding:0px 5px; transition:all 0.3s ease; display:inline-block;}
    .reListBottomT .reShow.on .iconS {transform: rotate(180deg);} 
    .reListBottomList {background:#F9F9F9; padding:0px 25px; display:none;}
    .reListBottomList ul li {border-top:1px dashed #B1B1B1; padding-top:25px;}
    .reListBottomList ul li:first-child {border-top:0;}

/********** form **********/

/* input basic style */

input[type="text"],
input[type="number"],
select {height:28px; border:1px solid #D7D7D7; box-sizing:border-box; vertical-align:middle; text-indent:10px; border-radius:5px; font-size:14px; font-family:'Noto Sans Korean', Dotum, sans-serif; color:#666; -webkit-appearance: none;}

input:read-only {background-color:#eee;}

/* select */

select {padding:0px 35px 0px 10px; text-indent: 0; background: url(../img/common/selectArrow.svg) no-repeat right center #fff; background-size: 20px;}
select::-ms-expand {display:none}

/* input checkbox style */

input[type="checkbox"] {position:absolute; opacity:0;}
input[type="checkbox"] + label {position:relative; cursor:pointer; padding:0;}
input[type="checkbox"] + label:before {content:""; margin-right:5px; display:inline-block ;vertical-align:middle; width: 16px; height: 16px; background: white; border:1px solid #d7d7d7;border-radius:2px;}
input[type="checkbox"]:checked + label:before {background:#003082; border:1px solid #003082;}
input[type="checkbox"]:disabled + label {color:#b8b8b8; cursor:auto;}
input[type="checkbox"]:disabled + label:before {box-shadow:none; background:#ddd;}
input[type="checkbox"]:checked + label:after {content:""; position:absolute; left:4px; top:12px; background:white; width:2px; height:2px; box-shadow:2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white; transform:rotate(37deg);}
.checkboxList li {display:inline-block; margin-right:8px;}
#chkPopClose2input[type="checkbox"]:checked + label:after {top:13px;}

 /* input file style */

 input[type="file"] {text-indent: 0; font-size: 14px; height:33px; line-height:29px;}
 input[type=file]::file-selector-button  {font-size:14px; font-family: 'Noto Sans Korean','돋움', 'Dotum', sans-serif;  font-size: 14px; vertical-align: middle; box-sizing:border-box; color:#666; border:1px solid #666; background:#fff; font-size:13px; line-height:24px; height:24px; border-radius:3px; margin:3px; padding:0px 5px; display: inline-block; transition:all 0.3s ease; word-break: keep-all; min-width:57px;}

 /* input radio style */

.radiolabel {color:#666; display: inline-block; position: relative; cursor: pointer; padding-left:22px; -webkit-user-select: none;-moz-user-select: none; -ms-user-select: none; user-select: none;}
.radiolabel input { position: absolute; opacity: 0; cursor: pointer; width:0; height:0; overflow:hidden;}
.checkmark {position: absolute; top: 3px; left: 0; height: 15px; width: 15px; background-color: #F6F6F6; border:1px solid #A5A5A5;border-radius: 50%;}
input[type="radio"]:checked ~ .checkmark { background-color: #fff; color:#000;}
.checkmark:after {content: ""; position: absolute; display: none;}
input[type="radio"]:checked ~ .checkmark:after { display: block;}
.checkmark:after { top:2px; left: 2px; width: 11px; height:11px; border-radius: 50%; background: #000;}

/* ie input  설정 */

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  input {border:1px solid #D7D7D7; box-sizing: border-box; vertical-align: middle; text-indent:10px; font-family:''; line-height:120%;} 
  input[type='checkbox']:checked + label::after {top:13px;}
} 

/* datepicker */

.datepickerBox {display: inline-block; position: relative; line-height: 0;}
.ui-datepicker-trigger {position: absolute; top: 0; bottom: 0; right: 10px; margin: auto 0; cursor: pointer;}
.ui-icon-circle-triangle-e {background-image: url(../img/common/icon_next.svg) !important; background-position: center center;}
.ui-icon-circle-triangle-w {background-image: url(../img/common/icon_prev.svg) !important; background-position: center center;}
.ui-datepicker-prev,
.ui-datepicker-next {cursor: pointer;}

/********** paging **********/

.pagingBox {margin:30px 0px; font-size:12px; text-align:center;}
.pagingBox a {width:30px; height:30px; color:#888; display: inline-block;  vertical-align:middle; transition:all 0.3s ease; border:1px solid rgba(0,0,0,0); box-sizing: border-box;}
.pagingBox ul {display:inline-block; margin: 0 24px;}
.pagingBox ul li {display:inline-block;}
.pagingBox a:hover {border-radius: 5px; border:1px solid rgba(0,0,0,0.6);}
.pagingBox strong {color:#08409F;}

/********** layerpopup **********/

.layerpopup {position: fixed; z-index: 1000; top: 0px; bottom: 0px; left: 0px; right: 0px; background: rgba(0, 0, 0, 0.7); transform: scale(0); opacity: 0; transition: opacity 0.6s ease;}
.layerpopup.on {transform: scale(1); opacity: 1;}

.layerpopup.sizeS .layerpopupIn {width:500px; height: calc(100% - 300px);}
.layerpopup.sizeM .layerpopupIn{width:calc(100% - 500px); height: calc(100% - 200px);}
.layerpopup.sizeL .layerpopupIn{width:calc(100% - 100px); height: calc(100% - 100px);}

.layerpopup .layerpopupIn {height:100%; overflow:hidden; margin:50px auto; border-radius: 10px;}
.layerpopup .layerpopupIn .layerpopupHead {padding:20px 0 0;  background-color:#fff; font-size:24px; color:#000; position:relative; border-top-left-radius: 10px; border-top-right-radius: 10px;}
.layerpopup .layerpopupIn .layerpopupHead .layerpopupHeadIn {margin:0 30px;  padding-bottom:20px; border-bottom:3px solid #F5F5F5}
.layerpopup .layerpopupIn .layerpopupHead .layerpopupHeadIn a {position:absolute; right:32px; top: 19px; font-size:30px; color:#8888;}
.layerpopup .layerpopupIn .layerpopupHead .LayerPopupSubText {font-size:13px;}

.layerpopup .layerpopupIn .layerpopupCon {background-color:#fff;  padding:24px 30px 20px; height:calc(100% - 165px); overflow-y: auto; box-sizing: border-box;}
.layerpopup .layerpopupIn .layerpopupCon.only {border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
.layerpopup .layerpopupIn .layerpopupCon .tabConAllView {top:0;}
.layerpopup .layerpopupIn .layerpopupCon .contentTitle { font-weight:500; margin-bottom:12px; position:relative; padding-bottom:12px; color:#000; font-size:20px; border-bottom:1px solid #E1E1E1}
.layerpopup .layerpopupIn .layerpopupCon .contentTitle.lineneone {border:none; padding:0;}
.layerpopup .layerpopupIn .layerpopupCon .infomationBox {background-color:#EFF4FC; padding:20px; margin-bottom:20px;}
.layerpopup .layerpopupIn .layerpopupCon .infomationBox .ulList {margin-left:0;}
.layerpopup .layerpopupIn .layerpopupCon .txtBox {border:1px solid #d7d7d7;padding:10px;color:#666;  margin-bottom:20px;}
.layerpopup .layerpopupIn .layerpopupCon .tabBoxCon {display: block;}
.layerpopup .layerpopupIn .layerpopupCon .searchBox {padding:15px; line-height:35px}
.layerpopup .layerpopupIn .layerpopupCon .searchBox input {height:36px; line-height: 36px;}
.layerpopup .layerpopupIn .layerpopupCon .searchBox select {height:36px; line-height: 36px;}

.layerpopup .layerpopupIn .layerpopupBottom {background-color:#F7F7F7; margin:0; padding:20px 0; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}

/********** button **********/

button {background:none; border:0px; padding:0px; margin:0px; cursor:pointer; box-sizing: border-box; font-family: 'Noto Sans Korean', Dotum, sans-serif; letter-spacing:-0.05em}

.buttonBox {margin:40px 0px; text-align:center; overflow: hidden; width:100%; display:inline-block;}
.buttonBoxS {margin:15px 0px; text-align:center; overflow: hidden; width:100%; display:inline-block;}
.buttonBoxL {float:left;}
.buttonBoxR {float:right;}

/* button L size */

[class^="bu_l_"], [class*=" bu_l_"] {display: inline-block; vertical-align: middle; box-sizing:border-box; font-size:16px; line-height:44px; border-radius:5px; min-width:130px; margin:0px 3px; padding:0 5px; transition:all 0.3s ease;}
[class^="bu_l_square"], [class*=" bu_l_square"] {width: 44px; min-width: 44px; height: 44px;}

.bu_l_black {background:#412C36; color:#fff;}
.bu_l_black:hover {background: #333;}
.bu_l_red {background:#FF0000; color:#fff;}
.bu_l_red:hover {background: #333;}
.bu_l_gray {background:#666; color:#fff;}
.bu_l_gray:hover {background: #fff; border:1px solid #666; color:#666;}
.bu_l_blue {width:240px; line-height:48px; text-align:center; border-radius:53px; color:#fff; border:1px solid #0A65BA; background-color:#0A65BA;}
.bu_l_blue:hover {color:#0A65BA; background-color:#fff;}

.bu_l_grayLine {border:1px solid #666; background:#fff; color:#666;}
.bu_l_grayLine:hover {background: #666; border:1px solid #666; color:#fff;}
.bu_l_blueLine {border:1px solid #003082; background:#fff; color:#003082;}
.bu_l_blueLine:hover {background: #003082; border:1px solid #003082; color:#fff;}

.bu_l_square_black {background:#412C36; color:#fff;}
.bu_l_square_black:hover {background: #333;}

.bu_l_disable {border:1px solid #E1E1E1; background:#F2F2F2; color:#666; cursor:default;}

/* button M size */

[class^="bu_m_"], [class*=" bu_m_"] {min-width:72px; vertical-align: middle; box-sizing:border-box; font-size:14px; line-height:26px; border-radius:5px; padding:0 10px; display: inline-block; transition:all 0.3s ease;}
[class^="bu_m_square_"], [class*=" bu_m_square_"] {width: 28px; min-width: 28px; padding: 0;}

.bu_m_black {background:#412C36; color:#fff; }
.bu_m_black:hover {background: #333;}
.bu_m_gray {border:1px solid #666; background:#666; color:#fff;}
.bu_m_gray:hover {background: #fff; color:#666;}
.bu_m_blue {border:1px solid #003082; background:#003082; color:#fff; }
.bu_m_blue:hover {background: #fff; color:#003082;}
.bu_m_red {border:1px solid #DF4B4B; background:#DF4B4B; color:#fff; }
.bu_m_red:hover {background: #fff; color:#DF4B4B} 
.bu_m_green {background: #006600; color: white;}

.bu_m_blueLine {width:114px; line-height:46px; font-size:17px; font-weight:400; text-align:center; border:1px solid #0A65BA; border-radius:24px; box-sizing:border-box; color:#0A65BA; background-color:#fff;}
.bu_m_blueLine:hover {color:#fff; background-color:#0A65BA;}
.bu_m_redLine {background:#fff; border:1px solid #DF4B4B; color:#DF4B4B; }
.bu_m_redLine:hover {background:#DF4B4B; color:#fff;}
.bu_m_grayLine {border:1px solid #666; background:#fff; color:#666; }
.bu_m_grayLine:hover {background: #666; color:#fff;}

.bu_m_square_grayLine {border:1px solid #666; background:#fff; color:#666; }
.bu_m_square_grayLine:hover {background: #666; color:#fff;}

.bu_m_disable {border:1px solid #E1E1E1; background:#F2F2F2; color:#666; min-width:72px; vertical-align: middle; cursor: default;}

/* button S size */

[class^="bu_s_"], [class*=" bu_s_"] {min-width:57px; vertical-align: middle; box-sizing:border-box; font-size:13px; line-height:22px; border-radius:5px; padding:0 8px; display: inline-block; transition:all 0.3s ease;}

.bu_s_black {border:1px solid #412C36; background:#412C36; color:#fff;}
.bu_s_black:hover {background:#412C36; color:#fff;}
.bu_s_gray {border:1px solid #D7D7D7; background:#F1F1F1; color:#888;}
.bu_s_gray:hover {background:#fff; color:#888;}
.bu_s_blue {border:1px solid #003082; background:#003082; color:#fff;}
.bu_s_blue:hover {background:#fff; color:#003082;}
.bu_s_red {border:1px solid #F3D1D1; background:#FFEBEB; color:#CF6969;}
.bu_s_red:hover {background:#FFEBEB; color:#fff;}

.bu_s_blueLine {width:100px; line-height:36px; font-size:14px; font-weight:400; text-align:center; border:1px solid #0A65BA; border-radius:18px; box-sizing:border-box; color:#0A65BA; background-color:#fff;}
.bu_s_blueLine:hover {color:#fff; background-color:#0A65BA;}
.bu_s_redLine {border:1px solid #FF0000; background:#fff; color:#FF0000;}
.bu_s_redLine:hover {background:#FF0000; color:#fff;}
.bu_s_grayLine {border:1px solid #666; background:#fff; color:#666;}
.bu_s_grayLine:hover {background:#666; color:#fff;}
.bu_s_greenLine {border: 1px solid #006600; color: #006600}
.bu_s_greenLine:hover {background:#006600; color:#fff;}

.bu_s_disable {border:1px solid #E1E1E1; background-color:#F2F2F2; color:#666; cursor: default}


/********** text **********/
/* color */
.text_red {color:#DF4B4B}
.text_green {color:#41C931}
.text_gray {color:#555;}
.text_blue {color:#0065BA;}
.text_black {color:#000;}
.text_white {color:#fff;}


/********** 공용 컴포넌트 **********/
.hold,
.noImg,
.noDesign {display:flex; justify-content:center; align-items:center; height:400px; font-size:36px; font-weight:bold; border:1px solid #666; color:#666; background-color:#eee;}
.noImg:after {display:block; content:"No Img";}
.noDesign:after {display:block; content:"No Design";}
.hold:after {display:block; content:"Hold";}

@media (max-width: 1600px) and (min-width: 861px) {
  .conBox {max-width:none;}
  .conWideBox {max-width:none;}
  .conP {text-align:left;}
  .tabletText_ac {text-align:center;}
  .conImgBoxList {width:800px; margin:0 auto;}
  .conImgBoxList .conImgBox {display:inline-block; width:auto;}
  .conImgBox {display:block; width:800px; margin:0 auto;}
  .conImgBox img {width:100%;}

  .al {text-align:left;} .ac {text-align:center;} .ar {text-align:right;} .aj {text-align:justify;}
}

@media all and (max-width: 860px) { 
  .tableBox {overflow-x:auto;}
  .tableBox.mobileS > table {width:400px;}
  .tableBox.mobileM > table {width:600px;}
  .tableHead {margin-top:30px;}
  .conBox {max-width:none;}
  .conWideBox {max-width:none;}
  .conP {text-align:left;}
  .guideBox > ol, .guideBox > ul {margin:30px 0 0 0;}

  .mobileScrollX {overflow-x:scroll;}
  .conImg.mobileScroll {overflow-x:auto; width:auto; max-width:none;}
  .conImg.mobileScroll > img {max-width:none; width:800px;}
  .conImg.mobileScroll > img.size_S {width:600px;}

  .conImg.img2 {width:180%;}
  .conImg.img2 > img {width:calc(50% - 10px);}
  .conImg.img2 > img:nth-child(2) {float:right;}
  .conImg.img2 > span {display:inline-block; width:calc(50% - 10px);}
  .conImg.img2 > span:nth-of-type(2) {float:right;}

  .conImg.img3 {width:280%;}
  .conImg.img3 > img {width:calc(33.3% - 8px); margin-right:12px;}
  .conImg.img3 > img:nth-of-type(3) {margin-right:0;}
  .conImg.img3 > span {padding-top:10px;}

  .tableHeadL {position:static;}
  .tableHeadR .tableHeadRH {position:static; text-align:left;}

  .al {text-align:left;} .ac {text-align:center;} .ar {text-align:right;} .aj {text-align:justify;}
}