@charset "utf-8";
.wrap {display:block; height:auto; overflow:hidden;}

/* login */
body.bgGray {background:#333;}
.loginTop {position:relative; height:400px; background:#f74d1e;}
.loginTop .loginLogo {position:absolute; bottom:50px; left:0; width:100%; text-align:center;}
.loginTop .loginLogo a {font-size: 68px; color: #fff;}
.loginTop .loginLogo img {max-width:200px;}
.loginCon {width:400px; margin:0 auto; overflow:hidden;}
.loginCon h1 {margin-top:44px; color:#bebebe; font-size:16px; font-weight:300; text-align:center;}
.loginCon .loginBox {margin-top:30px;}
.loginCon .loginInput { background:transparent; overflow:hidden; border-bottom: 1px solid #999; box-sizing: border-box;}
.loginCon .loginInput.on { border-bottom: 1px solid #fff; }
.loginCon .loginInput input::placeholder{color:#999;}
.loginCon .loginInput.on { border-bottom: 1px solid #fff; }
.loginCon .loginInput.on input::placeholder{color:#fff;}
.loginCon .loginInput .text {width:100%; height:58px; border:none; padding:0 0 0 72px; margin:0; border-radius:0; outline:none; color:#fff; font-size:16px; font-weight:400;}
.loginCon .loginInput .id {background:url('../img/ico_user01_w.png') no-repeat 26px center;}
.loginCon .loginInput .pw {background:url('../img/ico_lock01_w.png') no-repeat 25px center;}
.loginCon .loginInput .otp {background:url('../img/otp_icon.png') no-repeat 25px center;}
.loginCon .loginBox button {display:block; width:100%; height:58px; margin-top:26px; background:#f74d1e; color:#fff; font-size:18px; font-weight:700;}
.loginCon .loginBox .loginChk {margin-top:22px;}
.loginCon .loginBox .loginChk input[type="checkbox"] {display: none; width:18px; height:18px;}
.loginCon .loginBox .loginChk label {color:#fff; font-size:16px; vertical-align:middle;}
.loginCon .loginBox .loginChk label::before {content:""; display: inline-block; margin-right: 10px; width: 18px; height: 18px; vertical-align: -3px; background:#fff url("../img/check_off.png") no-repeat 50% 50%; -webkit-background-size: contain; background-size: contain; box-sizing: border-box;}
.loginCon .loginBox .loginChk input:checked + label::before {background:#fff url("../img/check_on.png") no-repeat 50% 50%; -webkit-background-size: contain; background-size: contain;}

/* layout */
.comnWrap {display:block; height:100%; overflow:hidden; overflow-x:auto; position:relative; padding:0 0px 0 230px; background:#FFF; min-width:1360px; min-height:1000px;}
.comnWrap.full {padding:0; min-width:100%; min-height:auto;}
.comnWrap .leftSec {position:absolute; left:0; top:0; width:230px; height:100%; background:#555; overflow:hidden; overflow-y:auto;}
.comnWrap .leftSec::-webkit-scrollbar,
.comnWrap .leftSec::-webkit-scrollbar {width: 5px;background:#252424;}
.comnWrap .leftSec::-webkit-scrollbar-thumb,
.comnWrap .leftSec::-webkit-scrollbar-thumb {background: #4f4f4f;border-radius:50px;}
.comnWrap .leftSec::-webkit-scrollbar-track,
.comnWrap .leftSec::-webkit-scrollbar-track {background: none;}
.comnWrap .leftSec .logo {display:block; height:auto; overflow:hidden; padding:10px 20px; text-align:center;}
.comnWrap .leftSec .logo img {width:100px;}
.comnWrap .leftSec .mngUtilSec {display:block; padding:15px; background:#444;}
.comnWrap .leftSec .mngUtilSec .mngName {color:#ccc; font-size:14px; font-weight:300; margin-bottom:8px;}
.comnWrap .leftSec .mngUtilSec .mngName em {color:#FFF; font-weight:500; font-size:16px; margin-right:4px;}
.comnWrap .leftSec .mngUtilSec .mngPart {color:#ccc; font-size:14px; font-weight:300; margin-bottom:15px;}
.comnWrap .leftSec .lnbSec {display:block; height:auto; padding:20px; position:relative;}
.comnWrap .leftSec .lnbSec:after {content:''; position:absolute; left:20px; top:-3px; width:40%; height:6px; background:#f74d1e;}
.comnWrap .leftSec .lnbSec li {display:block; height:auto; overflow:hidden; position:relative; opacity:0.6; transition:.2s all;}
.comnWrap .leftSec .lnbSec li:hover {opacity:1.0;}
.comnWrap .leftSec .lnbSec li.on {opacity:1.0;}
.comnWrap .leftSec .lnbSec li .lnb {display:block; height:auto; position:relative; font-size:15px; border-bottom:1px solid #666;}
.comnWrap .leftSec .lnbSec li .lnb a {display:block; color:#FFF; padding:10px 10px 10px 5px;}
.comnWrap .leftSec .lnbSec li .lnb .ar {position:absolute; right:5px; top:15px; width:20px; height:11px; background:url(../img/ar_menu.png) no-repeat 50% 50%; background-size:15px 8px; transition:.2s all;}
.comnWrap .leftSec .lnbSec li .lnb .ar.on {transform: rotate( -180deg ); top:15px;}


.comnWrap .leftSec .lnbSec li dl {display:none; height:auto; overflow:hidden; padding:8px 8px; background:#666; border-radius:0 0 5px 5px;}
.comnWrap .leftSec .lnbSec li dl.on {display:block;}
.comnWrap .leftSec .lnbSec li dl dd {display:block; height:auto; font-size:14px; position:relative;}
.comnWrap .leftSec .lnbSec li dl dd a {display:block; color:#ccc; transition:.2s all; padding:3px 12px 3px 8px;}
.comnWrap .leftSec .lnbSec li dl dd .txt {position:absolute; right:-3px; top:5px; color:#FFF; font-size:12px; text-align:right; }
.comnWrap .leftSec .lnbSec li dl dd .txt a {display:block; color:#FFF; font-size:12px; text-align:right; padding:0; }
.comnWrap .leftSec .lnbSec li dl dd a:hover {color:#FFF;}
.comnWrap .leftSec .lnbSec li dl dd.on a {color:#FFF;}
.comnWrap .leftSec .lnbSec li dl dd:after {content:''; position:absolute; left:0; top:50%; transform:translate(0, -50%); width:4px; height:1px; background:#ccc;}
.comnWrap .leftSec .lnbSec li.on dl {display:block !important;}
.comnWrap .leftSec .lnbSec li dl:not(.on) {
    display: none !important;
}


.comnWrap .container {display:block; height:auto; overflow:hidden;}
.comnWrap .content {clear:both; display:block; height:auto; overflow:hidden; padding:0 20px 10px 20px;}
.comnWrap .content.clean {padding:0; background:none; border:0; border-radius:0;}
.gnbSec {display:block; height:auto; overflow:hidden; padding:0 0 0 20px; border-bottom:1px solid #666; margin-bottom:10px; background:#ccc;}
.gnbSec .gnbMenu {float:left; width:120px; height:40px; line-height:40px; background:#444; text-align:center; font-size:14px; border-right:1px solid #ccc; box-sizing:border-box;}
.gnbSec .gnbMenu a {display:block; color:#FFF; font-weight:400;}
.gnbSec .gnbMenu a:hover {background:#555;}
.gnbSec .gnbMenu.on a {background:#f74d1e;}

/* page Element */
.pageTitle {display:block; height:auto; overflow:hidden; padding:1px 0 1px 20px; font-size:18px; color:#333; letter-spacing:0; position:relative;}
.pageTitle:after {content:''; position:absolute; left:5px; top:50%; transform:translate(0, -50%); width:7px; height:2px; background:#f74d1e;}
.highTitle {display:block; height:auto; overflow:hidden; padding:5px 0 10px 0; margin-bottom:0; font-size:20px; color:#666; letter-spacing:0; position:relative; font-weight:500; border-bottom:1px solid #c5c5c5; }
.highTitle span {display:inline-block; margin-right:10px; padding-right:13px; position:relative;}
.highTitle span:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:1px; height:15px; background:#c5c5c5;}
.highTitle span:last-child:after {background:none;}
.highTitle span em {display:inline-block; margin-left:10px; font-weight:300; color:#f15d2b;}
.midTitle {display:block; height:auto; overflow:hidden; padding:5px 0 5px 15px; margin-bottom:5px; font-size:16px; color:#333; letter-spacing:0px; position:relative; font-weight:400;}
.midTitle:after {content:''; position:absolute; left:5px; top:50%; transform:translate(0, -50%); width:3px; height:3px; background:#333; border-radius:50%;}

.conBlock {clear:both; display:block; height:auto; overflow:hidden; padding:3px 0; position:relative;}
.conBlock .halfCon {float:left; width:49.5%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .halfCon.clean {border:0; border-radius:0; background:none; padding:0;}
.conBlock .halfCon:last-child {margin-right:0;}
.conBlock .thirdCon {float:left; width:32.666%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .thirdCon:last-child {margin-right:0;}
.conBlock .left30Con {float:left; width:29%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left35Con {float:left; width:34%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left40Con {float:left; width:39%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left45Con {float:left; width:44%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left48Con {float:left; width:48%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left49Con {float:left; width:49%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left50Con {float:left; width:49%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left55Con {float:left; width:54%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left60Con {float:left; width:60%; margin-right:0%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left65Con {float:left; width:65%; margin-right:0%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left70Con {float:left; width:70%; margin-right:0%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .right60Con {float:left; width:60%; margin-right:0%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .right70Con {float:left; width:70%; margin-right:0%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .right40Con {float:left; width:39%; margin-left:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .right35Con {float:left; width:34%; margin-left:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .right30Con {float:left; width:29%; margin-left:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left25Con {float:left; width:25%; margin-right:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .left50Con {float:left; width:48%; margin-right:0%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .right50Con {float:right; width:48%; margin-right:0%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .right55Con {float:right; width:53%; margin-right:0%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .right25Con {float:left; width:25%; margin-left:1%; height:auto; overflow:hidden; border:1px solid #eee; background:#FFF; padding:20px;}
.conBlock .fullCon {clear:both; display:block; height:auto; overflow:hidden; border-top:1px solid #ccc; background:#FFF; padding:20px 0;}
.conBlock .fullCon.marMinus {margin-top:-1px;}

.conBlock .left30Con.clean,
.conBlock .left70Con.clean,
.conBlock .right70Con.clean,
.conBlock .right30Con.clean,
.conBlock .fullCon.clean,
.conBlock .left25Con.clean,
.conBlock .left50Con.clean,
.conBlock .right25Con.clean {border:0; border-radius:0; background:none; padding:0;}

.conBlock select {display:inline-block; width:auto; height:28px; line-height:26px; border:1px solid #ccc; border-radius:3px; -webkit-appearance: none; -moz-appearance:none; appearance: none; background:#f9f9f9 url(../img/ar_select.png) no-repeat 92% 50%; background-size:15px 9px; padding:0 30px 0 10px; font-size:13px;}
.conBlock select::-ms-expand {display: none;}
.conBlock select.small {height:30px; line-height:28px; margin:0 5px;}

.conBlock input[type="text"], .conBlock input[type="password"], .conBlock input[type="number"], .conBlock input[type="date"], .conBlock input[type="file"] {display:inline-block; width:100%; height:28px; line-height:26px; background:#f9f9f9; border:1px solid #ccc; padding:0 10px; box-sizing:border-box; font-size:14px; color:#333; border-radius:3px; box-sizing:border-box;}
.conBlock input.w {background:#FFF;}

.tabMenu {display:block; height:auto; overflow:hidden; position:relative; z-index:10;}
.tabMenu .cauTxt {position:absolute; right:0; top:50%; transform:translate(0, -50%); text-align:right; font-size:14px; color:#999;}
.tabMenu li {float:left; width:160px; font-size:13px; border:1px solid #ccc; margin-left:-1px; text-align:center; background:#f0f0f0;}
.tabMenu li a {display:block; color:#666; padding:8px 20px;}
.tabMenu li.on {background:#FFF; border-bottom:1px solid #FFF;}
.tabMenu li:first-child {margin-left:0;}
.tabMenu.faq li {width:auto;}

.allChk {clear:both; padding:10px 0;}
.desc {clear:both; display:block; height:auto; overflow:hidden; padding:10px 0; position:relative; font-size:14px; font-weight:300;}
.desc .schWording {float:left; height:auto; overflow:hidden;}
.desc .schWording i {display:inline-block; padding-right:12px; margin-right:8px; color:#e26637; position:relative; font-weight:400;}
.desc .schWording i a {color:#e26637;}
.desc .schWording i a:hover {text-decoration:underline; text-underline-position: under;}
.desc .schWording i:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:1px; height:10px; background:#ccc;}
.desc .schWording i:last-child {padding-right:0; margin-right:0;}
.desc .schWording i:last-child:after {background:none;}
.desc .totalCount {position:absolute; right:0; top:50%; transform:translate(0, -50%); text-align:right;}
.desc .totalCount em {font-weight:400; color:#e26637;}

.listTable {clear:both; display:block; height:auto; overflow:hidden;}
.listTable .chkN input + span {padding:0 0 0 19px; vertical-align:top;}
.listTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.listTable th, .listTable td {border:1px solid #ddd; padding:8px; font-size:14px; text-align:center;}
.listTable th {font-weight:400; background:#f8fdf4; text-align:center; border-top:1px solid #999; border-bottom:1px solid #999;}
.listTable th:first-child, .listTable td:first-child {border-left:0;}
.listTable th:last-child, .listTable td:last-child {border-right:0;}
.listTable td {font-weight:300;}
.listTable td.link a {color:#374b87; text-decoration:underline; font-weight:500;}
.listTable tr.hr, .listTable th.hr, .listTable td.hr {border-bottom:1px solid #aaa;}
.listTable tr:hover {background:#f8f8f8;}
.listTable textarea {display:inline-block; width:100%; height:100px; padding:15px; font-size:14px; color:#333; border:1px solid #ddd; background:#FFF; box-sizing:border-box;}

.itemTable {clear:both; display:block; height:auto; overflow:hidden;}
.itemTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.itemTable th, .itemTable td {padding:8px; font-size:12px;}
.itemTable th {font-weight:400; background:#fff6f3; text-align:left; border-right:1px solid #ddd;}
.itemTable td {font-weight:300; text-align:left;}
.itemTable td a:hover {color:#e26637;}
.itemTable tr:hover {background:#f8f8f8;}
.itemTable tr:first-child {border-top:1px solid #999;}
.itemTable tr {border-bottom:1px solid #ddd;}
.itemTable tr.devide {border-bottom:1px solid #999;}

.inputTable {clear:both; display:block; height:auto; overflow-x: auto}
.inputTable .cauTxt {display:block; height:auto; overflow:hidden; text-align:right; font-size:14px; color:#999; margin-bottom:10px;}
.inputTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.inputTable th, .inputTable td {border:1px solid #ddd; padding:8px; font-size:14px;}
.inputTable th {font-weight:400; background:#f8f8f8; text-align:left; padding:8px 15px;}
.inputTable th:first-child, .inputTable td:first-child {border-left:0;}
.inputTable th:last-child, .inputTable td:last-child {border-right:0;}
.inputTable td {font-weight:300; text-align:left;}
.inputTable tr.quest {background:#f0f0f0;}
.inputTable tr.quest th {background:#f0f0f0;}

.inputTable input[type="text"], .inputTable input[type="password"], .inputTable input[type="number"], .inputTable input[type="date"] {background:#f9f9f9; vertical-align:middle; margin-right:5px;}
.inputTable textarea {display:inline-block; width:100%; height:200px; line-height:16px; background:#FFF; border:1px solid #ccc; padding:10px; box-sizing:border-box; font-size:14px; color:#333; border-radius:5px; box-sizing:border-box;}
.inputTable select {margin-right:5px;}
.inputTable label {margin-right:20px;}
.inputTable label.radioN, .inputTable label.chkN {margin-right:0;}
.inputTable label:last-child {margin-right:0px;}

.inputTable .listTable th, .inputTable .listTable td {border:1px solid #ddd; padding:8px; font-size:14px; text-align:center;}
.inputTable .listTable th {font-weight:400; background:#f8fdf4; text-align:center; border-bottom:1px solid #999;}

.inputTable .itemTable th, .itemTable td {padding:8px; border:1px solid #ddd !important;}


.arTable {display:block; height:auto; overflow:hidden;}
.arTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.arTable th, .arTable td {padding:8px; font-size:12px; }
.arTable th {font-weight:400; background:#e9f5ff; text-align:center; border-right:1px solid #ddd;}
.arTable td {font-weight:300; text-align:left;}
.arTable td a:hover {color:#e26637;}
.arTable tr:hover {background:#f8f8f8;}
.arTable tr:first-child {border-top:1px solid #999;}
.arTable tr {border-bottom:1px solid #ddd;}
.arTable tr.devide {border-bottom:1px solid #999;}
.arTable input[type="text"] {font-size: 12px;}

.apTable {display:block; height:auto; overflow:hidden;}
.apTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.apTable th, .apTable td {padding:8px; font-size:12px;}
.apTable th {font-weight:400; background:#ffe9ef; text-align:center; border-right:1px solid #ddd;}
.apTable td {font-weight:300; text-align:left;}
.apTable td a:hover {color:#e26637;}
.apTable tr:hover {background:#f8f8f8;}
.apTable tr:first-child {border-top:1px solid #999;}
.apTable tr {border-bottom:1px solid #ddd;}
.apTable tr.devide {border-bottom:1px solid #999;}


.arTable2 {display:block; height:auto; overflow:hidden;}
.arTable2 table {padding:0; margin:0; width:100%; table-layout:fixed;}
.arTable2 th, .arTable2 td {padding:8px; font-size:14px; }
.arTable2 th {font-weight:400; background:#e9f5ff; text-align:center; border-right:1px solid #ddd;}
.arTable2 td {font-weight:300; text-align:left;}
.arTable2 td a:hover {color:#e26637;}
.arTable2 tr:hover {background:#f8f8f8;}
.arTable2 tr:first-child {border-top:1px solid #999;}
.arTable2 tr {border-bottom:1px solid #ddd;}
.arTable2 tr.devide {border-bottom:1px solid #999;}
.arTable2 input[type="text"] {font-size: 14px;}

.apTable2 {display:block; height:auto; overflow:hidden;}
.apTable2 table {padding:0; margin:0; width:100%; table-layout:fixed;}
.apTable2 th, .apTable2 td {padding:8px; font-size:14px;}
.apTable2 th {font-weight:400; background:#ffe9ef; text-align:center; border-right:1px solid #ddd;}
.apTable2 td {font-weight:300; text-align:left;}
.apTable2 td a:hover {color:#e26637;}
.apTable2 tr:hover {background:#f8f8f8;}
.apTable2 tr:first-child {border-top:1px solid #999;}
.apTable2 tr {border-bottom:1px solid #ddd;}
.apTable2 tr.devide {border-bottom:1px solid #999;}


.reportTable {clear:both; display:block; height:auto; overflow:hidden;}
.reportTable .chkN input + span {padding:0 0 0 19px; vertical-align:top;}
.reportTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.reportTable th, .reportTable td {padding: 6px; font-size:12px; text-align:center;}
.reportTable th:first-child, .reportTable td:first-child {border-left:0;}
.reportTable th:last-child, .reportTable td:last-child {border-right:0;}
.reportTable td {font-weight:300;}
.reportTable td.link a {color:#374b87; text-decoration:underline; font-weight:500;}
.reportTable tr:hover {background:#f8f8f8;}


.summary { }
.summary table{ text-align: right; width: 100%; }
.summary th {border:1px solid #ddd; padding:8px; font-size:14px; background-color: #f7dfbc}
.summary td {border:1px solid #ddd; padding:8px; font-size:14px;}


.innerTd {display:block; height:auto; overflow:hidden; position:relative; text-align:left;}
.invoiceTxt {color:#000; margin-right:10px; font-weight:400;}
.bar {display:inline-block; padding-left:15px; margin-right:15px; position:relative; vertical-align:12px;}
.bar:after {content:''; position:absolute; right:0; top:0; width:1px; height:14px; background:#aaa;}

.cmtInput {display:block; height:auto; overflow:hidden; margin-bottom:15px; position:relative; padding-right:100px;}
.cmtInput textarea {display:inline-block; width:100%; height:100px; padding:15px; font-size:14px; color:#333; border:1px solid #ddd; background:#f0f0f0; box-sizing:border-box;}
.cmtInput button.btnCmt {position:absolute; right:0; top:0; width:100px; height:100px; background:#333; color:#FFF; font-weight:500; font-size:16px; text-align:center;}

.contSearch {display:block; height:auto; overflow:hidden; padding-bottom:15px; margin-bottom:10px; border-bottom:1px dashed #ccc;}
.contSearch .schOption {display:block; height:auto; overflow:hidden; padding-bottom:8px;}
.contSearch .schOption select, .contSearch .schOption input[type="text"] {margin-right:5px;}
.contSearch .schOption.inline {display:inline-block; width:auto; vertical-align:middle; padding-bottom:0;}
.periodSec {display:block; height:auto; overflow:hidden;}
.periodSec.inline {display:inline-block; width:auto; vertical-align:middle; margin-left:10px;}
.periodSec .calendar {width:105px !important; background:#FFF url(../img/ico_cal.png) no-repeat 80px 50% !important;}

.setPeriod {display:inline-block; height:auto; vertical-align:middle; margin-left:10px;}
.setPeriod .setBtn a {float:left; height:28px; line-height:26px; font-size:12px; padding:0 15px; color:#666; background:#f0f0f0; border:1px solid #eee; box-sizing:border-box; margin-right:2px;}
.setPeriod .setBtn.on a {background:#666; color:#FFF;}

.resultGuideSec {display:block; height:auto; overflow:hidden; padding:10px 0;}
.resultGuideSec .halfGuide {float:left; width:50%; height:auto; font-size:14px; color:#666;}
.resultGuideSec .halfGuide b {color:#333; font-weight:500;}

.itemFuncSec {display:block; height:auto; overflow:hidden; padding:10px 0;}
.itemFuncSec .half {float:left; width:50%; height:auto;}

.photoList {display:block; height:auto; overflow:hidden;}
.photoList li {float:left; width:200px; height:200px; overflow:hidden; margin:0 10px 10px 0;}
.photoList li img {width:200px; height:200px;}

.caseList {display:block; height:auto;}
.caseList li {display:block; position:relative; line-height:28px; margin-bottom:10px;}
.caseList li:last-child {margin-bottom:0;}
.caseList li dl {display:block; height:auto; overflow:hidden;}
.caseList li dl dd {display:block; height:auto; position:relative; margin-bottom:10px;}
.caseList li dl dd:last-child {margin-bottom:0;}
.caseList.device li {float:left; width:16.66667%;}
.noMar {margin:0 !important;}
img.prdImg {width:60px; height:60px;}
.tdInner {display:block; height:auto; overflow:hidden; position:relative;}
.cateDepth {position:absolute; right:0; top:50%; transform:translate(0, -50%); text-align:right; font-size:15px; color:#666;}
.cateDepth b {color:#333;}
.cateCount {display:inline-block; padding:0 15px; font-size:16px; font-weight:500; color:#333; vertical-align:middle;}

.sortBy a {display:inline-block; padding:0 5px; color:#999;}
.sortBy a:hover {color:#333;}
.sortBy.on a {color:#333; font-weight:500;}

.statsModify {display:inline-block; vertical-align:middle; margin-left:20px; padding-left:20px; position:relative;}
.statsModify:after {content:''; position:absolute; left:0; top:50%; transform:translate(0, -50%); width:1px; height:18px; background:#666;}
.statsModify.noLine {margin-left:0; padding-left:0;}
.statsModify.noLine:after {background:none;}

.itemList {display:block; height:auto; overflow:hidden; padding:10px 0;}
.itemList li {display:block; height:auto; overflow:hidden; padding:3px 0 3px 15px; position:relative; font-size:14px;}
.itemList li:after {content:''; position:absolute; left:5px; top:12px; width:3px; height:3px; background:#666;}

.platList {display:block; height:auto; overflow:hidden; padding:0;}
.platList li {display:block; height:auto; overflow:hidden; padding:5px 0; position:relative;}

.ordCh {display:inline-block; padding:1px 0px; color:#FFF; border-radius:2px; margin-right:5px; background:#555; font-size:11px; width:30px; text-align:center;}
.ordCh.pc {background:#205fbc;}
.ordCh.mo {background:#6abc20;}
.ordCh.ap {background:#bc3320;}

.prdStats {display:inline-block; font-size:14px; padding-right:15px; margin-right:10px; position:relative;}
.prdStats:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:1px; height:14px; background:#ccc;}
.prdStats:last-child {padding-right:0; margin-right:0;}
.prdStats:last-child:after {background:none;}
.prdStats a:hover {text-decoration:underline;}

.reasonList {display:block; height:auto; overflow:hidden; border:1px solid #ddd; background:#f0f0f0; padding:10px;}
.reasonList li {display:block; height:auto; overflow:hidden; padding:3px 0 3px 15px; position:relative; line-height:20px; font-size:14px; color:#333; text-align:left !important;}
.reasonList li:after {content:''; position:absolute; left:0; top:13px; width:3px; height:3px; background:#333;}

.listTable .reasonList {background:none; border:0; padding:0 0 0 20px;}
.listTable .reasonList li {padding-left:10px;}
.listTable .reasonList li:after {content:''; position:absolute; left:0px; width:4px; height:1px;}

.exOptSel {clear:both; display:block; height:auto; overflow:hidden; margin-top:10px;}
.exOptSel dt, .exOptSel dd {float:left; padding:5px; box-sizing:border-box; text-align:left; border:1px solid #ccc;}
.exOptSel dt {width:12%; height:40px; line-height:40px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding:0 10px; background:#eee; border-left:0; border-right:0;}
.exOptSel dd {width:21.33333%; border-right:0;}
.exOptSel dd select {width:100%;}

.resPhoto {clear:both; display:block; height:auto; overflow:hidden; margin-top:10px;}
.resPhoto li {display:block; height:auto; overflow:hidden; text-align:center; margin-bottom:10px;}
.resPhoto li img {max-width:100%;}

.bnrBox {display:block; height:auto; overflow:hidden; padding:10px 100px 20px 10px; margin-bottom:20px; border-bottom:1px dashed #666; position:relative;}
.bnrBox .titleSec {clear:both; display:block; height:auto; overflow:hidden; margin-bottom:10px;}
.bnrBox .titleSec .title {float:left; width:100px;}
.bnrBox .deviceTarget {float:left; width:48%; height:auto; overflow:hidden; position:relative; margin-right:4%;}
.bnrBox .deviceTarget.end {margin-right:0;}
.bnrBox .tScreen {color:#000; font-size:16px; font-weight:900; margin-bottom:5px;}
.bnrBox:last-child {margin-bottom:0; padding-bottom:0; border-bottom:0;}
.bnrBox button {position:absolute; right:0; top:50%; transform:translate(0, -50%); width:80px; height:80px; border:0; text-align:center; font-size:16px; font-weight:500; border-radius:5px; cursor:pointer;}
.bnrBox button.btnAdd {background:#333; color:#FFF;}
.bnrBox button.btnDel {background:#f0f0f0; border:1px solid #d0d0d0; color:#666;}
.bnrBox .deviceTarget li {display:block; height:auto; overflow:hidden; padding:5px 0 5px 100px; position:relative;}
.bnrBox .deviceTarget li .title {position:absolute; left:0; top:8px; font-size:14px; color:#333;}
.bnrBox .deviceTarget li input[type="text"], .bnrBox li input[type="file"] {float:left;}
.bnrBox .deviceTarget li .target {clear:both; display:block; height:auto; overflow:hidden; padding:10px 0 0 0px;}
.bnrBox .deviceTarget li img {max-width:100%;}
/*
.bnrBox .direction {position:absolute; left:10px; top:50%; transform:translate(0, -50%); width:110px; height:auto; font-weight:900;}
*/
.bnrBox .direction {display:block; height:auto; overflow:hidden; font-weight:900; margin-bottom:15px; font-size:18px;}

.tPrice {display:block; text-align:right; font-size:24px;}
.tDesc {clear:both; display:block; height:auto; overflow:hidden; margin-top:10px; padding:0 5px;}
.tDesc dt, .tDesc dd {float:left; width:50%; height:auto; overflow:hidden; line-height:24px; letter-spacing:0;}
.tDesc dt {text-align:left;}
.tDesc dd {text-align:right;}
.bold {font-weight:700;}
.bold2 {font-weight: bold;}

/* pagination */
.pagingWrap {display:block; height:40px; overflow:hidden; position:relative; width:480px; box-sizing:border-box; padding:0 79px; margin:15px auto;}
.pagingWrap .prevGroup {position:absolute; left:0; top:0;}
.pagingWrap .prevGroup .btnBackword a {float:left; width:40px; height:40px; border:1px solid #e2e2e2; background:url(../img/btn_backword.png) no-repeat 50% 50%; box-sizing:border-box;}
.pagingWrap .prevGroup .btnPrev a {float:left; width:40px; height:40px; border:1px solid #e2e2e2; background:url(../img/btn_prev.png) no-repeat 50% 50%; box-sizing:border-box; margin-left:-1px;}
.pagingWrap .nextGroup {position:absolute; right:0; top:0;}
.pagingWrap .nextGroup .btnForword a {float:right; width:40px; height:40px; border:1px solid #e2e2e2; background:url(../img/btn_forword.png) no-repeat 50% 50%; box-sizing:border-box;}
.pagingWrap .nextGroup .btnNext a {float:right; width:40px; height:40px; border:1px solid #e2e2e2; background:url(../img/btn_next.png) no-repeat 50% 50%; box-sizing:border-box; margin-right:-1px;}
.pagingWrap .paging {display:block; height:auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center;}
.pagingWrap .paging .num a {display:inline-block; width:30px; height:40px; line-height:40px; text-align:center; font-size:14px; color:#999; position:relative;}
.pagingWrap .paging .num.on a {color:#f74d1e; font-weight:700;}
.pagingWrap .paging .num.on a:after {content:''; position:absolute; left:50%; bottom:5px; transform:translate(-50%, 0); width:15px; height:2px; background:#f74d1e;}
.pagingWrap .paging .num a:hover {color:#f74d1e; font-weight:700;}
.pagingWrap .paging .num a:hover:after {content:''; position:absolute; left:50%; bottom:5px; transform:translate(-50%, 0); width:15px; height:2px; background:#f74d1e;}

/* btn */
.btnAbs {position:absolute; right:0; top:50%; transform:translate(0, -50%);}
.btnArea {clear:both; display:block; height:auto; overflow:hidden;}
.absBtns {position:absolute; right:0; top:50%; transform:translate(0, -50%); text-align:right;}
.btn a {display:inline-block; height:40px; line-height:40px; text-align:center; font-size:14px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; padding:0 15px; vertical-align:middle;}
.btnS a {display:inline-block; height:auto; text-align:center; font-size:13px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; padding:5px 15px; vertical-align:middle;}
.btnS2 a {display:inline-block; height:auto; text-align:center; font-size:12px; color:#FFF; font-weight:300; border-radius:3px; letter-spacing:0px; padding:5px 7px; vertical-align:middle;}
.btnB a {display:inline-block; width:100%; height:60px; line-height:60px; text-align:center; font-size:16px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; vertical-align:middle;}
.btnLine a {display:inline-block; height:40px; line-height:38px; text-align:center; font-size:14px; font-weight:400; border-radius:4px; letter-spacing:0px; padding:0 15px; vertical-align:middle; background:#FFF;}
.orange a {background:#e26637;}
.yellow a {background:#e3a805;}
.green a {background:#3ca865;}
.gray a {background:#666;}
.blue a {background:#5273f7;}
.purple a {background:#8d05f5;}
.red a {background:#fa1e43;}
.dGray a {background:#444;}
.black a {background:#000;}
.lineO a {border:1px solid #e26637; color:#e26637;}
.lineG a {background:#f0f0f0; border:1px solid #d0d0d0; color:#666;}

button.btnSmall {display:inline-block; height:22px; line-height:22px; text-align:center; font-size:13px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; padding:0 8px; background:#555; margin:0 5px;}
button.btnSch {display:inline-block; height:28px; line-height:28px; text-align:center; font-size:14px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; padding:0 8px; background:#555; margin:0 5px;}
input.btnSch {display:inline-block; height:28px; line-height:28px; text-align:center; font-size:14px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; padding:0 8px; background:#555; margin:0 5px;}
button.lineBtn {display:inline-block; height:28px; font-size:13px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; padding:0px 15px; vertical-align:middle; background:#555; border:1px solid #444; cursor:pointer;}
input[type="submit"] {display:inline-block; height:40px; text-align:center; font-size:14px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; padding:0 20px; vertical-align:middle; background:#666; border:0; cursor:pointer;}
input[type="submit"].del {display:inline-block; height:auto; font-size:13px; color:#666; font-weight:400; border-radius:4px; letter-spacing:0px; padding:3px 10px; vertical-align:middle; background:#f0f0f0; border:1px solid #d0d0d0; cursor:pointer;}
input[type="submit"].delBig {display:inline-block; height:28px; font-size:13px; color:#666; font-weight:400; border-radius:4px; letter-spacing:0px; padding:0px 15px; vertical-align:middle; background:#f0f0f0; border:1px solid #d0d0d0; cursor:pointer;}
input[type="submit"].add {display:inline-block; height:auto; font-size:13px; color:#FFF; font-weight:400; border-radius:4px; letter-spacing:0px; padding:3px 10px; vertical-align:middle; background:#666; border:1px solid #666; cursor:pointer;}

button.green {background:#3ca865;}
button.orange {background:#e26637;}
button.gray {background:#666;}
button.dGray {background:#444;}
button.black {background:#000;}

/* bbsSearch */
.bbsSearch {display:inline-block; height:auto; overflow:hidden; border:1px solid #ccc; background:#FFF; border-radius:5px; vertical-align:middle; margin-right:20px;}
.bbsSearch select {border:0; background-position:90% 50%;}
.bbsSearch .schCate {float:left;}
.bbsSearch .bbsSchInput {float:left; position:relative; padding-right:60px;}
.bbsSearch .bbsSchInput:after {content:''; position:absolute; left:0; top:0; width:1px; height:100%; background:#eee;}
.bbsSearch .bbsSchInput input[type="text"], .bbsSearch .bbsSchInput input[type="number"], .bbsSearch .bbsSchInput input[type="date"] {background:#FFF; border:0;}
.bbsSearch .bbsSchInput button.bbsSch {position:absolute; right:0; top:0; width:60px; height:28px; border:0; background:#f74d1e; color:#FFF; font-size:14px;}

/* device List */
.comnWrap {min-height:100vh;}
.comnWrap .content.fullHeight {min-height:calc(100vh - 80px); padding-bottom:0;}
.devicePer50 {max-height:calc(50vh - 120px); overflow:hidden; overflow-y:auto; margin-bottom:20px; box-sizing:border-box;}
.devicePer70 {max-height:calc(70vh - 120px); overflow:hidden; overflow-y:auto; margin-bottom:20px; box-sizing:border-box;}
.devicePer80 {max-height:calc(80vh - 120px); overflow:hidden; overflow-y:auto; margin-bottom:20px; box-sizing:border-box;}
.devicePer90 {max-height:calc(90vh - 120px); overflow:hidden; overflow-y:auto; margin-bottom:20px; box-sizing:border-box;}

.xyScroll {max-height:calc(95vh - 120px); overflow:hidden; overflow-y:auto; overflow-x: auto; margin-bottom:20px; box-sizing:border-box;}

.stickyHeader {
    position: sticky;
    top: 0;
    background-color: #000000;
    z-index: 100;
}



.conBlock.tyFlex {display:flex; flex-flow: row wrap; justify-content: space-between; position:relative;}
.conBlock.tyFlex .midTitle {color:#333; font-weight:600; font-size:14px; margin-bottom:1px; position:relative;}

.conLeft50 {width:49.5%; position:relative;}
.conRight50 {width:49.5%; position:relative;}
.conLeft50.tight {width:50%; position:relative;}
.conRight50.tight {width:50%; position:relative;}
.conLeft45 {width:45%; position:relative;}
.conLeft55 {width:54%; position:relative;}
.conLeft40 {width:40%; position:relative;}
.conLeft60 {width:59%; position:relative;}
.conRight40 {width:40%; position:relative;}
.conRight45 {width:45%; position:relative;}
.conRight60 {width:59%; position:relative;}
.conLeft20 {width:20%; position:relative;}
.conLeft30 {width:30%; position:relative;}
.conLeft70 {width:69%; position:relative;}
.conRight30 {width:30%; position:relative;}
.conRight70 {width:69%; position:relative;}
.conRight80 {width:79%; position:relative;}
.conLeft20 {width:20%; position:relative;}
.conLeft80 {width:79%; position:relative;}
.conRight20 {width:20%; position:relative;}
.conRight80 {width:79%; position:relative;}
.conRight80.tight {width:80%; position:relative;}
.conLeft23 {width:25%; position:relative;}
.conRight77 {width:74%; position:relative;}
.conRight77.tight {width:75%; position:relative;}
.conLeft10 {width:10%; position:relative;}
.conRight90 {width:90%; position:relative;}
.conThree15 {width:14%; position:relative;}
.conThree20 {width:19%; position:relative;}
.conThree25 {width:24%; position:relative;}
.conThree30 {width:29%; position:relative;}
.conThree50 {width:50%; position:relative;}
.conThree55 {width:55%; position:relative;}
.conThree60 {width:60%; position:relative;}

.perCenterSec {display:block; height:calc(100vh - 180px); overflow:hidden; overflow-y:auto;}
.perCenterSec .listTable thead th {background:#f0f0f0; border-top:1px solid #333;}
.perCenterSec .listTable tr:hover {background:#f7faff;}

.perCenterSec2 {display:block; height:calc(100vh - 250px); overflow:hidden; overflow-y:auto;}
.perCenterSec2 .listTable thead th {background:#f0f0f0; border-top:1px solid #333;}
.perCenterSec2 .listTable tr:hover {background:#f7faff;}


.perCenterView {display:block; height:calc(100vh - 180px); overflow:hidden; overflow-y:auto;}
.perCenterView .listTable th {border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
.perCenterView .listTable td {text-align:left;}
.perCenterView .btnArea {padding-right:10px;}

.btnArea.flexBetween {display:flex; justify-content:space-between; align-items:center; }

.flexBetween2 {display:flex; justify-content:space-between; align-items:center; }


.text-danger { color: #bc3320; font-weight: bold;}


.table-container {
    max-height: 80vh; /* 화면 높이의 80% */
    overflow-y: auto;
    display: block;
}
table {
    border-collapse: collapse;
}
th, td {
    text-align: left;
    /*padding: 8px;*/
}
thead th {
    position: sticky;
    top: 0;
    background-color: #f9f9f9;
    z-index: 1;
}

#overlay {
    display: none; /* Initial state is hidden */
    position: fixed; /* Changed to absolute by jQuery */
    width: auto;
    height: auto;
    z-index: 1000; /* Ensure it's above other content */
    align-items: center;
    justify-content: center;
}

#overlayContent {
    background-color: #f7e9cb;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    border: 1px solid #ddd;
    transition: all 0.3s ease; /* Smooth transition for any changes */
}

/* Add more styling here for buttons and the close button */
button {
    margin: 5px;
    padding: 10px 15px;
    border: none;
    border-radius: 5px;
    background-color: #007bff;
    color: white;
    cursor: pointer;
}

button:hover {
    background-color: #0056b3;
}


/* 240223 */
.deviceSec {display:block; position:relative; padding-right:220px; min-height:calc(100vh - 140px);}
.deviceSec:after {content:''; position:absolute; right:0; top:0; width:200px; height:100%; background:#f1f1f1;}

.innerFunc {position:fixed; right:30px; top:120px; width:180px; height:auto; z-index:10;}
.innerFunc .ifTitle {background:#15234d; color:#FFF; font-size:14px; font-weight:600; padding:10px 0; text-align:center;}
.innerFunc .memoTitle {background:#fa921b; color:#FFF; font-size:14px; font-weight:600; padding:10px 0; text-align:center;}
.innerFunc li {display:block;}
.innerFunc li a {display:block; color:#333; font-size:12px; padding:8px; border-bottom:1px solid #ccc; background:#FFF;}
.innerFunc li a:hover {color:#f06821;}

.tabWrap {position:relative;}
.tabWrap .halfCon {width:50%; margin-right:0; border:0; padding:0 0; position:relative;}

.pTabMenu {position:relative; display:flex; justify-content:flex-start; align-items:flex-end; padding-left:20px;}
.pTabMenu:after {content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#ccc;}
.pTabMenu span {position:relative; margin-left:-1px; flex:0 1 auto;}
.pTabMenu span:first-child {margin-left:0;}
.pTabMenu span a {display:block; padding:8px 20px; position:relative; background:#f0f0f0;}
.pTabMenu span a:after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ccc; box-sizing:border-box;}
.pTabMenu span a.on {padding:12px 20px; background:#FFF; color:#15234d; font-weight:700;}
.pTabMenu span a.on:before {content:''; position:absolute; left:1px; bottom:-2px; width:100%; height:4px; background:#FFF; z-index:10;}

.pTabMenuS {position:relative; display:flex; justify-content:flex-start; align-items:flex-end; padding-left:20px;}
.pTabMenuS:after {content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#ccc;}
.pTabMenuS span {position:relative; margin-left:-1px; flex:0 1 auto;}
.pTabMenuS span:first-child {margin-left:0;}
.pTabMenuS span a {display:block; padding:5px 20px; position:relative; background:#f0f0f0;}
.pTabMenuS span a:after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ccc; box-sizing:border-box;}
.pTabMenuS span a.on {padding:8px 20px; background:#FFF; color:#15234d; font-weight:700;}
.pTabMenuS span a.on:before {content:''; position:absolute; left:1px; bottom:-2px; width:100%; height:4px; background:#FFF; z-index:10;}

.inputTable th a {display:inline-block; color:#15234d; font-weight:700; }
.inputTable td textarea.short {height:100px;}
.inputTable input.wdPer75 {width:73%; margin-right:1%;}
.inputTable input.wdPer70 {width:68%; margin-right:1%;}
.inputTable input.wdPer65 {width:63%; margin-right:1%;}
.inputTable input.wdPer70s {width:68%; margin-right:0%;}
.inputTable input.wdPer35 {width:35%; margin-right:0;}
.inputTable input.wdPer30 {width:30%; margin-right:0;}
.inputTable input.wdPer20 {width:18%; margin-right:1%;}
.inputTable input.wdPer25 {width:23%; margin-right:1%;}
.inputTable input.wdPer10 {width:10%; margin-right:0%;}
.inputTable input.wdPer90 {width:90%; margin-right:0%;}
.inputTable input.wdPer80 {width:80%; margin-right:0;}
.inputTable select.wdPer30 {width:28%; margin-right:1%;}
/*.inputTable input.calendar {background:#FFF url(../img/ico_cal.png) no-repeat 90% 50% !important;}*/
.inputTable td.inTable {padding:0;}
.radioSet {display:flex; justify-content:flex-start; align-items:stretch; padding:5px 5px; text-align:center;}
.radioSet .radioB {display:inline-block;margin:0;cursor:pointer;vertical-align:middle; width:25%;}
.radioSet .radioB input {position:absolute; visibility:hidden;}
.radioSet .radioB input + span {padding:1px 25px 1px 0px; background-position:right 50%;}
.radioSet .radioB input:checked + span {background-position:right 50%;}
.inChk .chkB input + span {padding:1px 25px 1px 0; background-position:right 50%;}
.inChk .chkB input:checked + span {background-position:right 50%;}
.innerItems {margin-top:5px; display:block; height:210px; overflow:hidden; overflow-y:auto; background:#f1f1f1;}
.innerItems th, .innerItems td {padding:4px; text-align:center;}
.innerItems th {background:#666; color:#FFF; font-size:14px;}
.innerItems td {background:#FFF;}
.inputTable td .txt {padding:10px 0; text-align:right;}

.partBlock {display:flex; justify-content:flex-start; align-items:stretch; gap:0px; margin-top:20px; border-top:1px solid #000;}
.partBlock .mngNumber {width:20%; position:relative;}
.partBlock .mngNumber:after {content:''; position:absolute; right:0; top:0; width:1px; height:calc(100% - 0px); background:#ddd;}
.partBlock .mngNumber .title {background:#f1f1f1; font-weight:400; padding:0px 15px; display:flex; align-items:center; font-size:14px; height:67px; box-sizing:border-box; border-bottom:1px solid #ddd;}
.partBlock .mngNumber ul {display:block; height:452px; overflow:hidden; overflow-y:auto; padding:15px;}
.partBlock .mngNumber ul li {padding:3px 0;}
.partBlock .mngNumber ul li.example {padding:0 0 5px; font-weight:700;}
.partBlock .mngNumber ul li input.dis {background:#FFF; border:1px solid #FFF;}
.partBlock .mngNumber ul li input.dis:focus {background:#e4f3ff; border:1px solid #92caf7;}
.partBlock .mngNumber .btnArea {padding:10px 15px; border-top:1px solid #ddd;}
.partBlock .mngNumber .btnArea a {width:100%; text-align:center; box-sizing:border-box;}
.partBlock .mngDetail {width:calc(80% - 0px);}
.partBlock .mngDetail .inputTable th {text-align:center;}
.partBlock .inputTable.big input {height:48px;}
.partBlock .inputTable.big textarea {height:48px; padding:0 10px;}
.partBlock .inputTable.percent textarea {height:100%;}
.partBlock .inputTable.percent textarea.cntrQty {height:361px;}
.partBlock .inputTable.percent textarea.ladenBoard {height:193px;}

.partBlock.small .mngNumber ul {height:300px;}
.partBlock.small .title {align-items:flex-start; padding:15px;}
.partBlock.small .mngDetail .title {background:#f1f1f1; font-weight:400; padding:0px 15px; display:flex; align-items:center; height:67px; font-size:14px; box-sizing:border-box; border-bottom:1px solid #ddd;}
.partBlock.small .mngDetail .inputTable {padding:15px;}
.partBlock.small .mngDetail .inputTable textarea {height:343px;}

.inputTable.subScroll .inner {height:calc(50vh - 186px); background:#f1f1f1;}
.inputTable.subScroll .inner2 {height:calc(40vh - 186px); background:#f1f1f1;}
.inputTable.subScroll .title {display:block; background:#dce5ff; padding:5px 15px; color:#333; font-size:14px; font-weight:700;}
.inputTable.subScroll .title .tRed {margin-left:10px;}
.inputTable.subScroll th, .inputTable.subScroll td {text-align:center; padding:3px 0;}
.inputTable.subScroll td {background:#FFF;}


.midTitle.strong {font-weight:700;}
.inputTable.blue th, .inputTable.blue td {font-size:12px; padding:4px;}
.inputTable.blue th {background:#5b68c9; color:#FFF; font-weight:700; text-align:center;}
.inputTable.blue input {text-align:right; height:30px;}
.inputTable.blue textarea {padding:8px; line-height:1.2;}
.inputTable.blue.short input {text-align:right; height:28px;}
.inputTable.blue.short td.title {background:#f8f8f8;}

.conBlock.noPad .halfCon {padding-top:0;}

.red a {background:#e42727;}
.blue a {background:#2777e4;}

.scrollTable {position:relative;}
.scrollTable ul {display:flex; justify-content:flex-start; align-items:stretch; text-align:center; border:1px solid #ededed; background:#5b68c9;}
.scrollTable ul.tHead {border-bottom:0; padding-right:5px;}
.scrollTable ul.tHead li {color:#FFF;}
.scrollTable ul.total li {background:#f0d4b4; font-weight:700;}
.scrollTable .tBody {background:#f8f8f8; height:400px; overflow-y:scroll;}
.scrollTable .tBody li {color:#333; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; background:#FFF;}
.scrollTable li {display:block; padding:6px; border-right:1px solid #ededed; color:#333; flex:1 0 auto;}
.scrollTable li:last-child {border-right:0;}
.scrollTable li.item01 {width:50px;}
.scrollTable li.item02 {width:12%;}
.scrollTable li.item03 {width:68px;}
.scrollTable li.item04 {width:80px;}
.scrollTable li.item05 {width:80px;}
.scrollTable li.item06 {width:16%;}

.scrollTable.hblInfo .tBody {height:100px;}
.scrollTable.arItems .tHead {background:#e9f5ff;}
.scrollTable.arItems .tHead li {color:#333;}
.scrollTable.arItems .tBody {height:320px;}
.scrollTable.apItems .tHead {background:#ffe9ef;}
.scrollTable.apItems .tHead li {color:#333;}
.scrollTable.apItems .tBody {height:313px;}

.scrollTable.apItems .tHead {background:red;}
.scrollTable.apItems .tHead li {color:#333;}
.scrollTable.apItems .tBody {height:320px;}
.scrollTable.apItems .tHead {background:#ffe9ef;}
.scrollTable.apItems .tHead li {color:#333;}
.scrollTable.apItems .tBody {height:313px;}


.scrollTable *::-webkit-scrollbar,
.scrollTable *::-webkit-scrollbar {width: 5px;background:#252424;}
.scrollTable *::-webkit-scrollbar-thumb {background: #aaa;border-radius:50px;}
.scrollTable *::-webkit-scrollbar-track {background: #f8f8f8;}


#arap-summary {
    font-size: 18px;
    font-family: Arial, sans-serif; /* 폰트 설정 */
    color: #333; /* 기본 텍스트 색상 */
    background-color: #f0f0f0; /* 배경 색상 */
    padding: 10px; /* 안쪽 여백 */
    border-radius: 8px; /* 테두리 둥글기 */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* 그림자 효과 */
    margin: 5px auto; /* 중앙 정렬 */
    text-align: center;
}


#customer-ar {
    color: #28a745; /* 고객 A/R 색상 */
}

#agent-debit, #agent-credit {
    color: #dc3545; /* 대리점 데빗/크레딧 색상 */
}

#vendor-ap {
    color: #ffc107; /* 공급업체 A/P 색상 */
}

#net-pl {
    color: #17a2b8; /* 순이익/손실 색상 */
}

.cursor { cursor: pointer }



/* print 240323 */
.printWrap {position:relative; width:100%; max-width:1060px; margin:0 auto; }
.printWrap * {-webkit-print-color-adjust: exact !important; color-adjust: exact !important; color:#000;}
.printWrap h1 {font-size:30px; font-weight:900; text-align:center; padding-bottom:10px; border-bottom:3px solid #ccc;}
.printWrap h1.bdrNone {border-bottom:0;}
.printWrap .prHeadTable {position:relative; margin-top:4px;}
.printWrap .prHeadTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.printWrap .prHeadTable th, .printWrap .prHeadTable td {border:1px solid #333; padding:6px; font-size:12px;}
.printWrap .prHeadTable th:first-child {border-left:0;}
.printWrap .prHeadTable th:last-child {border-right:0;}
.printWrap .prHeadTable td {vertical-align:top;}
.printWrap .prHeadTable td:first-child {border-left:0;}
.printWrap .prHeadTable td:last-child {border-right:0;}
.printWrap .prHeadTable td.noBdr {border-left:0; border-right:0; text-align:center;}
.printWrap .prHeadTable td.noBdr span {float:left; width:33.33334%; text-align:center;}
.printWrap .printCon {position:relative;}
.printWrap .printCon .title {color:#aaa; margin-bottom:5px; font-size:10px;}
.printWrap .printCon .printTxt {line-height:1.3; padding-left:10px; box-sizing:border-box; font-weight:500;}

.printWrap .prDetailTable {position:relative; margin-top:5px;}
.printWrap .prDetailTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.printWrap .prDetailTable th, .printWrap .prDetailTable td {border:1px solid #333; padding:6px; font-size:12px;}
.printWrap .prDetailTable th {text-align:left; background:#eee; font-weight:700; padding:8px;}
.printWrap .prDetailTable th:first-child {border-left:0;}
.printWrap .prDetailTable th:last-child {border-right:0;}
.printWrap .prDetailTable td {vertical-align:top; height:300px; position:relative; font-size:10px; }
.printWrap .prDetailTable td:first-child {border-left:0;}
.printWrap .prDetailTable td:last-child {border-right:0;}
.printWrap .prDetailTable td ul {display:block;}
.printWrap .prDetailTable td ul li {display:block; line-height:1.3; font-weight:500; margin-bottom:5px;}
.printWrap .prDetailTable td ul li:last-child {margin-bottom:0;}
.printWrap .prDetailTable td ul li .unit {display:block;}
.printWrap .prDetailTable td ul.btmCont {position:absolute; left:6px; bottom:6px; width:100%;}
.printWrap .printCopyright {text-align:center; padding-top:20px; font-size:12px; font-weight:500; line-height:1.3;}

.printWrap .prDetailTable.autoHeight td {text-align:center; height:auto; vertical-align:middle;}
.printWrap .prDetailTable.autoHeight th {text-align:center;}
.printWrap .prDetailTable.autoHeight tr.total th, .printWrap .prDetailTable.autoHeight tr.total td {border-left:0; border-right:0; text-align:right; font-weight:900; border-top:4px double #333;}
.printWrap .prDetailTable.autoHeight tr.profit th, .printWrap .prDetailTable.autoHeight tr.profit td {border-left:0; border-right:0; text-align:right; font-weight:900; border-top:2px solid #333; border-bottom:0;}

.printWrap .prCleanTable {position:relative; border-bottom:2px solid #333;}
.printWrap .prCleanTable.bdrNone {border-bottom:0;}
.printWrap .prCleanTable table {padding:0; margin:0; width:100%; table-layout:fixed;}
.printWrap .prCleanTable th, .printWrap .prCleanTable td {padding:6px; font-size:12px; text-align:left;}



.printWrap .prCargoTable {position:relative; border-bottom:2px solid #333;}
.printWrap .prCargoTable.bdrNone {border-bottom:0;}
.printWrap .prCargoTable table {padding:0; margin:0; width:100%; table-layout:fixed;}

.printWrap .prCargoTable th, .printWrap .prDetailTable td {border:1px solid #333; padding:6px; font-size:10px;}
.printWrap .prCargoTable th {text-align:left; background:#eee; font-weight:700; padding:8px;}
.printWrap .prCargoTable th:first-child {border-left:0;}
.printWrap .prCargoTable th:last-child {border-right:0;}

.printWrap .prCargoTable th, .printWrap .prCargoTable td {padding:6px; font-size:10px; text-align:left;}


.printWrap .prCorpInfo {text-align:center;}
.printWrap .prCorpInfo .title {font-size:14px; font-weight:700;}
.printWrap .prCorpInfo .desc {font-size:12px;}
.printWrap .prRefNo {position:absolute; left: 30px; top: 100px; font-size:14px; color:#000;}
.printWrap .prRefNo em {font-weight:700;}




/* 20240321 */
.printWrap input[type="text"], .printWrap input[type="number"] {display:inline-block; width:100%; height:30px; line-height:28px; border:1px solid #aaa; padding:0 10px; background:#FFF; font-size:14px; color:#000; font-weight:600; box-sizing:border-box;}
.printWrap textarea {display:inline-block; width:100%; height:100px; line-height:1.3; border:1px solid #aaa; padding:10px; background:#FFF; font-size:12px; color:#333; font-weight:600; box-sizing:border-box;}

.printWrap .printCon .printTxt.date {display:flex; justify-content:flex-start; align-items:center; gap:5px;}
.printWrap .printCon .printTxt.date input {width:80%;}
.printWrap .printCon .printTxt.date .calendar {cursor:pointer;}

.printWrap .pageFunc {display:flex; justify-content:space-between; align-items:stretch; gap:15px; margin-top:10px; padding:0 5px;}
.printWrap .pageFunc.flexEnd {justify-content:flex-end;}
.printWrap .pageFunc .signDate {display:flex; justify-content:flex-start; align-items:center; gap:30px;}
.printWrap .pageFunc .signDate div span {width:65px;}
.printWrap .pageFunc .signDate div input {width:120px;}
.printWrap .pageFunc .signDate .sign {display:flex; justify-content:flex-start; align-items:center; gap:10px;}
.printWrap .pageFunc .signDate .date {display:flex; justify-content:flex-start; align-items:center; gap:10px;}
.printWrap .pageFunc .signDate .date span {width:30px;}

.printWrap .pageFunc .pBtns button {display:inline-block; height:30px; border-radius:4px; font-size:14px; border:1px solid #333; background:#555; color:#FFF; font-weight:700; padding:0 10px;}
.printWrap .printCon.simple {display:flex; justify-content:flex-start; align-items:stretch;}
.printWrap .printCon.simple .title {width:40px; margin-bottom:0;}
.printWrap .printCon.simple .printTxt {width:calc(100% - 75px);}
.printWrap .printCon.simple .printTxt textarea {height:40px;}
.printWrap .prHeadInfo {display:flex; justify-content:space-between; align-items:flex-end; gap:15px;}
.printWrap .prHeadInfo .printCon {width:45%;}
.printWrap .prHeadInfo .signInfo {}
.printWrap .prHeadInfo .signInfo p {color:#000; font-size:12px; line-height:1.5; text-align:left;}
.printWrap .prHeadInfo .signInfo p em {display:inline-block; width:50px; font-weight:700; text-align:left;}

.printWrap .prHeadTable.packing .printCon {min-height:auto;}
.printWrap .cauTxt {text-align:center; font-size:13px; color:#000; padding:15px 0;}

.printWrap.pink {background:#ffe7fe !important;}
.printWrap.pink .printCon .title {color:#555;}
.printWrap.pink h1 {font-size:24px; position:relative; border-bottom:0px; }
.printWrap.pink h1 .formCode {position:absolute; left:10px; top:0; color:#000; font-size:13px; font-weight:500; line-height:1.3; text-align:left;}
.printWrap.pink h1 .ombNo {position:absolute; right:10px; top:0; color:#000; font-size:13px; font-weight:500; line-height:1.3; text-align:right;}

.printWrap.pink .thirdSec {display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin:20px 0;}
.printWrap.pink .thirdSec .tableSec {width:30%;}
.printWrap.pink .thirdSec .txtSec {width:calc(40% - 40px); text-align:center;}
.printWrap.pink .thirdSec .txtSec .title {color:#000; font-size:18px; font-weight:700;}
.printWrap.pink .thirdSec .txtSec .desc {color:#000; font-size:14px; word-break:keep-all;}

.printWrap.pink .guideTxt {color:#000; line-height:1.3; margin-bottom:10px;}
.printWrap.pink .printCon.simple .title {width:30px;}
.printWrap.pink .printCon.simple .printTxt {width:calc(100% - 30px);}
.printWrap.pink input {height:20px; line-height:20px; font-size:12px;}
.printWrap.pink .prDetailTable th {background:transparent; font-weight:normal; font-size:10px; color:#555; text-align:left;}
.printWrap.pink .fixHeight {height:60px;}

.printWrap.pink .prHeadTable.flex .printCon .title {min-height:22px;}
.printWrap.pink .expT {position:absolute; right:400px; bottom:0;}

.link a {color:#374b87; text-decoration:underline; font-weight:500;}

.fav-lists a { font-size: 12px;}

#loading, #loading2 {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
}

.spinner {
    width: 250px;
    height: 250px;
    animation: spin 2s linear infinite;
}

.toast {
    opacity: 1 !important; /* 기본 투명도 제거 */
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@media print {

}


.hover-div:hover { background-color: #f2eeed; }
.simple-btn { border: 1px solid #918d8d; background-color: whitesmoke; padding: 3px; font-size: 11px; cursor:pointer}



.popup-layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.popup-content {
    background-color: #fff;
    padding: 20px;
    border-radius: 8px;
    max-width: 600px;
    width: 100%;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.close-btn {
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 24px;
    cursor: pointer;
}

.message-detail h2 {
    margin-top: 0;
    font-size: 22px;
}

.message-detail .message-body {
    margin-top: 20px;
    white-space: pre-wrap;
}


.favorite li {
    list-style: none; /* 기본 목록 스타일 제거 */
    background-image: url("/img/favorite2.png");
    background-size: 16px 16px; /* 이미지 크기 조정 */
    background-repeat: no-repeat;
    background-position: 10px center; /* 이미지 위치를 왼쪽에서 5px 떨어뜨리고, 수직 중앙에 배치 */


    background-color: whitesmoke;
    padding-left: 35px;
    padding-top: 8px;
    padding-bottom: 8px;
    border-radius: 10px;
    margin-top: 7px;
    margin-bottom: 7px;

    color: #0a0a0a;
}

.main-vacations {
    background-color: whitesmoke;
    padding-left: 35px;
    padding-top: 8px;
    padding-bottom: 8px;
    border-radius: 10px;
    margin-top: 7px;
    margin-bottom: 7px;

    color: #0a0a0a;
}



/* 레이어 팝업의 배경 */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: none; /* 기본적으로 숨김 */
    justify-content: center;
    align-items: center;
    z-index: 9999;
    text-align: center;
}

/* 팝업 내부 이미지 */
.popup-content {
    max-width: 90%;
    max-height: 80%;
}

.popup-content-pc {
    max-height: 800px;
}


.popup-buttons {
    margin-top: 10px;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.popup-button {
    padding: 10px 15px;
    font-size: 14px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    background-color: #007bff;
    color: white;
    transition: background-color 0.3s ease;
}


.popup-button:hover {
    background-color: #0056b3;
}



/* 레이어 팝업 배경 */
.image-layer {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8); /* 어두운 배경 */
    z-index: 1000;
    text-align: center;
    overflow: auto;
}


.image-layer-content {
    position: relative;
    display: inline-block;
    margin-top: 5%;
    background-color: whitesmoke;
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.image-layer-content img {
    max-width: 90%;
    max-height: 90%;
    display: block;
    border-radius: 5px;
}

.close-layer {
    position: absolute;
    top: -10px;
    right: 15px;
    font-size: 30px;
    color: #333;
    cursor: pointer;
    z-index: 1001;
}

/* Top Count Down */
#countdown-container {
    position: fixed;
    bottom: 10px;
    left: 10px;
    background: rgba(0, 0, 0, 0.3);
    color: white;
    padding: 10px 15px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: bold;
    display: flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    animation: fadeIn 0.5s ease-in-out;
}

#countdown-icon {
    width: 20px;
    height: 20px;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

.countdown-warning {
    color: #ffcc00;
    animation: pulse 1s infinite;
}

.countdown-danger {
    color: #ff4444;
    animation: pulse 0.5s infinite;
}





.bermuda-card{
    transform: translate(-50%, -100%); /* 마커 상단에 뜨게 */
    background:#fff; border:1px solid #ddd; border-radius:10px;
    box-shadow:0 8px 24px rgba(0,0,0,.15);
    padding:10px 12px; font:13px/1.4 Arial, sans-serif;
    z-index: 9999; pointer-events:auto; /* 내부 클릭 가능 */
}
.bermuda-card table{ border-collapse:collapse; }
.bermuda-card th, .bermuda-card td{ padding:4px 8px; border-bottom:1px solid #eee; white-space:nowrap; }
.bermuda-card .title{ font-weight:700; margin-bottom:6px; }

.status-table {
    border-collapse: collapse;
    width: 100%;
    font-size: 12px;
    text-align: center;
}

.status-table thead {
    color: #000000;
    font-size: 13px;
}

.status-table th{
    border: 1px solid #e0e0e0;
    padding: 6px 10px;
}
.status-table td {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    padding: 6px 10px;
}



.status-table tr:hover {
    background: #e6f2ff;   /* hover 시 약간 파란 배경 */
}