/*
v3.4 에서 추가된 CSS
*/

/* 폰트 호환성 개선 */
BODY,
TD,
DIV,
FORM,
TEXTAREA,
CENTER,
OPTION,
PRE,
INPUT,
P,
BLOCKQUOTE,
BR,
A:link,
A:visited,
A:hover,
A:active,
A.mnwhite:link,
A.mnwhite:visited,
A.mnwhite:hover,
A.mnwhite:active,
A.tit:link,
A.tit:visited,
A.tit:hover,
A.tit:active,
A.mn:link,
A.mn:visited,
A.mn:hover,
A.mn:active,
.inputbox,
.select,
.nmail_menu A:link,
.nmail_menu A:visited,
.nmail_menu A:hover,
.nmail_menu A:active,
.nm_number a:hover,
A.tit_top:link,
A.tit_top:visited,
A.tit_top:hover,
A.tit_top:active {
    /*font-family: 'Malgun Gothic','맑은 고딕','굴림','돋음';*/
    font-family: 'Malgun Gothic', -apple-system, 'Apple SD Gothic Neo', '굴림', '돋음';
}


/* 기존 br 태그 높이 지정 유지 */
br[style="line-height:3px"],
br[style="line-height: 3px"],
br[style="line-height:5px"],
br[style="line-height: 5px"],
br[style="line-height:7px"],
br[style="line-height: 7px"],
br[style="line-height:10px"],
br[style="line-height: 10px"] {
    display: none;
}

/* 목록 체크박스 상하 정렬 개선 */
.table > thead > tr > th > input[type="checkbox"],
.table > tbody > tr > td > input[type="checkbox"] {
    margin-top: 6px;
    margin-bottom: 5px;
    cursor: pointer;
}

/* 라디오 버튼 사이 여백 */
input[type="radio"] + label + input[type="radio"],
input[type="radio"] + font + input[type="radio"] {
    margin-left: 5px;
}

/* 편지함관리 - input 높이 개선 */
form > table > tbody > tr > td > input[name=mb_name] {
    height: 23px;
    vertical-align: text-top;
}

/* 일정관리 - 달력 항목 */
.diary-month-row {
    margin-bottom: 3px;
}

.diary-month-row .diary-month-subject {
    font-size: 8pt;
    color: black;
}

/* 상단 안내 문구 */
.layout-container .np-mail_receive_check .alert.alert-info {
    margin-bottom: 10px;
}

/* br 태그 숨김 대신 테이블 하단 마진 일괄 추가 */
.layout-container .affix-content table,
.layout-container .window-open-content table {
    margin-bottom: 3px;
}

/* 하단 마진 일괄 추가 제외 */
.layout-container .affix-content.np-mail_list table,
.layout-container .affix-content.np-mail_read table {
    margin-bottom: 0;
}

/* 버튼 영역 좌우 패딩 삭제 */
.layout-container .affix-content.np-mail_read table[width="100%"][cellspacing="0"][cellpadding="5"] > tbody > tr > td,
.layout-container .affix-content table[width="100%"][cellspacing="0"][cellpadding="5"] > tbody > tr > td.main_table_button,
.layout-container .affix-content table[width="100%"][cellspacing="0"][cellpadding="5"] > tbody > tr > td.main_table_button_page,
.layout-container .affix-content table.share-table[width="100%"][cellspacing="0"][cellpadding="5"] > tbody > tr > td,
.layout-container .affix-content table.mbr-group[width="100%"][cellspacing="0"][cellpadding="5"] > tbody > tr > td {
    padding-left: 0;
    padding-right: 0;
}

/* 게시판 추가 시 테이블 간격 */
.layout-container .affix-content .new-table {
    margin-top: 15px;
}

/* 대용량 테이블 */
.layout-container .attach-use {
    border: 1px solid #a2c0ea;
    margin: 10px 0;
}

.layout-container .attach-use .use-title {
    background-color: #E8F2FF;
    padding-right: 10px;

}

.layout-container .attach-use tr td {
    padding: 5px 10px;
}

.layout-container .attach-use tr td:nth-child(3) {
    padding-left: 0;
}

.layout-container .attach-use tr td .progress,
.np-file_list .progress {
    margin-bottom: -1px;
}

/* 첫번째, 마지막 메일 읽기시 이전/다음 버튼 글자크기 */
a.btn.disabled {
    font-size: 10pt;
}

/* 목록 데이터 없을 경우 안내 문구에서 기존 table 태그 cellpadding 유지 */
table[width="100%"][cellspacing="1"][cellpadding="3"] > tbody > tr > td {
    padding: 5px;
}


/* 팝업창  .window-open-content */

/* 중요 메일 별표 */
.mail-star:focus,
.mail-star:hover {
    text-decoration: none;
}

.mail-star.on > span.glyphicon-star {
    color: #f6c849;
}

/* 편지 읽기 - 본문하단 이전, 다음 목록표시 */
.mail-prev-next-table {
    margin-top: 8px;
}

.mail-prev-next-table .mail-read-N {
    font-weight: bold;
}

.mail-prev-next-table .border-bottom td {
    border-bottom: 1px solid #efefef;
}

.mail-prev-next-table .glyphicon.glyphicon-triangle-bottom,
.mail-prev-next-table .glyphicon.glyphicon-triangle-top {
    font-size: 0.7em;
}

.mail-prev-next-table .border-right-hidden {
    border-right: hidden;
}

.mail-prev-next-table .icon-before a,
.mail-prev-next-table .icon-since a {
    display: block;
}

.mail-prev-next-table .icon-before a .bi,
.mail-prev-next-table .icon-since a .bi {
    font-size: 15px;
}

.mail-prev-next-table td:first-child a:focus,
.mail-prev-next-table td:first-child a:hover {
    text-decoration: none;
}

.mail-prev-next-table .glyphicon-envelope {
    color: #6fb8ff;
}

.mail-prev-next-table .glyphicon-check {
    color: #d3d6e6;
}

.mail-prev-next-table .glyphicon-share,
.mail-prev-next-table .glyphicon-share-alt {
    color: #737373;
}

/* Bootstrap Icon - https://icons.getbootstrap.com/ */
.bi-xs {
    font-size: 12px;
}

.bi-sm {
    font-size: 14px;
}

.bi-md {
    font-size: 16px;
}

.bi-lg {
    font-size: 18px;
}

.bi-xl {
    font-size: 20px;
}

/* 중요 메일 아이콘 */
.mail-star .bi,
.mail-list-status .bi {
    font-size: 16px;
}

.mail-star > .bi.bi-star-fill {
    color: #f6c849;
}

.mail-star > .bi.bi-star {
    color: #c3c8dd;
}

/* 제목 앞, 보낸사람이 지정한 중요도 아이콘 정렬 */
.mail-importance {
    vertical-align: -1px;
    margin-right: 3px;
}

/* 메일 상태 링크 */
.mail-status-links {
    line-height: 24px;
}

.mail-status-links a {
    /*font-size: 14px;*/
}

.mail-status-links .split {
    color: #cdcdcd;
    /*font-size: 10px;*/
    padding-left: 4px;
    padding-right: 4px;
}

.mail-status-links .mail-status-noread .count {
    color: #ff0000;
}

.mail-status-links .mail-status-star .count {
    color: #007fed;
}

/* 메일 목록 상단, '전체, 안읽음, 중요' 선택된 링크 강조 표시 */
.mail-status-links .mail-status-active {
    font-weight: bold;
}


/* IE, 파이어폭스 - 미리보기, 새창 아이콘 클릭시 링크 테두리 없앰 */
a:focus {
    outline: none;
    text-decoration: none;
}

/* 미리보기 */
.bi-icon-preview {
    font-size: 12px;
}

.btn-icon-preview {
    width: 18px;
    text-align: right;
}

.btn-icon-preview.active {
    color: #0081ff;
}

/* 미리보기 박스 숨김 */
.preview-box {
    position: absolute;
    display: none;
    background-color: #fff;
    margin-top: 4px;
    padding: 19px 19px 50px 24px;
    border: 1px solid #e6e6ea;
    /*box-shadow: 0 2px 8px rgba(0,0,0,0.15);*/
    width: 600px;
    min-height: 300px;
    max-height: 600px;
    z-index: 9999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    border-radius: 5px;
    box-sizing: border-box;
    box-shadow: 0 2px 4px 0 rgba(107, 119, 172, 0.1);
    letter-spacing: 0;
    word-break: break-all;
    word-wrap: break-word;
}

/* 보여줄 때 적용 */
.preview-box.active {
    display: block !important;
}

.preview-box-buttons {
    position: absolute;
    padding: 8px;
    bottom: 4px;
    left: 10px;
    right: 10px;
    display: flex;
    justify-content: center;
    /*gap: 12px;*/
    background-color: white;
}

.preview-box-buttons .left-spam-buttons {
    position: absolute;
    left: 15px;
}

/* 미리보기시 닫기, 삭제등 버튼 */
.preview-box-buttons .btn {
    font-size: 13px;
    padding: 3px 6px;
    margin-right: 12px;
}

.preview-box-buttons .btn-preview-box-delete {
    border-color: red;
    color: red;
    margin-right: 0;
}

.preview-box-buttons .btn-preview-box-delete:hover {
    background-color: #fff1f1;
}

/* 미리보기 테이블 스크롤 적용 */
.preview-box .table {
    width: 100%;
    table-layout: fixed;
}

.preview-box .preview-box-content {
    display: block; /* block으로 변경하여 overflow 속성 적용 */
    overflow-y: auto; /* 세로 스크롤바 생성 */
    height: 200px; /* 스크롤바가 생길 높이 지정 */
    border: none;
}

/* 스팸 신고 박스 숨김 */
.report-box {
    position: absolute;
    display: none;
    background-color: #fff;
    margin-top: 4px;
    padding: 15px 25px 50px 25px;
    border: 1px solid #e6e6ea;
    /*box-shadow: 0 2px 8px rgba(0,0,0,0.15);*/
    width: 520px;
    z-index: 9999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    border-radius: 5px;
    box-sizing: border-box;
    box-shadow: 0 2px 4px 0 rgba(107, 119, 172, 0.1);
    letter-spacing: 0;
    word-break: break-all;
    word-wrap: break-word;
}

/* 보여줄 때 적용 */
.report-box.active {
    display: block !important;
}

.report-box-buttons {
    position: absolute;
    padding: 8px;
    bottom: 4px;
    left: 10px;
    right: 10px;
    display: flex;
    justify-content: center;
    /*gap: 12px;*/
    background-color: white;
}

.report-box-buttons .btn {
    font-size: 13px;
    padding: 3px 6px;
    margin-right: 12px;
}

.report-box-buttons .btn-report-box {
    border-color: red;
    color: red;
}

.report-box-buttons .btn-report-box:hover {
    background-color: #fff1f1;
}

.report-box-table tbody tr td {
    border-color: #ebebeb;
}

.report-box-table tbody tr.title td {
    border-top: none;
}

.report-box-table tbody tr.title td h4 {
    margin-top: 5px;
    font-weight: 700;
}

.report-box-table .option-table {
    border-radius: 5px;
}

.report-box-table .option_item {
    background-color: #f9fafa;
}

.report-box-table .option_item td {
    padding: 12px 10px;
}

.report-box-table .option_item label {
    margin-bottom: 0;
}

.report-box-table .option_item input {
    margin-bottom: 5px;
}

.report-box-table .option_item input + label {
    padding: 0 0 0 5px;
    line-height: 20px;
    letter-spacing: -0.5px;
    vertical-align: top;
}

.report-box-table .option_item input[type="checkbox"] {
    margin-top: 4px;
}

.report-box-table .item-explain {
    line-height: 1.5;
    padding: 12px 8px;
}

.report-box-table .nm_comment {
    color: #3c5283;
}

/* 메일 목록 제목 */
.mail-list-subject {
    height: 18px;
    vertical-align: -4px;
    overflow: hidden;
    position: relative;
    display: inline-block;
    padding-right: 40px;
}

.mail-list-subject a {
    color: #000;
}

.mail-list-subject .btn-icon-preview {
    position: absolute;
    right: 21px;
    top: 0;
}

.mail-list-subject .btn-icon-new-window {
    position: absolute;
    right: 0;
    top: 0;
}

.mail-list-subject.no-icon {
    padding-right: 0;
}

/* 메일 목록 제목앞 편지함 */
.mail-list-subject-mailbox {
    color: rgba(0, 0, 0, 0.6);
}

/* 미리보기 - 받는사람, 참조 최대 높이 제한 */
.preview-box .preview-box-to,
.preview-box .preview-box-cc {
    display: block;
    overflow-y: auto;
    max-height: 5em;
    border-left: none;
    border-top: none;
    border-right: none;
    /*border-bottom: none;*/
}

/* 미리보기 - 내용 최대 높이 제한 */
.preview-box .preview-box-content {
    display: block;
    overflow-y: auto;
    height: 200px;
    border-left: none;
    border-top: none;
    /*border-bottom: 1px solid #ddd !important;*/
}

/* 미리보기 - 내용 여백 조정 */
.preview-box .preview-box-item {
    padding: 0;
}

.preview-box .preview-box-from,
.preview-box .preview-box-to,
.preview-box .preview-box-cc,
.preview-box .preview-box-content {
    padding: 8px;
}

/* 새창에서 열기 아이콘 */
.btn-icon-new-window {
    width: 18px;
    text-align: right;
    margin-left: 2px;
}

.np-mail_read .btn-icon-new-window {
    text-align: center;
    margin-left: 0;
    display: inline-block;
}

.btn-icon-new-window > .bi {
    font-size: 12px;
}

/** 개인별로 보내기 도움말 **/
.btn-mailing-help {
    display: inline-block;
    vertical-align: middle;
    background-color: #fff;
    border: 0;
    padding: 0;
    width: 18px;
    height: 18px;
    text-align: center;
    line-height: 16px;
    white-space: nowrap;
}

.mailing-help {
    position: absolute;
    background-color: #fff;
    padding: 5px 5px 5px 7px;
    border-radius: 5px;
    display: none;
    font-size: 16px;
    z-index: 99999;
    border: 1px solid #ccc;
    max-width: 490px;
}

.mailing-help .bi {
    font-size: 14px;
}

.mailing-help p {
    margin-bottom: 0;
    margin-right: 20px;
}

/* X 버튼 스타일 */
.mailing-help .btn-mailing-help-close {
    position: absolute;
    top: 2px;
    right: 2px;
    background: transparent;
    border: none;
    cursor: pointer;
}

/* 편지쓰기 - 개인별로 보내기 물음 아이콘 */
.np-mail_write .bi.bi-question-square {
    font-size: 15px;
}

/* 편지읽기 - 일정(ics) 파일 미리보기 */
.calendar-preview-box {
    max-width: 700px;
    margin: 15px;
}

.calendar-preview-box .table tr th,
.calendar-preview-box .table tr td {
    padding: 8px;
}

.calendar-preview-box .table tr td {
    padding-left: 0;
}

.calendar-preview-box .table tr th {
    font-size: 14px;
}

.calendar-preview-box-title {
    width: 50px;
    text-align: center;
}

.calendar-preview-box .calendar-preview-box-title {
    vertical-align: baseline;
    border-right: hidden;
    border-bottom: hidden;
}

.calendar-preview-box .calendar-preview-box-item {
    border-bottom: hidden
}

.calendar-preview-box .table tr:last-child .calendar-preview-box-title {
    border-bottom: 1px solid #ddd;
}

.calendar-preview-box .event-summary .calendar-preview-box-item {
    padding: 15px;
    font-size: 16px;
    border-top: 2px solid #3e79b5;
}

.calendar-preview-box .event-summary .calendar-preview-box-item {
    background-color: #fcfcfc;
}

.calendar-preview-box-help {
    margin-top: 5px;
}

.calendar-preview-box-help .bi {
    font-size: 14px;
}

/* 편지쓰기 - 미리보기 */
.mail-write-preview-content {
    width: 80vw; /* 본문내 너비 초과시 가로 스크롤 보여주도록 너비 고정 */
    overflow: auto;
    /*height: calc(100vh - 190px);*/ /* 화면 높이 비례하여 고정 */
    max-height: calc(100vh - 190px); /* 본문 높이에 따라 가변적이고, 최대 화면 높이만 제한 */
    border: 1px solid #dddddd;
}

@media (min-width: 768px) {
    .mail-write-preview-content {
        width: 548px;
    }
}

@media (min-width: 992px) {
    .mail-write-preview-content {
        width: 848px;
    }
}

.mail-write-preview-content > .table {
    border: none;
    margin-bottom: 0 !important;
}

.mail-write-preview-content > .table > tbody > tr:first-child > th,
.mail-write-preview-content > .table > tbody > tr:first-child > td {
    border-top: none;
}

.mail-write-preview-content > .table > tbody > tr:last-child > th,
.mail-write-preview-content > .table > tbody > tr:last-child > td {
    border-bottom: none;
}

/*   - 미리보기시 각 첫번째 칸 왼쪽 선 숨기기 */
.mail-write-preview-content > .table > tbody > tr > th,
.mail-write-preview-content > .table > tbody > tr > td {
    border-left: none;
}

/*   - 미리보기 버튼  */
.mail-write-preview-bottom {
    margin-top: 20px;
    margin-bottom: -15px;
    display: flex;
}

.mail-write-preview-bottom .preview-config span {
    margin-right: 10px;
}

.mail-write-preview-bottom .preview-config input,
.mail-write-preview-bottom .preview-config label {
    margin-right: 5px;
}

.mail-write-preview-bottom .preview-buttons {
    margin-left: auto;
}

/* 편지읽기 본문 */
.mail-body-view,
.mail-body-view p,
.mail-body-view td,
.mail-body-view div,
.mail-body-view pre,
.mail-body-view blockquote,
.mail-body-view a {
    font-size: 14px;
}

.mail-body-view pre {
    white-space: pre-wrap;
}

/* 메일 목록 보낸이 너비 */
.mail-list-from {
    min-width: 160px;
    width: 160px;
    overflow: hidden;
}

/* 메인 읽지 않은 메일 날짜 너비 */
.index-mail-latest-date {
    width: 4em;
    text-align: right;
}

#mail_write_preview_modal_body .modal-close {
    position: absolute;
    right: 26px;
    top: 19px;
}

/* 편지목록 - 메일 읽음, 안읽음, 전달, 회신 아이콘 */
.mail-list-status {
    text-align: center;
}

.mail-list-status .unread-mail .bi,
.mail-list-status .reply-mail .bi-envelope-fill,
.mail-list-status .forward-mail .bi-envelope-fill {
    color: #6fb8ff;
}

.mail-list-status .read-mail .bi,
.mail-list-status .reply-mail .bi-envelope-open,
.mail-list-status .forward-mail .bi-envelope-open {
    color: #c3c8dd;
}

.mail-list-status .reply-mail,
.mail-list-status .forward-mail {
    position: relative;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
}

.mail-list-status .reply-mail .bi-reply-fill {
    position: absolute;
    top: 2px;
    left: -6px;
    color: #c91e1e;
}

.mail-list-status .forward-mail .bi-reply-fill {
    position: absolute;
    top: 2px;
    left: 6px;
    transform: scaleX(-1);
    color: #4756e2;
}

/* HTML 원본 보기, HTML 보기, 링크 활성화 안내 */
.mail-html-origin-view,
.mail-html-limit-view {
    float: right;
    font-size: 12px;
    line-height: 20px;
    margin-right: 20px;
}

.mail-html-origin-view a {
    font-size: 12px;
}

/* 편지 읽기 HTML 제한시 안내 */
.mail-html-limit-view {
    background-color: #ffe8eb;
    border: 1px solid #ffaeb9;
    border-radius: 4px;
    padding-left: 4px;
    padding-right: 4px;
    color: #000000;
}

.mail-html-limit-view a {
    font-size: 12px;
    font-weight: bold;
}

/* 편지함관리 - HTML 제한 */
.np-mail_box .mail-html-limit-view {
    float: none;
    margin-right: 0;
}

/* 미리보기 개인별 보내기 */
.mail-write-is-mailing {
    font-weight: normal;
    font-size: 12px;
}

/* 임시보관함 자동 저장 안내 */
#draft_save_auto_msg {
    line-height: 22px;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 12px;
    color: #000000;
    background-color: #e8f0fe;
    border-radius: 3px;
    border: 1px solid #9a9aff;
}

/* 페이지 로딩중 (page_loading_view.inc.html 에서 이동) */
.nm-page-loading-wrap {
    position: relative;
}

.nm-page-loading-tab {
    position: fixed;
    width: 360px;
    height: 120px;
    top: 40%;
    left: 50%;
    /*margin-top: -350px;*/
    margin-left: -150px;
    background-color: #f5f5f5;
    border: 1px solid #7e9ba9;
    border-radius: 4px;
}

/* 페이지 로딩중 화면 개선 */
.loading-box {
    /*font-family:굴림;*/
}

.loading-box tr td {
}

.loading-box h1 {
    font-size: 16px;
    font-weight: bold;
    background-color: rgb(232, 242, 255);
    line-height: 3;
    padding: 0;
    margin: 0;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    white-space: nowrap;
}

.loading-box p {
    font-size: 14px;
    margin: 14px auto;
}

/* Outlook 주소록 가져오기/내보내기 */
.table-address {
    border: 1px solid #ddd;
}

.table-address tr th {
    border-right: 1px solid #ddd;
}

.table-address .btn-info {
    color: #fff;
    background-color: #1c8ecd;
    border-color: #1c8ecd;
}

.table-address input[type=file] {
    display: inline-block;
}

/* 경고 및 안내 문구 */
.alert-danger {
    background-color: #fff0f2;
    border: 1px solid #ebccd1;
}

/* 경고 안내 문구에서만 경고 아이콘 변경 */
.alert-danger .glyphicon-exclamation-sign:before {
    content: "\f333";
    font-family: bootstrap-icons !important;
}

.alert-info {
    padding: 6px;
    background-color: #E8F0Fe;
    border-color: #E8F0Fe;
    color: #000000;
    line-height: 1.6;
    margin-bottom: 4px;
}

/* 경고 및 안내 문구 - 기존 빨간 색 글자 톤 낮춤 */
.alert-info font[color="red"],
.alert-danger font[color="red"] {
    color: #c91e1e;
}

/* 버튼  */
.btn.btn-danger {
    color: #d9534f;
    border-color: #d43f3a;
    background-color: transparent;
    font-weight: bold;
}

/* 로그인 */
.login-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
}

.login-container.np-login {
    height: 410px;
}

/* 2단계 인증 확인 */
.login-container.np-login_2fa {
    height: 100%;
    max-height: 530px;
}

/* 2단계 인증 등록 */
.login-container.np-login_2fa_add,
.login-container.np-login_2fa_add_key {
    height: 100%;
    max-height: 740px;
}

.login-2fa-content {
    margin-top: 15px;
    margin-bottom: 15px;
    /*border-top: 1px solid #ddd;*/
    padding-top: 5px;
}

.login-2fa-content .otp-field {
    letter-spacing: 10px;
    font-size: 20px;
}

.login-2fa-desc-wrap {
    margin-bottom: 20px;
}

.login-2fa-title {
    font-weight: bold;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

.login-2fa-desc {
    margin-bottom: 10px
}

.login-2fa-explain {
    background-color: #F5F5F5;
    padding: 15px 25px;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
}

.login-2fa-explain-key {
    margin-left: 15px;
}

.login-2fa-app-ex {
    width: 80%;
}

.login-2fa-app-ex.mb20 {
    margin-bottom: 20px;
}

.login-2fa-app-ex .mb0 {
    margin-bottom: 0;
}

.login-2fa-app-code {
    font-size: 20px;
    font-weight: bold;
    color: #00bae7;
}

.login-2fa-box .form-group-trust {
    margin-bottom: 10px;
}

.login-2fa-box .trust-desc {
    font-weight: normal;
}

.login-2fa-box .get-certified {
    display: flex;
}

.login-2fa-box .get-certified .btn {
    width: 45%
}

.login-2fa-box .get-certified a.btn:first-child {
    margin-right: 10%
}

.login-2fa-box .get-certified .btn-gray {
    background-color: #b5b5b5;
    border-color: #b5b5b5;
    margin-top: 0;
    margin-left: auto;
}

.login-2fa-box .scan-input {
    text-align: center;
    margin-bottom: 20px;
}

.login-2fa-box .scan-qr-img {
    margin-bottom: 15px;
}

.login-2fa-secret {
    font-family: ui-monospace, "Courier New", monospace;
    letter-spacing: 0.5px;
}

.login-2fa-box .store-link {
    text-decoration: underline;
}

#clipboardCopyToast {
    position: absolute;
    right: 0;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 14px;
    opacity: 0;
    transition: opacity 0.3s;
    z-index: 9999;
}

#clipboardCopyToast.show {
    opacity: 1;
}

/* 모바일웹 - 2단계 인증 */
@media (max-width: 425px) {
    .login-2fa-content {
        margin-top: 0;
        margin-bottom: 0;
    }

    .login-2fa-explain {
        padding: 4px 8px;
    }

    .login-2fa-explain-key {
        margin-left: 10px;
    }

    .login-container.np-login_2fa_add,
    .login-container.np-login_2fa_add,
    .login-container.np-login_2fa_add_key {
        height: 100%;
    }
}

/* 환경설정 - 2단계 인증 설정 팝업창 */
.window-open-content .login-container {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    -ms-transform: none;
}

.window-open-content .login-2fa-content {
    margin-top: 0;
    margin-bottom: 0;
}

/* 메인 - 2단계 인증 상태 */
.index-2fa-status {
    float: right;
    margin-right: 5px;
}

.index-2fa-status::after {
    clear: both;
}

.index-2fa-status > a {
    font-size: 12px;
    font-weight: bold;
}

.index-2fa-status > a:hover {
    text-decoration: none;
}

.index-2fa-status.index-2fa-setup > a {
    color: #c50400;
}


/** 레이아웃 **/
.layout-top {
    margin-bottom: 0;
}

.layout-container {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}

/** 레이아웃 - 상단 로고 **/
.layout-top-left-logo {
    width: 210px;
    padding: 0;
    /*text-align: center;*/
}

.layout-top-left-logo a {
    padding: 5px;
}

.layout-top-left-logo img {
    max-width: 100%;
    max-height: 50px;
}

/** 레이아웃 - 상단 메뉴 **/
.layout-top-left-logo,
.layout-top-menu {
    height: 60px;
}

.layout-top-menu {
    padding-left: 15px;
}

.layout-top-menu .navbar-top-menu li a {
    font-size: 15px;
}

.layout-top-menu .navbar-top-menu li {
    border-bottom: 2px solid transparent;
}

.layout-top-menu .navbar-top-menu li:hover {
    border-bottom: 2px solid #2578bc;
}

.layout-top-menu .navbar-top-menu li.active a,
.layout-top-menu .navbar-top-menu li:hover a {
    color: #337ab7;
}

.layout-top-menu .navbar-top-menu li.active a,
.layout-top-menu .navbar-top-menu li.active:hover a {
    color: #337ab7;
    background-color: transparent;
}

/** 레이아웃 - 왼쪽 메뉴 회색 배경 지정 (삭제시 기존 흰색 배경 사용) **/
.layout-container.layout-sidebar-gray .affix-sidebar {
    background-color: #f9fafa;
}

.layout-container.layout-sidebar-gray #affix_sidebar_divider {
    border-left: none;
}

.layout-container.layout-sidebar-gray #affix_sidebar_divider + .affix-content {
    box-shadow: rgba(0, 0, 0, 0.04) 0px 0px 24px, rgba(0, 0, 0, 0.04) -1px 0px 0px, rgba(0, 0, 0, 0.04) 0px 0px 12px;
}

.layout-container.layout-sidebar-gray .sidebar-nav-new .two-link.inb-body .item,
.layout-container.layout-sidebar-gray .sidebar-nav-new .two-link.inb-bottom .item {
    background-color: #ffffff;
}

/** 레이아웃 - 컨텐츠 **/
.layout-container .affix-content {
    padding-top: 10px;
    padding-bottom: 10px;
    /*border-left: 1px solid #e7e7e7;*/
}

/** 레이아웃 - 왼쪽 메뉴 **/
@media (min-width: 768px) {
    .layout-container .affix-sidebar {
        width: 210px;
    }

    .layout-container .affix-content {
        width: calc(100% - 210px);
    }
}

/* 가운데 구분선 높이 100% 맞춤 */
.layout-container .affix-row {
    display: flex;
    min-height: calc(100vh - 130px);
}

.layout-container .affix-row > div {
    float: none;
    display: inline-block;
}

#affix_sidebar_divider {
    margin-left: -2px;
    margin-right: -2px;
    width: 4px;
    cursor: col-resize;
    border-left: 1px solid #e7e7e7;
    float: left;
    z-index: 1000;
}

/* 컨텐츠 높이 100% 맞춘후, 왼쪽 메뉴가 없 주소록/웹하드 높이 지정 */
.affix-content-not-left-menu.np-address,
.affix-content-not-left-menu.np-index {
    padding-bottom: 0;
}

.affix-content-not-left-menu.np-address > table,
.affix-content-not-left-menu.np-address > table > tbody > tr:nth-child(3) > td,
.affix-content-not-left-menu.np-index > table,
.affix-content-not-left-menu.np-index > table > tbody > tr:nth-child(5) > td {
    height: 100%;
}

.layout-container .sidebar-nav {
    width: 100%;
}

/* 왼쪽 메뉴 아이콘 정렬 */
.sidebar-nav .navbar li .mb-name {
    max-width: calc(100% - 32px);
    vertical-align: -0.25em;
}

/* 받은편지함 등 기본 편지함 강조 */
.sidebar-nav .navbar li.mb-system .mb-name {
    font-weight: bold;
}

/* 편지함 트리 */
.sidebar-nav .navbar-default {
    /*padding: 18px 16px;*/
    padding: 10px;
    background-color: transparent;
    /*background-color: #f9fafa;*/
    /*box-shadow: 1px 0 0 0 rgba(0, 0, 0, 0.04);*/
}

.sidebar-nav .navbar-nav li.mb-depth {
    white-space: nowrap;
    padding-top: 0;
    padding-bottom: 0;
    position: relative;
}

.sidebar-nav .navbar-nav li.mb-depth > .navbar-link {
    display: inline-block;
    position: relative;
    /*width: calc(100% - 20px);*/
    width: 100%;
    padding: 6px 8px;
    color: #1e1e23;
}

.sidebar-nav .navbar-nav li.mb-depth.child-open > .navbar-link {
    background-color: transparent;
}

.sidebar-nav .navbar-default .navbar-nav li.mb-depth.active > a,
.sidebar-nav .navbar-default .navbar-nav li.mb-depth.child-open.active > a,
.sidebar-nav .navbar-default .navbar-nav li.active > a {
    border-radius: 4px;
    color: #1e1e23;
    background-color: #e8f0fe;
}

.sidebar-nav .navbar li a:hover,
.sidebar-nav .navbar-nav li.mb-depth.child-open > .navbar-link:hover {
    background: rgba(36, 42, 48, 0.06);
    border-radius: 4px;
    text-decoration: none;
}

.sidebar-nav .navbar li a:hover .mb-name {
    /*font-weight: bold;*/
}

/* 하위 편지함 펼침 */
.sidebar-nav .navbar-nav li.mb-depth .btn-toggle-child {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
    padding-right: 4px;
    font-size: 12px;
    width: 22px;
    height: 32px;
    line-height: 32px;
    text-align: right;
    z-index: 1;
}

.sidebar-nav .navbar-nav li.mb-depth.active .btn-toggle-child,
.sidebar-nav .navbar-nav li.mb-depth:hover .btn-toggle-child {
    background-color: transparent;
}

/* 하위 편지함 열림 상태 - 폴더 아이콘 */
.sidebar-nav .navbar-nav li.mb-depth.child-open.has-child .bi-folder:before {
    content: "\f3d8";
}

/* 하위 편지함 열림 상태 - 펼침 아이콘 */
.sidebar-nav .navbar-nav li.mb-depth.child-open.has-child .btn-toggle-child:before {
    content: "\f286";
}

.sidebar-nav .navbar-nav li.mb-depth.child-close.has-child + .nav-child-menu {
    display: none;
}

/* 하위 편지함 ul */
.sidebar-nav .navbar-nav .nav-child-menu {
    padding-left: 0;
}

/* 편지함 트리 깊이별 좌측 여백 ( 아이콘 15px + padding 6px ) */
.sidebar-nav .mb-depth-2 .navbar-link {
    /*margin-left: 15px;*/
    padding-left: 21px !important;
}

.sidebar-nav .mb-depth-3 .navbar-link {
    /*margin-left: 30px;*/
    padding-left: 36px !important;
}

.sidebar-nav .mb-depth-4 .navbar-link {
    /*margin-left: 45px;*/
    padding-left: 51px !important;
}

.sidebar-nav .mb-depth-5 .navbar-link {
    /*margin-left: 60px;*/
    padding-left: 66px !important;
}

.sidebar-nav .mb-depth-6 .navbar-link {
    /*margin-left: 75px;*/
    padding-left: 81px !important;
}

.sidebar-nav .mb-depth-7 .navbar-link {
    /*margin-left: 90px;*/
    padding-left: 96px !important;
}

.sidebar-nav .mb-depth-8 .navbar-link {
    /*margin-left: 105px;*/
    padding-left: 111px !important;
}

.sidebar-nav .mb-depth-9 .navbar-link {
    /*margin-left: 120px;*/
    padding-left: 126px !important;
}

.sidebar-nav .mb-depth-10 .navbar-link {
    /*margin-left: 135px;*/
    padding-left: 141px !important;
}

/* 왼쪽 메뉴 - 편지쓰기 | 내께쓰기 */
.sidebar-nav-new .navbar-default .navbar-nav > li.two-link-menu {
    display: flex;
    padding-top: 0;
    padding-bottom: 0;
    /*max-width: 190px;*/
}

.sidebar-nav-new .navbar-default .navbar-nav > li.two-link-menu > a {
    display: inline-block;
    width: calc(50% - 4px);
    padding-right: 0;
}

.sidebar-nav-new .navbar-default .navbar-nav > li.two-link-menu.inb-top > a {
    width: calc(50% - 1px);
}

.sidebar-nav-new .navbar-default .navbar-nav > li.two-link-menu.inb-top > a:first-child {
    margin-right: 2px;
}

.sidebar-nav-new .two-link.inb-body .item:first-child,
.sidebar-nav-new .two-link.inb-bottom .item:first-child {
    margin-right: 8px;
}

/* 왼쪽 메뉴 상단 디자인 개선 */
.sidebar-nav-new .two-link.inb-top,
.sidebar-nav-new .two-link.inb-body,
.sidebar-nav-new .two-link.inb-bottom {
    /* box-sizing: border-box;
    width: 100%;
    padding: 16px 18px 0;
    table-layout: fixed;*/
    width: 100%;
}

.sidebar-nav-new .two-link.inb-top {
    margin-bottom: 10px;
}

.sidebar-nav-new .navbar-nav > li.two-link-menu > a:first-child {
    padding-right: 0;
}

.sidebar-nav-new .two-link.inb-top a {
    color: #fff !important;
}

.sidebar-nav-new .two-link.inb-top .btn-write {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.sidebar-nav-new .two-link.inb-top .btn-write:hover {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.sidebar-nav-new .two-link.inb-top .btn-write-me {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.sidebar-nav-new .two-link.inb-top .btn-write-me:hover {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.sidebar-nav-new .two-link.inb-top .item {
    display: table-cell;
    width: 50%;
    padding: 10px 0;
    line-height: 14px;
    text-align: center;
    /*background-color: #607d8b;*/
    /*background-color: #1c8ecd;*/
    background-color: #6C757D;
    /*font-weight: bold;*/
    font-size: 14px;
}

.sidebar-nav-new .two-link.inb-top .item:hover {
    background-color: /*#2578bc;*/ #494c56;
}

.sidebar-nav-new .two-link .mail-status-star .count,
.sidebar-nav-new .two-link .mail-status-noread .count {
    color: #007fed;
}

.sidebar-nav-new .two-link.inb-body {
    margin-bottom: 8px;
}

.sidebar-nav-new .two-link.inb-body .item,
.sidebar-nav-new .two-link.inb-bottom .item {
    /*background-color: #ebeff4;*/
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 3px 0;
    font-size: 12px;
}

.sidebar-nav-new .two-link.inb-body .item:hover,
.sidebar-nav-new .two-link.inb-bottom .item:hover {
    background-color: rgba(36, 42, 48, 0.06) !important;
    /*font-weight: 700;*/
}

.sidebar-nav-new .mail-write-menu-bottom-split {
    margin: 10px -10px 3px -10px;
}

/* 좌측메뉴 관리 버튼 위치 */
.sidebar-nav-new .two-link > .btn.top-btn {
    top: -34px !important;
}

.sidebar-nav-new .bi {
    font-size: 15px;
    color: #4c4c4c;
}

.sidebar-nav-new .bi.bi-pencil {
    color: #fff;
}

/* 메인 - 엔메일 주소영역 */
.index-center-wrap .alert-success {
    color: #455297;
    background-color: #d8eef0;
    border-color: #bcdbd3;
    padding-left: 10px;
}

/* 편지쓰기 - 새 창에서 열기, 설정 */
.more-setting {
    float: right;
}

.more-setting .bi {
    color: #686868;
    font-size: 16px;
    margin-right: 8px;
}

/* 메인화면 아이콘 등 */
.main-nmail-home .well {
    padding: 15px;
}

.main-nmail-home .txt-align-center {
    display: flex;
}

.main-nmail-home .txt-align-left {
    padding-top: 18px;
}

.main-nmail-home .col-xs-offset-1 {
    text-align: right;
}

.main-nmail-home .main-bi-icon {
    font-size: 58px;
    color: #4c4c4c;
}

/* 메인화면 - 받은 편지함 아이콘 */
.affix-content .bi.bi-three-dots {
    font-size: 17px;
    line-height: 1;
}

/* 메인화면 - 받은 편지함 테이블 여백 */
.index-mail-latest-box .index-mail-latest-title,
.index-mail-latest-box .index-mail-latest-list tr td {
    padding-left: 10px;
}

.index-mail-latest-title .bi {
    font-size: 19px;
    line-height: 1;
    vertical-align: -.125em;
    color: #547072;
}

.index-size-info {
    margin-bottom: 5px;
}

.index-config-status {
    padding: 0;
    background-color: rgb(240, 240, 240);
    border-radius: 4px;
    margin-bottom: 8px;
}

.index-config-status li a {
    font-weight: bold;
}

.index-config-status li a .count {
    color: #007fed;
    font-weight: normal;
}

/* 메인화면 우측 공지사항, 일정 아이콘등 */
.notice-volume .bi {
    font-size: 16px;
}

.bi-calendar-event-fill {
    color: #6f6f6f;
}

.notice-board .bi {
    font-size: 14px;
    color: #4c4c4c;
}

/* 메인화면 중앙 읽지 않은 메일, 게시물 등 */
.layout-container .affix-content .index-center-wrap .index-latest-box.latest-center-board table {
    margin-bottom: 0;
}

.layout-container .affix-content .index-center-wrap .index-latest-box {
    margin-bottom: 8px;
}

/*.layout-container .affix-content .index-center-wrap .index-latest-box:last-child {*/
/*    margin-bottom: 0;*/
/*}*/

/* 왼쪽 메뉴 상단 타이틀 - 환경설정 등 */
.sidebar-nav .navbar-default .navbar-nav > .active:first-child > a {
    margin-bottom: 10px;
    background-color: #e7e7e7;
}

.sidebar-nav .txt-shadow_g {
    text-shadow: none;
    font-size: 15px;
}

/* 홈 - 좌측 관리자, 메일서버관리 메뉴 여백 */
.sidebar-nav-new #sidenav01.navbar-nav > li.admin_menu a {
    padding-left: 8px;
}

/* 스팸/지운편지함 하위 편지함 있을 경우, 비움버튼과 여백 */
.navbar-default .navbar-nav > li.has-child > .btn.btn-xs {
    right: 23px;
}

/* 메인 - 우측 메뉴 너비 */
.index-right-wrap {
    width: 220px;
    float: none;
    display: inline-block;
}

.index-center-wrap {
    width: calc(100% - 220px);
    min-width: 656px;
    padding-right: 10px;
}

@media (max-width: 1140px) {
    .index-center-wrap {
        width: 100%;
    }
}

/* 메인 -  우측 메뉴 테이블간 간격 */
.layout-container .affix-content .index-right-wrap > table {
    margin-bottom: 8px;
}

/* 편지함관리 */
.mail-box-action-icons {
    display: inline-flex;
    padding-left: 10px;
}

.mail-box-action-icons > a {
    padding-left: 4px;
    padding-right: 4px;
}

.mail-box-action-icons > i {

}

/* 우측 하단 TOP 아이콘 */
.topfocus {
    right: 18px;
    bottom: 18px;
    padding-top: 0;
    border-top: none;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .15);
    border-radius: 50%;
    width: 35px;
    height: 35px;
    text-align: center;
    margin: auto;
}

.topfocus .bi {
    font-size: 18px;
    padding-top: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.7;
}

/*반응형 디자인 */
@media (max-width: 768px) {
    /* 상단메뉴 고정 */
    .navbar-nav > li, .navbar-nav {
        float: left !important;
    }

    .navbar-fixed-top .navbar-collapse {
        min-width: 810px;
    }

    /* 왼쪽 메뉴 - left menu 여백 */
    .affix-sidebar {
        padding-right: 3px;
    }

    .affix-sidebar .navbar-toggle {
        margin: 0;
    }

    /* 왼쪽 메뉴 리스트 */
    .navbar-header {
        padding-bottom: 10px;
    }

    .layout-container.layout-sidebar-gray .affix-sidebar {
        width: 264px !important;
    }

    .sidebar-nav .navbar-nav li.mb-depth,
    #sidenav01.navbar-nav > li.admin_menu {
        width: 100%;
    }

    .sidebar-nav .navbar-nav .nav-child-menu {
        float: left;
        width: 100%;
    }
}

@media (max-width: 830px) {
    /* 우측 여백 - 너비 조정*/
    .layout-sidebar-gray .affix-content {
        min-width: 730px;
    }

    /* 메일 제목 - 최소 너비*/
    .mail-list-from {
        min-width: 80px;
        width: 80px;
        max-width: 80px;
        overflow: hidden;
    }
}

/* 편지쓰기 여백 조정 */
.write-table > tbody > tr > td {
    line-height: 40px;
}

.write-table select {
    vertical-align: 0;
}

.np-mail_write select {
    height: 23px;
}

.np-mail_write select[name="mf_add_attach_names[]"] {
    height: auto;
}

.write-table-editor-bottom > tbody > tr > td {
    line-height: 40px;
}

.write-table,
.write-table-editor-bottom,
.write-table-editor-bottom label {
    margin-bottom: 0 !important;
}

.write-table-editor-bottom #reserve_view {
    line-height: 40px;
    height: 40px;
    vertical-align: middle
}

.write-table-editor-bottom .reserve-comment {
    display: block;
    height: 20px;
    line-height: 20px;
    margin-top: -5px;
    margin-bottom: 10px;
}

/* 스팸포인트 */
.mail-spam-point0 a,
.mail-spam-point1 a,
.mail-spam-point2 a {
    color: #000000;
}

.mail-spam-point3 a,
.mail-spam-point4 a,
.mail-spam-point5 a {
    color: #494949;
}

.mail-spam-point6 a,
.mail-spam-point7 a,
.mail-spam-point8 a {
    color: #7D7D7D;
}

.mail-span-point9 a {
    color: #939393
}