@charset "utf-8";

.list-table .txt-left { text-align: left !important; }

/* 공통 - (step) process bar */
.process-wrap { position: relative; width: 100%; text-align: center; }
.process-wrap .step { position: relative; display: inline-block; padding: 0 50px; font-size: 1.3rem; font-weight: 500; color: #a7a7a7; text-align: center; }
.process-wrap .step:not(:first-child) { margin-left: -3px; }
.process-wrap .step:not(:first-child):before { content: ''; display: block; width: 100%; height: 1px; border-top: 1px dashed #b7b7b7; position: absolute; top: 15px; left: -80px;}
.process-wrap .step .num { position: relative; z-index: 1; top: 2px; display: block; width: 25px; height: 25px; background:#d1d1d1; border-radius: 50%; color: #fff; text-align: center; line-height: 25px; font-size: 1.3rem; font-weight: 600; margin: 0 auto 10px; }
.process-wrap .step.on { color: #4c51dd; font-weight: 600; }
.process-wrap .step.on:before { border-top-color: #4c51dd; }
.process-wrap .step.on .num { background:#4c51dd; transition: opacity .25s; opacity: 1;}

/* 공통 - 그룹 선택 ui */
.setting-wrap { position: relative; background:#fff; border: 1px solid #dee3eb; margin-top: 20px;}

/* 공통 - 감시 센서 설정 */
.observ-group { padding: 40px; border-bottom: 1px solid #dee3eb; }
.observ-group .tit-wrap { float: left; width: 200px; font-size: 1.3rem; font-weight: 500; line-height: 30px; }
.observ-group .description { clear: both; padding-top: 10px; font-size: 1.2rem; color:#999; }
.observ-group .description img { width: 15px; height: 15px; position: relative; top: 1px;}
.observ-group .selectbox-wrap { float: left; }
.observ-group .selectbox-wrap .selectbox { float: none; display: inline-block; min-width: 250px; margin-right: 2px;}
.observ-group .selectbox-wrap .tab-group-wrap { display: inline-block; }
.observ-group .selectbox-wrap .tab-group-wrap .btn-wrap { margin-top: 0; top: auto; }
.observ-group .selectbox-wrap .tab-group-wrap .btn-wrap ul li { float: none; margin-left: 5px;}

/* step 2 - 감시 센서 설정 */
.setting-table { position: relative; }
.setting-table .fix-table { box-shadow: 0 2px 5px rgba(0,0,0,0.1); z-index: 1;}
.setting-table .table-btn { text-align: right; padding-right: 20px;}
.setting-table .normal-txt-input { width: 100%; margin: 2px 0;}
.setting-table .selectbox { width: 100%; min-width: auto; margin: 2px 0;}
.setting-table .unit { display: inline-block; margin: 0 2px;}
.setting-table table { width: 100%; position: relative; table-layout: fixed; }
.setting-table table thead tr { border-bottom: 1px solid #dee3eb; }
.setting-table table tbody tr { border-top: 1px solid #dee3eb; }
.setting-table table tr th { padding: 7px 0 7px 20px; background-color: #e7e9f4; font-weight: 600; }
.setting-table table tr td { padding: 5px 0 5px 20px; line-height: 2.4;}
.setting-table table tr.added-row td { background:#f6f6f6;}
.setting-table table tr.add-filter-row { border: 0; }
.setting-table table tr.add-filter-row td { padding-top: 0;}
.setting-table table tr td.v-bottom { vertical-align: bottom; }
.setting-table table tr td.td-filter .selectbox { min-width: auto; width: 100%;}
.setting-table table tr td .add-filter-btn { display: inline-block; font-size: 1.1rem; font-weight: 500; color: #888; cursor: pointer; padding: 3px 10px; border-radius: 3px; }
.setting-table table tr td .add-filter-btn:hover {background: #f0f0f0; }
.setting-table table tr td .check-input { display: inline-block; }
.setting-table table tr td .ft { display: inline-block; margin: 1px 0; font-size: 1rem; background:#e4e4e4; color: #666; padding: 0 10px 1px; border-radius: 3px; font-weight: 500; line-height: 17px; }
.setting-table .sensor-range-select { display: inline-block; }
.setting-table .sensor-range-select .normal-txt-input { width: 70px; }
.setting-table .sensor-range-select .selectbox { width: 70px; float: none; vertical-align: middle; margin-left: 3px;}
.setting-table .add-filter-row:hover .del-btn { display: inline-block}
.setting-table .del-btn { display: none; padding:7px 7px 3px; line-height: normal; vertical-align: middle; margin-left: 10px; border-radius: 3px; cursor: pointer;}
.setting-table .del-btn img { width: 11px; height: 13px; opacity: .7; }
.setting-table .del-btn:hover { background:#f2f2f2; }
.setting-table .del-btn:hover img { opacity: 1; }

/* step 3 - 발신자 선택 */
.setting-table .selectbox-time .selectbox { min-width: auto; width: 100px; float: none;}

/* step 4 - 최종 확인 */
.setting-info { position: relative; background: #fff; padding: 20px; border: 1px solid #dee3eb; margin-top: 20px; }
.setting-info .setting-table:not(:last-child) {margin-bottom: 30px;}
.setting-info .setting-table > .tit { font-weight: 600; padding-bottom: 10px; font-size: 1.4rem; color:#000; }
.setting-info .setting-table table { border: 1px solid #dee3eb;}
.setting-info .setting-table .tit-input .normal-txt-input { height: 40px; }


/* 센서가져오기 레이어팝업 */
.alarm-sensor-pop .pop-bg .pop-layer { width: 55%; max-height: 90vh; }
.alarm-sensor-pop .pop-bg .pop-layer .pop-top { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #dee3eb;}
.alarm-sensor-pop .pop-content ul.cont-tab { margin-bottom: 10px;}
.alarm-sensor-pop .sensor-range-select .normal-txt-input { width: 60px; padding-right: 15px; }
.alarm-sensor-pop .info-detail { margin-bottom: 30px;}
.alarm-sensor-pop .selected-table table {border: 1px solid #dee3eb; border-top: 0;}
.alarm-sensor-pop .selected-table table tbody td { background: #f8f8f8; }

.alrt { padding-top: 5px; font-weight: 500; }
.alrt.red { color: #c87272; }