/* _content/Clevi.App.Components.SmartConnect/CreateDeviceGroupDialog.razor.rz.scp.css */

.cl-project_dialog[b-ua4x0jhx2r] {
    padding: 0 10px;
}

    .cl-project_dialog .thumb[b-ua4x0jhx2r] {
        margin-bottom: 10px;
    }

    .cl-project_dialog .thumb[b-ua4x0jhx2r] {
        margin-bottom: 10px;
    }

        .cl-project_dialog .thumb .pro-dialog_title[b-ua4x0jhx2r] {
            display: flex;
            justify-content: space-between;
            -webkit-justify-content: space-between;
        }

            .cl-project_dialog .thumb .pro-dialog_title .clc-button[b-ua4x0jhx2r] {
                height: fit-content;
            }

        .cl-project_dialog .thumb .clc-textarea[b-ua4x0jhx2r], .cl-project_dialog .thumb .clc-textbox[b-ua4x0jhx2r] {
            width: 100%;
        }

        .cl-project_dialog .thumb .table-responsive[b-ua4x0jhx2r] {
            margin-top: 10px;
        }

        .cl-project_dialog .thumb:last-child[b-ua4x0jhx2r] {
            display: flex;
            justify-content: space-between;
            -webkit-justify-content: space-between;
        }

            .cl-project_dialog .thumb:last-child .clc-button[b-ua4x0jhx2r] {
                width: 70px;
            }

        .cl-project_dialog .thumb .content[b-ua4x0jhx2r] {
            display: flex;
            flex-direction: column;
            -webkit-flex-direction: column;
        }

            .cl-project_dialog .thumb .content span[b-ua4x0jhx2r] {
                font-size: 12px;
                color: #757575;
                text-indent: 3px;
            }
/* _content/Clevi.App.Components.SmartConnect/DeviceGroupTreeItem.razor.rz.scp.css */
/**
 * Framework starts from here ...
 * ------------------------------
 */

.tree[b-l7o0lhzvbh],
.tree ul[b-l7o0lhzvbh] {
    margin: 0 0 0 1em; /* indentation */
    padding: 0;
    list-style: none;
    color: #369;
    position: relative;
}

    .tree ul[b-l7o0lhzvbh] {
        margin-left: .5em
    }
        /* (indentation/2) */

        .tree[b-l7o0lhzvbh]:before,
        .tree ul[b-l7o0lhzvbh]:before {
            content: "";
            display: block;
            width: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 4px;
            border-left: 3px solid;
        }

ul.tree[b-l7o0lhzvbh]:before {
    border-left: none
}

.tree li[b-l7o0lhzvbh] {
    margin: 0;
    padding: 0 1.5em; /* indentation + .5em */
    line-height: 2em; /* default list item's `line-height` */
    font-weight: bold;
    position: relative;
}

.tree container[b-l7o0lhzvbh], .tree folder[b-l7o0lhzvbh] {
    display: block;
}



.tree li[b-l7o0lhzvbh]:before {
    content: "";
    display: block;
    width: 10px; /* same with indentation */
    height: 0;
    border-top: 1px dashed;
    margin-top: -1px; /* border top width */
    position: absolute;
    top: 1em; /* (line-height/2) */
    left: 4px;
}

ul.tree > li[b-l7o0lhzvbh]:before {
    border-top: none;
}

.tree li:last-child[b-l7o0lhzvbh]:before {
    background: white; /* same with body background */
    height: auto;
    top: 1em; /* (line-height/2) */
    bottom: 0;
}
/* _content/Clevi.App.Components.SmartConnect/Pages/DeviceList.razor.rz.scp.css */

.cl-timelist_wrap[b-c0hygm04mx] {
    display: flex;
    flex-wrap: wrap;
}
    /*.status-wrap{
    margin-bottom:0px;
}
.status-wrap .status{
    margin-right:30px !important;
    
}
.status-wrap .status i{
    margin-right:5px !important;
    font-size:13px;
}*/

    .cl-timelist_wrap .card[b-c0hygm04mx] {
        width: 320px;
        min-height: 200px;
        padding: 15px;
        box-shadow: 1px 1px 8px #8585851f;
        -webkit-box-shadow: 1px 1px 10px #8585851f;
        border-radius: 10px;
        border: 1px solid #ededed;
        position: relative;
        margin: 0 15px 20px 0;
    }

        .cl-timelist_wrap .card .top[b-c0hygm04mx] {
            margin-top: 5px;
            margin-bottom: 10px;
            display: flex;
        }

        .cl-timelist_wrap .card .desc[b-c0hygm04mx] {
            position: absolute;
            top: 20px;
            right: 5px;
            width: 52%;
            margin-right: 5px;
        }

            .cl-timelist_wrap .card .desc h4[b-c0hygm04mx] {
                font-size: 18px;
                margin: auto 0;
                width: 100%;
                text-overflow: ellipsis;
                overflow: hidden; /* 내용이 길면 감춤니다 */
                display: block;
                word-wrap: break-word;
                word-break: break-all;
                white-space: nowrap;
                text-align: right;
            }

        .cl-timelist_wrap .card .top img[b-c0hygm04mx] {
            width: 40px;
            height: 40px;
            float: left;
            margin-right: 10px;
        }

        .cl-timelist_wrap .card .top h5[b-c0hygm04mx] {
            font-size: 16px;
            margin: auto 0;
            word-wrap: break-word;
            word-break: break-all;
            white-space: break-spaces;
            color: #7b7b7b;
        }

        .cl-timelist_wrap .card .img[b-c0hygm04mx] {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
            opacity: 0.15;
            width: 55%;
            object-fit: contain;
        }

        .cl-timelist_wrap .card .status[b-c0hygm04mx] {
            /*position: absolute;
            top: -10px;
            right:0;*/
            font-size: 13px;
        }

            .cl-timelist_wrap .card .status i[b-c0hygm04mx] {
                font-size: 11px;
                margin-right: 10px;
            }




        .cl-timelist_wrap .card .bottom[b-c0hygm04mx] {
            /*            flex-grow: 1;
            display: flex;*/
        }

            .cl-timelist_wrap .card .bottom .cl-timelist-messages[b-c0hygm04mx] {
                height: 90px;
                overflow-y: visible;
            }

                .cl-timelist_wrap .card .bottom .cl-timelist-messages p[b-c0hygm04mx] {
                    margin-top: 0px;
                    margin-bottom: 4px;
                    font-size: 12px;
                    text-overflow: ellipsis;
                    word-break: break-all;
                    -webkit-line-clamp: 3;
                    overflow: hidden;
                }

            .cl-timelist_wrap .card .bottom .buttons[b-c0hygm04mx] {
                /*position: absolute;*/
                bottom: 8px;
                left: 10px;
            }
/* _content/Clevi.App.Components.SmartConnect/Pages/DeviceListSimple.razor.rz.scp.css */



/*심플리스트 시작*/

.cl-timelist_wrap-simple[b-8bmmwdqvuq] {
    display: flex;
    flex-wrap: wrap;
}

    .cl-timelist_wrap-simple .card[b-8bmmwdqvuq] {
        /*        width: 320px;
        height: 200px;*/
        padding: 7px;
        box-shadow: 1px 1px 8px #8585851f;
        -webkit-box-shadow: 1px 1px 10px #8585851f;
        border-radius: 10px;
        border: 1px solid #ededed;
        position: relative;
        margin: 1px 1px 1px 1px;
        max-width: 280px;
        min-width: 120px;
    }

        .cl-timelist_wrap-simple .card .top[b-8bmmwdqvuq] {
            margin-top: 5px;
            margin-bottom: 10px;
            display: flex;
        }

        .cl-timelist_wrap-simple .card .desc[b-8bmmwdqvuq] {
            /*position: absolute;*/
            /*            top: 20px;
            right: 5px;
            width: 52%;
            margin-right: 5px;*/
        }

            .cl-timelist_wrap-simple .card .desc h4[b-8bmmwdqvuq] {
                font-size: 16px;
                margin: auto 0;
                width: 100%;
                text-overflow: ellipsis;
                overflow: hidden; /* 내용이 길면 감춤니다 */
                display: block;
                word-wrap: break-word;
                word-break: break-all;
                white-space: nowrap;
                text-align: right;
            }

        .cl-timelist_wrap-simple .card .top img[b-8bmmwdqvuq] {
            width: 40px;
            height: 40px;
            float: left;
            margin-right: 10px;
        }

        .cl-timelist_wrap-simple .card .top h5[b-8bmmwdqvuq] {
            font-size: 16px;
            margin: auto 0;
            word-wrap: break-word;
            word-break: break-all;
            white-space: break-spaces;
            color: #7b7b7b;
        }

        .cl-timelist_wrap-simple .card .img[b-8bmmwdqvuq] {
            /*position: absolute;*/
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
            opacity: 0.15;
            width: 55%;
            object-fit: contain;
        }

        .cl-timelist_wrap-simple .card .status[b-8bmmwdqvuq] {
            /*position: absolute;
            top: -10px;
            right:0;*/
            font-size: 13px;
        }

            .cl-timelist_wrap-simple .card .status i[b-8bmmwdqvuq] {
                font-size: 11px;
                margin-right: 10px;
            }




        .cl-timelist_wrap-simple .card .bottom[b-8bmmwdqvuq] {
            flex-grow: 1;
            display: flex;
        }

            .cl-timelist_wrap-simple .card .bottom .cl-timelist-messages[b-8bmmwdqvuq] {
                height: 35px;
                overflow-y: visible;
            }

                .cl-timelist_wrap-simple .card .bottom .cl-timelist-messages p[b-8bmmwdqvuq] {
                    margin-top: 0px;
                    margin-bottom: 4px;
                    font-size: 12px;
                    text-overflow: ellipsis;
                    word-break: break-all;
                    -webkit-line-clamp: 3;
                    overflow: hidden;
                }

            .cl-timelist_wrap-simple .card .bottom .buttons[b-8bmmwdqvuq] {
                /*position: absolute;*/
                bottom: 8px;
                left: 10px;
            }
/*심플리스트 끝*/