@charset "utf-8";

*{font-family: 'Pretendard';}

/*왼쪽메뉴*/
html, body{background:#f3f5f6; scroll-behavior: smooth;}
.web_wrap{width: 100%; position: relative; }
.left_menu_acco{width:280px;position:fixed; background:#FFF; height: 100%; box-shadow: 2px 4px 8px 0px #2934390A; transition: 0.3s; left:0;}
.content_box{ padding:30px; padding-left: 310px; box-sizing: border-box; }


.home_logo_box{width:100%; padding:40px;box-sizing: border-box; text-align: center; border-bottom: 1px solid #eee;;}
.menu_icon{width:20px; height:20px; margin-right: 8px; }
.menu_icon img{width: 100%;}
.home_logo{width: 200px; margin:0 auto;}
.home_logo img{width: 100%}

.left_menu_ul{clear: both; width:100%;max-height: 66vh; overflow-y: auto;}
.left_menu_li{width:100%;transition: 0.3s; position: relative; }
.left_menu_btn{display: block;padding:10px; box-sizing: border-box;transition: 0.3s; font-size:18px; font-weight: bold; margin-top: 20px;}
.left_menu_icon{background-position: left 20px top 7px; background-repeat: no-repeat; background-size: 25px; }

.left_menu_icon01{background-image: url(/static/img/web/dashboard.png);}
.left_menu_icon02{background-image: url(/static/img/web/talk.png);}
.left_menu_icon03{background-image: url(/static/img/web/people.png);}
.left_menu_icon04{background-image: url(/static/img/web/notice.png);}
.left_menu_icon05{background-image: url(/static/img/web/system.png);}

.left_menu_li:first-child .left_menu_btn{margin-top: 00px;}
.left_menu_li:last-child .left_menu_btn{padding-bottom: 20px;}

.left_menu_li:last-child .left_menu_line{display: none;}



.left_menu_line{display: none; width: 60px; height: 1px; background:#000; margin-left: 20px}
.menu_active_bg{width:5px; background:#fff;height: 39.5px;position: absolute; top: 0;left: 0;z-index: 1;transition: 0.3s;}

.menu_cont_box{height:calc(100vh - 153px); overflow-y:auto;    justify-content: space-between;}

.logout_btn{display:block; height:50px;  border-radius:12px; transition: 0.3s; width:calc(100% - 40px); margin:0 auto; margin-bottom:40px;
background-image: url('/static/img/web/logout_icon.png'); background-position: left 15px center; background-repeat: no-repeat; background-size: 20px; font-size: 16px;
font-weight:500; color:#727272; line-height: 50px; padding-left: 50px; box-sizing: border-box;}
.logout_btn:hover{background-color:#f3f3f3; color:#000;background-image: url('/static/img/web/logout.png');}



.left_menu_box{padding:20px; box-sizing: border-box;}
.left_menu_titbox{padding:15px 0; box-sizing:border-box; }
.left_menu_tit{font-size:15px; color:#000;}
.left_menu_page_btn{display: block; font-size: 14px; padding:12px; box-sizing: border-box; width:100%; transition: 0.3s; margin-bottom: 8px; border-radius: 8px; font-weight:500;
color:#666;}
.left_menu_page_btn:last-child{margin-bottom: 0;}
.left_menu_page_btn:hover{background-color:#f3f5f6;}





/*로그인*/
.login_wrap{display:block;width:100%; position: relative;}
.login_center_box{display: flex; flex-direction: column; align-items: center;    height: 100vh;justify-content: center;}

.center_tbox img{width:100%;}
.log_cont01{background-color:#333; width:550px; height:100vh; position: absolute; top:0; left:0; background-image: url('/static/img/opener/left_login_bg.png');
background-repeat: no-repeat; background-position: center; background-size: cover;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.center_tbox{width:250px;}

.log_cont02{padding:100px; box-sizing: border-box; padding-left:650px; width:100%;}
.login_logo{width:250px; margin: 0 auto;}
.login_logo img{width: 100%;}
.login_tit_eng{font-size: 26px;  text-align: left; font-weight: 400; margin-bottom: 40px; color:#9ca2a9;}
.login_tit{font-size: 68px;  letter-spacing: 3px; text-align: left;}
.input_title{padding-bottom:8px; font-size: 18px; font-weight: 700;}
.input_title_box{margin-bottom: 15px;}
.input_title_box03{display: flex; flex-direction: row; align-items: center;}
.input_title_box03 .ck_text{padding-left: 8px; cursor: pointer;display:block}

.login_tit_inpbox{max-width: 400px;;}


.log_cont_logo{display: block; width: 250px;}
.log_cont_logo img{ width: 100%;}
.log_cont_txt{font-size: 22px;padding-left: 15px;}
.log_cont_tbox{position: absolute; bottom: 15px; left: 15px;}


/*공통 CSS*/
/* Check */
.ck { width:24px; height:24px; opacity: 0; top:0; left:0; position: absolute;border:0; padding:0; margin:0; cursor: pointer;}
.ck + .ck_btn {
display:inline-block;  background-image: url('/static/img/opener/no_check_icon.png'); background-size:18px; width:24px; height:24px;
 background-repeat: no-repeat; background-position: center; transition: 0.3s;cursor: pointer;}
.ck + .ck_btn_height{height:auto;}
.width_24px{width:24px; height: 24px;;}
.ck:checked + .ck_btn {background-image: url('/static/img/opener/n_check_icon.png');}
.ck_text{font-size: 15px; font-weight:500;; color:#999;}


.hover_table tr{ transition: 0.3s;cursor: pointer;}
.hover_table tr td{ transition: 0.3s;}
.hover_table tr:hover td{ background:#f6f6f6;}


button{box-sizing: border-box; outline: none;  border:0;}

.btn{width:100%; height:40px;border-radius: 8px; display:block; font-size:13px; font-weight:600; padding:0 8px; transition: 0.3s;}

.btn_save{font-size:15px; font-weight: 600;min-width: 60px; min-height: 45px; background:#2e3192; color:#fff;}
.btn_save:hover{background:#0d0f42;} 
.btn_cancel{font-size:15px; font-weight: 600;min-width: 60px; min-height: 45px; background:#fff; color:#999}
.btn_cancel:hover{background:#f3f3f3;} 
.pop_btn_cancel{font-size:15px; font-weight: 600;min-width: 60px; min-height: 45px; background:rgb(204, 204, 204); color:rgb(29, 29, 29)}
.pop_btn_cancel:hover{background:#dfdfdf;} 

.btn_small{width:100%; height:32px;border-radius: 8px; display:block; font-size:12px; font-weight:700; padding:0 8px; transition: 0.3s;}





.right_btn_box{display: inline-block; position: absolute; right:0; top:-2px;}

.btn_blue{background:#dadcff; color:#3c3f70;border: 1px solid #bec0e1;}
.btn_blue:hover{background:#b8bdff;}
.btn_blue:disabled{opacity: 0.5; background:#dadcff !important;}

.btn_gray{background:#f3f3f3; color:#49555a;border: 1px solid #dbdbdb;}
.btn_gray:hover{background:#d5d3d3;}
.btn_gray:disabled{opacity: 0.5; background:#dadcff !important;}

.btn_red{background:#ffb8b8; color:#b94e4e;border: 1px solid #e3b2b2;}
.btn_red:hover{background:#e3acac;}
.btn_red:disabled{opacity: 0.5; background:#dadcff !important;}

.margin_top_20{margin-top: 20px;}
.margin_top_8{margin-top: 8px;}
.margin_top_15{margin-top: 15px;}
.margin_bottom_12{margin-bottom: 12px;}
.margin_bottom_16{margin-bottom: 16px;}
.margin_bottom_20{margin-bottom: 20px;}

.padding_top_20{padding-top: 20px;}
.padding_top_8{padding-top: 8px;}
.padding_bottom_12{padding-bottom: 12px;}
.padding_bottom_16{padding-bottom: 16px;}
.padding_bottom_20{padding-bottom: 20px;}

.margin_right_12{margin-right: 12px;}
.margin_right_btn_12 button{margin-right: 12px;}
.margin_right_btn_12 button:last-child{margin-right:0px;}


.dis_flex_row{display: flex; flex-direction: row;}
.dis_flex_center{align-items: center; }
.dis_flex_right{justify-content: flex-end;}
.dis_flex_bottom_end{align-items: flex-end;}
.dis_flex_end{justify-content: space-between; }
.dis_flex_row_justify{justify-content: center;}
.dis_flex_column{display: flex; flex-direction: column;}
.dis_flex_btn_center{display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
.dis_flex_btn_center_top{display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; }
.dis_inblock{display: inline-block;vertical-align: middle;}
.padding0{padding: 0;}
.padding16{padding: 16px; box-sizing: border-box;}

.gap_10 {gap: 10px;}

.pop_cont_btnbox_right .pop_cont_btn_width{margin-right: 12px;}
.pop_cont_btnbox_right .pop_cont_btn_width:last-child{margin-right: 0;}

.datetimepicker .datepicker-nav .datepicker-nav-previous, .datetimepicker .datepicker-nav .datepicker-nav-next{background:#00d1b2 !important;}

/* 스크롤 */
::-webkit-scrollbar { width: 5.2px; height:5.2px;} /* 스크롤 바 */
::-webkit-scrollbar-track { background-color:#ccc; } /* 스크롤 바 밑의 배경 */
::-webkit-scrollbar-thumb { background: #999; border-radius: 10px; } /* 실질적 스크롤 바 */
::-webkit-scrollbar-thumb:hover { background: #404040; } /* 실질적 스크롤 바 위에 마우스를 올려다 둘 때 */
::-webkit-scrollbar-thumb:active { background: #808080; } /* 실질적 스크롤 바를 클릭할 때 */
::-webkit-scrollbar-button { display: none; } /* 스크롤 바 상 하단 버튼 */


.inp_style{ height: 40px;border-radius: 8px; outline: none; border:1px solid #dbdbdb; min-width: 170px;box-sizing: border-box; width:100%; ;font-family: 'Pretendard', sans-serif;}
.login_inp_style{ height: 50px;border-radius: 4px; outline: none; border:2px solid #dbdbdb; min-width: 170px;box-sizing: border-box; width:100%; 
    font-size: 16px;;font-family: 'Pretendard', sans-serif; font-weight: 500;}
.inp_style.date{background-image:url('/static/img/opener/calendar_icon.png'); background-repeat: no-repeat; background-position: left 8px center; background-size:20px;
padding-left: 36px;}
.inp_style.search{background-image:url('/static/img/opener/search_icon.png'); background-repeat: no-repeat; background-position: left 8px center; background-size:20px;
    padding-left: 36px;}
.sel_style{width:100%; height: 40px;border-radius: 8px; outline: none; border:1px solid #dbdbdb; min-width: 170px;box-sizing: border-box;width:100%;}

.inp_md{min-width: 300px;}
.inp_sm{min-width: 200px;}
.inp_xs{min-width: 50px;}
.sel_sm{min-width: 100px;}
input:read-only{background:#F3F5F6;  border:1px solid #dbdbdb !important;}
/* .inp_style.date:read-only{background-color:#fff;} */
input:disabled{background:#F3F5F6;  border:1px solid #dbdbdb !important; color:#8998A0 !important;}



.setup_title{font-size:14px; font-weight:bold; margin-bottom: 8px;display: block;}

input{font-size:14px; box-sizing: border-box; padding:0 8px;outline: none;}
input:placeholder{color:#ABB4B9; transition:0.3s; font-size:45px;}
input:focus{border-color: #ffacaf;}
select{font-size:14px; box-sizing: border-box; padding:0 12px;
    -webkit-appearance: none; 
   -moz-appearance: none;    
   appearance: none;
background-image:url('/static/img/web/drop_arrow.png'); background-repeat: no-repeat; background-position: right 14px center; background-size:10px;}

select:placeholder{color:#ABB4B9; transition:0.3s; font-size:14px;}
select option{font-size: 18px;}
select:focus{border-color: #ffacaf;}

.textarea_style{ height: 40px;border-radius: 8px; outline: none; border:1px solid #dbdbdb; min-width: 170px;box-sizing: border-box; width:100%; ;
    font-family: 'Pretendard', sans-serif;}


textarea:read-only{background:#F3F5F6;  border:1px solid #e3e3e3 !important;}
textarea:disabled{background:#F3F5F6;  border:1px solid #e3e3e3 !important; color:#8998A0 !important;}
textarea{font-size:14px; box-sizing: border-box; padding:10px 8px;outline: none; display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;}
textarea:placeholder{color:#ABB4B9; transition:0.3s; font-size:45px;}
textarea:focus{border-color: #ffacaf;}



.default_btn{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#ff6066; color:#fff; font-weight:600; width:100% ; 
    padding: 0 12px; box-sizing: border-box; transition: 0.3s;}   

.min_width_btn{min-width: 60px;}
.default_btn:hover{background-color: #fe4047;}

.default_btn:disabled{background-color:#ccc; color:#666;}

.default_ver_btn{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#46b692; color:#fff; font-weight:600; width:100% ; 
    padding: 0 12px; box-sizing: border-box; transition: 0.3s;}   

.default_ver_btn:hover{background-color: #35ab85;}

.default_ver_btn:disabled{background-color:#ccc; color:#666;}

.default_ver02_btn{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#4d24ad; color:#fff; font-weight:600; width:100% ; 
    padding: 0 12px; box-sizing: border-box; transition: 0.3s;}   

.default_ver02_btn:hover{background-color: #391a79;}

.default_ve02r_btn:disabled{background-color:#ccc; color:#666;}

.default_delete_btn{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#ffddde; color:#fe4047; font-weight:600; width:100% ; 
    padding: 0 12px; box-sizing: border-box; transition: 0.3s; border:1px solid #ffa1a4;}    

.default_delete_btn:hover{background-color: #f9bdbf;}

.default_delete_btn:disabled{background-color:#ccc; color:#666;}


.default_btn_big{display: block; border-radius: 4px; border: 0; height:50px; text-align: center; background-color:#ff6066; color:#fff; font-weight:600; width:100% ; 
    padding: 0 8px; box-sizing: border-box; transition: 0.3s; font-size:16px;}
.default_btn_big:hover{background-color: #fe4047;}

.default_btn_big:disabled{background-color:#ccc; color:#666;}

.default_btn_gray{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#f3f5f6; color:#424a4d; font-weight:600; width:100% ; 
    padding: 0 8px; box-sizing: border-box; transition: 0.3s; white-space: nowrap;}
.default_btn_gray:hover{background-color: #ddd;}

.default_btn_gray:disabled{background-color:#ccc; color:#666;}

.default_btn_downgray{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#cdcdcd; color:#545454; font-weight:600; width:100% ; 
    padding: 0 8px; box-sizing: border-box; transition: 0.3s;}
.default_btn_downgray:hover{background-color: #ddd;}

.default_btn_downgray:disabled{background-color:#ccc; color:#666;}

.default_btn_darkengray{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#798185; color:#fff; font-weight:600; width:100% ; 
    padding: 0 8px; box-sizing: border-box; transition: 0.3s;}
.default_btn_darkengray:hover{background-color: #939b9f;}

.default_btn_darkengray:disabled{background-color:#ccc; color:#666;}

.default_btn_white{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#fff; color:#9ca2a9; font-weight:600; width:100% ; 
    padding: 0 8px; box-sizing: border-box; transition: 0.3s;}
.default_btn_white:hover{background-color: #eee;}

.default_btn_white_border{border:1px solid #ccc; height: 40px; padding: 0 8px;}

.default_btn_clean{display: block; border-radius: 8px; border: 0; height:40px; text-align: center; background-color:#0cd5dc; color:#fff; font-weight:600; width:100% ; 
    padding: 0 14px; box-sizing: border-box; transition: 0.3s;}
.default_btn_clean:hover{background-color: #0ab3b9;}

.default_btn_clean:disabled{background-color:#ccc; color:#666;}

.default_btn_sm{display: block; border-radius: 6px; border: 0; height:30px; text-align: center; background-color:#f3f5f6; color:#424a4d; font-weight:600; width:100% ; 
    padding: 0 12px; box-sizing: border-box; transition: 0.3s; border:0;}

.default_btn_sm:hover{background-color: #ddd;}

.default_btn_sm:disabled{background-color:#ccc; color:#666;}

.default_btn_history{background-image: url('/static/img/web/history_icon.png'); background-repeat: no-repeat; background-position: left 8px center ; background-size: 22px;
    padding-left: 34px;}

        
.default_btn_plus{background-image: url('/static/img/web/w_hov_plus_btn.png'); background-repeat: no-repeat; background-position: left 13px center ; background-size: 12px;
    padding-left: 36px;}

.default_btn_minus{background-image: url('/static/img/web/minus_btn_icon.png'); background-repeat: no-repeat; background-position: left 13px center ; background-size: 12px;
        padding-left: 36px; background-color:#ffdfe0; color:#fe4047}
.default_btn_minus:hover{background-color:#f9bdbf;}
    
.default_btn_plus_sm{background-image: url('/static/img/web/plus_btn_sm_img.png'); background-repeat: no-repeat; background-position: left 12px center ; background-size: 14px;
        padding-left: 34px;}


.icon_btn{display: block; border-radius: 8px; border: 0; width:44px; height:44px; text-align: center; background-color:#fff; color:#424a4d; font-weight:600; 
    padding: 0 8px; box-sizing: border-box; transition: 0.3s; border:1px solid #ddd;}
.icon_btn_txt{width:60px}
.icon_btn:hover{background-color:#f6f6f6;}
.icon_btn.excel{background-image:url('/static/img/opener/excel_icon.png'); background-repeat: no-repeat; background-position:center; background-size:22px;}
.icon_btn_txt_left{display: block; border-radius: 8px; border: 0;  padding-right:8px; padding-left: 36px; height:44px; text-align: center; background-color:#fff; color:#424a4d; font-weight:600; 
   box-sizing: border-box; transition: 0.3s; border:1px solid #ddd; }
.icon_btn_txt_left_medium{display: block; border-radius: 8px; border: 0;  padding-right:8px; padding-left: 36px; height:40px; text-align: center; background-color:#fff; color:#424a4d; font-weight:600; 
    box-sizing: border-box; transition: 0.3s; border:1px solid #ddd; }
.icon_btn_txt_left.excel{background-image:url('/static/img/opener/excel_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left.download{background-image:url('/static/img/opener/download_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left.refresh{background-image:url('/static/img/opener/refresh_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left.plus{background-image:url('/static/img/opener/btn_plus_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:18px;}
.icon_btn_txt_left.search{background-image:url('/static/img/opener/dark_search_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left.time{background-image:url('/static/img/opener/time_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left.setting{background-image:url('/static/img/opener/n_setting_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left:hover{background-color:#f6f6f6;}


.icon_btn_txt_left_ver02{display: block; border-radius: 8px; border: 0;  padding-right:8px; padding-left: 36px; height:40px; text-align: center; font-weight:600; 
    box-sizing: border-box; transition: 0.3s; }
.icon_btn_txt_left_ver02.time{background-image:url('/static/img/opener/w_time_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left_ver02.maid{background-image:url('/static/img/opener/w_maid_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left_ver02.master{background-image:url('/static/img/opener/w_master_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.icon_btn_txt_left_ver02.card{background-image:url('/static/img/opener/w_card_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}



.pop_icon_btn{display: block; border-radius: 8px; border: 0; width:40px; height:40px; text-align: center; background-color:#fff; color:#424a4d; font-weight:600; 
    padding: 0 8px; box-sizing: border-box; transition: 0.3s; border:1px solid #ddd;}
.pop_icon_btn:hover{background-color:#f6f6f6;}
.pop_icon_btn.excel{background-image:url('/static/img/opener/excel_icon.png'); background-repeat: no-repeat; background-position:center; background-size:22px;}
.pop_icon_btn_txt_left{display: block; border-radius: 8px; border: 0;  padding-right:8px; padding-left: 36px; height:40px; text-align: center; background-color:#fff; color:#424a4d; font-weight:600; 
   box-sizing: border-box; transition: 0.3s; border:1px solid #ddd; }
.pop_icon_btn_txt_left.excel{background-image:url('/static/img/opener/excel_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.pop_icon_btn_txt_left.download{background-image:url('/static/img/opener/download_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.pop_icon_btn_txt_left.refresh{background-image:url('/static/img/opener/refresh_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.pop_icon_btn_txt_left.plus{background-image:url('/static/img/opener/btn_plus_icon.png'); background-repeat: no-repeat; background-position:left 8px center; background-size:20px;}
.pop_icon_btn_txt_left:hover{background-color:#f6f6f6;}


.room_link_btn{width:50px; height:50px; border:0; border-radius: 50%; background-color:#ddd; box-shadow: 2px 4px 8px 0px #2934390a;margin-right: 20px;;
display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; transition: 0.3s; color:#111;}
.room_link_btn .room_link_icon{display:block; width:16px; height: 16px; background-repeat: no-repeat; background-position: center; background-size: 100%;
background-image: url('/static/img/mobile/door/bluetooth_off.png');margin-bottom: 4px;}
.room_link_btn.on{background-color:#ff6066; color:#fff;}
.room_link_btn.on .room_link_icon{background-image: url('/static/img/mobile/door/bluetooth_on.png');}
.room_link_btn:disabled{background-color:#ddd; }


.sel_style{width:100%; box-sizing:border-box;border-radius:8px; border:1px solid #dbdbdb;height:40px;padding:0 8px;outline:none;
    -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image:url('/img/opener/drop_icon.png'); background-repeat:no-repeat;
    background-position:right 8px center; background-size:8px; background-color:#fff;color:#000;}
  .key_list_sel::-ms-expand { display: none;}

  select:disabled{background-color:#F3F5F6;  border:1px solid #e3e3e3 !important; color:#8998A0 !important;}
  select::read-only{background-color:#F3F5F6;  border:1px solid #e3e3e3 !important; color:#8998A0 !important;}

.text_center{text-align: center;}
.text_left{text-align: left;}
.text_right{text-align: right;}

.right_contbox{ padding:80px 30px 30px 310px;box-sizing: border-box; width: 100%; min-width:1580px;transition: 0.3s;}
.main_cont_tit{font-size: 28px; display: flex; flex-direction: row; align-items: center;}
.main_cont_tit_sub{margin-left: 12px; color:#8c8c8c; font-size:20px; font-weight: 400;;}

.total_numbox{margin-bottom: 12px; position: relative;z-index:1;}
.total_numbox_margin_top_bottom{margin:20px 0px; position: relative;z-index:1;}
.total_num_tit{color:#9ca2a9; font-size: 18px; font-weight: 600; text-align: right;}
.total_num_tit_sub{color:#9ca2a9; font-size: 15px; font-weight: 600;}
.total_num_tit_box .total_num_tit{margin-right:8px;}
.total_num_tit_box .total_num_tit:last-child{margin-right: 0;;}


.total_tab{font-size:14px; font-weight: 500; margin-right: 8px; padding:4px 12px; background-color:#ddd; border-radius:100px; color:#999; cursor: pointer; transition: 0.3s;}
.total_tab:hover{background-color:#d1d1d1;}
.total_tab.active{color:#fff; background-color:#ff6066;}
.total_tab:last-child{margin-right:0;}
.total_tab.active.js{background-color:#f5a623;}
.total_tab.active.gs{background-color:#46589A;}
.total_tab.active.cl{background-color:#0cd5dc;}
.total_tab.active.dt{background-color:#10b120;}


.total_tab_num{display: block; width:17px; height:17px;background-color:#fff; text-align: center; ;line-height: 17px; border-radius: 50%; margin-left:8px;}
.total_tab.active.js .total_tab_num{color:#f5a623;}
.total_tab.active.gs .total_tab_num{color:#46589A;}
.total_tab.active.cl .total_tab_num{color:#0cd5dc;}
.total_tab.active.cl .total_tab_num{color:#10b120;}


/* .room_state_box{position: absolute; top:8px ; right:8px;} */
.room_state{font-size:22px; font-weight: bold;  transition: 0.3s; 
            color:#fff; display: inline-block;line-height: 33px;}
/* 공실 뒤 같은색 */
.room_state.js{background-color:#f5a623;}
.room_state.gs{background-color:#46589A;}
.room_state.cl{background-color:#0cd5dc;}
.room_state.dt{background-color:#10b120;}


/* 공실 뒤에 진한 색 
.room_state.js{background-color:#E98100;}
.room_state.gs{background-color:#19327E;}
.room_state.cl{background-color:#059392;}
.room_state.dt{background-color:#0a7021;} */





.wcont_box{width:100%; padding:20px; box-sizing: border-box; border-radius: 12px; box-shadow: 2px 4px 8px 0px #2934390A; background-color:#fff;position:relative; z-index:1;}
.table_over_stylebox{ box-shadow: 2px 4px 8px 0px #2934390A; border-radius:12px; overflow: hidden; border:1px solid #f3f5f6;}

.table_over_stylebox_04{
    border:1px solid #f6f6f6; 
    box-shadow: 2px 4px 8px 0px #2934390A; 
    border-radius:12px; 
    overflow: auto;
    height: 250px;
    background-color: #fff;
}
.back_wcolor{background-color:#fff;}

.table_header{position: relative; z-index: 1; width:100%; box-shadow: 2px 4px 8px 0px #2934390A;}

.table_list{width: 100%; table-layout: fixed; border-collapse: collapse;}
.table_list_th{padding:14px; font-size: 14px; font-weight: 600; color:#9ca2a9;    vertical-align: middle;}
.table_list_td{padding:14px; color:#333;; font-size: 14px; font-weight: 500;    vertical-align: middle;}
.table_list_td > p{ font-size: 14px; font-weight: 500;}
.table_list_td .table_list_td_ok{color:#0ca8ff;}
.table_list_td .table_list_td_no{color:#ff0000;}
.table_list_td_red{color:#ff0000;}
.table_list_td_gray{color:#aaa;}


.table_list_chart{}
.table_list_chart thead{position: relative; z-index: 1; width:100%; box-shadow: 2px 4px 8px 0px #2934390A;}
.table_list_chart th{padding:14px 8px; font-size: 14px; font-weight: 600; color:#9ca2a9;    vertical-align: middle;}
.table_list_chart td{padding:14px 8px; color:#333;; font-size: 14px; font-weight: 500;    vertical-align: middle;border:1px solid #f1f1f1;text-align: center; cursor: pointer;}
.table_list_chart td.connect_on{background-color:#7777ff; color:#fff; border:1px solid #fff;}
.table_list_chart td.connect_fail{background-color:yellow;}
.table_list_chart td.connect_re{background-color:#ff0000; color:#fff;border:1px solid #fff;}
.table_list_chart tbody tr{border-bottom:1px solid #f1f1f1;}
.table_list_chart tbody tr:last-child{border-bottom:0}
/* .table_list_chart tbody tr td:last-child{border-right:0} */
.table_list_chart tbody tr td:first-child{border-left:0; font-weight: bold; text-align: left;}



.table_contbox_btngrp .table_list_td{padding:10px 14px;}
.table_contbox_btngrp td{padding:10px 14px;}
.table_contbox_btngrp td .icon_btn_txt_left_medium{width:100%;}


.table_body tr{border-bottom:1px solid #eee;}
/* .table_body tr:nth-child(2n){background-color:#fbfbfb;} */
.table_body tr:last-child{border-bottom: 0;}

.table_body tr{transition: 0.3s; cus}
.table_body_hover tr{cursor: pointer;}
.table_body_hover tr:hover{background-color:#f3f5f6;}

.tb_divbox{display: table; width: 100%; height: 100%;}
.tb_divbox .tb_cell{display: table-cell; vertical-align: middle;}

.data_search_grp{margin-right: 12px; width:100%;}
.data_search_grp:last-child{margin-right: 0px;}


.inp_moving_widthbox .inp_moving_width{margin-right: 8px; }
.inp_moving_widthbox .inp_moving_width:last-child{margin-right: 0;}

.inp_moving_widthbox06 .inp_moving_width02{min-width: 60px;}


.view_grp{width:100%; display: flex; flex-direction: column;}


.view_grp_listbox{ display: flex; flex-direction: row; column-gap: 1%; flex-wrap: wrap;}
.view_grp_list{ width:15.83%; height: 100%; box-sizing: border-box; background-color:#fff; border-radius: 12px; box-shadow: 2px 4px 8px 0px #2934390a; 
                margin-top: 15px; cursor: pointer; transition: 0.3s; position: relative;  min-width:238px;}
.view_grp_list.js .view_tbox01{background-color: #f5a623;}
.view_grp_list.gs .view_tbox01{background-color: #46589A;}
.view_grp_list.cl .view_tbox01{background-color: #0cd5dc;}
.view_grp_list.dt .view_tbox01{background-color: #10b120;}

.view_grp_list:hover{box-shadow: 2px 4px 8px 0px #2934394a;}
.view_tit_grp{width: 100%; display:flex; flex-direction: column; justify-content: space-between;}


/* .view_tit_box{width:100%; } */
.view_tit_box{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.view_tit_box02{margin-top: 8px;}
/* 전원 연결 확인 버튼 */
.connect_box{
    display: flex;
    display: row;
}
.connect{
    width: 24px;
    height: 24px;
    z-index: 1;
}
.connect_box .connect{
    background: url(/static/img/web/connect01.png) no-repeat;
    background-size: 100%;
    border-radius: 50%;
    transition: 1s;
}

.connect_box .battery{
    margin-left: 8px;
    background-size: 16px;
    border-radius: 50px;
    transition: 1s;
    
    background-position: center;
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
}

.connect_box .battery80{background-image: url(/static/img/web/w_battery_80.png);background-color:#007afe;}
.connect_box .battery40{background-image: url(/static/img/web/b_battery_40.png);background-color:#f9e000;}
.connect_box .battery20{background-image: url(/static/img/web/w_battery_20.png);background-color:#ff0000;}

.connect_box .connect.on{
    background: url(/static/img/web/connect01_active.png) no-repeat;
    background-size: 100%;}

.connect_box .connect.door{display:none;}
.view_tbox.view_tbox01{width: 100%; padding:23px; padding-bottom:30px; box-sizing: border-box; border-radius: 12px 12px 0 0;  position: relative;}

.view_tit{color: #fff;}

.view_tit01{font-size: 22px;}
.view_tit02{font-size: 14px;  font-weight:bold; color:#ffff }
.view_tit_js{background:#F4B200;}
.view_tit_gs{background:#46589A;}
/* .view_tbox{width:100%;} */
.view_tbox02{display: flex; flex-direction: row;justify-content: space-between; padding: 0 20px; box-sizing: border-box; position: absolute;left: 0; bottom: 10px;width:100%;}
.view_tbox02 .view_tit{color:#333; font-weight:bold; font-size: 15px;}
.view_tbox02 .view_txt{color:#666;font-size: 15px;}
.view_txt02{color:#fff; font-weight: 500;}




.view_tbox .key_tbox_bundle{  display:flex; flex-direction:row; width:100%; background-color: #f3f4f5;     border-radius: 12px;
       box-shadow: 2px 3px 5px 0px #29343921;padding: 10px;    column-gap: 10px; box-sizing: border-box;justify-content: space-between;}
.key_tbox.on{background-color: #fff;box-shadow: 2px 4px 8px 0px #29343912;}


.view_tbox03{background-color: #fff;border-radius:0 0 12px 12px;; display: flex;padding:20px; flex-direction: column;box-sizing:border-box;position: relative;
    padding-top: 35px;  padding-bottom: 45px;}
.key_tbox{width: 100%; display: flex; flex-direction: column; padding: 8px 0; background-color:#e7e7e7; border-radius: 8px;}
/* 
.view_tbox .key_tbox_bundle .key_tbox:first-child{border-radius: 8px 0 0 8px;}
.view_tbox .key_tbox_bundle .key_tbox:last-child{border-radius: 0 8px 8px 0;} */

.re_flex{
    display: flex;
    flex-direction: row;

}


/* 배터리 상태 */
.battery_grp{width:100%; box-sizing: border-box;display: flex; flex-direction: column; align-items: center; justify-content: center; position: absolute; top:-14px; left:0;}
.battery_box{padding: 6px 12px; box-sizing: border-box;border-radius: 50px;display: flex; flex-direction: row; align-items: center;box-shadow: 2px 4px 8px 0px #2934390A;max-width:107px;}
.battery_box_80{background-color: #007afe;}
.battery_box_40{background-color: #f9e000;}
.battery_box_40 > p{color:#333;}
.battery_box_20{background-color: #ff0000;}
.battery_box_none{background-color: #999;}
.battery_box_none > p{color: #efefef;}
.battery_txt{color:#fff; font-size: 13px; font-weight:500;margin-right:8px; line-height: normal;}
.battery_tbox{width:15px; height:15px;}
.battery_tbox img{width: 100%;}
/* 파워 버튼 (전원버튼) - 202211 추가*/
.power_button{
    width: 100%;
    margin: 15px auto;
    display: flex; 
    justify-content: space-between;
    flex-direction: row;
    margin-bottom:0;
    column-gap: 15px;
}
.power_button img{width: 40px;box-shadow: 2px 4px 8px 0px #29343912}

/* 버튼 한개일때 정렬 */
.one_btn_center{ justify-content: center; }

/* 팝업 릴레이 버튼 한개 일 때 정렬과 토글버튼 */
/* .toggle.on{
    width: 80px;
    height: 40px;
    border: 3px solid #ff6066;
    border-radius: 500px;
    background-color: #fff;
    position: relative;
    transition: 1s;
}
.toggle.on p{
    width: 40px;
    height: 40px;
    background-color: #ff6066;
    border-radius: 500px;
    box-sizing: border-box;
    position: absolute;
    top: 0; left: 0;
    transition: 1s;
}
.toggle.on p::after{
    content: 'on';
    width: 40px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    transition: 1s;
}
.toggle.off{
    width: 80px;
    height: 40px;
    border: 3px solid #ccc;
    border-radius: 500px;
    background-color: #fff;
    position: relative;
    transition: 1s;
}
.toggle.off p{
    width: 40px;
    height: 40px;
    background-color: #ccc;
    border-radius: 500px;
    box-sizing: border-box;
    position: absolute;
    top: 0; right: 0;
    transition: 1s;
}
.toggle.off p::after{
    content: 'off';
    width: 40px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    transition: 1s;
} */

/* 엑티브 버전 */
.toggle{
    width: 80px;
    height: 40px;
    border: 3px solid #ccc;
    border-radius: 500px;
    background-color: #fff;
    position: relative;
    transition: .5s; 
}
.toggle p{
    width: 40px;
    height: 40px;
    background-color: #ccc;
    border-radius: 500px;
    box-sizing: border-box;
    position: absolute;
    top: 0; right: 0;
    transition: .3s;
}
.toggle p::after{
    content: 'off';
    width: 40px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    transition: .5s;
}

.toggle.active{
    width: 80px;
    height: 40px;
    border: 3px solid #ff6066;
    border-radius: 500px;
    background-color: #fff;
    position: relative;
}
.toggle.active p{
    width: 40px;
    height: 40px;
    background-color: #ff6066;
    border-radius: 500px;
    box-sizing: border-box;
    position: absolute;
    top: 0; right: 40px; /*이거덕에 움직일수 있어*/
}
.toggle.active p::after{
    content: 'on';
    width: 40px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
}

    .wrapper_main_ck_txt{
        font-size: 14px;font-weight: 600;color: #9ca2a9;vertical-align: middle;    width: 100%;
        text-align: center;
        padding: 14px;
        box-sizing: border-box;
        box-shadow: 0px 3px 2px 0px #2934390a;}

  .switch_label {
    display: block;
    position: relative;
    width: 60px;
    height: 25px;
    background: #d3d3d3;
    border-radius: 60px;
    transition: background 0.4s;
    cursor: pointer;
    margin:0 auto;
  }

  .switch_label::after {
    content: "";
    position: absolute;
    left: 3px;
    top: 50%;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    background-color: #fff;
    transform: translateY(-50%);
    box-shadow: 1px 3px 4px rgba(0,0,0,0.1);
    transition: all 0.4s;
  }

  .switch_label::before {
    content: "OFF";
    font-size: 13px;
    font-weight: bold;;
    position: absolute;
    left: 26px;
    top: 50%;
    transform: translateY(-50%);
    color:#999;
    transition: all 0.4s;
  }
  .list_ck:checked + .switch_label {
    background:#ff6066
  }

  .list_ck:checked + .switch_label::after {
    left: calc(100% - 23.5px);
   }

   .list_ck:checked + .switch_label::before {
    content: "ON";
    color: #fff;
    left: 8px;
  }
  /* #chk1:checked + .switch_label {
    background:#ff6066
  }

  #chk1:checked + .switch_label::after {
    left: calc(100% - 23.5px);
   }

   #chk1:checked + .switch_label::before {
    content: "ON";
    color: #fff;
    left: 8px;
  } */

  /* 리스트뷰 */
  .view_list_tb_box{width: 100%; background-color:#fff;border-radius: 12px;;}
  .view_list_tb_box .table_over_stylebox{overflow: unset;}
  .view_list_tb_box .table_header{position: sticky; top: 0; background-color: #fff; border-radius: 12px 12px 0 0;}
  .view_table_state{display: inline-block; padding:4px 6px; box-sizing: border-box;color:#fff;border-radius: 50px;min-width: 60px;text-align: center; font-weight:500;}
  .view_table_state.js{background-color:#f5a623;}
  .view_table_state.gs{background-color:#46589A;}
  .view_table_state.dt{background-color:#10b120;}
  .view_table_state.cl{background-color:#0cd5dc;}
.relay_on::after{
    content: "ON";
    background-color:#ff6066;
    color:#fff;
    display: flex; flex-direction: row; align-items: center; justify-content: center;
    width:28px; height:28px;border-radius: 50%;
    font-size:10px; 
    margin:0 auto;
    font-weight: bold;; 
}
.relay_off::after{
    content: "OFF";
    background-color:#ccc;
    color:#999;
    display: flex; flex-direction: row; align-items: center; justify-content: center;
    width:28px; height:28px;border-radius: 50%;
    font-size:10px; 
    margin:0 auto;
    font-weight: bold;; 
}
.main_cont_btn_tab_ul{background-color:#e6e6e6; border-radius: 12px; padding:6px; box-sizing: border-box; display: flex; flex-direction: row;box-shadow: 2px 4px 8px 0px #2934390a;
margin-left:8px;}
.main_cont_btn_tab_li{min-width: 100px;margin-right: 4px;}
.main_cont_btn_tab_li:last-child{margin-right: 0;}

.main_cont_btn_tab_btn{font-size: 14px; font-weight:bold; display: flex; flex-direction: row; align-items: center; justify-content: center; height:32px;border-radius: 8px;
    color:#b4b4b4; transition: 0.3s;}
.main_cont_btn_tab_btn:hover{background-color: #ccc;}    
.main_cont_btn_tab_btn.active{ background-color:#fff;box-shadow: 2px 4px 8px 0px #2934390a;color:#ff6066; }




.key_icon{display: block; width:20px; height:20px;  background-repeat: no-repeat; background-position: center;
background-size:18px; margin: 0 auto; margin-bottom:4px;}
.key_tbox.on .key_icon01{background-image: url('/static/img/opener/phonekey_icon_on02.png');}
.key_tbox.off .key_icon01{background-image: url('/static/img/opener/phonekey_icon_off02.png');}
.key_tbox.on .view_txt01{color:#ff6066;}
.view_grp_list.off .key_icon01{background-image: url('/static/img/opener/key_icon_off.png');}
.key_tbox.off .view_txt01{color:#aaa;}
.view_grp_list.off .view_txt01{color:#999;}
.view_txt01{width:100%; text-align: center; font-weight:700; font-size:12px; }

.key_tbox.on .key_icon02{background-image: url('/static/img/opener/lock_icon_on02.png'); }
.key_tbox.off .key_icon02{background-image: url('/static/img/opener/lock_icon_off02.png');}
.view_grp_list.off .key_icon02{background-image: url('/static/img/opener/lock_icon_off02.png'); }

.key_tbox.on .key_icon03{background-image: url('/static/img/opener/lock_icon_on02.png');  }
.key_tbox.off .key_icon03{background-image: url('/static/img/opener/lock_icon_off02.png');}
.view_grp_list.off .key_icon03{background-image: url('/static/img/opener/lock_icon_off02.png');  }


.key_issue_dategrp{width:100%; display: flex; flex-direction: row; align-items: center;}
.key_issue_datebox{width:100%; display: flex; flex-direction: row; align-items: center;}
.key_issue_dategrp .date_inp{margin-right:8px;}
.key_issue_datebox02{ margin-right: 8px;}
.key_issue_datebox:last-child{margin-right: 0;}
.key_issue_dategrp .inp_time_style{min-width: 60px; width:60px;}
/* .key_issue_dategrp .inp_time_style_left{margin-left: 8px;} */
.key_issue_dategrp .time_center{margin:0 8px;}

.main_cont_btn_grp .main_cont_width{margin-right:8px;}
.main_cont_btn_grp .main_cont_width:last-child{margin-right:0px;}


.tab_list_box{width:100%; padding:4px; border-radius: 8px; background-color:#f3f5f6;box-sizing:border-box;}
.tab_list{width:100%; margin-right: 8px;;}
.tab_list:last-child{margin-right: 0;}
.tab_list.active{background-color:#fff; border-radius: 8px;box-shadow: 2px 4px 8px 0px #29343917;}
.tab_list .tab_list_btn{    display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center ; padding:0 8px;  height:32px; color:#afb3b5;
font-weight:600;}
.tab_list.active .tab_list_btn{color:#ff6066; }
.pagebtn_grp_box{width:100%; display: flex; flex-direction: column;justify-content: center;align-items: center; margin-top:20px;}

.pagebtn{display: flex;    flex-direction: column;justify-content: center;align-items: center; box-sizing:border-box; margin-right:4px; transition: 0.3s;
    border-radius: 8px; height:31px; width: 31px;text-align: center;}
.pagebtn:hover{background-color:#eee;;}
.pagebtn.active{background-color:#ff6066; color:#fff;}

.pagebtn.prev{background-image: url(/static/img/opener/prev_icon.png); background-repeat: no-repeat; background-position: center; background-size: 12px;}
.pagebtn.next{background-image: url(/static/img/opener/next_icon.png); background-repeat: no-repeat; background-position: center; background-size: 12px;}
.pagebtn:last-child{margin-right:0}


.popup_wrap{width:100%; height:100%; position:fixed; top:0; left:0; background-color:rgba(0,0,0,0.5); display: flex; flex-direction: column; align-items: center; 
    justify-content: center; z-index: 9; padding:30px; box-sizing: border-box;}
.popup_contbox{min-width: 880px; max-width: 1280px; border-radius: 12px; background-color:#fff;box-shadow: 2px 4px 8px 0px #29343926; margin:0 auto;}
.popup_header_grp{border-bottom: 1px solid #eee;;}
.popup_header{padding:20px 30px; box-sizing: border-box; }
.popup_header_tabgrp{width:100%;}

.popup_header_li{transition: 0.3s;}
.popup_header_li.active{border-bottom: 4px solid #111;box-sizing: border-box; }
.popup_header_li:hover{background-color:#eee;}
.popup_header_li_btn{padding:20px 15px; box-sizing: border-box ; font-size: 18px;font-weight: 600; display: block; color:#afb3b5; transition: 0.3s;}
.popup_header_li.active .popup_header_li_btn{color:#111; }



.popup_header .view_tbox03{margin:0; column-gap: 0%; padding-top:20px;}
.popup_header .view_tbox03 .key_tbox{display: flex; flex-direction: row; align-items: center;  width:auto; padding: 8px 10px; margin-right: 8px;}
.popup_header .view_tbox03 .key_tbox:last-child{margin-right: 0;}
.popup_header .view_tbox03 .key_icon{width:16px; height:16px; margin-right:8px; margin-bottom: 0;}
.popup_header .view_tbox03 .key_tbox.on{background-color:#ff6066;}
.popup_header .view_tbox03 .key_tbox.off{background-color:#d9d9d9;}
.popup_header .view_tbox03 .key_tbox.on .key_icon{background-image: url('/static/img/opener/w_key_icon_on.png');background-size: 100%;}
.popup_header .view_tbox03 .key_tbox.on .view_txt01{color:#fff;}
.popup_header .view_tbox03 .key_tbox.off .key_icon{background-image: url('/static/img/opener/g_key_icon_off.png');background-size: 100%;}

.popup_header .view_tbox03 .key_tbox.on .key_icon02{background-image: url('/static/img/opener/w_password_icon_on.png');background-size: 100%;}
.popup_header .view_tbox03 .key_tbox.off .key_icon02{background-image: url('/static/img/opener/g_password_icon_off.png'); background-size: 100%;}
.popup_header .view_tbox03 .key_tbox.on .key_icon03{background-image: url('/static/img/opener/w_password_icon_on.png');background-size: 100%;}
.popup_header .view_tbox03 .key_tbox.off .key_icon03{background-image: url('/static/img/opener/g_password_icon_off.png');background-size: 100%;}
.popup_header .view_tbox03 .view_txt01{width:auto;}

.popup_title{margin-right:12px;}
.popup_title01{font-size:28px;}
.popup_title02{font-size:24px; font-weight: 400; color:#9ca2a9;}
.popup_title03{font-size:16px; font-weight: 500; margin-right: 8px; padding:4px 14px;border-radius:100px; cursor: pointer; transition: 0.3s; color:#fff}
.popup_title03.js{background-color:#f5a623;}
.popup_title03.gs{background-color:#46589A;}
.popup_title03.cl{background-color:#0cd5dc;}
.popup_title03.dt{background-color:#10b120;}



/* 22.11.14_jungin_ver */
.cont_box_grp04{
    height: auto;
    border-radius: 12px;      
    background-color: #fff;
    margin-top: 20px;
    box-shadow: 2px 4px 8px 0px #2934390A;
    display: flex;
    justify-content: center; 
    align-items: center;
}
 .checkbox_all{
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.checkbox_all li{
    width: 120px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    margin: 0 auto;
    justify-content: center;
    box-sizing: border-box;
}
.checkbox_all li .wrapper{margin: 14px 0;}
.checkbox_all li:last-child .{ border-right: 0;}
/*
.checkbox_all li p{
    padding-left: 12px;
    font-size:15px;
    color:#333;
    font-weight: 500;
}
.checkbox_all li:nth-child(2){
    width: 200px;
}
.checkbox_all li input{
    width: 20px;
    height: 20px;
    margin-top: 3px;
    position: relative;

}

.checkbox_all li input + label {
	display: inline-block;
	width: 20px;
	height: 20px;
	border: 2px solid #ff6066;
    border-radius: 3px;
    line-height: 20px;
    cursor: pointer;
}
.checkbox_all li input:checked + label::after {
    content:'✔';
    display: inline-block;
    font-size: 13px;
	width: 20px;
	height: 20px;
    color: #fff;
    text-align: center;
    border: 2px solid #ff6066;
    background-color: #ff6066;
    border-radius: 3px;
    position: absolute;
    left: 63px;
    top: 50%;
    transform: translateY(-50%);
}



.checkbox_all .all_power_list input:checked + label::after{left:26px;}
.checkbox_all li input {
	display: none;
}
.checkbox_all li a button{
display: block;
border-radius: 8px;
border: 0;
height: 40px;
text-align: center;
background-color: #ff6066;
color: #fff;
font-weight: 600;
width: 60px;
padding: 0 8px;
box-sizing: border-box;
transition: 0.3s;
}
.checkbox_all li a button:hover{
    background-color: #e23d42;
} */




.popup_close{width: 40px; height:40px; display:block; background-image: url('/static/img/opener/cancel_icon.png'); background-repeat: no-repeat ; background-position: center;
    background-size: 10px; background-color:#f3f5f6; border-radius: 8px; transition: 0.3s;}
.popup_close:hover{background-color:#e3e3e3;}


.popup_body{padding:20px; box-sizing: border-box; display: flex; flex-direction: column; background-color:#f3f5f6;max-height: 65vh; overflow-y: auto;}
.popup_body .table_over_stylebox{background-color:#fff;}

.pop_cont_tbox{margin-bottom: 20px;}
.pop_cont_tit{font-size:22px;}
.pop_cont_box{width:100%; padding:20px; box-sizing: border-box; border-radius: 12px; background-color:#fff;box-shadow: 2px 4px 8px 0px #2934390a;}
.pop_cont_sub_tbox{width:100%; padding-bottom: 12px; border-bottom: 1px solid #eee;}
.pop_cont_sub_tit{font-size:16px;}

.pop_cont_input_grp{margin-top:8px;}
.pop_cont_input_box{margin-right:8px; width:100%;}
.pop_cont_input_box:last-child{margin-right:0;}
.pop_cont_box01{margin-bottom: 20px;;}
.pop_cont_sub_box .pop_cont_box{ margin-bottom: 0; margin-right: 20px;}
.pop_cont_sub_box .pop_cont_box:last-child{margin-right: 0;}

.pop_cont_input_grp_keygrp:first-child{margin-top:12px;}

.pop_cont_input_grp_tbox .setup_title{margin-bottom: 0;}

.pop_cont_input_grp_tbox{margin-top:12px; box-sizing: border-box;}
.pop_cont_input_grp_tbox .pop_cont_input_grp_twidth{margin-right: 8px; width: 100%;}
.pop_cont_input_grp_tbox .pop_cont_input_grp_twidth:last-child{margin-right: 0;}
.pop_cont_input_grp_tbox .pop_cont_input_grp_twidth01{max-width:170px;}
.pop_cont_input_grp_tbox .pop_cont_input_grp_twidth02{max-width:170px;}
.pop_cont_input_grp_tbox .pop_cont_input_grp_twidth03{max-width:100%;}
.pop_cont_input_grp_tbox .pop_cont_input_grp_twidth04{max-width:150px;}

.pop_cont_input_grp01 .pop_cont_input_box01{max-width:170px;}
.pop_cont_input_grp01 .pop_cont_input_box02{max-width:170px;}
.pop_cont_input_grp01 .pop_cont_input_box03{max-width:100%;}
.pop_cont_input_grp01 .pop_cont_input_box04{max-width:150px;}


.pop_cont_input_grp_key .pop_cont_input_box02{max-width: 150px;}
.pop_cont_input_grp_key .pop_cont_input_widthbox{width:100%;}
.pop_cont_input_grp_key .pop_cont_input_width{width: 100%; margin-right:8px;}
.pop_cont_input_grp_key .pop_cont_input_width02{max-width: 60px;}
.pop_cont_input_grp_key .pop_cont_input_width:last-child{margin-right: 0;}

.pkey_btn_list_box{width:100%;}
.pkey_list{width:100%; margin-right:8px;}
.pkey_list:last-child{margin-right: 0;}




.popup_footer{width: 100%; padding:20px 30px; box-sizing: border-box;}

.popup_btn_width{margin-right: 8px; min-width: 60px;}
.popup_btn_width:last-child{margin-right: 0;}

.pop_total_numbox{margin-bottom: 20px;;}
.pop_cont_tit_right{margin-right: 12px;;}

.pop_table_over_stylebox .table_body_scroll{max-height: 40vh; overflow-y: auto;}

.empty_txt_box{width:100%; padding:50px 0;}
.empty_txt_box .table_list_none{text-align: center; font-size:14px; color:#9ca2a9;}


.pop_table_widthbox{width:100%;}
.pop_table_width{width:50%; margin-right: 20px;}
.pop_table_width:last-child{margin-right: 0;;}

.memo_tr_tbox td{background-color:#dadde1;}
.memo_tr_tbox td p{font-size: 14px;font-weight: 500; color:#666;word-wrap:break-word;}

.pop_table_contbox{padding:16px; width:100%; box-sizing: border-box; border-radius: 12px;box-shadow: 2px 4px 8px 0px #2934390a; background-color:#fff;}
.pop_table_cont_tbox{padding:12px; border:1px solid #dbdbdb;border-radius: 8px; min-height: 180px;max-height: 180px; overflow-y: auto; box-sizing: border-box;}
.pop_table_cont_tbox .pop_table_cont_txt{font-size: 14px;font-weight: 500; color:#ff0000;word-wrap:break-word;}

.pop_cont_inp_grp_width .pop_cont_inp_box{width:100%;}
.pop_cont_inp_grp_width .pop_cont_inp_box{margin-right: 8px;;}
.pop_cont_inp_grp_width .pop_cont_inp_box:last-child{margin-right: 0;}

.pw_btn_widthbox{width:100%;}
.pw_btn_width {margin-right: 8px; width:100%;}
.pw_btn_width:last-child{margin-right: 0;}
.pw_btn_width02{max-width: 110px;;}


.max_height_180{height:180px;}
.max_height_80{height:80px;}
.max_height_263{height:263.5px;}





.main_cont_width_inpgrp {margin-right:20px;}
.main_cont_width_inpgrp:last-child{margin-right: 0;}

.main_cont_width_inptit{font-weight: 700; font-size: 14px;}

.main_cont_width_inp{margin-right: 8px;}
.main_cont_width_inp:last-child{margin-right: 0;}

.main_cont_width_inp03 {width: 60px;}
.main_cont_width_inp03 button{width: 100%;;}

.max_width_65{max-width: 65px;}

.max_width_296{max-width: 296px;}

.max_width_200{max-width: 200px;}
.max_width_296{max-width: 296px;}

.min_width_200{min-width: 200px;}
.min_width_296{min-width: 296px;}

.connect_txt{font-size: 18px; margin-right: 12px;font-weight:600;}
.connect_txt:last-child{margin-right:0;}
.connect_txt02{color:#ff0000;}


/* 재희 추가*/
/* 테이블 자료없을때 */
.empty_td{text-align: center; background:#fff !important}
.empty_td:hover{background:#fff !important}
.empty_td:active{background:#fff !important}
.empty_td_txt{text-align: center; padding:130px 0; color:#d0d0d0;}

/*채팅 리스트*/

.cont_li01{width:500px; margin-right:20px}
.cont_tit{font-size: 22px; margin-bottom:16px}
.cont_list_tbox{border-bottom:1px solid #eee; box-sizing:border-box; padding:10px 20px; }

.cont_li02{width:calc(100% - 520px); }
.cont_li02 .cont_shadow_box{overflow: hidden}


.list_ulbox{max-height:  400px; overflow-y: auto;}
.list_li{transition: 0.3s; cursor: pointer; padding:15px 20px; box-sizing: border-box; border-bottom: 1px solid #eee;}
.list_li:last-child{border-bottom: 0;}
.list_li:hover{background:#f6f6f6;}
.list_li:active{background:#e4e4e4;}
.list_li.active{background:#f6f6f6;}
.datarow.active{background:#faebd7;}
/* 재희추가 */
.list_li.selectLi{background-color: #eee;}
/* 재희추가 */
.user_contbox01{width:60px; margin-right:16px;align-items: center;display: flex;flex-direction: row;}
.profile_img{width:60px; height: 60px; border-radius: 50%; background-color: #ddd; display: block;    background-image: url(/static/img/web/def_user_icon.png);
    background-color: #DDD;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;}
.user_contbox02{width:calc(100% - 184px); margin-right:8px;}
.user_contbox_tit{font-size:18px; padding-bottom: 2px;overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.user_contbox_txt{font-size:14px;overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#666; font-weight: 400;}

.user_contbox03{text-align: right; width:93px; margin-left:8px;padding:0px 0; box-sizing: border-box;}

.info_p{display:flex; flex-direction: row; color:#666;overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.info_p em{margin-right: 8px; font-weight: 500;}
.info_p em:last-child{margin-right:0;}
.user_contbox_time{font-size:13px; font-weight: 500; color:#aaa;}
.user_contbox_talk{font-size:14px; font-weight: bold; background:#ff0000; color:#fff;width: 25px; height: 25px; display: block; text-align: center;
line-height: 25px;border-radius: 50%; float: right; margin-top:4px }

.wait_list_ulbox{width:100%;display: flex; justify-content: center;align-items: center;flex-direction: column; height:535px;}
.none_chatting_icon{width: 80px; height: 80px; margin-bottom: 20px;}
.none_chatting_icon img{width: 100%;}
.wait_list_txt{display: flex; justify-content: center;align-items: center; color: #c7c5c5; font-weight: 500; font-size: 16px;}
.none_chat_cont_box{width:100%;display: flex !important; justify-content: center;align-items: center; flex-direction: column;}
.none_chat_icon{width: 80px; height: 80px; margin-bottom: 20px;}
.none_chat_icon img{width: 100%;}
.none_chat_txt{font-size: 22px; font-weight: 500; color: #c7c5c5; }


/* 진행상황 */
.progress_grp_tit{font-size:18px;width:120px;}
.progress_grp_bar{width:calc(100% - 120px); height:23px; border-radius: 50px; background:#e6e6e6; margin-top:3px; position: relative;
overflow: hidden;}
.progress_grp_gage{position: absolute; top:0; left: 0; border-radius: 50px; height: 100%; transition:0.3s; }

.progress_color01{color:#ed1e79; font-weight: bold; display: inline-block;}
.progress_color02{color:#ff1515; font-weight: bold; display: inline-block;}
.progress_color03{color:#8482ff; font-weight: bold; display: inline-block;}
.progress_color04{color:#0071bc; font-weight: bold; display: inline-block;}

.progress_grp_gage01{background:linear-gradient(45deg, #ed1e79, #eb86b2); }
.progress_grp_gage02{ background:linear-gradient(45deg, #ff1515, #ff9fa3);}
.progress_grp_gage03{background:linear-gradient(45deg, #8482ff, #cfceff); }
.progress_grp_gage04{ background:linear-gradient(45deg, #0071bc, #73bbeb);}

.progress_bar{width:0%;}
.percent_txt{color:#fff; font-weight:bold; padding-left: 12px; box-sizing: border-box; line-height: 23px;}


.cont_shadow_box_850px{height: 850px;}
.cont_shadow_box_924px{height: 924px;}
.cont_shadow_box_915px{height: 915px;}



/* AS 채팅 내역*/

.chat_cont_top_tbox{padding:20px; box-sizing: border-box; border-bottom: 1px solid #eee; position: relative; display: flex; flex-direction: row; align-items: center; 
    justify-content: space-between;}
/* .profile_text_right{margin-left: 12px} */
.cont_right_tit{font-size: 22px;}

.list_li_div{justify-content: space-between;}


.chat_cont_box{padding:20px;width:100%; box-sizing:border-box; display:table; position:relative;padding-bottom:56px;}
.chat_body_box{padding:30px 20px; box-sizing: border-box; height: 100%; padding-bottom: 29px; max-height: 756px; overflow-y: auto;} 
.cont_shadow_box_510px{height: 510px;}
.top_notice_txtbox{position: relative;}
.progress_all_num{position: absolute; right: 0; top:50%;  transform: translateY(-50%); color:#666; font-size:14px}


.chat_send_box{display:flex; flex-direction: row;max-width:40%;clear:both; position:relative; margin-bottom:20px;}
 .chat_send_box:last-child{margin-bottom:0;}



 .chat_send_left{float:left;}
 .chat_send_left .chat_send_cont{float:left;}
 .chat_send_left .chat_send_profile{width:45px; height:45px; margin-right:8px; display:inline-block; background-image:url('/static/img/web/def_user_icon.png');background-color:#DDD;
 background-repeat:no-repeat; background-position:center; background-size:cover;border-radius:50%;}
 .chat_send_left .chat_send_text{width:calc(100% - 53px);}
 .chat_send_left .chat_send_div{border-radius:0 12px 12px 12px; margin-top:4px; background:#f3f5f6;}
 .chat_send_left .chat_send_time{right:-40px;}
 
 
 .chat_send_listbox{width:100%; margin-top:16px;}
 .chat_send_list{width:100%; height:40px; margin-bottom:8px; line-height:40px; text-align:center; border-radius:8px; font-weight:bold; background:#fff; color:#2e3192; cursor: pointer;}
 .chat_send_list:last-child{margin-bottom:0;}
 
 .chat_send_right{float:right;}
 .chat_send_right .chat_send_text{width:100%;}
 .chat_send_right .chat_send_div{border-radius:12px 0px 12px 12px; margin-top:0px;background:#ff6066;}
 .chat_send_right .chat_send_txt{color:#fff;}
 .chat_send_right .chat_send_time{left:-40px;}
 
 
 .name_txt{font-weight:bold;}
 .chat_send_txt{font-size:14px;}
 .chat_send_div{background:#fff;padding:8px 14px; }
 .chat_send_time{position:absolute; bottom:0; font-size:12px;color:#aaa;}
 .chat_send_time > p{font-size: 12px;}
 
 .chat_send_imgbox{max-width:250px;position:relative;}
 .chat_send_imgbox:after{ content: ""; display: block; padding-bottom: 100%; box-sizing:border-box;overflow:hidden; width:180px;}
.chat_send_img{position: absolute; width: 100%; height: 100%;box-sizing:border-box;
background-image:url('/static/img/web/door/test_img.png'); background-repeat:no-repeat; background-position:center; background-size:100%;}

.bottom_pic_cont{width:48px;}
.bottom_pic_li{width:40px; height: 40px; margin-right: 8px;}
.bottom_pic_btn{display: block;width: 40px; height: 40px; border-radius: 8px;background-color:#f4f4f4;  color:#3a5d5d; transition: 0.3s;
background-repeat: no-repeat; background-position: center; background-size: 30px; transition: 0.3s;}
.bottom_pic_btn:hover{background-color: #e6e6e6;}
.bottom_image{background-image: url(/static/img/web/image_icon.png);}
.bottom_pic{background-image: url(/static/img/web/camera_icon.png);}

.bottom_btn_icon{background-repeat: no-repeat; background-position: center; background-size: 18px; width:22px; height: 22px;transition: 0.3s;}

.bottom_btn_icon01{background-image: url(/static/img/web/btn_check.png)}
.bottom_btn_icon02{background-image: url(/static/img/web/btn_error.png)}

/* .bottom_btn_icon01:hover{background-image: url(/static/img/web/hv_check.png)}
.bottom_btn_icon02:hover{background-image: url(/static/img/web/hv_error.png)} */


.bottom_textgrp{width:100%;}
.bottom_textbox{width:100%; position:absolute; bottom:0; left:0; z-index:1; background:#fff;padding:16px; box-sizing:border-box;  box-shadow: 0px -2px 4px 0px #29343914;}
.bottom_textbox .bottom_text_cont{float:left;}
.bottom_textbox .bottom_text_inpbox{width:100%; height:40px; border-radius:8px; }
.bottom_textbox .bottom_text_btn{width:60px; height:40px; margin-left:8px; border-radius:8px; background:#ff6066; color:#fff;text-align:center;line-height:40px; cursor: pointer;
font-weight:bold;transition:0.3s;}
.bottom_textbox .bottom_text_inp{width:100%; box-sizing:border-box;border-radius:8px; border:1px solid #D0D6D9;height:40px;padding:0 8px;outline:none;}
/* .bottom_btn_listbox{position: absolute; top:50%; transform: translateY(-50%); right: 40px} */
.bottom_btn_ul{width:100%; }
.bottom_btn_li{height:40px; margin-right: 8px;}
.bottom_btn_li:last-child{margin-right: 0px;}
.bottom_btn{    padding: 8px 14px;
    display: block;
    border-radius: 8px;
    border: 1px solid #e3e3e3;
    background: #fff;
    color: #8e9295;
    transition: 0.3s;}
.bottom_btn img{width: 22px;display: block; margin: 0 auto;}







.chat_pop_wrap{width:100%; height:100%; position:fixed; top:0; left:0; background-color:rgba(0,0,0,0.45); z-index:9;}

.chat_pop_ul{ position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:#fff; border-radius:12px;box-shadow: 0px 2px 4px 0px #29343914;
display: flex; flex-direction: row; padding:30px 0px; min-width:230px;}
.chat_pop_list{padding:0 25px; box-sizing:border-box; border-right:1px solid #eee;width:50%;}
.chat_pop_list:last-child{border-right:0;}
.chat_pop_icon{width:40px; height:40px;  display:block;  margin:0 auto;}
.chat_pop_icon img{width:100%;}
.chat_pop_tit{text-align:center; margin-top:8px;}

.cont_shadow_box{padding:20px; border-radius: 12px; box-shadow: 2px 4px 8px 0px #2934390A; box-sizing: border-box; background: #fff; }
.cont_shadow_box02{padding:20px; border-radius: 5px; box-shadow: 2px 4px 8px 0px #2934390A; box-sizing: border-box; background: #fff; }
.default_inp{width:100%; height: 40px;border-radius: 50px; outline: none; border:1px solid #dbdbdb; }
.default_sel{width:100%; height: 40px;border-radius: 50px; outline: none; border:1px solid #dbdbdb;}

/* 문의 카테고리 수정 팝업 */
.category_width_box{width:100%; display: flex; column-gap: 20px; flex-direction: row; align-items: center;flex-wrap: wrap;    row-gap: 20px;}
.category_cont_box{width:231px;}
/* .category_cont_box:nth-child(5n){margin-right:0;} */
.category_cont_tbox{margin-bottom: 12px;}
.category_btn_box{justify-content: space-between; width: 100%;}
.pop_table_contbox_relative{position: relative;}

.category_btn_grp{margin-top:12px;}

.popup_cont_txt{font-size:14px; color:#999;}

/* Page 기본설정 */
.data_search_max_widthbox .data_search_grp{max-width: 250px;}
.data_search_max_widthbox .data_search_btngrp{max-width: 318px;}
.data_search_max_widthbox .inp_moving_width01{width: 100%;}


/* 온습도조절 wrap */
.popup_hd_state{font-size:16px; font-weight: 500; margin-right: 8px; padding:6px 14px;border-radius:100px; cursor: pointer; transition: 0.3s; color:#fff; 
background-color:#ff6066}

.pop_cont_subbox{display: flex; flex-direction: row;align-items: center;}
.popup_sub_title{font-size:24px;}
.popup_sub_title02{color:#ff0000;}
.popup_sub_title03{color:#7787ff;}
.pop_cont_sub_cont{margin-right: 18px; display: flex; flex-direction: row;align-items: center;}
.pop_cont_sub_cont .pop_cont_sub_txt{margin-right:8px; font-size:14px;}

.temper_contents_box{width:100%; position: relative;}
.temper_listbox{width:100%;  position: relative; flex-wrap: wrap;  column-gap:15px;}
.temper_list{padding:16px; box-sizing: border-box; box-shadow: 2px 4px 8px 0px #2934390A; border-radius: 12px; background-color:#fff;
margin-top:15px;width:calc(16% - 2px);position: relative;cursor: pointer;}
.temper_list.off{background-color:#fff; opacity: 0.4;}
.temper_list.off .off_box{position: absolute; top:0; left: 0; width:100%; height:100%;  border-radius: 12px;}


.temper_div_box{display: flex; flex-direction: column;}
.temper_div_hd{display: flex; flex-direction: row; align-items: center;justify-content: space-between;}
.state_titbox{display: flex; flex-direction: row;align-items: center;}
.temper_div_title{font-size: 22px;}
.state_tit{padding:4px 12px; background-color:#ff6066; color:#fff; font-weight:500; border-radius: 100px; margin-right:8px; font-size:14px; max-width: 70px;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.temper_div_pow{width: 10px; height:10px; border-radius: 50%; background-color:#ddd;}
.temper_div_pow.on{background-color:#ff6066;}

.temper_div_body_tbox{width:100%; display: flex; flex-direction: row; align-items: center;}
.temper_div_contbox{width:100%; display: flex; flex-direction: column;     align-items: center; margin:16px 0; box-sizing: border-box; padding:5px 10px; }
.temper_div_contbox01{border-right: 1px solid #e1e1e1;}
.temper_div_bd_txt{font-size:12px;color:#999; font-weight: 500;}
.temper_div_bd_titbox{ display: flex; flex-direction: row;}
.temper_div_bd_tit{font-size: 28px; font-weight: bold;display: flex;flex-direction: row;  align-items: center;}
.temper_div_bd_tpoint{font-size:18px;display:inline-block; margin-left: 4px;}

.temper_div_ft{width:100%; margin-top:16px;}
.temper_div_ft_tbox{width:100%;justify-content: space-between;}
.temper_div_ft_txt{font-size:12px; color:#999; font-weight: 500; letter-spacing: -0.5px;}


.temper_div_body_btnbox{width:100%; padding:0px; box-sizing: border-box; background-color:#f3f5f6; border-radius: 16px;}
.temper_div_body_btngrp{display: flex; flex-direction: row;flex-wrap: wrap; padding:8px; box-sizing: border-box;}
.temper_div_body_btnlist{width:50%; }

.temper_div_body_square{width: 100%; position: relative;   box-sizing: border-box;}
.temper_div_body_square:after{content: "";display: block;padding-bottom: 100%;}
.temper_div_body_btn{display: block;position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%); border-radius: 8px; width: calc(100% - 16px);
 height: calc(100% - 16px); background-color:#fff; border-radius: 12px; box-shadow: 2px 4px 8px 0px #2934390A; background-repeat: no-repeat;
background-position: center; background-size: 28px; transition: 0.3s;}
.temper_div_body_btn:hover{background-color:#fff;}
.temper_div_body_btn.speaker{background-image: url('/static/img/web/speaker_icon.png');}
.temper_div_body_btn.motion{background-image: url('/static/img/web/motion_icon.png');}
.temper_div_body_btn.fire{background-image: url('/static/img/web/fire_icon.png');}
.temper_div_body_btn.smoke{background-image: url('/static/img/web/smoke_icon.png'); background-size: 32px;}

.temper_div_body_btn.speaker.on{background-image: url('/static/img/web/on_speaker_icon.png');background-color:#fff; }
.temper_div_body_btn.motion.on{background-image: url('/static/img/web/on_motion_icon.png');background-color:#fff;}
.temper_div_body_btn.fire.on{background-image: url('/static/img/web/on_fire_icon.png');background-color:#fff;}
.temper_div_body_btn.smoke.on{background-image: url('/static/img/web/on_smoke_icon.png');background-color:#fff; background-size: 32px;}

.temper_div_body_btn.speaker.on{background-image: url('/static/img/web/on_speaker_icon.png');background-color:#fff; }
.temper_div_body_btn.motion.on{background-image: url('/static/img/web/on_motion_icon.png');background-color:#fff;}
.temper_div_body_btn.fire.on{background-image: url('/static/img/web/on_fire_icon.png');background-color:#fff;}
.temper_div_body_btn.smoke.on{background-image: url('/static/img/web/on_smoke_icon.png');background-color:#fff; background-size: 32px;}


.toggleSwitch {
    width: 50px;
    height: 26px;
    display: block;
    position: relative;
    border-radius: 30px;
    background-color: #e3e3e3;
    cursor: pointer;
  }
  
   /* 토글 버튼 */
  .toggleSwitch .toggleButton {
    width: 18px;
    height: 18px;
    position: absolute;
    top: 50%;
    left: 4px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #b5b5b5;
  }

  /* 체크박스가 체크되면 변경 이벤트 */
.toggle:checked ~ .toggleSwitch {
    background: #ff6066;
  }
  
  .toggle:checked ~ .toggleSwitch .toggleButton {
    left:calc(100% - 22px);
    background: #fff;
  }
  
  .toggleSwitch, .toggleButton {
    transition: all 0.2s ease-in;
  }

.pop_num_setbox{display: flex; flex-direction: row;     align-items:flex-end; padding:20px; box-sizing: border-box; justify-content: center;}
.pop_num_setbox{padding:40px 0;}
.pop_num_set_inp{border:0;font-size: 48px; font-weight:bold; width:100%; text-align: center; max-width: 100px;background-color:transparent;}
.pop_num_set_inp::placeholder{color:#b8b8b8;}
.pop_num_set_inp:focus{outline: none;}

.pop_num_set_txt{font-size: 14px; color:#666; font-weight: 400;}

.pop_sensor_grp01 .pop_cont_flexbox{width: 100%; display: flex; flex-direction: row;    flex-wrap: wrap; column-gap: 20px;}
.pop_sensor_grp01 .pop_cont_flexbox .pop_cont_sub_box{position: relative; margin-top: 20px;;}
.pop_sensor_grp01 .pop_cont_sub_width01{width:380px;}
.pop_sensor_grp01 .pop_cont_sub_width02{width:calc(100% - 400px);}
.pop_sensor_grp01 .pop_count_setbox{margin-bottom: 60px;}
.pop_sensor_grp01 .pop_count_set_txt{margin-top:60px;}
.pop_sensor_grp01 .pop_cont_flexbox .pop_cont_sub_box:last-child{margin-right:0;}

.pop_sensor_grp01 .pop_cont_flexbox .pop_cont_sub_box.off{position: relative; opacity: 0.5;}
.pop_sensor_grp01 .pop_cont_flexbox .pop_cont_sub_box.off .off_box{position: absolute; top:0; left: 0; width:100%; height:100%;  border-radius: 12px;}
.pop_sensor_grp01 .pop_cont_flexbox .pop_cont_sub_box .pop_cont_box{margin-right: 0;}
.pop_sensor_grp01 .pop_cont_table_bdbox{height:415.5px; overflow-y: auto;}

.pop_cont_tablebox{width:100%;position: relative; box-shadow: 2px 4px 8px 0px #2934390a; background-color: #fff;overflow: hidden; border-radius: 12px;}
.pop_cont_table{border-collapse: collapse; width:100%;}
.pop_cont_table_bdbox{height:455.5px; overflow-y: auto;}


.pop_cont_table_hdbox{width:100%; border-radius: 12px 12px 0 0;box-shadow: 2px 4px 8px 0px #2934390a;z-index: 9;position: relative;;}
.pop_cont_table_hd{width:100%;}
.pop_cont_table_th{padding:14px; text-align: left; color:#9ca2a9; font-size: 14px; font-weight: 600;}
.pop_cont_table_td{padding:14px; text-align: left; color:#333; font-weight: 400; font-size: 14px;}
.pop_cont_table_bd tr{border-bottom:1px solid #eee;}
.pop_cont_table_bd tr:first-child{border-bottom: 1px solid #eee;;}
.pop_cont_table_bd tr:last-child{border-bottom: 0;}





/* 화재 감지 */
.pop_sensor_grp02 .pop_cont_flexbox{width: 100%; display: flex; flex-direction: row;    flex-wrap: wrap; column-gap: 20px;}
.pop_sensor_grp02 .pop_cont_flexbox .pop_cont_sub_box{width:calc(33.3333% - 13.4px);position: relative; margin-top: 20px;;}
.pop_sensor_grp02 .pop_cont_flexbox .pop_cont_sub_box:last-child{margin-right:0;}

.pop_sensor_grp02 .pop_cont_flexbox .pop_cont_sub_box.off{position: relative; opacity: 0.5;}
.pop_sensor_grp02 .pop_cont_flexbox .pop_cont_sub_box.off .off_box{position: absolute; top:0; left: 0; width:100%; height:100%;  border-radius: 12px;}
.pop_sensor_grp02 .pop_cont_flexbox .pop_cont_sub_box .pop_cont_box{margin-right: 0;}

.pop_sensor_grp02 .pop_count_setbox{margin-bottom: 60px;}
.pop_sensor_grp02 .pop_count_set_txt{margin-top:60px;}

.pop_sensor_grp02 .pop_cont_table_bdbox{height:453.5px; overflow-y: auto;}

.pop_sensor_grp02 .pop_count_setbox{width:100%;}
.pop_count_set_txt{width:100%; font-size: 16px; text-align: center; color:#666; font-weight: 500;margin-top:40px;}
.pop_count_set_numbox{display: flex; flex-direction: row; align-items: center;  justify-content: center; margin-top: 20px;;}

.pop_count_set_inpbox{width:180px; height:180px;border:4px dotted #ccc; box-sizing: border-box; border-radius: 100%;    display: flex;
    flex-direction: row;justify-content: center;align-items: center; padding:20px; margin:0 20px;}
.pop_count_set_inp{width:100%; border:0; text-align: center; font-size: 58px; font-weight: bold; max-width: 100px;background-color:transparent;}
.pop_count_set_inp::placeholder{color:#b8b8b8;}
.pop_count_set_inp:focus{outline:none;}

.pop_count_set_num_btn{width:60px; height:60px; background-size: 25px; border:3px solid #ccc; background-repeat: no-repeat; background-position: center;  border-radius: 50%;
transition: 0.3s; box-sizing: border-box;}
.pop_count_set_num_btn.plus{background-image: url(/static/img/web/def_plus_btn.png);}
.pop_count_set_num_btn.minus{background-image: url(/static/img/web/def_minus_btn.png);}

.pop_count_set_num_btn.plus:hover{background-image: url(/static/img/web/hov_plus_btn.png);border:3px solid #ff6066; }
.pop_count_set_num_btn.minus:hover{background-image: url(/static/img/web/hov_minus_btn.png);border:3px solid #ff6066; }

.pop_count_set_inp_color{color:#fe4047; padding:0;}
.pop_count_set_inp_color02{color:#7787ff; padding:0;}
.pop_count_set_inptxt{color:#b8b8b8; font-size:20px; font-weight: bold;padding-top:22px;}

.pop_cont_table_bdbox.none{display: flex; flex-direction: column;     align-items: center;justify-content: center;}
.pop_cont_table_none_txt{color:#9ca2a9; font-weight: 400; font-size: 16px;}

/* 온습도 설정 */
.pop_sensor_grp03 .pop_cont_flexbox{width: 100%; display: flex; flex-direction: row;    flex-wrap: wrap; column-gap: 20px;}
.pop_sensor_grp03 .pop_cont_flexbox .pop_cont_sub_box{width:calc(33.3333% - 13.4px);position: relative; margin-top: 20px;;}
.pop_sensor_grp03 .pop_cont_flexbox .pop_cont_sub_box:last-child{margin-right:0;}

.pop_sensor_grp03 .pop_cont_flexbox .pop_cont_sub_box.off{position: relative; opacity: 0.5;}
.pop_sensor_grp03 .pop_cont_flexbox .pop_cont_sub_box.off .off_box{position: absolute; top:0; left: 0; width:100%; height:100%;  border-radius: 12px;}
.pop_sensor_grp03 .pop_cont_flexbox .pop_cont_sub_box .pop_cont_box{margin-right: 0;}

.pop_sensor_grp03 .pop_count_setbox{margin-bottom: 80px;}
.pop_sensor_grp03 .pop_count_set_txt{margin-top:80px;}

.pop_sensor_grp03 .pop_cont_table_bdbox{height:453.5px; overflow-y: auto;}
.pop_count_set_txt_color{color:#ff0000;}
.pop_sensor_grp03 .pop_count_setbox{width:100%;}

/* 스피커 설정 */
.pop_sensor_grp04 .pop_cont_flexbox{width: 100%; display: flex; flex-direction: row;    flex-wrap: wrap; column-gap: 20px;}
.pop_sensor_grp04 .pop_cont_flexbox .pop_cont_sub_box{width:100%;position: relative; margin-top: 20px;;}
.pop_sensor_grp04 .pop_cont_flexbox .pop_cont_sub_box:last-child{margin-right:0;}

.pop_sensor_grp04 .pop_cont_flexbox .pop_cont_sub_box.off{position: relative; opacity: 0.5;}
.pop_sensor_grp04 .pop_cont_flexbox .pop_cont_sub_box.off .off_box{position: absolute; top:0; left: 0; width:100%; height:100%;  border-radius: 12px;}
.pop_sensor_grp04 .pop_cont_flexbox .pop_cont_sub_box .pop_cont_box{margin-right: 0;}

.pop_sensor_grp04 .pop_count_setbox{margin-bottom: 80px;}
.pop_sensor_grp04 .pop_count_set_txt{margin-top:80px;}

.pop_sensor_grp04 .pop_cont_table_bdbox{height:auto;min-height: 300px;max-height:360.5px; overflow-y: auto;}


.pop_sensor_grp04 .pop_count_setbox{width:100%;}

.pop_sensor_grp04 .pop_cont_titbox{display: flex; flex-direction: row; align-items: center;}
.pop_sensor_grp04 .pop_cont_titbox .pop_cont_tit{margin-right: 12px;}


.pop_cont_sub_txt{font-size:14px; color:#999;}

.pop_sensor_grp04 .pop_cont_table_bd tr:nth-child(2n){background-color: #fff;}

.pop_sensor_grp04 .pop_cont_table_td{padding: 10px 14px;;}
.pop_cont_table_bd_grp{width:100%;}
.volume_size_warp{display: flex; flex-direction: row; align-items: center;     justify-content: space-between;}




.volume_size_number{font-size: 28px; font-weight: bold;border:0;width:52px; padding: 0;text-align: right;background-color:transparent;}
.volume_size_number:focus{outline: none;}

.volume_size_box{display: flex; flex-direction: row; align-items: center;}
.volume_size_listbox{display: flex; flex-direction: row;align-items: center; }
.volume_size_list{width: 10px; height: 15px; padding-right: 4px; box-sizing:border-box; }
.volume_size_list .volume_size_list_bg{width:6px; height:15px;background-color:#ddd;}
.volume_size_list_color .volume_size_list_bg{width:6px; height:15px;background-color:#ff6066;}
.volume_size_list:last-child{margin-right: 0;}


.volume_size_btn{width:20px; height:20px; background-size: 10px; border:1px solid #ccc; background-repeat: no-repeat; background-position: center;  border-radius: 50%;
    transition: 0.3s; box-sizing: border-box;}
.volume_size_btn.volume_size_up{background-image: url(/static/img/web/def_plus_btn02.png); margin-left: 8px;}
.volume_size_btn.volume_size_down{background-image: url(/static/img/web/def_minus_btn02.png);margin-right: 8px;}

.volume_size_btn.volume_size_up:hover{background-image: url(/static/img/web/w_hov_plus_btn.png);border:1px solid #ff6066; background-color:#ff6066 ; }
.volume_size_btn.volume_size_down:hover{background-image: url(/static/img/web/w_hov_minus_btn.png);border:1px solid #ff6066; background-color:#ff6066 ;}

.table_center{text-align: center;}

.not_used_tr{opacity: 0.25;}
.not_used_tr .default_btn:hover{cursor: default; }
/* .not_used_tr .toggleSwitch:hover{cursor: default; } */
.not_used_tr .volume_size_number:hover{cursor: default; }

.not_used_tr .volume_size_btn:hover{border:1px solid #ccc; }
.not_used_tr .volume_size_btn.volume_size_down:hover{cursor: default;background-image: url(/static/img/web/def_plus_btn02.png);background-color:#fff;}
.not_used_tr .volume_size_btn.volume_size_up:hover{cursor: default;background-image: url(/static/img/web/def_minus_btn02.png);background-color:#fff;}


.pop_cont_title_inpwidth{margin-right:12px;}
.pop_cont_title_inpwidth:last-child{margin-right: 0;}
.pop_cont_title_inpwidth01{width:250px;}
.pop_cont_title_inpwidth02{width:258px;}
.pop_cont_title_inpwidth03{width:120px;}
.pop_cont_title_inpwidth .volume_size_list .volume_size_list_bg{background-color:#ccc;}
.pop_cont_title_inpwidth .volume_size_list_color .volume_size_list_bg{width:6px; height:15px;background-color:#ff6066;}

.pop_cont_table_bottom_btnbox{width:100%;padding:14px; box-sizing: border-box;box-shadow: 2px -4px 8px 0px #2934390a;}
.pop_cont_table_bottom_btnbox .pkey_btn_list_box{ width:155px;}

/* tooltip */

[data-tooltip-text]:after {
	-webkit-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
	-moz-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
	transition: bottom .3s ease-in-out, opacity .3s ease-in-out;

	background-color: rgba(0, 0, 0, 0.8);

  -webkit-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
	-moz-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
	box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
	
  -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	
  color: #FFFFFF;
	font-size: 12px;
	margin-bottom: 10px;
	padding: 7px 12px;
	position: absolute;
	width: auto;
	min-width: 50px;
	max-width: 300px;
	word-wrap: break-word;

	z-index: 9999;

	opacity: 0;
	left: -9999px;
  	top: 90%;
	min-width:max-content;
	content: attr(data-tooltip-text);
	line-height:15px;
}

[data-tooltip-text]:hover:after {top: 55px;left: 50%; transform: translateX(-50%); opacity: 1;}


.page_mv_wrap{position: fixed; bottom: 40px; right:40px; z-index: 9;}

.page_mv_btn{margin-bottom: 12px;}
.page_mv_btn:last-child{margin-bottom: 0;}
/* 채팅 바로 가기 */
.chat_count_icon{ width:80px; height: 80px; border-radius: 50%; background-color: rgba(46,49,149, 0.85);
    box-shadow: 2px 4px 8px 0px #2934390A; display: flex; display: flex; position: relative;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 99999;}
.chat_count_talk_icon{ width: 40px; height: 40px;position: absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.chat_count_talk_icon img{width:100%; }
.notice_color{position: absolute; display: flex; flex-direction: column; top:-5px; right:-5px; width:40px; height:40px; background-color:#ff4a52; color:#fff;
    justify-content: center; align-items: center; font-size: 16px; font-weight: bold; border-radius: 50%;}


/* 객실상태 알림 */

.room_notice_btn{ display: block; width:80px; height:80px; border-radius: 50%; z-index: 9;
    box-shadow: 2px 4px 8px 0px #2934390a;transition: 0.3s; background:linear-gradient(45deg, #ff151e, #ff92d3); transition: 0.3s;}
    .room_notice_btn:hover{background:linear-gradient(45deg, #ff323a, #ffa1e6);}
    .room_notice_btn img{width:40px; height:40px; position: absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
    .room_notice_grp{position: relative; width:100%; height: 100%; display: block;}
    .room_notice{position: absolute; display: flex; flex-direction: column; top:-5px; right:-5px; width:40px; height:40px; background-color:#ff4a52; color:#fff;
        justify-content: center; align-items: center; font-size: 16px; font-weight: bold; border-radius: 50%;}

.room_notice_wrap{width: 330px; overflow: hidden; position: fixed; bottom:40px; right:40px; border-radius: 12px; background-color:#fff; box-shadow: 4px 4px 14px 5px #333f4424;
z-index: 10;}
.room_notice_hd{padding:16px; box-sizing: border-box; background:linear-gradient(45deg, #ff6066, #ff969a); position: relative;}
.room_notice_hd_tit{color:#fff;}
.room_notice_hd_tit01{font-size:22px;}
.room_notice_hd_tit02{font-size:14px; font-weight:400;}

.hd_close_btn{display: block; width: 33px; height:33px; background-position: center; background-repeat: no-repeat; background-size:20px;
    background-image: url('/static/img/mobile/door/w_close_icon.png'); position: absolute; top:16px; right: 16px;;}

.room_notice_body{padding:16px; box-sizing:border-box; height: 470px;  overflow-y: auto;}
.room_notice_list{margin-bottom:12px; border-radius: 12px; background-color:#f3f5f6;padding:10px 12px; box-sizing:border-box;}
.room_notice_list:last-child{margin-bottom:0;}

.room_notice_num_tit01{color:#000; font-size:18px;font-weight:bold;}
.room_notice_num_txt01{color:#333; font-size:12px;font-weight:400; margin-left: 8px;display: inline-block;padding:3px 8px; border-radius:50px; background:#ddd; }
.room_notice_num_txt02{color:#333; font-size:14px; margin-top: 4px; font-weight: 400;}

.room_notice_ft{ background:linear-gradient(45deg, #ff6066, #ff969a);}
.room_notice_refresh_btn{padding:16px; box-sizing:border-box; display:block; text-align: center; color:#fff; font-size: 16px;font-weight: bold;;}
.dis_flex_row_center{display: flex; flex-direction: row;align-items: center; width:100%;}

.text_over{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

/* 도어락 관리 */


.chk_box { display: block; position: relative; width:20px; height:20px; margin:0 auto; border-radius: 4px; overflow: hidden;
    cursor: pointer; font-size: 14px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

/* 기본 체크박스 숨기기 */
.chk_box input[type="checkbox"] { display: none; }

/* 선택되지 않은 체크박스 스타일 꾸미기 */
.chk_box .on { width: 20px; height: 20px; background: #eee; position: absolute; top: 0; left: 0; }

/* 선택된 체크박스 스타일 꾸미기 */
.chk_box input[type="checkbox"]:checked + .on { background: #ff6066; }
.chk_box .on:after { content: ""; position: absolute; display: none; }
.chk_box input[type="checkbox"]:checked + .on:after { display: block; }
.chk_box .on:after { width: 6px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); 
    -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; left: 6px; top: 2px; }

.pop_td_widthbox{width:100%; display: flex; flex-direction: row; align-items: center;}
.pop_td_width{margin-right:12px;}
.pop_td_width:last-child{margin-right: 0;}

.door_state{width: 12px; height: 12px; border-radius: 50px; margin-right: 12px; display: inline-block;}
.door_on{background:#ff6066;}
.door_off{background:#ddd;}

.cardkey_widthbox{width: 100%;}
.cardkey_width{margin-right: 20px;}
.cardkey_width:last-child{margin-right: 0;}

.cardlist_widthbox{width: 100%;}
.cardlist_widthbox01 .cardlist_width{width:100%; margin-right: 8px;}
.cardlist_widthbox01 .cardlist_width:last-child{margin-right: 0;}

.cardlist_widthbox02{flex-direction: column;}
.cardinp_widthbox{display: flex; flex-direction: row; align-items: center; width: 100%;;}
.cardinp_selelct{max-width: 60px; min-width:60px}
.cardinp_width{margin-right: 8px;}
.cardinp_width:last-child{margin-right: 0;}
.time_right{margin-right: 8px;}
.time_right:last-child{margin-right: 0;}
.cardlist_widthbox02 .cardinp_width01{width: 100%;}
.time_infinite{display: flex; flex-direction: row;}
.time_infinite .setup_title {margin-bottom:0;margin-right:12px;}
.last_margin_bottom20{margin-bottom: 20px;}
.last_margin_bottom20:last-child{margin-bottom: 0;}

.top_setup_title{margin-bottom:0;margin-right:12px;}

.search_cardkey_lisy{width:100%;}
.search_cardkey_lisy_width{margin-right: 8px;}
.search_cardkey_lisy_width:last-child{margin-right:0}


.motion_text_box{border-radius: 15px;  background-color:#fff; box-shadow:2px 6px 8px 0px #29343926; position:fixed;top:-150px;  left:50%; transform: translateX(-50%);
display:flex; flex-direction:row; align-items:center;padding-right:120px; box-sizing:border-box;overflow:hidden;z-index: 1; transition: 0.3s;}
.motion_text_box.motion{top:20px;}
.motion_state_box{display:flex; flex-direction:row; align-items:center;padding:20px; box-sizing: border-box; }
.motion_state {padding:6px 12px; display:inline-block; background-color:#ff0000; color:#fff; font-size:16px;border-radius: 50px;font-weight:500;margin-right:12px;}
.motion_text_tit{font-size:18px; font-weight:400;}
.motion_text_tit > em{color:#ff0000; font-weight:bold;}

.motion_btn_box{width:120px;height:100%; position: absolute; top:0; right:0;}
.motion_btn{display:flex;flex-direction: row; align-items: center; justify-content:center; width:100%; height:100%; font-size:18px; color:#fff;
     background:linear-gradient(45deg, #ff151e, #ff898d); font-weight:bold;}


 /* 요일 설정 pop */
 .relayauto_inp_cont_box{display: flex; flex-direction: row;}
 .relayauto_inp_cont_box .pop_cont_inp_box{margin-right: 20px;}
 .relayauto_inp_cont_box .pop_cont_inp_box:last-child{margin-right: 0;}
 .relayauto_selbox_widthbox{display: flex; flex-direction: row;}
 .relayauto_selbox_width{margin-right: 12px;}
 .relayauto_selbox_width:last-child{margin-right: 0;}
 .relayauto_selbox_width select{min-width:75px;}

 /* 릴레이보드 설정 */





.relay_power_tab_ul{background-color:#f3f5f6; border-radius: 12px; padding:8px; box-sizing: border-box; display: flex; box-shadow: 2px 4px 8px 0px #2934390a;}
.relay_power_tab_li{margin-right: 12px;width:100%;}
.relay_power_tab_li:last-child{margin-right: 0;}


.relay_power_button{display:flex; flex-direction: row; align-items: center; justify-content: center;width:100%;height:70px; border-radius: 12px; transition:0.3s;}
.relay_power_button .relay_icon{display: block; width:40px; height:40px; background-size:100% ;background-position:center;background-repeat: no-repeat;}
.relay_power_button .relay_icon.light{background-image: url(/static/img/web/light_icon.png);}
.relay_power_button .relay_icon.tv{background-image: url(/static/img/web/tv_icon.png);}
.relay_power_button .relay_icon.airc{background-image: url(/static/img/web/airc_icon.png);}
.relay_power_button .relay_icon.curtain{background-image: url(/static/img/web/curtain_icon.png);}
.relay_power_button .relay_icon.regulator{background-image: url(/static/img/web/regulator_icon.png);}

.relay_power_button.active .relay_icon.light{background-image: url(/static/img/web/on_light_icon.png);}
.relay_power_button.active .relay_icon.tv{background-image: url(/static/img/web/on_tv_icon.png);}
.relay_power_button.active .relay_icon.airc{background-image: url(/static/img/web/on_airc_icon.png);}
.relay_power_button.active .relay_icon.curtain{background-image: url(/static/img/web/on_curtain_icon.png);}
.relay_power_button.active .relay_icon.regulator{background-image: url(/static/img/web/on_regulator_icon.png);}


.relay_power_button:hover{background-color: #ddd;}    
.relay_power_button.active{ background-color:#fff;box-shadow: 2px 4px 8px 0px #2934390a;color:#ff6066; }



.relay_sett_ul{display: flex; flex-direction: row; margin-top: 20px; gap: 20px;flex-direction: row; flex-wrap: wrap;}

.relay_sett_li{width:calc(25% - 15px);opacity: 0.65;}
.relay_sett_li.on{opacity: 1;}
.relay_sett_top_tit{font-size: 24px;}
.relay_sett_li .power_icon{display: block; width: 30px; height:30px; background-repeat: no-repeat; background-position: center; background-size: 100%;
background-image: url(/static/img/web/switch_off.png); margin-right:12px;}
.relay_sett_li.on .power_icon{background-image: url(/static/img/web/switch_on.png);}
.relay_sett_topbox{margin-bottom: 20px;;}
.chk_box_tit{font-weight: 500; font-size: 13px; padding-left: 8px; color:#666}

.relay_sett_li .relay_power_tab_ul{margin-top: 20px;}
.relay_sett_li .relay_power_tab_li{margin-right: 8px;}
.relay_sett_li .relay_power_tab_ul .relay_power_button{height:56px;}
.relay_sett_li .relay_power_tab_ul .relay_power_button .relay_icon{width:30px;}

.right_active_navbtn{display:none; width:80px; height:80px; position: fixed; bottom:40px; left:40px; background-color:#fff; transition: 0.3s; border-radius: 50%;
    box-shadow: 4px 4px 14px 5px #333f4424; background-position: center; background-size: 45px; background-repeat: no-repeat; background-image: url(/static/img/web/r_menu_icon.png);
z-index: 99;}
.right_active_navbtn:hover{background-color: #ff6066;background-image: url(/static/img/web/w_menu_icon.png);}

.close_active_navbtn{display:none; width:80px; height:80px; position: fixed; bottom:40px; left:160px; background-color:#fff; transition: 0.3s; border-radius: 50%;
    box-shadow: 4px 4px 14px 5px #333f4424; background-position: center; background-size: 45px; background-repeat: no-repeat; background-image: url(/static/img/web/r_arrow_icon.png);
z-index: 99;}
.close_active_navbtn:hover{background-color: #ff6066;background-image: url(/static/img/web/w_arrow_icon.png);}


.right_active_navbtn{display:none;}
.close_active_navbtn{display: none;}


@media (min-width: 100px) and (max-width: 1728px) {
    .left_menu_acco{z-index: 11;position: fixed;}
    .right_contbox{padding: 80px 30px 30px 30px !important;}
    .left_menu_acco{left:-280px;}

    .right_active_navbtn{display:block;}
    .close_active_navbtn{display:block;}

    .popup_wrap{overflow: auto;}
    .popup_contbox{overflow: auto;}

    /* .motion_text_box{display: none !important;} */
} 

/* 언어 선택 */
.lang_box{position: absolute; top:20px; left: 310px; box-sizing: border-box; display: flex; flex-direction: row; align-items: center; background-color: #fff;
    border-radius: 8px;padding-left: 12px;box-shadow: 2px 4px 8px 0px #2934390a; transition: 0.3s;}
    .lang_box:hover{box-shadow: 2px 4px 8px 0px #2934391c;}
.lang_icon{width: 22px; height: 22px;;}
.lang_icon img{width: 100%;}
.lang_select{height: 40px;cursor: pointer;  border-radius: 8px; padding:0 8px; padding-left: 12px; font-size: 16px;outline:none;padding-right: 25px;border: 0;font-weight: 500;     
    -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image:url('/static/img/opener/down_icon.png'); background-repeat:no-repeat;
    background-position:right 8px center; background-size:14px; }