@charset "utf-8";

/* 센서 설정 */
.info-table .notice p {font-size: 12px; color: #c74747} 


/* 이미지 영역  */
.coordinate-section {margin:10px 0 30px;}
.coordinate-section .img-section { position: relative; height: 450px; border: 1px solid #dee3eb; }
.coordinate-section .img-area { width: 100%; height: 100%; background:#fff; }
.coordinate-section .img-area.default .default-txt {text-align: center; padding-top: 200px; line-height: 20px; color: #666c97; display: block}
.coordinate-section .img-area .img-box {width: 100%; height: 100%; text-align: center; padding: 20px 270px 20px 20px;}
.coordinate-section .img-area .img-box svg { max-height: 100%; max-width: 100%; }

/* input[type=text] 영역 */
.sensor-range-select .normal-txt-input { width: 60px; padding-right: 15px; }
.info-detail .info-table table tr td .normal-txt-input.w100 { width: 100%; }

/* 공지 문구 영역 */
.notice-wrap { border-bottom: 1px solid #b6b8c3; color: #c74747; padding-bottom: 12px; margin-bottom: 10px; }
.notice-wrap > div { position: relative; padding-left: 7px; }
.notice-wrap > div:after { content: ''; position: absolute; top: 7px; left: 0; width: 3px; height: 3px; border-radius: 50%; background: #c74747; }

/* form validation */
div.txt-invalid { margin-left: 0; }


/* 센서 설정 임계치 */
.tab-wrap .left-wrap {float: left;}
.tab-wrap .left-wrap .cont-tab {border-bottom: 0; margin-bottom: 0;}
.tab-wrap .btn-wrap .normal-btn.right-btn {float: right; height: 26px; line-height: 26px;}
.tab-wrap .btn-wrap .normal-btn .material-icons { font-size: 15px; position: relative; top: 4px; }
.sensor-info .info-table {margin-top:10px;overflow-y: auto}
.sensor-info .info-table table { table-layout: fixed; width: 100%; min-width: 1000px;}
.sensor-info .info-table table tr th {width: auto;}
.normal-btn.delete {padding: 0 8px;background: #f05050;}
.normal-btn.delete span.material-icons {font-size: 16px; position: relative; top: 2px}

/* disable  */
.normal-btn.disabled {background: #c6c6c6; cursor: no-drop;}


/* 센서 좌표 목록 */
.coordinate-section .list-box { position: absolute; top: 0; right: 0; width: 250px; height: 100%; background: #f8f8f8; transition: right .25s; overflow: hidden; border-left: 1px solid #dee3eb;}
.coordinate-section .list-box .list { overflow-y: auto; height: 100%; -ms-overflow-style: none;scrollbar-width: none;}
.coordinate-section .list-box .list::-webkit-scrollbar { display: none; }
.coordinate-section .list-box h2.title { color: #12144d; font-size: 1.5rem; padding: 10px; font-weight: 600; text-align: center; background:#dadbe1; }
.coordinate-section .list-box h2.title .material-icons { font-size: 19px; position: relative; top: 4px; margin-right: 3px;}
.coordinate-section .list-box ul { padding: 10px; }
.coordinate-section .list-box ul li { position: relative; color: #444; padding: 10px; background: rgba(255,255,255,0.1); font-size: 1.2rem; border-radius: 5px; margin-bottom: 10px; transition: background .1s ease; padding-right: 30px;}
.coordinate-section .list-box ul li.focus,
.coordinate-section .list-box ul li:hover { background: #e8e8ec; }
.coordinate-section .list-box ul li .sensor-label { font-size: 1rem; padding: 1px 6px 2px; border-radius: 3px; margin-right: 3px; }
.coordinate-section .list-box ul li .sensor-label.optic { border: 1px solid #d978eb; color: #d978eb; background:#fff}
.coordinate-section .list-box ul li .sensor-label.temp { border: 1px solid #32c7a3; color: #32c7a3; background:#fff}
.coordinate-section .list-box ul li .sensor-label.level { border: 1px solid #e1bb2f; color: #e1bb2f; background:#fff}
.coordinate-section .list-box ul li .sensor-label.recoater { border: 1px solid #ff7b54; color: #ff7b54; background:#fff}
.coordinate-section .list-box ul li .visibility { position: absolute; top: 12px; right: 10px; }
.coordinate-section .list-box ul li .visibility .material-icons { font-size: 14px; cursor: pointer;}
.coordinate-section .list-box ul li .visibility .material-icons:hover { opacity: 1 !important; }
.coordinate-section .list-box ul li .visibility .v-off { display: none; }
.coordinate-section .list-box ul li .visibility.off .v-on { display: none; }
.coordinate-section .list-box ul li .visibility.off .v-off { display: block; opacity: .5;}


@media (max-width: 768px) {
	.coordinate-section .img-section { height: auto; }
	.coordinate-section .img-area .img-box { padding: 20px; }
	.coordinate-section .list-box { position: static; top: auto; right: auto; width: 100%; height: 350px; border-radius: 0; }
	.coordinate-section .list-box h2.title { text-align: left; background-color: #111a59; padding: 20px 0 10px; font-size: 1.4rem;}
	.coordinate-section .list-box h2.title .material-icons { font-size: 16px; }
}