﻿@charset "utf-8";

* {margin:0; padding:0; font-family:-apple-system,BlinkMacSystemFont,"Malgun Gothic","맑은 고딕",helvetica,"Apple SD Gothic Neo",sans-serif; box-sizing:border-box;}
body {min-width: 320px;}
html,body{width:100%;height:100%;margin:0;padding:0;font-size:14px; color:#0a0a0a;letter-spacing: -0.05em;-webkit-text-size-adjust: 100% ; font-weight: 500;}
html,body,div,p,ul,li,ol,dl,dt,dd,input,textarea,select,p,hr,h1,h2,h3,h4,h5{margin:0;padding:0; line-height: 1.5em;;}
ul,li,ol,dl,dd,dt{list-style:none;}
img,fieldset{border:0}
ul,ol{list-style:none}
em,address{font-style:normal}
a,a:hover,a:active,a:focus{text-decoration:none;color:#333;}
a, a::after, a::before {transition: all 0.2s; -webkit-transition: all 0.2s;}
caption, legend, fieldset label {width:1px;height:1px;overflow:hidden;display:none}
table{margin:0px;border-collapse:collapse;-ms-word-break: keep-all;word-break: keep-all;}
td,th,p,span {letter-spacing: -0.05em;}/*-ms-word-break: keep-all;word-break: keep-all;*/
.hidden{position: absolute; left:-9999px;}
.overflow{overflow:hidden}
.blind{visibility:hidden;overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}
input, button, select, textarea {outline: none;}
mark {background: none;}
button{cursor: pointer}

select,
input[type="text"],
input[type="number"],
input[type="password"],
textarea {width: 100%; border: 1px solid #ddd; padding: 10px; transition: all 0.2s; -webkit-transition: all 0.2s; font-weight: 400;}
select:focus,
input[type="text"]:focus,
input[type="file"]:focus,
input[type="password"]:focus,
textarea:focus {border: 1px solid #53a2e4;}
input[type="checkbox"] {vertical-align: top; opacity: 0; width: 0; max-width: 0; height: 0; line-height: 0; font-size: 1px; position: absolute;}
input[type="checkbox"]:checked + label::before {background:#53a2e4; border: 1px solid #53a2e4;}
input[type="checkbox"]:checked:disabled + label::before {background:#ccc; border: 1px solid #ccc;}
input[type="checkbox"]:checked + label::after {content: '';}
input[type="checkbox"] + label {content: none; font-size: 14px; cursor: pointer}
input[type="checkbox"] + label {position: relative; display: inline-block; padding-left:27px;}
input[type="checkbox"] + label::before, input[type="checkbox"] + label::after {position: absolute; display: inline-block; vertical-align: top; left:1px; top:0px;}
input[type="checkbox"] + label::before {border: 1px solid #ddd; border-radius: 0px; content: ''; width: 18px; height: 18px; transition: all 0.2s; -webkit-transition: all 0.2s;}
input[type="checkbox"] + label::after { width: 20px; height: 20px;  background: url("../images/resources/check.png") no-repeat; position: absolute; top:0; left: 2px;}
input[type="checkbox"]:disabled + label::after { width: 20px; height: 20px;  background: url("../images/resources/check_x.png") no-repeat; position: absolute; top:0; left: 2px;}
/*input[type="checkbox"] + label::after { width: 20px; height: 20px;  background: url("../images/resources/check.png") no-repeat 2px -1px; }*/
/*{transform: translateY(-50%); -webkit-transform: translateY(-50%); width: 8px; height: 8px; top: 49%; left: 6px;}*/

input[type="radio"] {vertical-align: top; opacity: 0; width: 0; max-width: 0; height: 0; line-height: 0; font-size: 1px; position: absolute;}
input[type="radio"]:checked + label::before {background:#fdfdfd; border: 1px solid #ddd;}
input[type="radio"]:checked + label::after {content: ''; background: #999}
input[type="radio"] + label {content: none; font-size: 14px;}
input[type="radio"] + label {position: relative; display: inline-block; padding:3px 0px 1px 27px;}
input[type="radio"] + label::before, input[type="radio"] + label::after {position: absolute; display: inline-block; vertical-align: top; left:0; top:0; }
input[type="radio"] + label::before {border: 1px solid #ddd; content: ''; width: 18px; height: 18px; transition: all 0.2s; -webkit-transition: all 0.2s; border-radius: 10px;}
input[type="radio"] + label::after {transform: translateY(-50%); -webkit-transform: translateY(-50%); width: 12px; height: 12px; top: 50%; left: 4px; border-radius: 10px;}

/*list_체크박스*/
.list_box input[type="checkbox"] {vertical-align: top; opacity: 0; width: 0; max-width: 0; height: 0; line-height: 0; font-size: 1px; position: absolute;}
.list_box input[type="checkbox"]:checked + label::before {background:#fdfdfd; border: 1px solid #666;}
.list_box input[type="checkbox"]:checked + label::after {content: '';}
.list_box input[type="checkbox"] + label {content: none;}
.list_box input[type="checkbox"] + label {position: relative; display: inline-block; padding-left:27px;}
.list_box input[type="checkbox"] + label::before {position: absolute; display: inline-block; vertical-align: top; left:6px; top:-14px;}
.list_box input[type="checkbox"] + label::before {border: 1px solid #888; border-radius: 4px; content: ''; width: 15px; height: 15px; transition: all 0.2s; -webkit-transition: all 0.2s;}
.list_box input[type="checkbox"] + label::after { width: 16px; height: 16px; position: absolute; top: -8px;  left: 11px; background: url("../images/resources/v.png") no-repeat 0px 0px; }
.send_Alarm .list_box input[type="checkbox"] + label::before {top:2px}
.send_Alarm .list_box input[type="checkbox"] + label::after {top:8px}


/* icon */
.ion-category {background: url("../images/resources/ico_cate.gif") no-repeat 0 1px; display: inline-block; width: 13px; height: 14px; background-size: 13px;}
.ion-siren {background-image: url("../images/resources/ico_siren.png");background-repeat: no-repeat; background-size: cover; display: inline-block; width: 15px; height: 16px; margin-top: -2px}
a:hover .ion-siren ,a.on .ion-siren{background-image: url("../images/resources/ico_siren_over.png");}
.ion-pen {background: url("../images/resources/ico_pencile.png") no-repeat bottom; display: inline-block;width: 12px; height: 19px;}

/* paging*/
.paging {margin-top: 30px; text-align: center;}
.paging button {display: inline-block; background: #fff; min-width: 40px; height: 40px; text-align: center; border: 1px solid #ddd; color:#adadad; padding: 8px; transition: all 0.2s; -webkit-transition: all 0.2s;}
.paging button:hover, .paging button.on {border: 1px solid #53a2e4; background:#53a2e4; color:#fff;}
.paging .front, .paging .back {padding: 16px;}
.paging .front, .paging .prev, .paging .next, .paging .back {font-size: 0; vertical-align: bottom;}
.paging .front i, .paging .back i, .paging .prev i, .paging .next i {font-size: 10px;line-height: 25px}
.pagedlist { display: inline-block; vertical-align: top; }
.pagedlist button { margin-left: 4px; }

.clicks{cursor: pointer}

/* Tooltip container */
.facility{position: absolute; right:15px; top:15px; cursor: pointer; width: 20px; height: 20px;}

.tooltip {position: relative;  display: inline-block; text-align: right; }
.tooltip .tooltiptext {visibility: hidden; width: 170px; font-size: 13px; line-height: 18px; background-color: black; color: #fff; text-align: center; border-radius: 6px; padding: 10px;  
	position: absolute;  z-index: 1; bottom: 125%; left: 50%;  margin-left: -85px;  opacity: 0;  transition: opacity 1s;}
.tooltip .tooltiptext::after {
  content: " ";  position: absolute;  top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: black transparent transparent transparent;}
.tooltip:hover .tooltiptext {visibility: visible; opacity: 1;}
[class*=" mtcon2-"], [class^=mtcon2-] {font-family: mtcon2!important;speak: none;font-style: normal;font-weight: 400;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
[class*=" mtcon2-"], [class^=mtcon2-] {font-family: mtcon2!important;speak: none;font-style: normal;font-weight: 400;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
[class*=" mtcon2-"], [class^=mtcon2-] {font-family: mtcon2!important;speak: none;font-style: normal;font-weight: 400;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}

input[name="regdate"]{padding-right: 40px; background: url("../images/resources/time.png") no-repeat; background-position: 85% 48%}

/* number 타입에 spin 버튼 삭제 */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none; margin: 0;}

.paging button:disabled, .paging button:disabled:hover, .paging button:disabled.on {
	cursor: default;
	background: #F6F6F6;
	color: #adadad;
	border: 1px solid #ddd;
}

/*2021.03.17 - 이용절차에 대한 퍼블리싱*/
.list_style {margin-left: 20px;}
.list_style li{list-style-image : url('/images/knowledge/resources/list_dot.png');}
.remark{color: #929292; margin-top: -2px;font-size: 12px;}
.target_person{margin-top: 10px;}
.target_person li{display: block; border: 1px solid #ccc; border-radius: 5px; padding: 10px; text-align: center; margin-bottom: 30px; position: relative}
.target_person li::after{content: '↓'; position: absolute; bottom: -25px;  left: 50%; margin-left: -8px;}
.target_person li:last-child::after{content: '';}
.procedure{width:100%; border-top: 1px solid #ddd}
.procedure th{background: #f8f8f8;}
.procedure td,.procedure th{padding: 10px; border-bottom: 1px solid #ddd;}
.procedure td{border-left: 1px solid #ddd;}
.procedure td p{text-align: center}
/*2021.03.17 - 이용절차에 대한 퍼블리싱*/