/* fonts */
/*@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); */

/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
  }
  /* roboto-500 - latin */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/roboto-v30-latin/roboto-v30-latin-500.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/roboto-v30-latin/roboto-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/roboto-v30-latin/roboto-v30-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/roboto-v30-latin/roboto-v30-latin-500.woff') format('woff'), /* Modern Browsers */
         url('../fonts/roboto-v30-latin/roboto-v30-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/roboto-v30-latin/roboto-v30-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
  }

html, body{ height: 100vh; overflow-x : hidden; }
body{font-family: 'Noto Sans KR', sans-serif; letter-spacing:-.3px; position: relative;}
input { letter-spacing: -.3px; padding: 0 7px;}
textarea { letter-spacing: -.3px; font-family: sans-serif; padding: 4px 7px;}
input:focus-visible, textarea:focus-visible { outline: 0; }
textarea::placeholder { color:#777; }
.eng{ letter-spacing: 0; }

/* common */
#wrap { height: 100vh; overflow: scroll; }
html::-webkit-scrollbar { display: none; }
body::-webkit-scrollbar { display: none; }
#wrap::-webkit-scrollbar { display: none; }
.inner { padding: 0 6% 6vh; }
.sub_con { margin-bottom: 8vh; } /* 2212_전체수정 */
.clear:after{ content:''; display: block; clear:both; }
.caption { font-size: .8em; } 
.bold { font-weight: bold; } /* 221201 아이디, 비밀번호 찾기 */

/* 정렬 */
.alg_l { text-align: left; }
.alg_r { text-align: right; }
.alg_c { text-align: center; }

/* 여백 */
.mt5 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt50 { margin-top: 50px; }
.mt60 { margin-top: 60px; }
.mt70 { margin-top: 70px; }
.mt80 { margin-top: 80px; }
.mt90 { margin-top: 90px; }
.mt100 { margin-top: 100px; }

.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb50 { margin-bottom: 50px; }
.mb60 { margin-bottom: 60px; }
.mb70 { margin-bottom: 70px; }
.mb80 { margin-bottom: 80px; }
.mb90 { margin-bottom: 90px; }
.mb100 { margin-bottom: 100px; }

.pt5 { padding-top: 5px; }
.pt10 { padding-top: 10px; }
.pt20 { padding-top: 20px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }
.pt50 { padding-top: 50px; }
.pt60 { padding-top: 60px; }
.pt70 { padding-top: 70px; }
.pt80 { padding-top: 80px; }
.pt90 { padding-top: 90px; }
.pt100 { padding-top: 100px; }

.pb5 { padding-top: 5px; }
.pb10 { padding-top: 10px; }
.pb20 { padding-top: 20px; }
.pb30 { padding-top: 30px; }
.pb40 { padding-top: 40px; }
.pb50 { padding-top: 50px; }
.pb60 { padding-top: 60px; }
.pb70 { padding-top: 70px; }
.pb80 { padding-top: 80px; }
.pb90 { padding-top: 90px; }
.pb100 { padding-top: 100px; }

/* 텍스트 메인컬러 */
.blue{ color: #00adef }
.blue2 { color: #0060aa; }
.color333 { color:#333 }
.color666 { color:#666 }

.not_scroll{ position: fixed;
    overflow: hidden;
    width: 100%;
    height: 100% }

/* 버튼 */
.btnarea{ margin-top:4vh; }
.btnarea .btn{ width:100%; height: 7vh; border-radius: 10px; color:#fff; font-size:1.2em; font-weight: 600; }
.btnarea .btn.blue{ background: #00adef }
.btnarea .btn.blue2{ background: #0060aa; }
.btnarea .btn.green{ background: #00a885; }
.btnarea .btn.gray{ background: #575859; }
.btnarea .btn.disabled { background: #ddd; }
.btn_line_blue{ border: 2px solid #0060aa; padding: 4px 10px 4px 30px; color:#0060aa; font-size:1em; font-weight: 600; }

.btnarea.btn2ea { display: flex; }
.btnarea.btn2ea .btn { width: 50%; margin-right: 4%; }
.btnarea.btn2ea .btn:last-child { margin-right: 0; }
.btnarea.btn3ea { display: inline-block; width: 100%; }
.btnarea.btn3ea .btn { width: 47%; }
.btnarea.btn3ea .btn:first-child{ margin-right: 4%;}
.btnarea.btn3ea .btn:last-child { width: 99%; margin-top: 15px; } /* 2212 공급자-운송사업자 관련 추가기능 */

/* 라디오버튼 */
.radios {position: relative;}
.radios input[type="radio"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }
.radios input[type="radio"]+label { display: inline-block; position: relative; padding-left: 30px; font-size: 1.1rem; line-height: .9rem; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }/* 221123 해상도디버깅 */
.radios input[type="radio"]+label:before { content: ''; position: absolute; left: 0; top: -4px; width: 21px; height: 21px; text-align: center; background: #fafafa; border: 1px solid #cacece;
            border-radius: 100%; }
.radios input[type="radio"]+label:active:before,
.radios input[type="radio"]:checked+label:active:before { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); }
.radios input[type="radio"]:checked+label:before { background: #0060aa; border: 1px solid #0060aa; }
.radios input[type="radio"]:checked+label:after { content: ''; position: absolute; top: 2px; left: 6px; width: 11px; height: 11px; background: #fff; border-radius: 100%; }

/* 라디오 탭 */
.tabs_radio { position: relative; padding: 0; list-style: none;}
.tabs_radio .tab { float: left; width: 19.7%; font-size: .9em; height: 5vh; border-right: 1px solid #ddd; }
.tabs_radio .tab:last-child{ border-right: 0; }
.tabs_radio .tab label { height: 100%; position: relative; background: #fff; /*padding: 8px 0;*/ display: block; text-align: center; line-height: 5vh; }
.tabs_radio .tab [type="radio"] { display: none; width: 0 !important; height: 0 !important; }
.tabs_radio .tab .content { display: none; position: absolute; background: white; top: 39px; left: 0; right: 0; padding: 0; box-sizing: border-box; border: 1px solid #ccc;}
.tabs_radio .tab [type="radio"]:checked ~ label { color:#fff; background: #0060aa; z-index: 2; }
.tabs_radio .tab [type="radio"]:checked + label + .content { z-index: 1; display: block; }

/* 체크박스 */
.checks {position: relative;}
.checks input[type="checkbox"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;clip: rect(0, 0, 0, 0); border: 0; }
.checks input[type="checkbox"]+label { display: inline-block; position: relative; padding-left: 30px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; 
    -ms-user-select: none; color: #333; }
.checks input[type="checkbox"]+label:before { content: ''; position: absolute; left: 0; top: -2px; width: 21px; height: 21px; text-align: center; background: #fafafa;
    border: 1px solid #cacece; border-radius: 6px; }
.checks input[type="checkbox"]+label:active:before,
.checks input[type="checkbox"]:checked+label:active:before { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); }
.checks input[type="checkbox"]:checked+label:before { background: #0060aa; border-color: #0060aa; }
.checks input[type="checkbox"]:checked+label:after { content: ''; position: absolute; top: 3px; left: 5px; width: 13px; height: 13px; background: url(../images/checkbox.gif) center no-repeat;
    background-size:contain; border-radius: 0%; }

/* footer */
footer {position:absolute; bottom:0; width:100%; border-top:1px solid #eee; padding:30px 0 35px; color:#666; text-align: center; }
footer address{ font-size: 1em; font-weight: 600; }
footer .noticenter { margin-top:15px; }
footer .noticenter span, footer .noticenter a{ display: block; }
footer .noticenter span{ margin-bottom:5px; font-size:.85em; }
footer .noticenter a{ font-size: 1.5em; font-weight: 600; }
footer span.copy{ display: block; font-size: 0.6em; margin-top:10px; }

/* 팝업 */
.popup { width: 84.6%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #fff;  border-radius: 10px;  z-index: 99999; overflow: hidden; }/* 221213_헤더수정 */
.backon { content: ""; width: 100%; height: 100vh; background: rgba(0,0,0,.7); position: fixed; top: 0; left: 0; right:0; z-index: 9999; } /* 221213_헤더수정 */
.popupbackon { content: ""; width: 100%; height: 100vh; background: rgba(0,0,0,.7); position: fixed; top: 0; left: 0; right:0; z-index: 9999; } /* 221213_헤더수정 */
.closePopup { position: absolute; top: 50%; right: 5%; transform: translateY(-50%);  cursor: pointer; text-indent: -9999px; width:16px; height: 16px; background: url(../images/btn_x.gif) no-repeat; background-size: cover;}
.popupClose2 { position: absolute; top: 50%; right: 5%; transform: translateY(-50%);  cursor: pointer; text-indent: -9999px; width:16px; height: 16px; background: url(../images/btn_x.gif) no-repeat; background-size: cover;}
.openPopup { cursor: pointer; }
.popContents .popHead { position:relative; padding:2vh 5%; }
.popContents .popHead h4{ font-size:1.15em; font-weight: 600; color:#333; }
.popContents .popCon{ background: #f8f8f8;  }
.popContents .popCon .content { position: relative; padding: 3vh 5%; min-height: 10vh; max-height: 60vh; overflow-y: scroll; } /* 221215_팝업 통일 */
.popContents .popCon .content input {  /*width: 45%;*/ height:4.5vh; border:1px solid #eee; font-size:1em; }

.popContents .popCon .content .inputonly { position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.popContents .popCon .content .inputonly input[type=number], 
.popContents .popCon .content .inputonly input[type=text] { position:absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 70%; height:5.5vh; text-align: center; }
.popContents .popCon .content .inputonly input:focus-visible { outline: 0; }
.popContents .popCon .content textarea { height:14vh; border:1px solid #eee; font-size:1em; resize: none; }
.popContents .popCon .content textarea:focus-visible { outline: 0; }

.popContents .popCon .content form .radios li { display: inline-block; margin-right: 10px; }
.popContents .popCon .content form .radios li:last-child { margin-right: 0; }
/* 221201 아이디, 비밀번호 찾기 */
/* 221213 클래스 변경 */
.popContents .popCon .content p.caption_idpw{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 1em; line-height: 1.5em; }
.popContents .popCon .content p.caption_idpw span { border-bottom: 1px solid #333; font-weight: bold; }
/* //221213 클래스 변경 */
/* //221201 아이디, 비밀번호 찾기 */

.popContents .popBtn button{ height:6.75vh; font-size: 1.2em; color:#fff; }
.popContents .popBtn button.blue{ background: #00adef; }
.popContents .popBtn button.green{ background: #00a885; }
.popContents .popBtn button.gray{ background: #8f989d; }

.popContents .popBtn.btn1ea button{ width: 100%; }
.popContents .popBtn.btn2ea{ display: flex; }
.popContents .popBtn.btn2ea button{ width: 50% }
.popContents .popBtn.btn2ea button.btn_sort{ flex:1; width:50%; }
.popContents .popCon .content input[type=checkbox] { width:auto; height: auto;}

/* 탭 */
.tabarea ul.tabs { display: flex; margin-bottom: 2vh; }
.tabarea ul.tabs li { flex: 1; margin-right: 3%; background: #e7e7e9; height: 4.3vh; line-height: 4vh; align-items: center; }
.tabarea ul.tabs li a { display: block; text-align: center; height: 100%; }
.tabarea ul.tabs li:last-child { margin-right: 0; }
.tabarea ul.tabs li.on { background:#00a885; }
.tabarea ul.tabs li.on a { color:#fff; }
.tabarea .tab_con .tab_container { display: none; }
.tabarea .tab_con .tab_container.on { display: block; }

/* 가로 반응형 - Galaxy Fold */
@media all and (min-width: 280px) and (max-width: 319px) { 
    body { font-family: 'Noto Sans KR', sans-serif; letter-spacing: -.3px; position: relative; font-size: .85em; }
    .btnarea .btn { width: 100%; height: 7vh; border-radius: 10px; color: #fff; font-size: 1em; font-weight: 600; }
    .btn_line_blue { border: 2px solid #0060aa; padding: 2px 8px 4px 28px; color: #0060aa; font-size: 1em; font-weight: 600; }    
    
    .tabs_radio .tab { float: left; width: 19.6%; font-size: .9em; height: 5vh; border-right: 1px solid #ddd; }
    .checks input[type="checkbox"]+label { display: inline-block; position: relative; padding-left: 30px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; 
        -ms-user-select: none; color: #333; line-height: 1.3em; }
    
    .radios input[type="radio"]+label { display: inline-block; position: relative; padding-left: 30px; font-size: 1rem; line-height: .8rem; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
}


/* 221214_셀렉트 */
.bselect{ display: inline-block; font-family: sans-serif; position: relative;}
.bselect-input{ display:none; }
.bselect-active{ cursor:pointer; background:#fff; color: #888;    display: inline-flex; width: 100%; border: 1px solid #dedede; border-radius: 3px; cursor: pointer;
    font-size: 13px; line-height: 2.4em; /*text-indent: 10px; padding-left:10px;*/ position:relative; display:inline-block; text-align: left;}
.bselect-item{ display:inline-flex;	width:100%; }
.bselect-item .bselect-remove{ display:none;}
.bselect-item.bselect-disabled .bselect-remove{ display:block; color:#000; }
.bselect-disabled{ color:#ababab; }
.bselect-remove{ display: inline-flex; padding-right: 5px; padding-left: 5px; }
.bselect-default-text{	padding-left:10px; height: 100%; font-size: 1.2em; line-height: 2.6em; }
.bselect-multiple-item{	display: inline-flex;    border: 1px solid #dedede; margin: 2px; padding-right: 10px; border-radius: 3px; padding-left: 10px; }
.bselect-active.elipsis{white-space: nowrap;  overflow: hidden;  text-overflow: ellipsis; height: 5vh; }
.bselect-active:after{	position: absolute; content: ""; top: 2.2vh; right: 10px; width: 0; height: 0; border: 6px solid transparent; border-color: #4a4a4a transparent transparent}
.bselect-search{}
.bselect-content{visibility:visible; background: #fff; border: 1px solid #dedede; position: relative; z-index: 9;}
.bselect-list{ height: 100px;/* max-height: 200px */  overflow: hidden; overflow-y: auto;  margin: 0px; padding: 0px; }
.bselect-list li{ cursor:pointer; font-size: 13px; padding-top: 3px;    padding-bottom: 3px;padding-left: 10px;  line-height: 2em; font-size: .9em; color:#333; }
.bselect-list li.elipsis{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.bselect-list li:hover{	background:#dedede;}
.bselect-search{ width: 98%; margin: 0px auto; margin-top: 1%;}
.bselect-search input{ border-radius: 0px; height: 30px; border: 1px solid #dedede; margin-bottom: 2%; width: 94%; font-family: 'Noto Sans KR'; font-size: .9em !important; }
.bselect-search input:focus{outline: 0; border: 1px solid #0be;}
.bselect-list li.hide-item{	display:none;}
.bselect-no-results{ text-align: center; padding: 20px; height: 100%; font-size: 13px;}
.bselect-selected-count { background-color: rgb(230, 230, 230); border-radius: 2px; display: inline-flex;margin: 2px; min-width: 0px; box-sizing: border-box;}
.bselect-selected-items { border-radius: 2px; color: rgb(51, 51, 51);  overflow: hidden; padding: 1px 10px; text-overflow: ellipsis; white-space: nowrap; 
    box-sizing: border-box;}

.bselect-selected-empty { -moz-box-align: center; align-items: center; border-radius: 2px; display: flex; padding-left: 4px; padding-right: 4px; box-sizing: border-box;}
.bselect-selected-empty svg { display: inline-block;  fill: currentcolor; line-height: 1; stroke: currentcolor; stroke-width: 0px;}
.bselect-selected-empty:hover {background-color: #fee2e1;}
/* //221214_셀렉트 */

/* 230209_팝업 */
.popup .popCon.tbinpop_h table { width:100%; border-top:2px solid #a9adae; margin-top: 10px; }
.popup .popCon.tbinpop_h table:first-child { margin-top: 0px;  }
.popup .popCon.tbinpop_h table td { position:relative; height: 5.5vh; color:#444; font-weight: 300; }
/*.popup .popCon#tbinpop_h table tr:nth-child(odd) { background:#fff; }*/
/*.popup .popCon#tbinpop_h table tr:nth-child(even) { background:#efefef; }*/
.popup .popCon.tbinpop_h table tr { border-bottom: 1px solid #eee; }
.popup .popCon.tbinpop_h table th { color:#333; font-weight: 500; padding-left: 5%; }
.popup .popCon.tbinpop_h table th,
.popup .popCon.tbinpop_h table td { text-align: left; font-size: 1em; vertical-align: middle; }
.popup .popCon.tbinpop_h table.tb_detail td { position:relative; }
.popup .popCon.tbinpop_h table.tb_detail.confirm td span { color:#010101; font-weight: 500; border-bottom: 1px solid #333; }

.popup .popCon.tbinpop_v table { width:100%; border-top:2px solid #a9adae; margin-top: 10px; }
.popup .popCon.tbinpop_v table thead th { height: 5.5vh; text-align: center; }
.popup .popCon.tbinpop_v table:first-child { margin-top: 0px;  }
.popup .popCon.tbinpop_v table td { position:relative; height: 5.5vh; color:#444; font-weight: 300; }
/*.popup .popCon#tbinpop_v table tr:nth-child(odd) { background:#fff; }*/
/*.popup .popCon#tbinpop_v table tr:nth-child(even) { background:#efefef; }*/
.popup .popCon.tbinpop_v table tr { border-bottom: 1px solid #eee; }
.popup .popCon.tbinpop_v table th { color:#333; font-weight: 500; }
.popup .popCon.tbinpop_v table th,
.popup .popCon.tbinpop_v table td { text-align: center; font-size: 1em; vertical-align: middle; }
.popup .popCon.tbinpop_v table.tb_detail td { position:relative; }
.popup .popCon.tbinpop_v table.tb_detail.confirm td span { color:#010101; font-weight: 500; border-bottom: 1px solid #333; }
/* //230209_팝업 */

/* 20230214 업로드*/
.indoTable .filebox {display:flex; justify-content: space-between; padding-right: 1em;}
.retTable .filebox {display:flex; justify-content: space-between; padding-right: 0.7em;}
.insuTable .filebox {display:flex; justify-content: space-between;padding-right: 0.6em;}
.filebox input[type="file"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip:rect(0,0,0,0);border:0;}
/*.filebox label {display: inline-block; padding: .5em .75em;color: #999;font-size: 74%;line-height:normal;vertical-align:middle;background-color: #fdfdfd;cursor: pointer;border: 1px solid #ebebeb;border-bottom-color: #e2e2e2;border-radius: .25em;}*/
.filebox label {display: inline-block; padding: .5em .75em;color: #999;font-size: inherit;line-height:normal;vertical-align:middle;background-color: #fdfdfd;cursor: pointer;border: 1px solid #ebebeb;border-bottom-color: #e2e2e2;border-radius: .25em;}
/*.filebox label {display: inline-block;padding: 2% 3%;color: #999;font-size: inherit;line-height:normal;vertical-align:middle;background-color: #fdfdfd;cursor: pointer;border: 1px solid #ebebeb;border-bottom-color: #e2e2e2;border-radius: .25em;}*/
.filebox .upload-name {display: inline-block;padding: .5em .75em;font-size: inherit;font-family: inherit;line-height:normal;vertical-align: middle;border-radius: .25em;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.upload-name {width:4em; text-decoration: underline; text-underline-position: under; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.insuTable .upload-name {width:26%; text-decoration: underline; text-underline-position: under; text-overflow: ellipsis;}
.retTable .upload-name {width:31%; text-decoration: underline; text-underline-position: under; text-overflow: ellipsis;}
#popup11 .upload-name {width:57%;} /*인도변경 이미지 span*/
.popup .filebox .upload-name {padding:0;}
#popup20 .imgChangeShow {width:57%;} /*인수변경 이미지 span*/
#popup13 .imgChangeShow {width:57%;} /*인수변경 이미지 span*/
#popup21 .imgChangeShow {width:57%;} /*회수변경 이미지 span*/