.snb h2 {
    font-weight: 600;
    font-size: 22px;
    line-height: 140%;
    letter-spacing: -0.2px;
    text-align: center;
    color: var(--color-text-bold);
    padding: 5px;
}

/* #################################################### */
/* 메일쓰기 버튼*/
.btn_type_01 {
    display: inline-flex;
    justify-content: center;
    align-items: center;

    width: 100%;
    height: 40px;
    padding: 0 20px;
    gap: 8px;

    font-family: 'Pretendard', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    line-height: 150%;
    letter-spacing: -0.2px;

    border-radius: 8px;
    border: none;
    background-color: var(--color-button-bg-primary-fill);
    color: var(--color-text-inverse);

    cursor: pointer;
    opacity: 1;
    transition: background-color 0.2s ease;

    position: relative;
    background-image: none;
    background-position: initial;
}

.btn_type_01::before {
    position: absolute;
    top: 50%;
    left: 16px;
    transform: translateY(-50%);
    content: "";
    width: 14px;
    height: 16px;
    
    mask-image: url("../../img/svg/ic_cmm_plus.svg");
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
    background-color: var(--color-icon-inverse);
    filter: brightness(0) invert(1);
}

/* #################################################### */
/* 메일 용량바  */
.mail_volume .volume_bg {
    position: absolute;
    top: 7px;
    left: 0;
    width: 100%;
    height: 7px;
    background: var(--color-progress-bg-subtle);
    border-style: none;
    border-color: var(--color-border-light);
    border-width: 1px;
    border-radius: 100px;
    gap: 10px;
    overflow: hidden;
}

/* 메일 사용량  */
.mail_volume .volume {
    background: var(--color-progress-indicator-primary);
    border-radius:999px;
}

.mail_volume .volumeText {
    display: flex;
    justify-content: space-between;
}

.mail_volume .summary {
    font-weight: 400;
    font-size: 13px;
    line-height: 140%;
    letter-spacing: -0.2px;
    color: var(--color-text-subtle);
}

.mail_volume .volumeText .summary .used {
    font-weight: 500;
    font-size: 13px;
    line-height: 140%;
    letter-spacing: -0.2px;
    color: var(--color-text-primary);
}

.mail_volume .remain {
    float: right;
    font-weight: 400;
    font-size: 13px;
    line-height: 140%;
    letter-spacing: -0.2px;
    color: var(--color-text-subtle);
}

/* #################################################### */
/* 메일 용량바 하단 "메일 / 라벨" */
.snb_tab {
    display:flex;
    gap:6px;
    padding: 2px;
    background: var(--color-bg-subtle);
    border-radius: 8px;
    width: 100%;
    overflow: hidden;
}

/* 기존 스타일 GW내 충돌로 인하여 추가 */
.snb_tab:after {
    display: none;
}

.snb_tab li {
    position: relative;
    float: left;
    width: 50%;
    margin: 0 0 0 1px;
}

.snb_tab .snb_btn {
    flex:1;
    width: 100%;
    height: 100%;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius: 7px;
    cursor:pointer;
    color: var(--color-text-disabled-on-disabled);
    font-size:14px;
    font-weight:600;
}

/* 메일 / 라벨 활성화 */
.snb_tab li.tab_active a {
    background:var(--color-bg-default);
    height: 30px;
    color:var(--color-text);
    box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.08);
    width: 100%;
    border-radius: 7px;
}

/* 메일 / 라벨 비활성화 */
.snb_tab li a {
    display: block;
    height: 30px;
    line-height: 28px;
    background-color: transparent;
    border-style: none;
    border-color: var(--color-border);
    border-width: 1px;
    color: var(--color-text-disabled-on-disabled);
    text-align: center;
    font-size: 12px;
    font-weight: 600;
}

/* #################################################### */
/* 메일함 리스트 */
.snb .mail_tree_wrap {
    top: 170px;
    bottom: 50px;
    left: 0;
}

#emlLeft_mailTree .tree-count-num[data-count-key="mailCnt"] {
    display: none;
}

/* 임시보관 및 예약메일의 경우 class 추가 */
#emlLeft_mailTree .tree-node.show-mail-cnt .tree-count-num[data-count-key="mailCnt"] {
    display: inline-block
}

/* 예약메일 밑 선 */
#emlLeft_mailTree .tree-node[data-key="personalRoot"] {
    border-top: 1px solid var(--color-border);
}

/* 예약메일 밑 선 */
.tree-node.folder-node {
    position: relative;
}

#emlLeft_mailTree .tree-node[data-key="personalRoot"]::after,
#emlLeft_mailTree .tree-node[data-key="shareMailBox"]::after,
#emlLeft_mailTree .tree-node[data-key="apprRoot"]::after
{
    content: "";
    position: absolute;
    left: 5px;
    right: 5px;
    bottom: 0px;
    height: 1px;
    background: var(--color-border);
    pointer-events: none;
}

/* 설정 버튼*/
#emlLeft_settingBtn {
    background-image: url("../../img/svg/tree-icon/ic_tree_setting-fill.svg") !important;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: 0px center;
}

/* 관리자 설정 버튼*/
#emlLeft_manageBtn {
    background-image: url("../../img/svg/tree-icon/ic_tree_wrench-fill.svg") !important;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: 0px center;
}

/* #################################################### */
/* 새 라벨 만들기 버튼 */
.btn_type_02 {
    display: inline-flex;
    justify-content: center;
    align-items: center;

    width: 100%;
    height: 30px;
    padding: 0 20px;
    gap: 8px;

    font-family: 'Pretendard', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    line-height: 150%;      /* 21px */
    letter-spacing: -0.2px;

    border-radius: 8px;
    background-color: var(--color-bg-default);
    color: var(--color-text);

    cursor: pointer;
    opacity: 1;
    transition: background-color 0.2s ease;

    position: relative;
    background-image: none;
    background-position: initial;
    border: 1px solid var(--color-border);
}

.btn_type_02 span {
    padding: 0 0 0 20px;
    background-repeat: no-repeat;
    background-position: -30px -125px;
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
    font-weight: 500;
}

/* #################################################### */
/* 라벨 검색 */
.snb .search_category {
    margin-top: 8px;
    padding: 0;
}

.label-tree__search-wrapper {
    width: 100%;
}

.label-tree__search {
    display: flex;
    border-radius: 8px;
    border: 1px solid var(--color-border);
    padding: 7px 12px 7px 16px;
}

.label-tree__search-icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    aspect-ratio: 1;
    mask-position: center;
    mask-repeat: no-repeat;
    background-color: var(--color-icon-disabled);
}

.label-tree__search-icon--search {
    mask-image: url("../../img/svg/search.svg");
    margin-left: auto;
    pointer-events: auto;
    cursor: pointer;
}

.label-tree__search-icon--reload {
    mask-image: url("../../img/svg/reload.svg");
    mask-size: 15px 17px;
    margin-left: auto;
    pointer-events: auto;
    cursor: pointer;
}

.label-tree__search-input {
    border: none;
    background: none;
    width: 100%;
    font-family: Pretendard, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    letter-spacing: -0.2px;
    color: var(--color-text);
    padding: 0;
    margin: 0;
}

.label-tree__search-input::placeholder {
    color: var(--color-input-text-placeholder);
}

.search_category > .label-tree__search-wrapper> .label-tree__search > .label-tree__search-input {
    font-family: Pretendard, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    letter-spacing: -0.2px;
    border: none;
    width: 100%;
    height: auto;
}

.search_category > .label-tree__search-wrapper> .label-tree__search > .label-tree__search-input:focus {
    color : var(--color-text);
}

.search_category > .label-tree__search-wrapper {
    padding : 0;
}

/* ################################################################################## */
/* 라벨 */
.snb .label_tree_wrap {
    top: 220px;
    bottom: 100px;
    left: 0;
}

/* 메일 드래그 시, 메일함 css 추가 */
#emlLeft_mailTree .tree-node-content.drop-hover {
    border: none !important;
}

/* 보낸메일함 의 경우 class 추가 */
#emlLeft_mailTree .tree-node.none-mail-cnt .tree-count-num[data-count-key="unreadMailCnt"] {
    display: none;
}
