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

/* タブ */
#page {
  background:url(../img/bg_tab.png) no-repeat!important;
}
#tab-area .tab-set-2 .tab-all {
    background-image: url(../img/tab_kikikon_1.png);
}
#tab-area .tab-set-2 .tab-desc-1 {
    background-image: url(../img/tab_kikikon_2.png);
}

/* パネル */
.panel {
  position: absolute;
  background: #ffffff;
  width: 330px;
  height: 170px;
  border-radius:8px;
}
#panel_1 {
  left: 65px;
  top: 1px;
}
#panel_2 {
  left: 401px;
  top: 1px;
}
#panel_3 {
  left: 65px;
  top: 176px;
}
#panel_4 {
  left: 401px;
  top: 176px;
}

/* アイコン */
.panel .icon {
  position: absolute;
  left: 9px;
  top: 9px;
  width: 66px;
  height: 66px;
  background: url(../img/s_32_1.png) no-repeat;
}
.panel .icon.on {
  background: url(../img/s_32_2.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_blind         {background-image: url(../img/ic_kb_blind.png);}
.icon_img_denkijou      {background-image: url(../img/ic_kb_denkijou.png);}
.icon_img_takuhai       {background-image: url(../img/ic_kb_takuhai.png);}
.icon_img_call          {background-image: url(../img/ic_kb_call.png);}
.icon_img_ev            {background-image: url(../img/ic_kb_ev.png);}
.icon_img_jukeiki       {background-image: url(../img/ic_kb_kasaikeihouki.png);}
.icon_img_heatexchanger {background-image: url(../img/ic_kb_netsukokan.png);}

/* パネルボタン */
.panel > .button_rt {
  position: absolute;
  right: 23px;
  top: 32px;
}

.panel > .ev_assist_rapper > .button_rt2 {
  position: absolute;
  right: 10px;
  top: 50px;
}

.panel > .button_ques {
  position: absolute;
  right: 7px;
  top: 35px;
}
.panel > .button_ques > .button_text {
  font-size:25px;
}

/* 機器名 */
.kiki_title {
  position: absolute;
  left: 80px;
  width: 250px;
  top: 10px;
  height:20px;
  line-height:20px;
  font-size: 20px;
  font-weight: bold;
}

body.nf .kiki_title, 
body.aiseg .kiki_title {
    font-size:16px;
}

/* 機器数値 */
.kiki_val {
  position: absolute;
  left: 81px;
  top: 35px;
}
.line2 + .kiki_val {
  top: 59px;
}
.kiki_val > div {
  position:relative;
  left:0;
  top:0;
  height: 18px;
  line-height: 18px;
}
.kiki_val > div > span {
display:inline-block;
}
.kiki_val > div > .w_6em {
width:6em;
}

.kiki_val > .caution {
  margin-top:-3px;
  margin-left:1px;
  padding-left:34px;
  width:100%;
  height:30px;
  line-height:30px;
  font-size: 16px;
  background: url(../img/s_32_9.png) 1px center no-repeat;
}
.kiki_val > div > .color_red {
  color: #BF4840;
}
.kiki_val > div > .color_gray {
  color: #8b959c;
}

/* モード表示 */
.kiki_mode {
  position: absolute;
  right: 7px;
  top: 7px;
  width:111px;
  height: 24px;
  line-height: 24px;
  text-align:center;
  color:#fff;
  background: url(../img/s_32_12.png) no-repeat;
}
.kiki_mode.on {
  background: url(../img/s_32_8.png) no-repeat;
}

/* バッテリー残量 */
.battery_val {
  position: absolute;
  right: 0;
  top: 0;
  width:49px;
  height: 39px;
  background: url(../img/s_32_battery.png) no-repeat;
  display: none;
}
.battery_val.lv-0 {
  background-position:0 0;
  display: block;
}
.battery_val.lv-1 {
  background-position:0 -39px;
  display: block;
}

/* 機器ボタン上テキスト */
.kiki_state {
  position: absolute;
  left:8px;
  top:92px;
  height:30px;
}

.kiki_state_rt {
  position: absolute;
  right: 10px;
  top: 15px;
  text-align:center;
  font-weight:bold;
}

.kiki_state:after {
  display: block;
  clear: both;
  height: 0px;
  visibility: hidden;
  content: ".";
}
.kiki_state > .state {
  float:left;
  margin-top:0;
  margin-right:6px;
  line-height:30px;
  font-size:19px;
  text-align:center;
  font-weight:bold;
}
.kiki_state > .state.line2 {
  margin-top:-9px;
  margin-bottom:9px;
  line-height:18px;
  font-size:16px;
}
.kiki_state > .state:last-child {
  margin-right:0;
}
.kiki_state > .state.off {
  color: rgba(0,0,0,0.6);
}
.kiki_state > .state.on {
  color: #47856D;
}
.kiki_state > .bath_disp_on {
  visibility: visible;
}
.kiki_state > .bath_disp_off {
  visibility: hidden;
}

.kiki_state > .caution {
  margin-top:-3px;
  margin-left:1px;
  padding-left:34px;
  width:100%;
  height:30px;
  line-height:30px;
  font-size: 16px;
  background: url(../img/s_32_9.png) 1px center no-repeat;
}
.kiki_state > .state.ua_sf {
  font-size:16px;
}
.kiki_state > .blue {
  color: #4E6DB3;
}
.kiki_state > .coral {
  color: #D97126;
}
.kiki_state > .black {
  color: black;
}
.kiki_state > .gray {
  color: gray;
}

/* 機器ボタン */
.kiki_button {
  position: absolute;
  left:9px;
  top:120px;
}
.kiki_button:after {
  display: block;
  clear: both;
  height: 0px;
  visibility: hidden;
  content: ".";
}
.kiki_button > .button {
  float:left;
  margin-right:6px;
}
.button > .button_text.fc_green {
  color: #47856D;
}

.kiki_button > .bath_disp_on {
  visibility: visible;
}
.kiki_button > .bath_disp_off {
  visibility: hidden;
}

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

/* 表示順変更ボタン */
#button_changeorder {
  position: absolute;
  left: 236px;
  top: 10px;
}

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

/* ポップアップ */
.action_class {
	display: inline-block;
	line-height: 33px;
	margin-top: 25px;
	position: absolute;
	left: 283px;
	top: 266px;
}
.yesno.action_class {
	left: 206px;
}
.yesno.action_class > div {
	position: absolute;
}
.yesno.action_class .popup_button_no {
	left: 158px;
}

/* 洗剤残量表示 */
.detergent_val {
  position: absolute;
  right: 0;
  top: 0;
  width:49px;
  height: 39px;
  background: url(../img/s_32_detergent.png) no-repeat;
  display: none;
}
.detergent_val.lv-0 {
  background-position:0 0;
  display: block;
}
.detergent_val.lv-1 {
  background-position:0 -39px;
  display: block;
}

/******************************************************
 * 多デバイス用調整
 ******************************************************/
body.tv .panel > .button_ques > .button_text {
  font-size:30px !important;
}

body.tv .kiki_state_rt,
body.pc .kiki_state_rt {
  line-height: 17px;
}