@charset "utf-8";

#commu-dialog-report {
    height: 100%;
    width: 100%;
    padding: 16px 48px;
    overflow-y: scroll;
}

.commu-dialog-report-block {
    margin-bottom: calc(40px - 16px);
    padding: 16px;
}
.commu-dialog-report-block:last-child {
    margin-bottom: 0;
}
.commu-dialog-report-type-problem {
    background: #FFF4CF;
}

.commu-dialog-report-header {
    position: relative;
    height: 20px;
    line-height: 20px;
    width: 512px;
    border-bottom: 1px solid #808080;
    font-size: 0;

}
.commu-dialog-report-header .owner-icon {
    position: absolute;
    top: 2px;
    left: 0;
    height: 16px;
    width: 16px;
    border-radius: 8px;
}
.commu-dialog-report-inner-header {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}
.commu-dialog-report-inner-header .report-type-name {
    display: inline-flex;
    font-size: 12px;
    margin-right: 8px;
    height: inherit;
    /* インナーヘッダー幅: 100% - アイコン~件数マージン: 8px - 件数幅: 24px */
    max-width: calc(100% - 24px - 8px);
    font-weight: bold;
}
.commu-dialog-report-inner-header .report-type-name .inner-report-type-name {
    height: inherit;
    width: inherit;
    /** 三点リーダー表示設定 - ここから **/
    overflow: hidden;
    word-break: break-all;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    /** 三点リーダー表示設定 - ここまで **/
}

.commu-dialog-report-inner-header .ticket-count {
    display: inline-block;
    font-size: 10px;
    width: 24px;
    color: #BCBCBC;
}

.commu-dialog-report-content {
    width: 512px;
    margin-top: 16px;
    font-size: 0;
}
.commu-dialog-report-content .member-ticket {
    position: relative;
    display: inline-block;
    margin-bottom: 16px;
}
.commu-dialog-report-content .member-ticket:nth-child(odd) {
    margin-right: 16px;
}
.commu-dialog-report-content .member-ticket:nth-child(even) {
    margin-left: 0;
}

.commu-dialog-report-content .ticket-title {
    position: relative;
    display: inline-block;
    margin-top: 8px;
}
.commu-dialog-report-content .ticket-title:first-child {
    margin-top: 0;
}