html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, font, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, th, td { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: transparent; 
} 

ol, ul { 
    list-style: none; 
} 
blockquote, q { 
    quotes: none; 
} 
blockquote:before, blockquote:after, 
q:before, q:after { 
    content: ''; 
    content: none; 
} 

/* remember to define focus styles! */ 
:focus { 
    outline: 0; 
} 
input:focus::-webkit-input-placeholder{color:transparent;}
input:focus::-moz-placeholder{color:transparent;} /* firefox 19+ */
input:focus::-ms-input-placeholder{color:transparent;} /* ie */
input:focus::-moz-placeholder{color:transparent;}
textarea:focus::-webkit-input-placeholder{color:transparent;}
textarea:focus::-moz-placeholder{color:transparent;} /* firefox 19+ */
textarea:focus::-ms-input-placeholder{color:transparent;} /* ie */
textarea:focus::-moz-placeholder{color:transparent;}
input,textarea{border-style: groove;}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill
{
  background-color:green;
}

/* remember to highlight inserts somehow! */ 
ins { 
    text-decoration: none; 
} 
del { 
    text-decoration: line-through; 
} 

/* tables still need 'cellspacing="0"' in the markup */ 
table { 
  /*  border-collapse: collapse; */
    border-spacing: 0; 
}
a{text-decoration:none;color:inherit;}
*{font-family:'Open Sans Condensed', sans-serif;font-weight: 200;}
body {
  background-color:#3c4c65;
  min-width:1024px;margin:0px;/*-webkit-user-select: none;-khtml-user-select: none;  -moz-user-select: none;  -o-user-select: none;  user-select: none;*/
}
#switchframe{
  width:60px;
  height:30px;
  border:1px solid #ddd;
  border-radius:20px;
  float:right;
  margin-top:5px;
  background-color: rgba(200,200,200,0.5);
  cursor:pointer;
  -webkit-transition: all .5s cubic-bezier(.23,1,.32,1);
  transition: all .5s cubic-bezier(.23,1,.32,1)
}
#switchb{
  display: block;
  height: 28px;
  width: 28px;
  border-radius: 50%;
  background-color: white;
  margin-left: 1px;
  margin-top: 1px;
  -webkit-transition: all .5s cubic-bezier(.23,1,.32,1);
  transition: all .5s cubic-bezier(.23,1,.32,1);
  -moz-box-shadow: 0 2px 10px rgba(0,0,0,.2);
  -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
  box-shadow: 0 2px 10px rgba(0,0,0,.2);
}
#switchframe.on
{
  background-color:#4285f4;
}
#switchframe.on #switchb
{
  margin-left: 31px;
}

#topctrl
{
  position:absolute;
  background-color: white;
  z-index: 1;
  -moz-box-shadow: 0 2px 10px rgba(0,0,0,.2);
  -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
  box-shadow: 0 2px 10px rgba(0,0,0,.2);
  top:100px;
  right:26px;
  width:180px;
  border:1px solid #d6d6d6;
  display:none;
}
#topctrl .gb_eb
{
  position:absolute;
  top:-24px;
  right:17px;
  border:12px solid transparent;
  border-bottom: 12px solid white;
  width:0px;
  height:0px;
}
#topctrl .gb_fb
{
  position:absolute;
  top:-26px;
  right:16px;
  border:13px solid transparent;
  border-bottom: 13px solid rgba(0,0,0,.1);
  width:0px;
  height:0px;
}
#topctrl .mth
{
  display:block;
  padding: 10px 0 10px 20px;
  font-size:20px;
  cursor:pointer;
  color: #777;
}
#topctrl .mth:hover
{
  background-color:#62aef5;
  color:white;
}
#loading_1
{
  width: 100%;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  z-index:999;
  display:none;
}
#freeze_body{width:100%;height:100%;opacity:0.6;filter:alpha(opacity=60);position:fixed;top:0px;left:0px;z-index:9998;background-color:white;}
#freeze_body[rel='loading']{background:url("../images/ft-loading.gif") no-repeat center center white;background-size:400px;}
#freeze_body_black{width:100%;height:100%;background-color: rgba(0,0,0,0.5);position:fixed;top:0px;left:0px;z-index:9998;}
#block_screen_outside{z-index: 9998;position: fixed;top: 0px;left: 0px;width: 100%;height: 100%;background-color:transparent;background-image:url("../Image/loading/2675948.gif");background-repeat: no-repeat;background-position: center center;}
#cnfdialog{
  -webkit-user-select: none;-khtml-user-select: none;  -moz-user-select: none;  -o-user-select: none;  user-select: none;
  background: rgb(237,249,255); /* Old browsers */
  background: -moz-linear-gradient(-45deg, rgba(237,249,255,1) 0%, rgba(199,237,255,1) 47%, rgba(157,224,255,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(-45deg, rgba(237,249,255,1) 0%,rgba(199,237,255,1) 47%,rgba(157,224,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, rgba(237,249,255,1) 0%,rgba(199,237,255,1) 47%,rgba(157,224,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#edf9ff', endColorstr='#9de0ff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  position:absolute;left:0px;min-width:1024px;width:100%;z-index:10000;display:none;
}
#cnfdialog.pass{
  background-color:#148d07;
}
#cnfdialog > div{min-height:280px;width:600px;}
#cnfdialog span{display: block;color:dodgerblue;text-align:left;}
#cnfdialog #result{text-transform:uppercase;font-size:36px;font-weight:400;margin:70px 0 15px 0;}
#cnfdialog #des{font-size:28px;margin-bottom:100px;text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;}
#cnfdialog #cont{font-size:28px;font-weight:bold;height:60px;}
#cnfdialog #cont .bt{
  font-family: 'Yanone Kaffeesatz', sans-serif;
  font-weight: 200;
  color:#bfbfbf;
  cursor:pointer;
  display:block;
  height: 50px;
  line-height:50px;
  width:130px;
  float:left;
  margin-right:10px;
  -webkit-user-select: none;-khtml-user-select: none;  -moz-user-select: none;  -o-user-select: none;  user-select: none;
}
#cnfdialog #cont .bt:hover{color:dodgerblue;}
.mug-outside{
  float:left;width:40px;height:40px;border: 1px white solid;
  border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;
  margin: 38px 0 0 0;overflow:hidden;
  position:relative;
}
.mug-inside{background-color:white;width:100%;height:100%; -webkit-backface-visibility: hidden;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;}
.mug-inside img{width:100%;height:100%;position:absolute;top:0;bottom:0;left:0%;right:0;margin:auto;border-radius: 50%;}
#main-container{
  position:relative;
  
}

#op-box{
  -webkit-user-select: none;-khtml-user-select: none;  -moz-user-select: none;  -o-user-select: none;  user-select: none;
  position:absolute;background-color:white;top:0;bottom:0;left:0;right:0;margin:auto;
  -moz-box-shadow:0px 2px 13px 0px #000;
  -webkit-box-shadow:0px 2px 13px 0px #000;
  box-shadow:0px 2px 13px 0px #000;
  display:none;
  z-index:9999;
  width:700px;
}
#op-box .blk1{padding:20px 60px;}
#op-box .blk2{position:relative;height:45px;background-color: #cfedff;}
#op-box .oinfoarea{position:absolute;bottom:10px;right:20px;}
.a_bt
{
  display: block;
  width: 70px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  float: left;
  margin-right: 2px;
  background-color: #12bef3;
  color: white;
  cursor: pointer;
  font-size:20px;
}
.a_bt#autoRefresh.disable{
  background-color: #aaa;
}
.a_bt.exportchart
{
  background-image:url("../images/ms-excel.png");
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  width: 60px !important;
  height: 60px !important;
  background-color: transparent;
  cursor:pointer;
  margin:0 !important;
}
.mul_dbt
{
  display: block;
  min-width: 100px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  float: left;
  background-color: #12bef3;
  color: white;
  cursor: pointer;
  font-size:20px;
}
.mul_dbt.select{
  background-color: rgba(18, 190, 243,0.5);
}

.g_bt{cursor:pointer;font-size:20px;color:white;margin: 0 10px;font-weight:bold;}
.g_bt:hover{color:#408bc9;}
.infotable{font-size:20px;table-layout:fixed;}
.infotable td{height:60px;vertical-align:middle;}
.infotable td.title{text-align:right;position:relative;min-width:120px;}
.infotable td.title.req{color:red;}
.infotable td.title.req:before{
  content: "*";
  color: red;
  font-size: 30px;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0 auto -15px;
  height: 28px;
}
.infotable td.title.req.startop:before{
  top: -40px;
}
.infotable td.value{
  padding-left:15px;
  -webkit-user-select: text;
  -khtml-user-select: text;
  -moz-user-select: text;
  -o-user-select: text;
  user-select: text;
}
.infotable td.sh_value{padding:0 8px;}
#gmap{width:700px;height:700px;}


textarea.field_value,textarea.field_value_dummy
{
  font-size:20px;height:60px;width:500px;padding:6px 10px 8px 10px;
  -webkit-transition: border linear .2s,box-shadow linear .2s;
  -moz-transition: border linear .2s,box-shadow linear .2s;
  -o-transition: border linear .2s,box-shadow linear .2s;
  transition: border linear .2s,box-shadow linear .2s;
  resize:none;
  color:black;
  padding: 2px 10px;
}


.field_value,.field_value_dummy
{
  width:350px;
  height:30px;border:4px solid #d6d6d6;
  font-family:'Open Sans Condensed', sans-serif;
  font-size:20px;
  padding: 2px 10px;
  transition: border .3s linear,box-shadow linear .3s;
  -webkit-transition: border .3s linear,box-shadow linear .3s;
  -moz-transition: border .3s linear,box-shadow linear .3s;
  -o-transition: border .3s linear,box-shadow linear .3s;
}
.field_value:focus,.field_value_dummy:focus
{
  -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);
  border-color:#02c4db;
}
.field_value.s1{width:35px}
.field_value.short,.field_value_dummy.short{width:120px;}
.field_value.phone,.field_value.zipcode{width:110px}
.field_value.float,.field_value_dummy.float{width:110px}
.field_value.dob,.field_value_dummy.dob,.field_value.date{width:110px}
.field_value[type='number'],.field_value_dummy[type='number']{width:110px}
.field_value.long,.field_value_dummy.long{width:400px}
.field_value.middle{width:200px}
.inputframe{position:relative;}
.inputframe[type='score']{border:4px solid transparent;}
.inputframe input.file_button{
  position: absolute;
  opacity: 0;
  transform: scale(2);
  cursor: pointer;
  top: 13%;
  left: -100%;
}
.inputframe.error .field_value,.inputframe.error .field_value_dummy,.inputframe.error .field-select .ddind,
.inputframe[type='score'].error
{
  -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,0,0,0.6);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,0,0,0.6);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,0,0,0.6);
  border-color:red;
}
.chk_frame
{
  float:left;
  cursor:pointer;
  margin: 10px 0;
}
.chk_frame .chk_bt
{
  position:relative;
  float:left;
  display:block;
  border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;
  background-color:#d6d6d6;
  width:38px;height:38px;
}
.chk_frame:focus .chk_bt{background-color:#02c4db;}
.error .chk_frame .chk_bt{background-color:red;color:red;}
.chk_frame .chk_bt:after
{
  content:"";
  border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;
  background-color:white; 
  width:30px;height:30px;
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  right:0;
  margin: auto;
}
.chk_frame.checked .chk_bt:after{background-color:#02c4db; border:4px white solid;width:22px;height:22px;}
.chk_frame .chk_txt
{
  display:block;
  width:auto;
  line-height:38px;
  height:38px;
  margin:0 10px;  
  float:left;
}
.error .chk_frame .chk_txt{color:red;}
.field-select{padding-right:24px;width:156px;position:relative;-webkit-user-select: none;-khtml-user-select: none;  -moz-user-select: none;  -o-user-select: none;  user-select: none;}
.field-select.large{width:500px;}
.field-select .ddind{
  display: block;
  background-color: white !important;
  /*position: absolute;*/
  width: 100%;
  font-size: 20px;
  border: 4px solid #D6D6D6;
  color: #848484;
  height: 34px !important;
  line-height: 34px;
  padding-left: 12px;
  padding-right: 12px;
  text-transform: uppercase;
  background:url("../images/arrowdown_gray.png") no-repeat right 10px center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  cursor:pointer;
  -webkit-transition: border linear .2s,box-shadow linear .2s;
  -moz-transition: border linear .2s,box-shadow linear .2s;
  -o-transition: border linear .2s,box-shadow linear .2s;
  transition: border linear .2s,box-shadow linear .2s;
}
.field-select .ddind.bgar{background:url("../images/arrowdown_white.png") no-repeat right 10px center;}
.field-select .ddind:focus{-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);border-color:#02c4db;}
.field-select ul{
  display: none;
  top: 38px;
  background-color:white;position:absolute;
  border: 4px solid #D6D6D6;
  color:#848484;width:100%;
  -moz-box-shadow:4px 5px 7px 0px #777;
  -webkit-box-shadow:4px 5px 7px 0px #777;
  box-shadow:4px 5px 7px 0px #777;
  z-index: 999;
  max-height:400px;overflow: auto;
}
.field-select ul a{
  font-size: 20px;
  height: 34px !important;
  line-height: 34px;
  padding-left: 12px;
  padding-right: 12px;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  display:block;
  color:#848484;
}
.field-select ul[name='priority'] a[rep='0']
{
  background-color:#58ac3b;
  color:white;
}
.field-select ul[name='priority'] a[rep='1']
{
  background-color:#F8d05f;
  color:white;
}
.field-select ul[name='priority'] a[rep='2']
{
  background-color:#F64A16;
  color:white;
}

.field-select ul a.select{background-color:#007fa3 !important;color:white !important;}

.appendico{
  display:block;
  width:35px;
  height:35px;
  float:right;
  cursor:pointer;
}
.appendico#plus
{
  background:url("../images/+.png") no-repeat center;
  background-size:100%;
}
.appendico#minus
{
  background:url("../images/-.png") no-repeat center;
  background-size:100%;
}




#master_info_frame,#detail_info_frame
{
  min-width:1024px;
  -webkit-user-select: none;-khtml-user-select: none;  -moz-user-select: none;  -o-user-select: none;  user-select: none;
}
#detail_info_frame{display:none;}
.navi-tabs-frame
{
  width:20%;
  float:left;
}
.summary-frame
{
  width:80%;
  background-color: #4c4f54;
  float:left;
  color:white;
}
.item-holder {padding-top:25%;position: relative;}
.navi-tabs-frame .item-holder {padding-top: 100%;}
.navi-tabs-frame .d-navi-tabs{
  display:block;
  float:left; 
  width:50%;
}
.navi-tabs-frame .d-navi-tabs[rank="0"]
{
  background: #f4d03f;
}
.navi-tabs-frame .d-navi-tabs[rank="1"]
{
  background: #f6ab00;
}
.navi-tabs-frame .d-navi-tabs[rank="2"]
{
  background: #f9690e;
}
.navi-tabs-frame .d-navi-tabs[rank="3"]
{
  background: #e74c3c;
}
.navi-tabs-frame .d-navi-tabs[rank="4"]
{
  background: #e87e04;
}

.navi-tabs-frame .d-navi-tabs .item-holder {padding-top: 100%;}
.navi-tabs-frame .d-navi-tabs .item-frame{cursor:pointer;width:100%;height:100%;position:absolute;top: 0;left: 0;overflow:hidden;}
.navi-tabs-frame .d-navi-tabs .item-frame span{
  display:block;color:white;font-size:1.5vw;line-height:10vw;
  position: absolute;
  left: 0;
  width: 100%;
}
.navi-tabs-frame .d-navi-tabs.active .item-frame:after
{
  content:"";
  width:100%;height:100%;
  left:0;top:0;
  position:absolute;
  background-color: white;
  opacity: 0.6;
}
.navi-tabs-frame .d-navi-tabs .item-frame span.ICO
{
  background-repeat: no-repeat;
  background-position: center;
  height: 100%;
  top: 0%;
  background-size: 50%;
  -webkit-transition: all .5s cubic-bezier(.23,1,.32,1);
  transition: all .5s cubic-bezier(.23,1,.32,1)
}
.navi-tabs-frame .d-navi-tabs .item-frame span.TXT
{
  left: 100%;
  text-align:center;
  -webkit-transition: all .5s cubic-bezier(.23,1,.32,1);
  transition: all .5s cubic-bezier(.23,1,.32,1)
}
.navi-tabs-frame .d-navi-tabs .item-frame:hover span.ICO,
.navi-tabs-frame .d-navi-tabs.active .item-frame span.ICO{left:-100%;}
.navi-tabs-frame .d-navi-tabs .item-frame:hover span.TXT,
.navi-tabs-frame .d-navi-tabs.active .item-frame span.TXT{left:0;}
.navi-tabs-frame .d-navi-tabs.active .item-frame span.TXT{color:black;}


.navi-tabs-frame .d-navi-tabs#generalinfo .item-frame span.ICO{background-image:url("../images/generalinfo.png");}
.navi-tabs-frame .d-navi-tabs#traceability .item-frame span.ICO{background-image:url("../images/traceability.png");}
.navi-tabs-frame .d-navi-tabs#equipmentinfo .item-frame span.ICO{background-image:url("../images/equipment.png");}
.navi-tabs-frame .d-navi-tabs#sensorinfo .item-frame span.ICO{background-image:url("../images/sensing.png");}
.navi-tabs-frame .d-navi-tabs#alarminfo .item-frame span.ICO{background-image:url("../images/alarm.png");}
.navi-tabs-frame .d-navi-tabs#productinfo .item-frame span.ICO{background-image:url("../images/productinfo.png");}
.navi-tabs-frame .d-navi-tabs#privilegeinfo .item-frame span.ICO{background-image:url("../images/privilegeinfo.png");}
.navi-tabs-frame .d-navi-tabs#calibrationinfo .item-frame span.ICO{background-image:url("../images/calibrationinfo.png");}
.navi-tabs-frame[role="staff"] .d-navi-tabs#message .item-frame span.ICO{background-image:url("../images/message.png");}
.navi-tabs-frame[role="staff"] .d-navi-tabs#taskinfo .item-frame span.ICO{background-image:url("../images/taskinfo.png");background-size: 35%;}
.navi-tabs-frame[role="staff"] .d-navi-tabs#accountinfo .item-frame span.ICO{background-image:url("../images/accountinfo.png");}
.navi-tabs-frame .d-navi-tabs#chartinfo .item-frame span.ICO{background-image:url("../images/chartinfo.png");}
.navi-tabs-frame .d-navi-tabs#preferenceinfo .item-frame span.ICO{background-image:url("../images/preferenceinfo.png");}
.navi-tabs-frame .d-navi-tabs#transfer .item-frame span.ICO{background-image:url("../images/transfer.png");}
.navi-tabs-frame[role="inventory"] .d-navi-tabs#reconcile .item-frame span.ICO{background-image:url("../images/i_transfer.png");}
.navi-tabs-frame .d-navi-tabs#sell .item-frame span.ICO{background-image:url("../images/sell.png");}
.navi-tabs-frame .d-navi-tabs#alarmrecord .item-frame span.ICO{background-image:url("../images/alarmrecord.png");}
.navi-tabs-frame .d-navi-tabs#reconcile .item-frame span.ICO{background-image:url("../images/reconcile.png");}
.navi-tabs-frame .d-navi-tabs#datatransfer .item-frame span.ICO{background-image:url("../images/datatransfer.png");}

.summary-frame .selfie-outside
{
  position: absolute;
  width: 15%;
  padding-top: 15%;
  height: 0;
  overflow: hidden;
  left:4%;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  background-color: #02c4db;
  margin-top: 2%;
}
.selfie-outside .photoctrl
{
  position:absolute;
  width:100%;height:100%;
  top:0;left:0;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  background: url("../images/icon_camera.png") black no-repeat 58% 27%;
  opacity: 0.4;
  background-size: 50%;
  display:none;
  cursor:pointer;
}
.selfie-outside .photoctrl.edit
{
  background: url("../images/selfie_icon_edit.png") black no-repeat 52% 27%;
  background-size: 32%;
}
.selfie-outside .photoctrl .file_button
{
  position: absolute;
  opacity: 0;
  transform: scale(6);
  cursor: pointer;
  top: 26%;
  left: -100%;
}
.selfie-outside .photoctrl span.file_button{
  display: block;
  width: 110px;
  height: 22px;
}
.selfie-outside:hover .photoctrl{display:block;}
.selfie-outside .photoctrl #rm
{
  display: none;
  width: 25%;
  height: 25%;
  background: url("../images/trashcan.png") no-repeat center;
  background-size: 50%;
  position: absolute;
  bottom: 5%;
  left: 36%;
  cursor:pointer;
}
.selfie-outside .photoctrl #rm.edit{display:block;}
.summary-frame .selfie-inside
{
  position: absolute;
  top:0;
  width: 100%;
  height: 100%;
  color: white;
  background-color: #02c4db;
  font-size: 10vw;
  line-height: 11vw;
  text-align: center;
}
.summary-frame .selfie-outside[rel="octet"]
{
  overflow:initial;background-color:transparent;
}
.summary-frame .selfie-outside[rel="octet"] .selfie-inside{background-color:transparent;}
.summary-frame
{
  -webkit-user-select: text;
  -khtml-user-select: text;
  -moz-user-select: text;
  -o-user-select: text;
  user-select: text;
}

.summary-frame #last_date_logon
{
  position:absolute;
  bottom: 16%;
  left: 1%;
  font-size: 1.2vw;
  right: 79%;
  text-align: center;
}
.summary-frame #info_one
{
  font-size: 5vw;
  position:absolute;
  top: 2%;
  left: 22%;
}
.summary-frame #info_two
{
  font-size: 1.5vw;
  position: absolute;
  top: 36%;
  left: 22%;
}
.summary-frame #info_three
{
  font-size: 1.5vw;
  position: absolute;
  top: 46%;
  left: 22%;
}
.summary-frame #info_four
{
  font-size: 1.5vw;
  position: absolute;
  top: 56%;
  left: 22%;
}
.summary-frame #info_five
{
  font-size: 1.5vw;
  position: absolute;
  top: 66%;
  left: 22%;
}
.summary-frame #info_six
{
  font-size: 1.5vw;
  position: absolute;
  top: 76%;
  left: 22%;
}
#detail_info_frame .detail-data-frame
{
  padding-top: 20%;
  margin-left: 20%;
}
#detail_info_frame .detail-data-frame .inside-frame
{
  background-color:white;
  position:absolute;left:0;top:0;
  width:100%;
  padding: 40px 0;
  -moz-box-shadow:0px 2px 13px 0px #000;
  -webkit-box-shadow:0px 2px 13px 0px #000;
  box-shadow:0px 2px 13px 0px #000;
  margin-bottom: 10px;
}
#detail_info_frame .detail-data-frame #detail_header_tab
{
  z-index:1;
  position: absolute;
  top: 0px;
  width: 100%;
}
#detail_info_frame .detail-data-frame .detailctrltab
{
  display:block;float:left;
  height:40px;margin-right:1px;
  width:100px;
  font-size:16px;
  color:white;
  text-align:center;
  line-height:40px;
  background-color:orange;
}
#detail_info_frame .detail-data-frame .inside-frame .infotable{margin-left:40px;}
#detail_info_frame .info-save
{
  z-index: 10;
  position:absolute;
  right:0px;
  top:0px;
  height:0px;
  overflow:hidden;
  -webkit-transition: height .5s cubic-bezier(.23,1,.32,1);
  transition: height .5s cubic-bezier(.23,1,.32,1)
}
#detail_info_frame .info-save.active{height:60px;}
#detail_info_frame .info-save .bt
{
  float:left;
  margin:1px;
  width:160px;
  height:60px;
  line-height:60px;
  font-size:25px;
  color:white;
  font-weight:bold;
  text-align:center;
  background-color:cornflowerblue;
}
.norecordind{
  font-size: 35px;
  background-color: #777;
  text-align: center;
  color: white;
  height: 90px;
  width: 260px;
  line-height: 90px;
  display: block;
  margin: 0 auto;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}
.inside-frame div.h1
{
  text-align: left;
  background-color: #4c4f54;
  color: white;
  height: 40px;
  font-size: 24px;
  line-height: 40px;
  padding-left:20px;
  margin-bottom:1px;
}
.inside-frame div.h2
{
  text-align: left;
  background-color: #02c4db;
  color: white;
  height: 60px;
  font-size: 36px;
  line-height: 60px;
  padding-left:20px;
  margin-bottom:1px;
}
.chart-frame 
{
  float:left;width:97%;padding:10px;position: relative;
}
.chart-frame .header .ind
{
  display:block;
  float:left;
  color:white;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  text-align:left;
  padding:0 5px;
  font-size: 25px;
  margin-left:10px;
  background-color:#2594C5;
}
.chart-frame[order='1'] .header .ind
{
  background-color:#c00000; 
}
.chart-frame[order='2'] .header .ind
{
  background-color:#90ed7d; 
}
.chart-frame[order='3'] .header .ind
{
  background-color:#2b908f; 
}
.chart-frame[order='4'] .header .ind
{
  background-color:#f45b5b; 
}
.chart-frame[order='5'] .header .ind
{
  background-color:#91e8e1; 
}
.chart-frame[order='6'] .header .ind
{
  background-color:#79b018; 
}
.chart-frame[order='7'] .header .ind
{
  background-color:#f5e425; 
}
.chart-frame[order='8'] .header .ind
{
  background-color:#c5e425; 
}
.chart-frame[order='9'] .header .ind
{
  background-color:#355425; 
}
.chart-frame[order='10'] .header .ind
{
  background-color:#2594C5; 
}
#navigator_frame
{
  width:900px;
  margin:0 auto;
}
#navigator_frame .navi_col{float:left;}
#navigator_frame .unit
{
  width:300px;
  height:190px;
  margin-bottom:110px;
  position:relative;
}
#navigator_frame .unit .enter_ind
{
  background: url(../images/enter_w.png) no-repeat center;
  background-size: 40px;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 67px;
  right: 19px;
  display: block;
  cursor: pointer;
  z-index: 1;
}
#navigator_frame .unit .back_ind
{
  background: url(../images/navi_back_w.png) no-repeat center;
  background-size: 40px;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 35px;
  left: 54px;
  display: block;
  cursor: pointer;
  z-index: 1;
  transform: rotate(270deg);
}
#navigator_frame .unit .fname
{
  margin:20px auto 0 auto;
  text-align: center;
  color:#eee;
  width:100%;
  display:block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
#navigator_frame .navi_col[ord='1'] .unit .fname
{
}
#navigator_frame .unit .mug-outside
{
  width:165px;
  height:165px;
  margin:0 auto;
  float:none;
  cursor:pointer;
}
#navigator_frame .unit .mug-outside .mug-inside
{
  background:url("../images/buildingbg_o.png") no-repeat 0 center;
  background-size: 172%;
}
#navigator_frame .navi_col[ord='1'] .mug-outside
{
  margin-top:100px;
}
#navigator_frame .navi_col[ord='2'] .mug-outside
{
}

#searchresultframe
{
  position:absolute;
  top:38px;
  -moz-box-shadow: 0px 2px 13px 0px #000;
  -webkit-box-shadow: 0px 2px 13px 0px #000;
  box-shadow: 0px 2px 13px 0px #000;
  background-color: #777;
  z-index:1;
}
#searchresultframe .item
{
  display:block;
  width:auto;
  cursor:pointer;
  color:white;
  padding:10px;
}
#searchresultframe .exist.item:hover,#searchresultframe .exist.item:active
{
  background-color: #4370cc;
}
.appendeditem
{
  height: 35px;
  line-height: 35px;
  margin: 9px 0;
}
div.bingo
{
  display: block;
  float: left;
  width:auto;
  height:auto;
  text-align: center;
  background-color: #ddd;
  padding:8px;
  margin: 2px;
  color: #666;
  cursor:pointer;
  position:relative;
  border: 3px solid transparent;
  font-size:24px;
  
}
div.bingo div{
  display:table-cell;
  vertical-align:middle;
  width:auto;height:auto;
}
td.bingo{padding: 15px;}
div.bingo.select{    
/*  color: whitesmoke;
  background-color: lightskyblue;*/
  font-weight: bold;
  border: 3px solid orange;
}
div.bingo.positive{color:#58ac3b}
div.bingo.negative{color:#F64A16}
div.bingo.active
{
  color: whitesmoke !important;
}
div.bingo.active
{
  background-color: lightskyblue;
}
div.bingo.negative.active
{
  background-color: #ed6e40;
}
.bingo_detail
{
  display:none;
}
.bingoadd{
  color:white;
  position:relative;
}
.bingoadd .addnew_bt{position: absolute;}
.bingoadd .w-blk{
  float: left;
  background-color: #02c4db;
  color: white;
  height: 52px;
  line-height: 52px;
  width: 75px;
  margin-left: 15px;
  padding-right: 16px;
  border-radius: 10px;
  cursor:pointer;
}
.bingoadd:hover .w-blk{background-color: #408bc9;}
.bingoadd:hover .addnew_bt{ 
  -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    background-color: #408bc9;
}
.title_bt
{
  background-color:#f9690e;
  width:68px;
  height:68px;
  line-height:68px;
  display:block;
  float:left;
  color:white;
  font-size:16px;
  font-weight:400;
  text-align:center;
  position:relative;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
.detail-data-frame[role='facility'] .title_bt{width:120px;}
.title_bt.select,.title_bt:hover{width:100px;height:95px;line-height:95px;font-size:20px;}
.detail-data-frame[role='facility'] .title_bt.select,.detail-data-frame[role='facility'] .title_bt:hover{width:140px;}
.title_bt.s
{
  background-color:#f6ab00;
}
.title_bt:after
{
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  border: 0px solid white;
  opacity: 1;
  box-sizing: border-box;
}
.title_bt.select:after,.title_bt:hover:after
{
  border: 4px solid white;
  opacity:1;
}
.detail-data-frame[role='facility'] .title_bt.select:after,.detail-data-frame[role='facility'] .title_bt:hover:after{border: 1px solid white;}

.group_check
{
  margin-bottom:1px;
}
.group_check .gc_header
{
  position:relative;cursor:pointer;
}
.group_check .gc_header .gc_ind{display:block;color: #aaa;background-color: #ddd;padding: 12px;font-size: 20px;}
.group_check .gc_body{display:none;}
.group_check .gc_header.active .gc_ind
{
  color: whitesmoke;
  background-color: lightskyblue;
}
div.score
{
  background-image:url("../images/score.png");
  background-repeat:no-repeat;
  height:73px;
  width:73px;
  float:left;
  background-size:362px;
  cursor:pointer;
  border-radius:50%;
  border:3px solid black;
  margin:20px;
}
div.score[val='0']
{
  background-position:-143px -19px;
}
/*div.score[val='1']
{
  background-position: -143px -19px;
}*/
div.score[val='1']
{
  background-position: -264px -19px;
}
/*div.score[val='3']
{
  background-position: -22px -19px;
}*/
div.score[val='2']
{
  background-position: -143px -132px;
}

div.score[val='0'].select
{
  background-color:#F64A16;
}
/*div.score[val='1'].select
{
  background-color: orange;
}*/
div.score[val='1'].select
{
  background-color: #F8d05f;
}
/*div.score[val='3'].select
{
  background-color: lightgreen;
}*/
div.score[val='2'].select
{
  background-color: #58ac3b;
}
#TR_detail {padding-top:20px;}
.trh
{
  border-bottom: 1px solid #d6d6d6;
  cursor: pointer;
  height: 60px;
  font-size: 26px;
  line-height: 80px;
  background-color: gray;
  color: white;
  position:relative;
  margin-bottom:2px;
}
.trh.open{background-color: orange;}
.trh span 
{
  display:block;
  float:left;
  margin:0 10px;
  height:60px;
}
.trh span.priority
{
  height:0px;
  width: 50px;
  border-right: 25px solid transparent;
  position:absolute;
  left:-10px;
}
.trh span.priority[rank='0']{border-top: 25px solid #58ac3b;}
.trh span.priority[rank='1']{border-top: 25px solid #F8d05f;}
.trh span.priority[rank='2']{border-top: 25px solid #F64A16;}

.trh span.score
{
  background-image:url("../images/score.png");
  background-repeat:no-repeat;
  height:40px;
  width:40px;
  float:left;
  background-size:214px;
  cursor:pointer;
  border-radius:50%;
  border:3px solid white;
  margin-top:8px;
}
.trh span.score[rank='0']{background-position:-87px -14px;background-color:#F64A16;}
.trh span.score[rank='1']{background-position:-158px -14px;background-color: #F8d05f;}
.trh span.score[rank='2']{background-position:-87px -81px;background-color: #58ac3b;}
.STR{padding-bottom:20px;display:none;}
.STR .behavior_ind{    
  display: block;
  color: white;
  text-align: center;
  border-radius: 20px;
  width: 98%;
  margin: 10px auto;
}
.STR .behavior_ind.positive{background-color: lightskyblue;}
.STR .behavior_ind.negative{background-color: #ed6e40;}
.STR .desblock
{
  float:left;
  margin:5px;
  border:1px solid #d6d6d6;
  width: 300px;
  height: 200px;
  padding: 10px;
  overflow: auto;
}
.STR .attach{
  background: url(../images/attach.png) no-repeat 0 3px;
  background-size: 25px;
  padding-left: 30px;
}
#newcomment
{
  position:relative;
}
.comment_frame{
  position:relative;
}
.comment_frame #controller{
  height: 40px;
  width:527px;
  margin-left:94px;
}
.comment_frame textarea
{
  margin: 20px 0 0 30px;
}
.comment_frame .appendico
{
  display: block;
  width: 26px;
  height: 26px;
  float: left;
  cursor: pointer;
  margin-left: 8px;
}
.viewcomment{
  border-bottom: 1px solid #d6d6d6;
  margin-bottom: 15px;
}
.viewcomment .attach
{
  background-size: 18px;
  padding-left: 23px;
}

.s-subscriber
{
  float: left;
  width: 280px;
}
.s-subscriber .namearea
{
}
.s-subscriber .namearea .name
{
  display: block;
  color: black;
  font-size: 20px;
  float: left;
  margin: 31px 0 0 12px;
}
.s-subscriber .namearea .check
{
  width: 20px;
  border: 1px solid;
  display: block;
  height: 20px;
  float: left;
  margin-top: 39px;
  position:relative;
  cursor:pointer;
}
.s-subscriber .namearea .check.checked
{
  background:url("../images/checkicon.png") no-repeat center center;
  background-size: 100%;
}
.s-subscriber .namearea .check.checked.w
{
  background:url("../images/checkicon_w.png") no-repeat center center;
  background-size: 100%;
}
span.scinv.on{
  animation: blinker 2s linear infinite;
}@keyframes blinker {
  50% {
    opacity: 0;
  }
}
.msgframe
{
  padding-left: 40px;
  font-size: 20px;
  background-color: #777;
  color: white;
  margin-bottom: 40px;
}
.msgframe .Harea
{
  
}
.msgframe .msgcontent
{
  background-color: black;
  width: 488px;
  padding: 20px;
  border-radius: 10px;
  margin: 10px 0;
}
.msgframe .Harea .hi
{
  float: left;
  background-color: red;
  color: white;
  padding: 10px;
  border-radius: 10px;
  margin-top: 20px;
}
.msgframe .bt
{
  width: 150px;
  height: 40px;
  background-color: cornflowerblue;
  text-align: center;
  display: block;
  line-height: 40px;
  margin: 5px 0;
  cursor: pointer;
}
.reporttable
{
  font-size:18px;
  table-layout:fixed;
  border-collapse: collapse;
  margin-left: 40px;
}
.reporttable td
{
  border: 1px solid #777;
  padding: 0 5px;
  text-align: center;
}
#pdfoutput
{
  width:210mm;
  height:297mm;
}
#report_frame{width:1024px;margin:0 auto;}
.rd_frame
{
  margin: 25px 10px;
  border: 1px solid;
  padding: 10px;
}
.rd_frame .checkitem
{
  float:left;
  display: flex;
  align-items: center;
}
.aopframe{
  border-bottom: 2px solid #d6d6d6;
}
.aopdetail{
  border-bottom:1px solid #777;padding:5px;
}
.aopitem{padding:0 5px;}
.append_table
{
  
}
.append_table td{text-align:left;padding:10px;font-size:20px;vertical-align: middle;}
.agenda_card{
  position:relative;
  width:800px;
  background-color:white;
  margin:10px auto 20px auto;
  border-radius:20px;
  -moz-box-shadow:11px 11px 16px -4px rgba(0,0,0,1);
  -webkit-box-shadow:11px 11px 16px -4px rgba(0,0,0,1);
  box-shadow:11px 11px 16px -4px rgba(0,0,0,1);
  font-size:20px;
  color:white;
  padding: 15px;
  background-color:cornflowerblue;
}
.agenda_card .priority_flag
{
  position:absolute;
  width:100px;
  height:30px;
  right:-35px;top:0px;
}
.agenda_card .priority_flag span{display:block;float:left;}

.agenda_card .priority_flag[pr='0'] .right{border: 15px solid #58ac3b;border-right: 12px solid transparent;}
.agenda_card .priority_flag[pr='0'] .left{border: 15px solid #58ac3b;border-left: 15px solid transparent;border-top: 15px solid transparent;}
.agenda_card .priority_flag[pr='0'] .middle{width:40px;height:30px;background-color:#58ac3b;}

.agenda_card .priority_flag[pr='1'] .right{border: 15px solid #F8d05f;border-right: 12px solid transparent;}
.agenda_card .priority_flag[pr='1'] .left{border: 15px solid #F8d05f;border-left: 15px solid transparent;border-top: 15px solid transparent;}
.agenda_card .priority_flag[pr='1'] .middle{width:40px;height:30px;background-color:#F8d05f;}

.agenda_card .priority_flag[pr='2'] .right{border: 15px solid #F64A16;border-right: 12px solid transparent;}
.agenda_card .priority_flag[pr='2'] .left{border: 15px solid #F64A16;border-left: 15px solid transparent;border-top: 15px solid transparent;}
.agenda_card .priority_flag[pr='2'] .middle{width:40px;height:30px;background-color:#F64A16;}




.agenda_card .imgframe
{
  width:170px;height:170px;
}
.agenda_card .imgframe img{width:100%;}
.agenda_card td{vertical-align:top;}
.agenda_card div.detail
{
  margin-top:5px;
  padding:5px;
  height:120px;
  overflow: auto;
  background-color:white;color:black;
}

.chart_msg
{
  position:absolute;
  width:300px;min-height:100px;
  z-index:999;top:0px;left:0px;
  background-color: rgba(0,0,0,0.9);
  border: 3px #bbb solid;
  border-radius:3%;
  padding-bottom: 3px;
}
.chart_msg #header
{
  padding:10px;
  font-size:28px;
  color:white;
  font-weight:bold;
}
.chart_msg *{display:block;}
.chart_msg #close
{
  position: absolute;
  right:-22px;
  top:-22px;
  width:40px;height:40px;
  background-image:url("../images/close_red.png");
  background-position:center;
  background-repeat:no-repeat;
  background-size:100%;
  cursor:pointer;
}
.chart_msg #addnote
{
  background-image:url("../images/addnote.png");
  background-position:center;
  background-repeat:no-repeat;
  background-size:100%;
  cursor:pointer;
  position:absolute;
  width:50px;height:50px;
  right: 20px;
  top: 36px;
}
#newnoteframe{
  display:none;
  position:relative;
}
#newnoteframe textarea
{
  height: 100px;
  width: 284px;
  resize: none;
  overflow: auto;
  font-size: 20px;
  padding: 5px;
  color: #333;
  margin-left: 2px;
}
.chart_msg #notecontent{
  max-height:400px;
  overflow:auto;
}
.chart_msg .notecontent{
  background: white;
  font-size: 20px;
  padding: 10px;
  margin-top:5px;
}