@charset "UTF-8";
/* CSS Document */

/* パネル */
.panel {
  position: absolute;
  background: #ffffff;
  width: 360px;
  height: 84px;
  border-radius: 8px;
}
#panel_1 {
  left: 9px;
  top: 1px;
}
#panel_2 {
  left: 373px;
  top: 1px;
}
#panel_3 {
  left: 9px;
  top: 89px;
}
#panel_4 {
  left: 373px;
  top: 89px;
}
#panel_5 {
  left: 9px;
  top: 177px;
}
#panel_6 {
  left: 373px;
  top: 177px;
}
#panel_7 {
  left: 9px;
  top: 265px;
}
#panel_8 {
  left: 373px;
  top: 265px;
}



/* アイコン */
.panel .icon {
  position: absolute;
  left: 7px;
  top: 17px;
  width: 50px;
  height: 50px;
  background: url(../img/s_32i1_icbase_off.png) no-repeat;
}
.panel .icon.on {
  background: url(../img/s_32i1_icbase_on.png) no-repeat;
}

.icon_img {
  width: 100%;
  height: 100%;
  background-position:center;
  background-repeat:no-repeat;
}
.icon_img_ecocute       {background-image: url(../img/ic_kb_ecocute.png);}
.icon_img_enefarm       {background-image: url(../img/ic_kb_enefarm.png);}
.icon_img_etc_kiki      {background-image: url(../img/ic_kb_etc_kiki.png);}
.icon_img_li_etc        {background-image: url(../img/ic_kb_li_etc.png);}
.icon_img_rangefood     {background-image: url(../img/ic_kb_rangefood.png);}
.icon_img_se_aircleaner {background-image: url(../img/ic_kb_se_aircleaner.png);}
.icon_img_se_aircon     {background-image: url(../img/ic_kb_se_aircon.png);}
.icon_img_se_yukadan    {background-image: url(../img/ic_kb_se_yukadan.png);}
.icon_img_shutter       {background-image: url(../img/ic_kb_shutter.png);}
.icon_img_takuhai       {background-image: url(../img/ic_kb_takuhai.png);}
.icon_img_wsensor       {background-image: url(../img/ic_kb_wsensor.png);}
.icon_img_call          {background-image: url(../img/ic_kb_call.png);}
.icon_img_ev            {background-image: url(../img/ic_kb_ev.png);}



/* 機器名 */
.lighting_title {
  position: absolute;
  left: 63px;
  top: 6px;
  width:296px;
  height:20px;
  line-height:20px;
  font-size: 20px;
  font-weight: bold;
}



/* 機器状態 */
.lighting_state {
  position: absolute;
  left: 63px;
  top: 31px;

  padding-top:1px;
  padding-bottom:3px;
  line-height:42px;
  font-size:20px;
  font-weight:bold;
  color: #8b959c;
}
.lighting_state.on {
  color: #47856D;
}
.lighting_state.off {
  color: rgba(0,0,0,0.6);
}



/* 機器ボタン */
.lighting_switch {
  position: absolute;
  left: 131px;
  top: 31px;
}
.lighting_switch .button_text {
  font-size:20px !important;
}

.lighting_control {
  position: absolute;
  left: 211px;
  top: 31px;
}
.lighting_control.disable {
  display:none;
}

.lighting_control .button_text {
  line-height:32px !important;
  font-size:20px !important;
}


.per_bar {
  position: absolute;
  top: 29px;
  left: 6px;
  width: 125px;
  height: 7px;
  border:#fff solid 1px;
  background:#CCCCCC;
}
.per_bar_val {
  width: 50px;
  height: 7px;
  background:#47856D;
}
.per_bar.lv_0 > .per_bar_val {
  width: 0;
}
.per_bar.lv_1 > .per_bar_val {
  width: 25px;
}
.per_bar.lv_2 > .per_bar_val {
  width: 50px;
}
.per_bar.lv_3 > .per_bar_val {
  width: 75px;
}
.per_bar.lv_4 > .per_bar_val {
  width: 100px;
}
.per_bar.lv_5 > .per_bar_val {
  width: 125px;
}
.per_bar.off {
  display:none;
}


/* 上下スクロール */
.scroller {
  position: absolute;
  width: 54px;
  height: 367px;
  top: 0;
  left: 742px;
}
.scroll_bottom {
  top: 303px;
}
.scroll_bar_wrap {
  height: 249px;
}

/* 更新ボタン */
#button_update {
  position: absolute;
  left: 355px;
  top: 10px;
}

/* 中止ボタン */
#popup_button_cancel {
  left: 285px;
  top: 291px;
  position: absolute;
}

#button_100 { top: 83px; left: 487px; }
#button_80 { top: 83px; left: 367px; }
#button_60 { top: 83px; left: 247px; }
#button_40 { top: 83px; left: 127px; }
#button_20 { top: 83px; left: 7px; }

.button {
	position: absolute;
}