@charset "utf-8";

body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,legend,li,menu,ol,p,select,table,td,textarea,th,ul {margin: 0;	padding: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary{display: block;}
keygen, meter, progress {display: inline-block;}
body { overflow: hidden; height:100%;width: 100%; -ms-overflow-style: none}
/* ::-webkit-scrollbar {display: none;} */

/* 스크롤바 설정*/
::-webkit-scrollbar { width:8px; height: 10px;}
/* 스크롤바 막대 설정*/
::-webkit-scrollbar-thumb { background-color: #e5e5e5;/* 스크롤바 둥글게 설정 */border-radius: 10px; background-clip: padding-box; border: 3px solid transparent; border-left:0; }
::-webkit-scrollbar-thumb:hover { background-color: #b5b5b5;}
::-webkit-scrollbar-thumb:active { background-color: #6b6b6b;}
/* 스크롤바 뒷 배경 설정*/
::-webkit-scrollbar-track { background-color: transparent; }

/* 유지 보수 시 컬러 일괄 적용 */
:root {
	--main-color : #869fff;
	--error-color: #ff5400;

	/* 아나키와 블루 */
	--color-96bffd: #96bffd;
	/* 자바그린 */
	--color-10bc83: #10bc83;
	/* 엠버 옐로우 */
	--color-ffc000: #ffc000;
	/* 버밀리온 레드 */
	--color-e5410e: #e5410e;
	/* 셔틀 그레이 */
	--color-484b52: #484b52;

	/* 지정 색상 */

	/* 빨강 3계열 */
	--color-eb8a9f: #eb8a9f;
	--color-f35055: #f35055;
	--color-a02031: #a02031;
	/* 주황 3계열 */
	--color-ff9c71: #ff9c71;
	--color-f87331: #f87331;
	--color-be5233: #be5233;
	/* 노랑 3계열 */
	--color-eab01c: #eab01c;
	--color-ce920b: #ce920b;
	--color-9f766a: #9f766a;
	/* 초록 3계열 */
	--color-83b730: #83b730;
	--color-35a23a: #35a23a;
	--color-007135: #007135;
	/* 파랑 3계열 */
	--color-42aedc: #42aedc;
	--color-4984d9: #4984d9;
	--color-14479e: #14479e;
	/* 보라 3계열 */
	--color-9b65d9: #9b65d9;
	--color-744dc8: #744dc8;
	--color-5830b3: #5830b3;
	/* 무채색 3계열 */
	--color-adadad: #adadad;
	--color-333333: #333333;
	--color-111111: #111111;
}

* {caret-color: var(--main-color);}
html {height:100%;width: 100%;}
body,button,input,select,textarea {	font-family:'Pretendard','Malgun Gothic', '맑은 고딕',system-ui,dotum,'돋움',sans-serif; font-size:15px; letter-spacing: -.3px;}
select{font-size:14px; border-radius: 0;}
embed,object{vertical-align:bottom}
label{cursor:pointer}
img,fieldset {border:0}
menu,ul,ol{list-style:none}
em,address{font-style:normal}
a,a:link{text-decoration:none; background-color: transparent;}
textarea{overflow:auto}
textarea:focus {border-color: var(--main-color) !important; outline: none !important;}
table {border-collapse: collapse; border-spacing: 0}
legend{visibility:hidden;display:none}
input[type=text]:focus, input[type=password]:focus { outline:none}
input::placeholder, textarea::placeholder { color:#B0B0B0}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color:#B0B0B0}
input:-ms-input-placeholder, textarea::-webkit-input-placeholder { color:#B0B0B0}
button,.button{display:inline-block;*display:inline;overflow:visible;height:27px;margin:0;padding:0 8px;border:1px solid #cbcbcb;line-height:27px;*line-height:21px;color:#343434;text-decoration:none;vertical-align:top;cursor:pointer;*zoom:1;background-position:0 -228px}/*;border-radius:3.1px;*/
button.disabled{cursor:default}
button[disabled='disabled']{cursor:default;color:#bfbfbf; background: #f0f0f0; border-color: #E5E5E5; opacity:.3; -webkit-filter: grayscale(100%);}
button::-moz-focus-inner{padding:0!important;border:0!important}
strong {font-weight: bold;}

input:disabled {border: 1px solid #E5E5E5 !important; color: #bfbfbf !important; background: #fafafa !important;}
input[type="checkbox"], input[type="radio"] {cursor: pointer;}

.blind { display: block; overflow: hidden; position: absolute; top: 0; left: 0; width: 0; height: 0; border: 0; background: 0 0; font-size: 0;line-height: 0;}
.clear {clear: both;height: 0;content: ''; display: block; visibility: hidden;}
.b {font-weight: bold}
/** 더블클릭선택표 없애기 **/
.unselectable { -moz-user-focus: ignore; -moz-user-select: -moz-none;  -webkit-user-select: none; -ms-user-select: none; user-select: none; }
.input_check, .input_checkbox, .input_radio { width: 13px; height: 13px; overflow: hidden; padding: 0; margin: 0 3px 0 0; vertical-align: -3px; *vertical-align: 0;}

/* IMAGES
---------------------------------------------------------------------------------- */
.gnb_list_box li a, .gnb_list_box .ndrive a, .gnb_area .gnb_list_box .gnb_last .btn_more, .gnb_area .article_num em, .gnb_area .article_num .tail, .gnb_area span.icon_up em, .gnb_area span.icon_event_pnb em, .gnb_area span.icon_new em , .gnb_lst .ico_arrow, a.gnb_my .arrow_more, a.gnb_my .filter_mask, .gnb_lst li .gnb_icon, .select_bullet, .gnb_mask, .gnb_notice_lyr .svc_list .gnb_btn_remove span, .gnb_ly_alert .gnb_btn_close i ,.dh_layer .type_a.type_a_check .checked a, .searchLayer a.delete_btn, .icoFile, .deleteBtn, .btn_close, .ico_add, .btn_remove, .search_form .ipt_wrap .btn_submit, .btn_folder, .fc_input, .del, .importantOff, .importantOn, .ico_sort, .img, .ico, ul.description li.des_img, ul.description li.des_img .upto_data, .mail_preview .preview_area .pre_attach ul li .tit:before, .pf_photo, .copy_btn, .file_ico
{background-image: url(../img/ar_main.png);background-size: 817px 2000px; background-repeat:no-repeat}
.dh_layer .type_a.type_a_check .checked a, .dh_layer .type_a.type_a_check .selected a, .dh_layer .hl_noti a, .dh_layer .moveBox .moveBox_list li.selected label, .vicon, .type_a.sTip .sTip_lst li
{background-image: url(../img/ico_mail.png); background-repeat:no-repeat}

/* LAYOUT
---------------------------------------------------------------------------------- */
.wrap{ height: auto; width: auto; position: absolute; top: 0; bottom: 0;left: 0;right: 0;overflow: hidden;min-width: 0; z-index: 1;}
#header {height: 55px;position: relative; z-index: 30; min-width: 800px; box-sizing:border-box; }
#container { position: absolute; top: 55px;  bottom: 0; left: 0; right: 0; overflow: hidden; margin: 0; min-height: 0; z-index: 20; zoom: 1;}
#container:after { clear: both; display: block;  height: 0; content: ''; visibility: hidden; }
#nav_snb { position: absolute;  top: 0;  bottom: 0; left: 0; float: none; width: 251px; box-sizing:border-box; z-index: 20; line-height: normal; border-right:1px solid #ddd; overflow: visible; background-color: #fff;zoom: 1;}

#section_cen { position: absolute; left: 0; right: 0; top: 0; bottom: 0; padding:0; z-index:10; zoom:1}
#section_cen_fix {position: absolute;left: 0;top: 0;right: 0; bottom: 0; overflow-y:visible; zoom:1;}
#content {position: absolute; left:251px; top: 0; bottom: 0; right: 0; overflow: hidden; _overflow: hidden; z-index:30; zoom:1; background-color:#fff }
.lft_fd #content {left: 0!important;}

#cont_fix_area { position: relative; zoom: 1;}
#cont_flex_area { position: absolute;  top: 111px; bottom: 0; left: 0; right: 0; min-height: 1px; overflow: auto; z-index: 20;  zoom:1; }

/* HEADER
---------------------------------------------------------------------------------- */
#header h1 {position: absolute;left: 0;top: 0; width: 210px;height: 55px; padding: 0 20px; z-index: 30;overflow: hidden; display: flex; flex-wrap: nowrap; align-items: center;}
#header h1 a {display: inline-flex; align-items: center;}
#header h1 .ci {margin-right: 14px; width: 108px; max-height: 24px;}
#header h1 .ci > img {display: inline-block; width: 100%;}
#header.h_mail .pwe_home { width:auto;height: 23px; font-size:18px; color:#fff; font-weight:bold;}

.login_group{position:absolute;right:0;top:0;width:auto;z-index:20;white-space:nowrap;}

.gnb_one {position: relative; z-index:40; color: #444; letter-spacing: 0;line-height: normal ;text-align: left}
.gnb_one a, .gnb_one a:visited, .gnb_one a:active, .gnb_one a:focus {color: #fff;}
.gnb_one a, .gnb_one label, .gnb_one button { cursor: pointer;}
.gnb_lst {padding: 0;zoom: 1; display:inline-block;}
.content_header .gnb_lst {display: none;}
.gnb_lst > li { border-left:1px solid #000;border-color: rgba(0, 0, 0, 0.05); box-sizing:border-box; height:55px; float: left;overflow: visible;color: #fff; }
.gnb_lst > li:after {clear: both;height: 0;content: ''; display: block; visibility: hidden;}
.gnb_lst > li a {position: relative; z-index: 100;}
.gnb_lst > li .gnb_icon { width:26px;height:26px; margin:auto; position:relative; display:inline-block}
.gnb_lst .gnb_notice_li a, .gnb_lst .gnb_setting_li a, .gnb_lst .gnb_admin_li a, .gnb_lst .gnb_help_li a, .gnb_lst .gnb_language_li a { display:block; height:26px; width:52px; text-align:center; padding:15px 0 14px}
.gnb_lst .gnb_notice_li .gnb_icon {background-position:-97px -299px}
.gnb_lst .gnb_setting_li .gnb_icon {background-position:-127px -299px}
.gnb_lst .gnb_admin_li .gnb_icon {background-position:-158px -299px}
.gnb_lst .gnb_help_li .gnb_icon {background-position:-189px -299px}
.gnb_lst .gnb_language_li .gnb_icon {background-position:-366px -86px}
.gnb_my_li {padding: 13px 6px 13px 12px;}
.gnb_my_namebox {padding: 1px 5px 0 0;background-repeat: no-repeat;background-position: 100% 50%; zoom: 1;}
a.gnb_my {display: block; vertical-align: middle; }
a.gnb_my img {vertical-align: top; border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px;}
a.gnb_my .filter_mask {width: 26px; height: 26px;  background-position: -367px -286px; display:inline-block; vertical-align:middle; border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px; }
a.gnb_my .gnb_name { padding-left: 5px; display: inline-block; height: 28px; line-height: 28px; vertical-align: top; font-weight:bold; vertical-align:middle; max-width: 80px; overflow: hidden; text-overflow: ellipsis;}
a.gnb_my .arrow_more { overflow:hidden; font-size:0; text-indent:-1000px; display:inline-block; width:16px; height:16px; background-position:-54px -292px; margin-left:6px; vertical-align: middle}
.gnb_setting_li {margin-right: -5px;}

.gnb_one .gnb_my_lyr, .gnb_one .gnb_notice_lyr,  .gnb_one .gnb_service_lyr { right: 7px;}
.gnb_lst .ico_arrow { position: absolute; left: 50%; width: 13px; height: 7px; margin-left: 8px;  background-position: -162px -259px;}
.gnb_my_li .ico_arrow { top: 34px; margin-left: 8px;}
.gnb_notice_li .ico_arrow { bottom:0 ; margin-left:-6px;}
.gnb_my_li .gnb_my_content { zoom: 1; padding: 15px 0 10px 15px;}

.gnb_area { position: relative; height: 55px; padding: 0 380px 0 251px; z-index: 10; zoom: 1; }
.gnb_area .gnb_list_box { position: relative;white-space: nowrap; font-size: 0;zoom: 1;}
.gnb_area .gnb_list_box .gnb_first { display: inline-block; vertical-align: top;*display: inline;zoom: 1; text-align: left;}
.gnb_area .gnb_list_box ul { height: 55px; font-size: 0; white-space: nowrap;  *display: inline; *zoom: 1;}
.gnb_area .gnb_list_box ul li { width: 55px; padding: 13px 0; zoom: 1;  text-align: center; display:inline-block; -ms-filter: "Alpha(opacity=65)"; filter: alpha(opacity=65); position: relative;}
.gnb_area .gnb_list_box ul li.on:before {background-color:#000;opacity:0.15; -ms-filter: "Alpha(opacity=6)"; filter: alpha(opacity=6); content:''; display:block;position: absolute; top: 0; width: 55px; height: 55px;}
.gnb_list_box li a { width: 29px; height: 29px; display: inline-block; vertical-align: top; position: relative; zoom: 1;}
.gnb_list_box .mail a     { background-position: -16px -47px;}
.gnb_list_box .address a  { background-position: -71px -46px;}
.gnb_list_box .wdrive a   { background-position: -125px -46px;}
.gnb_list_box .calendar a { background-position: -179px -46px;}
.gnb_list_box .board a { background-position: -502px -46px;}
.gnb_list_box .csm a { background-position: -232px -46px;}
.gnb_list_box .sales a { background-position: -286px -46px;}
.gnb_list_box .task a { background-position: -340px -46px;}
.gnb_list_box .cs a { background-position: -394px -46px;}
.gnb_list_box .reserve a { background-position: -448px -46px;}
.gnb_area .article_num { position: absolute; left: 17px; top: -5px; line-height: 13px; font-size:10px;color: #fff; width:auto; height:13px; vertical-align: top; padding-right: 6px; cursor: pointer; background-color:#525763; border-radius:12px; -moz-border-radius:6px; -webkit-border-radius:6px; padding:0 4px; font-family: tahoma,Helvetica;}

/* 로딩 이미지 */
.loadingWrap {display: flex; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 2022;}
.loadingWrap.overlay {background-color: rgba(0,0,0,0.3);}
.loadingWrap > ul {display: flex; align-items: center;}
.loadingWrap > ul > li {display: inline-block; width: 12px; height: 12px; min-width: 12px; border-radius: 50%; margin: 0 4px; animation: loadingItem 1s 0s cubic-bezier(.22,.37,.69,.78) infinite;}
.loadingWrap > ul > li.loadingItem1 {background-color: #6B8AFF; animation-delay: 0s;}
.loadingWrap > ul > li.loadingItem2 {background-color: #65B6FF; animation-delay: 0.2s;}
.loadingWrap > ul > li.loadingItem3 {background-color: #B98AFF; animation-delay: 0.4s;}
.loadingWrap > ul > li.loadingItem4 {background-color: #1DDBD4; animation-delay: 0.6s;}

@keyframes loadingItem {
	0% {transform: scale(1);}
	35% {transform: scale(1.5);}
  70% {transform: scale(1);}
}

.gnb_list_box ul li:hover {opacity: 0.95;}

#gnb_my_layer, .gnb_setting_li, .gnb_admin_li, .gnb_help_li {position: relative;}

/* 메뉴 좌측 */
.msearch { margin-top: 0; white-space: nowrap; float: left; position: relative; z-index: 20; min-width: 252px; margin-left: 12px; margin-right: 2px;}
.msearch .detail, .msearch .search, .msearch .search_btn { border: 1px solid #cbcbcb; border-radius: 0; -webkit-appearance: none; color: #999; vertical-align: top; float: left; height: 21px; line-height: 21px;}
.msearch .search { height: 27px; line-height: 27px; width: 152px; padding-left: 11px; padding-top: 3px; padding-right: 89px; font-weight: 500;  margin-right: -85px; position: relative; z-index: 1; background-color: transparent; border-color: #dadada; min-width: 152px;}
.msearch.infocus .search{ border-color: var(--main-color); position: relative;}
.msearch .search_btn { background-position: -17px -270px; display: inline-block; height: 30px; width: 33px; margin: 0; border-color: transparent; border-radius: 0; z-index:30; background-color: transparent;}
:root .msearch .detail {line-height: 33px\0;}
.msearch .detail { height: 30px; line-height: 32px; padding: 0 8px; font-size: 12px; margin-left: -1px; border: none; position: relative; z-index: 30;}
.msearch .ico_bu { background-position: -49px -284px; width: 11px; height: 4px; display: inline-block; position: relative; top: 14px; margin-left: 3px; *top: 3px; *zoom: 1; vertical-align: top}
.msearch .selected .ico_bu { background-position: -71px -284px;}
.msearch .notice_srch { display: inline-block; vertical-align: top; padding: 9px 0 0 6px; }
.msearch .notice_srch input { width: 13px; height: 13px;  overflow: hidden; vertical-align: -2px; *vertical-align: 0;}
.msearch .notice_srch label { margin-left: 3px; color: #666;}
.msearch.infocus .search, .msearch.infocus .search_btn {position: relative;}

.ar_contact .msearch .search {margin-right: -35px; width: 192px; padding-right: 49px;}
.ar_contact .msearch .detail{display:none;}

/* LAYER DESIGN
---------------------------------------------------------------------------------- */
.ly_dimmed{position:fixed; left: 0px;top: 0px;width: 100%;height: 100%; background: rgba(0,0,0,0.3);display: flex; align-items: center;justify-content: center;z-index: 99999;}
.gnb_notice_li .gnb_notice_lyr { display: none; position: absolute; right: 7px; top: 54px; width: 320px; height: 228px; z-index: 10; box-sizing:border-box; background-color:#fff; border:1px solid #b3b3b3;-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); -moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); color:#333 }
.gnb_my_lyr { position: absolute; right: 7px; top: 54px; z-index: 10; box-sizing:border-box; background-color:#fff; border:1px solid #b3b3b3;-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); -moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); color:#333 ; min-width: 360px; max-width: 550px;}
.gnb_my_lyr .gnb_my_head { background-color:#fcfcfc; border-bottom:1px solid #eeeeee; height:57px; line-height:56px; padding:0 16px; display: flex; flex-wrap: nowrap; align-items: center;}
.gnb_my_lyr .gnb_my_head .my_account {font-weight:bold; display:inline-block; vertical-align:middle; margin-right:10px; width: 100px; color: #000; font-size: 16px; white-space: nowrap;}
.gnb_my_lyr .gnb_my_head .my_account.exit-user {width: auto;}
.gnb_my_lyr .gnb_my_head .my_account.exit-user:hover {cursor:pointer;text-decoration: underline}
.select_box {position: relative; border: 1px solid #cbcbcb; height: 28px; vertical-align: middle; display: inline-block; overflow: hidden; box-sizing:border-box; min-width: 176px; padding: 0 32px 0 8px; background: url(../img/arrow.gif) no-repeat right 50%; appearance: none; width: calc(100% - 110px); text-overflow: ellipsis; font-size: 14px; outline: none; cursor: pointer;}
.gnb_connect_date { line-height:18px; padding-bottom:3px}
.gnb_connect_date dt {color: #000;}
.gnb_connect_date dd { color:#ababab; font-size: 14px}
.gnb_my_li .gnb_my_content .gnb_edit_lst { zoom: 1;}
.gnb_my_li .gnb_my_content .gnb_edit_lst:after {  display: block; clear: both; content: ''; }
.gnb_my_li .gnb_my_content .gnb_edit_lst li { float: left; border-right:0; height:auto; }
.gnb_my_li .gnb_my_content .gnb_edit_lst li.bar { color:#e9e9e9; padding:0 8px 0 8px}
.gnb_my_li .gnb_my_content .gnb_edit_lst li a { color:#333}
.gnb_my_lyr .gnb_my_foot {box-sizing:border-box; height:44px; border-top:1px solid #eee; position: relative}
.gnb_my_lyr .gnb_my_foot .gnb_btn_login { display:block; height:44px; overflow:hidden; line-height:43px; font-size:16px; color:#000; font-weight:bold; text-align:center;}
.gnb_my_lyr .gnb_my_foot .accountManage {position: absolute; top: 50%; transform: translateY(-50%); left: 16px; border: none; font-size: 14px; text-decoration: underline; color: #000; z-index: 2023; letter-spacing: -1px; padding: 0;}

.gnb_my_lyr .gnb_my_content {box-sizing:border-box; zoom: 1; display: flex; padding: 14px 16px;}
.gnb_my_lyr .gnb_my_content .gnb_img_area {position: relative; display: block; width: 64px;}
.gnb_my_lyr .gnb_my_content .gnb_mask { display: block; width: 64px; height: 64px; background-position: -230px -246px; border-radius:18px; -moz-border-radius:18px; -webkit-border-radius:18px; overflow:hidden}
.gnb_my_lyr .gnb_my_content .gnb_txt_area {width: calc(100% - 64px); padding-left: 18px;}
.gnb_my_lyr .gnb_my_content .gnb_account { display:flex; padding: 2px 0 10px; align-items: flex-end;}
.gnb_my_lyr .gnb_my_content .gnb_name { font-size: 14px; display: inline-block; font-weight:bold; padding-right:8px; max-width: 250px; white-space: normal;}
.gnb_my_lyr .gnb_my_content .gnb_name a {  color: #000; font-size: 16px; line-height: 20px;}
.gnb_my_lyr .gnb_my_content .gnb_mail_address {  color: #ababab; display:inline-block}
.gnb_my_lyr .gnb_my_content .gnb_edit_lst { zoom: 1; padding-top:10px; display: flex;}
.gnb_my_lyr .gnb_my_content .gnb_edit_lst:after {  display: block; clear: both; content: ''; }
.gnb_my_lyr .gnb_my_content .gnb_edit_lst li { border-right:0; height:auto; }
.gnb_my_lyr .gnb_my_content .gnb_edit_lst li.bar { color:#e9e9e9; padding:0 8px 0 8px}
.gnb_my_lyr .gnb_my_content .gnb_edit_lst li a { color:#000}
.gnb_my_lyr::before {content: ''; display: block; position: absolute; top: -7px; right: 30px; width: 13px; height: 7px; background: url(../img/ar_main.png) no-repeat -162px -259px;}

.accountStatus {display: none; font-size: 16px; color: #000; letter-spacing: -1px; font-weight: 500;}
.accountReturn {display: none; font-size: 14px; color: #000 !important; letter-spacing: -1px; font-weight: normal; align-items: center;}
.accountReturn > span {display: inline-block; width: 15px; height: 15px; background: url(../img/ar_main.png) no-repeat -355px -411px; margin-left: 2px;}
.gnb_my_lyr.profileChange .gnb_my_head {justify-content: space-between;}
.gnb_my_lyr.profileChange .gnb_my_head .my_account {display: none;}
.gnb_my_lyr.profileChange .gnb_my_head .select_box {display: none;}
.gnb_my_lyr.profileChange .gnb_my_head .accountStatus {display: flex;}
.gnb_my_lyr.profileChange .gnb_my_head .accountReturn {display: flex;}

.gnb_my_lyr.profileChange .gnb_my_content .gnb_img_area {display: none;}
.gnb_my_lyr.profileChange .gnb_my_content .gnb_txt_area {padding-left: 0; width: 100%;}
.gnb_my_lyr.profileChange .gnb_my_content .gnb_edit_lst {display: none;}
.gnb_my_lyr.profileChange .gnb_my_foot .accountManage {display: none;}

.dh_layer .type_a { overflow: hidden;border:1px solid #b3b3b3;}
.dh_layer .type_a .selector {border-bottom: 1px solid #f4f4f4;}
.dh_layer .type_a .selector li { display: block; _display: inline; _margin-bottom: -2px; line-height: 19px; letter-spacing: 0; white-space: nowrap;}
.dh_layer .type_a .selector li:hover:not(.li_tit) { background-color:#F3F5F6}
.dh_layer .type_a .selector li a, .dh_layer .moveBox .moveBox_list li label, .dh_layer .type_a .selector .user_info label { display: block; padding: 5px 19px 3px 9px; cursor: pointer; color:#0f0f0f}
.dh_layer .type_a_check .selector li a {padding: 6px 30px 6px 9px;}
.dh_layer .type_a .selector .selected a { text-decoration: none;}
.ar_drive .dh_layer .type_a .selector .border { border-bottom: 1px solid #f4f4f4; }
.dh_layer .type_a.type_a_check .checked a, .dh_layer .type_a.type_a_check .selected a { background-position: 3px -2111px; color: var(--main-color); background-color: #f3f5f6; font-weight: bold;}
.dh_layer .type_a.type_a_check .selector a { padding-left: 27px; }
.dh_layer .type_a .item_tit {display: block;padding: 5px 0 5px 9px;font-weight: 700;border-bottom: 1px solid #e8e8e8;}
.dh_layer .type_a .selector .user_info { font-size: 11px}
.dh_layer .type_a .selector .user_info label {color:#898989; }
.dh_layer .type_a .selector li.user_info:hover{ background-color:transparent}
.dh_layer .type_a .selector .user_info .arrow { display: inline-block;width:4px; height:5px; background-position: -600px -1061px; margin:0 5px; vertical-align:2px}
.dh_layer .type_a .selector .file { width:105px; padding:4px 0 4px 9px; overflow: hidden; white-space: nowrap; font-weight:bold; text-overflow:ellipsis; -o-text-overflow:ellipsis; -ms-text-overflow:ellipsis}
.dh_layer .type_a .selector .none { color: #999; text-indent: 9px; padding: 5px 0 3px 0; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis;}
.dh_layer .type_a.type_a_check a.descend {position: relative;}
.dh_layer .type_a.type_a_check a.descend button {display: none;}
.dh_layer .type_a.type_a_check .selected a.descend button {background: url(../img/ar_main.png) no-repeat -390px -1054px; display: inline-block; width: 17px; height: 17px; border: none; padding: 0; position: absolute; top: 50%; right: 10px; transform: translateY(-50%);}
.dh_layer .type_a.type_a_check a.descend button.toggle {background-position: -408px -1054px;}

.dh_layer .type_b { padding: 63px 20px 15px; color: #333; line-height: 16px; zoom: 1; position: relative; border:1px solid #b3b3b3}
.dh_layer .type_b .hTitle, .dh_layer .type_b h4, .setup_layer .hTitle, .dh_layer .type_a .hTitle { font-size: 18px; color: #333; display: block; height: 43px; line-height: 56px; position: absolute; left: 0; top: 0; width: 100%; text-indent: 20px; font-weight: bold}
.dh_layer .addButton { position: relative; margin: 0; padding: 19px 0 17px; text-align: center; line-height: 1em; zoom: 1;}
.dh_layer .addButton.bd { display: block; height: 63px; box-sizing:border-box; position: absolute; left: 0; bottom: 0; width: 100%; text-align:center; padding:13px 0 0; background-color:#fff}
.dh_layer .addButton button { border:1px solid #cbcbcb; min-width:104px; height:32px; box-sizing:border-box; color:#666; font-weight: normal; background: #fff}
.dh_layer .addButton button.b { background-color:#525763; border:none; color:#fff}

.dh_layer { overflow: unset; position: absolute; zoom: 1; z-index: 100000; -webkit-box-shadow: 0px 3px 6px #00000029; -moz-box-shadow: 0px 3px 6px #00000029; box-shadow: 0px 3px 6px #00000029; background-color:#fff; }
.dh_layer:after {display: block; clear: both; content: '';}
.dh_layer input[type=text]:focus { border-color:var(--main-color);}
.dh_layer input.disk-filter-extension {width:70px; border:1px solid #cbcbcb; padding: 0 10px; margin-left: 2px;}
.dh_layer input.disk-filter-extension:focus { outline: none; border: 1px solid var(--main-color);}
.dh_layer .hTitle, .notice_layer .hTitle {position: relative; color: #333; font-weight: 700; zoom: 1;}
.dh_layer .ps1 { width: 412px;  padding-top: 13px; }
.dh_layer .hl_noti { border-bottom: 1px solid #e0e0e0; padding-bottom: 8px; margin-bottom: 10px; color: #333; font-size: 11px; letter-spacing: -1px; white-space: nowrap; }
.dh_layer .hl_noti a {  color: var(--main-color); font-size: 11px; text-decoration: underline; background-position: 100% -1057px; padding-right: 6px;}
.dh_layer .attach_file_head { padding: 19px 0 5px 6px; font-size: 11px; font-weight: 700; color: #666;}
.dh_layer .attach_file_head .icoFile { background-position: -51px -389px; width: 8px; height: 13px; display: inline-block; vertical-align: middle; padding-bottom: 3px; margin-right: 7px;}
.dh_layer .attach_file_head .cnt { color: var(--main-color);}
.dh_layer .pText { font-size: 11px; line-height: 1.4em; color: #5b5b5b; overflow: hidden;  word-break: break-all;}
.dh_layer .pText .empty_contents {color: #b1b1b1;}
.dh_layer .pFile { overflow: auto; border: 1px solid #e8e8e8; padding: 7px 11px 6px; max-height: 210px;}
.dh_layer .pFile li { line-height: 18px; margin-bottom: 2px; position: relative;}
.dh_layer .pFile li a {  font-size: 11px; color: #666; vertical-align: top; }
.dh_layer .pFile li a.file { display: inline-block; width: 200px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.dh_layer .pFile li a.filename {pointer-events: none; cursor: default;}
.dh_layer .pFile li .menu { position: absolute; right: 0; top: 0; font-size: 0;}
.dh_layer .pFile li .bar { color: #e8e8e8; font-size: 12px; vertical-align: top; padding: 0 2px 0 1px; }
.dh_layer .addButton { position: relative;  margin: 0; padding: 19px 0 17px; text-align: center; line-height: 1em; zoom: 1; }
.dh_layer .ps1 .addButton { padding-top: 20px;}
.dh_layer button, .pop_reserve button, .setup_layer button, .tooltip_cover button { border: 1px solid #c3c3c3; color: #333; padding: 0 11px; border-radius: 0;}
.dh_layer button.b, .pop_reserve button.b, .setup_layer button.b, .tooltip_cover button.b { background-color: #f3f3f3;}
.dh_layer button.button_s{ border: 1px solid #c3c3c3; color: #333; padding: 0 11px; border-radius: 0; padding-left: 3px; padding-right: 3px; }
.dh_layer .addButton .button_s { font-size: 12px; color: #333!important; padding-left: 11px; padding-right: 11px; height: 27px!important; line-height: 27px; padding-top: 0;min-width:auto!important}
#moveMailLayer {max-width:320px}
.dh_layer .type_a.moveBox { float: none;}
.dh_layer .moveBox .moveBox_list { max-height: 350px; overflow: auto; overflow-x: hidden; *width: 250px;}
.dh_layer .moveBox .moveBox_list li { display: block;  _display: inline; _margin-bottom: -2px; line-height:22px; letter-spacing: 0; white-space: nowrap; background-clip: inherit;}
.dh_layer .moveBox .moveBox_list li:hover{background-color:#f3f5f6}
.dh_layer .moveBox .moveBox_list a { text-decoration: none; outline: 0;}
.dh_layer .moveBox .moveBox_list input { position: absolute; z-index: -1; width: 13px; height: 13px; margin: -1px 0 1px; display: none; }
.dh_layer .moveBox .moveBox_list li label { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 100%; display: block; padding: 3px 19px 1px 24px; cursor: pointer; color:#333}
.dh_layer .moveBox .moveBox_list li.selected label {background-position: 0 -2114px; color: var(--main-color);}
.dh_layer .moveBox .mailBoxMove { width: auto; clear: both; position: relative; border-bottom: 1px solid #e8e8e8; border-top: 1px solid #e8e8e8; margin-bottom: 11px; padding: 10px 72px 7px 6px;}
.dh_layer .moveBox .mailBoxMove a {color:#333; padding: 5px 10px 5px 20px; display:block}
.dh_layer .moveBox .mailBoxMove a:after { content:""; display: inline-block; width: 6px; height: 12px; background: url("../img/ar_main.png") no-repeat -359px -412px; vertical-align: -2px; margin:0 0 0 10px} 
.dh_layer .moveBox .mailBoxMove .ipt_grp { padding: 1px 10px 3px 20px;}
.dh_layer .moveBox .mailBoxMove input { color: #999; border: 1px solid #c5c5c5; vertical-align: middle; width: 100%;padding-left: 9px;box-sizing: border-box;height: 22px;}
.dh_layer .moveBox .mailBoxMove input[type=text]:focus { border-color:var(--main-color);}
.dh_layer .moveBox .mailBoxMove button {position: absolute;box-sizing: border-box;width:50px;top: 10px;right: 22px;border-radius: 0;border:none; background-color:#525763; height: 22px;line-height: 16px; color:#fff;}
.dh_layer .moveBox .btn_area { text-align: center; padding: 0 5px 11px;}
.dh_layer .moveBox .btn_area button { border: 1px solid #cbcbcb; height: 22px; line-height: 22px;  padding: 0 5px; border-radius: 0;}
.dh_layer .moveBox .moveBox_list li .icon { width:13px; height:11px; display:inline-block; margin-right:2px; vertical-align:-1px}

.dh_layer.label_radius {border-radius: 4px;}
.dh_layer.label_radius .type_b {border-radius: 4px; padding-top: 55px;}
.dh_layer.label_radius .type_b .hTitle {border-bottom: none !important; line-height: 54px !important; font-size: 18px;}
.dh_layer.label_radius .addButton.bd {border-radius: 0 0 4px 4px;}
.dh_layer.label_radius .addButton button {min-width: 72px}

.simple_search { padding-bottom: 27px; position: relative;}
.searchLayer { border:1px solid var(--main-color); background: #fff;}
.searchLayer.simple_search { width:339px; box-sizing:border-box}
.searchLayer li { position: relative; zoom: 1;}
.simple_search li.selected { background-color: #f5f5f5;}
.searchLayer.simple_search a { font-weight: 700;}
.simple_search a { word-break: break-all;ord-wrap: break-word;}
.searchLayer a { color: #333; font-size: 12px;  display: block; zoom: 1; padding: 4px 28px 2px 10px; line-height: 16px; text-decoration: none;}
.searchLayer .subtx { color: #999; font-size: 12px; padding-left: 5px; letter-spacing: -1px;font-weight: 400;}
.searchLayer .desc { height: 30px; line-height: 30px; text-indent: 10px; color: #999;}
.searchLayer a.delete_btn { position: absolute; right: 8px; border: 0; background-position: -133px -782px; width: 10px; height: 10px;  padding: 0; cursor: pointer; top: 5px; z-index: 40; }
.searchLayer a.delete_btn:hover {background-position: -146px -782px;}
.dh_layer .searchLayer .quickMenu {border-top: 1px solid #e1e1e1; height: 20px; padding: 7px 9px 0 0; background-color: #f5f5f5; color: #999; text-align: right; font-size: 11px; zoom: 1;  position: absolute; left: 0;  right: 0; bottom: 0;}
.dh_layer .quickMenu a { display: inline-block; color: #a1a2a5; letter-spacing: -1px; }
.dh_layer .quickMenu a:hover { color: #333; }
.dh_layer .quickMenu .posl, .dh_layer .quickMenu .posr { padding: 0; position: absolute; right: 12px; top: 5px; font-size: 11px; }
.dh_layer .quickMenu .posl {left: 10px; right: auto;}
.dh_layer.noneBg {background-color:transparent}

.dh_layer .quickwrite { height: 27px;padding: 5px 0 0 8px; border-top: 1px solid #fafafa; background-color: #f6f6f6;}

.dh_layer .quickwrite .input_quick { width: 268px; height: 19px; line-height: 19px; padding-left: 4px; border: 1px solid #c5c5c5; vertical-align: top; color: #333; *margin: -1px 3px 0 0;}
.dh_layer .quickwrite .button_s {min-width: 39px; text-align: center; height: 21px; line-height: 21px;}

.dh_layer.writeOption::before {content: ""; position: absolute; top: -4px; right: 12px; width: 7px; height: 7px; border-top: 1px solid #B3B3B3; border-right: 1px solid #B3B3B3; background: #fcfcfc; transform: rotateZ(-45deg); z-index: 20;}
.dh_layer .type_b.setting_adrslst_option { padding-bottom: 60px}
.dh_layer .type_b.setting_write_option { padding-bottom: 12px}
.dh_layer .type_b.setting_write_option .hTitle {font-size: 18px; font-weight: bold; border-bottom: 1px solid #f4f4f4; line-height: 45px;}
.dh_layer .type_b.setting_write_option .btn_close {top: 12px;}
.setting_write_option .desc {font-size: 12px; color: #666; line-height: 16px; margin-bottom: 13px;}
.setting_write_option .option_cover, .setting_adrslst_option .option_cover { min-width: 311px; margin-bottom: 18px;}
.setting_write_option .option_cover input, .setting_write_option .option_cover label, .setting_adrslst_option .option_cover input, .setting_adrslst_option .option_cover label {vertical-align: middle;}
.setting_write_option .option_cover label, .setting_adrslst_option .option_cover label { user-select:none;}
.setting_write_option .option_cover input, .setting_adrslst_option .option_cover input { position: relative; top: -2px\0;}
.setting_write_option .option_cover select, .setting_adrslst_option .option_cover select { vertical-align: middle; height: 26px; border: 1px solid #cbcbcb; background: #fff; text-align: center; -webkit-appearance: none; appearance: none; outline: none; background: url(../img/arrow.gif) no-repeat calc(100% + 4px) center; padding: 0 30px 0 12px; cursor: pointer;}
.setting_write_option .option_cover select {min-width: 78px; }
.setting_adrslst_option .option_cover select {min-width: 60px;}
.setting_write_option .option_cover select {text-align: left}
.setting_write_option .option_cover .title, .setting_adrslst_option .option_cover .title { display: block; font-weight: bold; color: #333; margin-bottom: 12px; padding: 0;}
.setting_adrslst_option .option_cover .sending_name { width: 100%; margin-top: -9px;}
.setting_write_option .option_cover .sending_name {margin-top: -3px; width: 100%;}
.setting_write_option .option_cover > div {display: flex; flex-wrap: nowrap; justify-content: flex-start;}
.setting_write_option .option_cover > div > div {width: 33.3%;}

.setting_adrslst_option .option_cover .lineH01 {display: flex; flex-wrap: wrap; width: 295px;}
.setting_adrslst_option .option_cover .lineH01 > div {width: 25%;}

.setting_bigfile .option_cover > div {display: flex; flex-wrap: nowrap; justify-content: flex-start;}
.setting_bigfile .option_cover > div > div {width: 25%;}

#tempate_layer_save.dh_layer .type_b {padding: 66px 23px 5px;}
#tempate_layer_save.dh_layer .type_b .hTitle {border-bottom: none; font-size: 16px; letter-spacing: -0.5px; line-height: 56px; height: 46px;}
#tempate_layer_save.dh_layer .guide_txt {padding-bottom: 15px;}

.dh_layer .hTitle .closelayer, .dh_layer .hTitle .lClose, .dh_layer .ly_alert .btn_layer_close, .dh_layer .type_c .btn_close, .dh_layer button.btn_close, .notice_layer .hTitle .lClose, .mail_preview .btn_close, .mail_reserve .btn_close, .multiAccountSetting .btn_close { border-radius: 0;  border: 0; cursor: pointer; background-color: transparent; padding: 0; background-position: -5px -553px; width: 19px; height: 19px; display: inline-block; position: absolute; right: 18px; top: 16px; overflow: hidden; vertical-align: top;}

.dh_layer button.btn_close {background-position: -5px -554px;}

.dh_layer .guide_txt { font-size: 13px; color:#999; line-height:20px}
.dh_layer .guide_txt .sTipTxt3 em {color:var(--main-color)}

.setting_bigfile .option_cover { min-width: 367px; margin-bottom: 18px;}
.setting_bigfile .option_cover input {position: relative; top: 2px;}
.setting_bigfile .option_cover input[type=text] { width:76px; height:26px; box-sizing:border-box; line-height: 24px; border: 1px solid #cbcbcb; border-radius:0; padding:0 6px}
.setting_bigfile .option_cover input[type=text]:focus {border-color: var(--main-color);}
.setting_bigfile .option_cover .title { display: block; color: #000; margin-bottom: 7px; padding: 0; font-size:13px}
.setting_bigfile .option_cover .inText { color:#ababab}
.setting_bigfile .option_cover .inText em { display:inline-block; color:#000; margin:0 10px 0 5px}
.setting_bigfile .option_cover dl { display:block}
.setting_bigfile .option_cover dt, .setting_bigfile .option_cover dd { display:inline-block}
.setting_bigfile .option_cover dt.title { font-size:14px; color: #333;  display:inline-block; margin-right:15px}
.setting_bigfile .option_cover dd span { color:var(--main-color)}
.setting_bigfile .option_cover dd em { color:#ccc; display:inline-block; margin:0 3px}
.setting_bigfile .option_cover .sending_name { width: 100%; margin-top: -9px;}

.dh_layer .type_b.madrs { padding:0; position: relative; min-width: 1024px; max-width: 1024px; min-height: 600px;}
.dh_layer .type_b.madrs .hTitle, .dh_layer .type_b.madrs .addButton.bd { border-color:#e2e2e2; overflow:hidden;min-width:700px}

.madrs .adrs_content{ padding: 0; z-index:20; position:absolute; top:62px; right:0; left:0; bottom:55px; overflow:auto; _position: static;}
.madrs .adrs_content:after { display: block; clear: both; height: 0; content: ""; visibility: hidden;}

.madrs .adrs_org { position: absolute; left:2%; top: 25px; right: 38.1%; bottom: 18px; _width:612px; _float: left; _height: 100%;}
.madrs .adrs_org.whole_screen { right:2%}
.madrs .notab_menu .adrs_org{ top:0}
.madrs .adrs_org .adrs_tab { display: -webkit-box; display: -webkit-flex; display: flex; position:absolute; right:0; left:0; top:0; z-index:1}
.madrs .adrs_org .adrs_tab li { display:inline-block; white-space:normal; text-align: center; *display: inline;*zoom: 1; -webkit-box-flex: 1; -webkit-flex: 1 0 70px; flex: 1 0 70px;}
.madrs .adrs_org .adrs_tab li a { display:block; margin-right:3px; text-align: center; box-sizing:border-box; border:1px solid #cacaca; background-color:#f8f8f8; color:#999;line-height: 34px; height:32px; overflow: hidden;}
.madrs .adrs_org .adrs_tab li:last-child a { margin-right:0}
.madrs .adrs_org .adrs_tab li.on a { background-color:#fff; color:#000; font-weight:700; border-bottom-color:#fff}
.madrs .adrs_org .adrs_grp { border:1px solid #cacaca; position:absolute; top:31px; bottom:0; right:0; left:0}
.madrs .notab_menu .adrs_org .adrs_grp { top:25px}
.madrs .adrs_org .adrs_grp .adrs_category { position:absolute; top:0; bottom:0; right:46px; left:0}

.adrs_category .adrs_grp_hd { padding:0 15px; border-bottom:1px solid #e6e7e8; min-height:45px; box-sizing:border-box}
.adrs_category .adrs_grp_hd .search_bar { padding-top:14px; zoom:1}
.search_bar .search_form { overflow: hidden; position: relative; vertical-align: top; zoom: 1;}
.search_form .ipt_wrap { border: 1px solid #cacaca; position: relative; zoom: 1; padding-right:38px; display: block; overflow: hidden; height:23px; color: #333;}
.search_form .ipt_wrap .btn_submit { width: 28px; height:23px; position: absolute; right: 0; top: 0; background-position: -200px -766px; border-radius: 0; border: 0; margin: 0; vertical-align: top; overflow: hidden;}
.search_form .ipt_wrap input { border: 0; padding: 0; padding-left:2px; height: 24px; line-height: 24px; width: 100%; vertical-align: top; color:#000; text-indent: 6px; *text-indent: 0; *padding-left: 5px; position: relative; *top: -1px; _padding-left: 0; font-size: 14px}
.search_form .ipt_wrap input:focus { color:#000; border-color:var(--main-color)}
.madrs .recent_hd { position:relative; display:block; padding:11px 0 8px}
.madrs .recent_hd .recent_tit { color:var(--main-color); font-weight:700;}
.madrs .recent_hd .recent_tit .cnt { font-size: 14px; font-weight: 700; color: var(--main-color); font-style: normal;}
.madrs .select_opt { font-size:13px; position:absolute; right:0; top:12px}
.madrs .select_opt a { color:#666}
.madrs .select_opt a.slt { color:var(--main-color)}
.madrs .select_opt .bar {color:#e6e7e8;margin:0 2px}
.madrs .default_group {position:absolute; left:0; top:86px; bottom:11px; border-right:1px solid #e6e7e8; box-sizing:border-box; width:50%; padding-left:8px; overflow:auto}
.madrs .default_group .group_list { padding-right:5px}
.madrs .default_group .group_list li, .madrs .addr_list .addr_result li { line-height:21px; min-height:21px; height:auto;box-sizing:border-box;}
.madrs .default_group .group_list li div.group_mem:hover {background-color: #f7f9ff; border-color: #e4ebff;}
.madrs .default_group .group_list li.click > div, .madrs .adrs_category .addr_list .addr_result li.click > div  { border:1px solid #e4ebff; background-color:#f7f9ff}

.madrs .group_mem { display:block; position:relative; height: 23px; border: 1px solid #fff; box-sizing: border-box; color: #3d3d3d; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 2px;}

.madrs .default_group .group_list li.child_folder.depth1 > div.group_mem { padding-left:10px}
.madrs .default_group .group_list li.child_folder.depth2 > div.group_mem { padding-left:20px}
.madrs .default_group .group_list li.child_folder.depth3 > div.group_mem { padding-left:30px}
.madrs .default_group .group_list li.child_folder.depth4 > div.group_mem { padding-left:40px}
.madrs .default_group .group_list li.child_folder.depth5 > div.group_mem { padding-left:50px}
.madrs .default_group .group_list li.child_folder.depth6 > div.group_mem { padding-left:60px}
.madrs .default_group .group_list li.child_folder.depth7 > div.group_mem { padding-left:70px}
.madrs .default_group .group_list li.child_folder.depth8 > div.group_mem { padding-left:80px}
.madrs .default_group .group_list li.child_folder.depth9 > div.group_mem { padding-left:90px}
.madrs .default_group .group_list li.child_folder.depth10 > div.group_mem { padding-left:100px}

.madrs .group_mem .ipt_cvr {width:54px; left:0; padding-left:17px;}
.madrs .group_mem button { width:13px; height:13px; border:0; padding:0;display:inline-block; background-color: transparent; vertical-align:top; margin:4px 0 0 -17px}
.madrs .adrs_category li.spread_folder > div > span > .btn_folder { background-position:-29px -770px}
.madrs .adrs_category li.fold_folder > div > span > .btn_folder { background-position:-7px -771px }
.madrs .adrs_category li input[type=checkbox] { vertical-align:top; margin:4px 0 0}
.madrs .adrs_category li .ic { display:inline-block; font-size:0; overflow:hidden; text-indent:-1000px; width:13px; height:13px; vertical-align:top; margin:3px 0 0 1px}
.madrs .adrs_category li .ico_fold { background-position:-97px -770px}
.madrs .adrs_category li .ico_profile { background-position:-53px -770px; margin-top:3px; width: 15px; height: 15px;}
.madrs .adrs_category li .ico_profile2 { background-position:-75px -770px; margin-top:3px; width: 15px; height: 15px;}
.madrs .adrs_category li ul { zoom: 1; _width: 100%; _overflow: hidden; padding:0 }
.madrs .adrs_category .addr_list { position:absolute; right:0; top:86px; bottom:11px; box-sizing:border-box; width:50%; overflow:auto}
.madrs .adrs_category .addr_list .group_mem .ipt_cvr { padding-left:13px; width:47px; }
.madrs .adrs_category .addr_list .group_mem label { left:47px;}
.madrs .adrs_category .addr_list .group_mem label em { font-size:12px; color:#999; margin-left:3px}

.madrs .adrs_org .adrs_grp .adrs_sort { position:absolute; top:0; bottom:0; right:0; width:46px; box-sizing:border-box; border-left:1px solid #e6e7e8}
.madrs .adrs_org .adrs_grp .adrs_sort li a { display:block; text-align:center; line-height:22px; height:23.5px; color:#999; font-size:11px; overflow:hidden}
.madrs .adrs_org .adrs_grp .adrs_sort li:first-child a { padding:5px 0 2px}
.madrs .adrs_org .adrs_grp .adrs_sort li.selected a { color:#3d3d3d; background-color:#f8f8f8; }
.adrs_org .btn_ctrl { position: absolute; top: 0; left: 100%; margin: 0; bottom: 0;}
.adrs_org .btn_ctrl .btn_add { position: absolute; left: 15px; z-index: 30; margin-top: -14px; width: 27px; height: 43px; overflow: hidden; background-position: 0 0; border: 0; padding: 0; margin: 0; border-radius: 0; box-sizing:border-box; border:1px solid #cacaca; text-align:center}
.adrs_org .btn_ctrl .btn_add:hover { border:1px solid #3d3d3d}
.adrs_org .btn_add span, .adrs_org .btn_remove span, .adrs_org .page_ctrl button span {display: block; overflow: hidden; width: 7px; height: 9px;font-size: 0; line-height: 0; text-indent:-1000px; margin:auto}
.adrs_org .btn_ctrl button .fc_input { background-position:-165px -773px}
.adrs_org .btn_ctrl button:hover .fc_input { background-position:-187px -773px}
.adrs_org .btn_ctrl .to { top: 21%; _margin-top: 80px;}
.adrs_org .btn_ctrl .cc { top: 57.5%; _margin-top: 230px;}
.adrs_org .btn_ctrl .bcc { top: 83.5%; _margin-top: 330px;}
.adrs_org .btn_ctrl .attendees { top: 46%; _margin-top: 330px;}
.notab_menu .adrs_org .btn_ctrl .to { top: 46%;}

.madrs .toitem { position: absolute; left:61.9%; top: 25px; right: 2%; bottom: 18px; _width: 412px; _float: left; _height: 100%;}
.field_to, .field_bcc, .field_cc, .field_attendees { position: absolute; left: 56px; right: 0; top: 0; bottom: 52%; border:1px solid #cacaca; box-sizing:border-box}
.notab_menu .field_to { bottom:0} 
.field_cc { top: 48%; bottom: 26%; margin-top:8px}
.field_bcc { top: 74%; bottom: 0; margin-top:8px}
.field_attendees { top: 0; bottom: 0;}

.madrs .toitem h3 { box-sizing:border-box; height:30px; border-bottom:1px solid #e6e7e8; overflow:hidden; line-height:30px; font-size:13px; text-indent:11px; position:relative; font-weight: normal;}
.madrs .toitem h3 a { position:absolute; font-size:12px; right:10px; top:0; color:#999; font-weight:normal}
.madrs .toitem h3 a .ico_trash { background-position:-119px -771px; width:11px; height:11px; display:inline-block; vertical-align:-1px; margin-right:3px}
.cnt { font-size: 11px;font-weight: 700; color: var(--main-color); font-style: normal;}
.toitem .addr_list { overflow:auto; position:absolute; top:30px; right:0; left:0; bottom:0}
.toitem .addr_list ul { padding:8px 0 5px 12px}
.toitem .addr_list li { line-height:22px; height:23px; position:relative; overflow:hidden}
.toitem .addr_list li .ic{display:inline-block; font-size:0; overflow:hidden; text-indent:-1000px; width:13px; height:13px; position:absolute; left:0; top:4px}
.toitem .addr_list li .ico_fold { background-position:-97px -770px}
.toitem .addr_list li .ico_profile {background-position:-53px -770px; width: 15px; height: 15px;}
.toitem .addr_list li .ico_profile2 {background-position:-75px -770px; width: 15px; height: 15px;}
.toitem .addr_list li .addr_txt {padding: 0 28px 0 19px; display:block; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; }
.toitem .addr_list li label { position:absolute; right:24px; top:0; font-size: 12px;}
.toitem .addr_list li label input { vertical-align:-2px}
.toitem .addr_list li .del {  background-color: transparent; border:none; border-radius:0; background-position:-146px -770px; width:17px; height:17px; position:absolute; right:6px; top:3px; overflow:hidden; padding:0}
.toitem .addr_list li.subtype .addr_txt { padding-right:116px }

.madrs .adrs_org .adrs_grp.nosort .adrs_category {right:0;}
.madrs .nosort .recent_hd { padding-top:18px}
.madrs .nosort .select_opt { top:19px}
.madrs .nosort .default_group, .madrs .adrs_grp.nosort .adrs_category .toitem { top:56px}
.madrs .adrs_grp.nosort .adrs_category .toitem { right: 0; bottom: 11px; box-sizing: border-box; width: 50%; overflow: hidden; left:auto; }
.adrs_category .field_to, .adrs_category .field_bcc, .adrs_category .field_cc { border:none; left:11px; bottom: 58%;}
.adrs_category .field_cc { top:42%; bottom:29%}
.adrs_category .field_bcc { top:71%; bottom:0}
.adrs_category .toitem h3 { border-bottom:none; border-top:1px solid #e6e7e8; font-weight:normal; text-indent: 0}
.adrs_category .field_to h3 { border:none; line-height:16px; height:16px;}
.madrs .adrs_category .toitem .field_to .addr_list { top:20px }
.madrs .adrs_category .toitem .addr_list { position: absolute; right: 0; left: 0; top:30px; bottom:0; box-sizing: border-box; width: auto; overflow: auto;}
.madrs .adrs_category .toitem .addr_list ul { padding: 0; }
.madrs .adrs_category .toitem .addr_list li .ic { position:relative}
.madrs .adrs_category .toitem .addr_list li .ico_profile { margin-top: 3px; top:auto}
.madrs .adrs_category .toitem .addr_list li .ico_profile2 { margin-top: 3px; top:auto}
.madrs .adrs_grp.nosort .adrs_category .addr_list .group_mem .ipt_cvr { padding-left:0}
.madrs .adrs_grp.nosort .adrs_category .addr_list .group_mem label {left:36px}
.madrs .onlylst .default_group { right:3px; width:auto; border-right:none}

.madrs .adrs_grp.onlylst_result .adrs_category {right:0}
.madrs .adrs_grp.onlylst_result .group_mem .ipt_cvr, .madrs .adrs_grp.onlygroup_result .group_mem .ipt_cvr{ width: 25px;}
.madrs .adrs_grp.onlylst_result .group_mem label, .madrs .adrs_grp.onlygroup_result .group_mem label  { left: 35px;}
.madrs .adrs_grp.onlylst_result .default_group { right: 3px; width: auto; border-right: none; top:20px}
.madrs .adrs_grp.onlygroup_result .adrs_category { right:0; top:5px; border-top:1px solid #e6e7e8}
.madrs .adrs_grp.onlygroup_result .default_group { top:0;bottom:0; padding-top:15px}
.madrs .adrs_grp.onlygroup_result .addr_list {top: 0;bottom:0; padding-top:15px}

.dh_layer.slt_sharing .madrs .adrs_org { top:0}
.dh_layer.slt_sharing .madrs .toitem { top:0;}
.dh_layer.slt_sharing .madrs .adrs_org .adrs_grp { top:0}
.dh_layer.slt_sharing .madrs .adrs_org .adrs_grp .adrs_category { right:0}
.dh_layer.slt_sharing .madrs .default_group { top:90px}
.dh_layer.slt_sharing .type_b.madrs  .hTitle { border-bottom:0}
.dh_layer.slt_sharing .adrs_org .btn_ctrl .to { height:63px; top:50%; margin-top:-32px}
.dh_layer.slt_sharing .field_to { bottom:0}

.type_a.list_layer { display: block; position: relative; z-index: 1; padding: 7px 0 12px 0; border-radius:2px}
.type_a.list_layer li { display: block; position: relative; height: 28px; line-height: 25px;}
.type_a.list_layer a { display: block; overflow: hidden; height: 100%; padding: 4px 20px 0 16px; text-decoration: none; text-overflow: ellipsis;  white-space: nowrap; color:#111}
.type_a.list_layer a:hover { background-color:#f8f8f8; font-weight:bold}
.type_b.list_layer { width:406px; height:320px; box-sizing:border-box;}
.type_b.list_layer .msearch {float: none; padding:0; display:inline-block; margin-left:18px; vertical-align:-7px}
.type_b.list_layer .msearch .search { font-weight:normal; box-sizing:border-box; height: 26px; line-height: 26px; width: 240px; padding-left: 10px; padding-top:2px;}
.type_b.list_layer .msearch .search_btn { background-position: -23px -265px; display: inline-block; height: 26px; width: 30px; position:relative}
.type_b.list_layer .lst_box { overflow:hidden; overflow-y:auto; position:absolute; left:23px; right:0; top:45px; bottom:50px; padding-right:23px}
.type_b.list_layer .lst_box .lst_txt, .type_b.list_layer .lst_box .lst_img { border:0; border-spacing:0; border-collapse:collapse; table-layout:fixed; width:100%; box-sizing:border-box; line-height:30px; height:30px}
.type_b.list_layer .lst_box .lst_txt th {width:30px; font-weight:normal; text-align:left}
.type_b.list_layer .lst_box .lst_txt td a { overflow:hidden; white-space: nowrap; text-overflow: ellipsis; color:#333; display:block}
.type_b.list_layer .lst_box .lst_txt td a:hover { text-decoration:underline}
.type_b.list_layer .lst_box .lst_img { margin-top:10px}
.type_b.list_layer .lst_box .lst_img a { width:63px; height:63px; border:1px solid #ddd; overflow:hidden; display:block; margin:3px;}
.type_b.list_layer.letter_slt { height:305px}
.type_b.list_layer .msearch .form_select_box {width: 55px;margin-right: 5px;height: 24px;position: relative;border: 1px solid #cdcdcd;padding-right: 16px;vertical-align: top;display: inline-block;float: left;overflow: hidden;}
.type_b.list_layer .msearch .form_select_box .current_item {text-indent: 0;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;max-width: 100%;display: block;padding-left: 6px;border-right: 1px solid #cdcdcd;line-height: 24px;font-size: 12px;font-weight: normal;}
.type_b.list_layer .msearch .form_select_box .form-search-to-select {position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 100%;height: 100%;opacity: 0;margin: 0;cursor: pointer;z-index: 30;}
.type_b.list_layer .msearch .form_select_box .select_bullet {background-position: -51px -284px;width: 7px;height: 4px;position: absolute;right: 4px;top: 50%;margin-top: -2px;}
.dh_layer.form-layer .hTitle {height: 60px; line-height: 60px; font-size: 18px; font-weight: bold;}
.dh_layer.form-layer .lst_box {top: 60px; bottom: 80px; padding: 10px 23px 10px 0;}

.type_a.sign_slt { min-width:136px; max-width: 160px;}
.type_a.sign_slt .list_layer { padding: 10px 0; display: block; position: relative; z-index: 1; border-bottom:1px solid #f4f4f4;}
.type_a.sign_slt .list_layer li { position:relative; display:block;}
.type_a.sign_slt .list_layer li a { padding: 0 14px 0 36px; display:block; color:#000; box-sizing: border-box; height: 32px; line-height: 32px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.type_a.sign_slt .list_layer:not(.sign_add) li a:hover {background-color: #f3f5f6;}
.type_a.sign_slt .list_layer li a.vicon { color:var(--main-color); background-position: 9px -2110px; background-color: #f3f5f6;}
.type_a.sign_slt .list_layer.sign_add { padding: 7px 0 5px; border-bottom:0} 
.type_a.sign_slt .list_layer.sign_add a { padding: 0 14px 0 16px; line-height:27px }
.dh_layer.stationery-layer .hTitle {height: 60px; line-height: 60px;}
.dh_layer.stationery-layer .hTitle h5 {font-size: 18px;}
.dh_layer.stationery-layer .lst_box {padding: 5px 23px 15px 0;}

.dh_layer.add_address { overflow: visible;}
.dh_layer .type_c { position: relative; padding: 0; zoom: 1; border:1px solid #b3b3b3; }
.dh_layer .type_c .layer_content { position: relative; padding: 65px 20px 8px; *zoom: 1;}
.dh_layer .type_c .layer_content .hTitle { font-size: 18px; position: absolute; top: 0; left: 0; border-bottom: 1px solid #ededed; width: 100%; height: 44px; line-height: 64px; background-color: #fff; text-indent: 19px; zoom: 1; color: #333; font-weight: bold;}
.dh_layer .type_c .layer_content.upld .hTitle {border-bottom: none;}
.dh_layer .info1 { padding: 0 0 6px; margin:15px 0 10px; font-size: 15px; letter-spacing: -1px; line-height: 18px; color: var(--error-color);}
.dh_layer.add_address .address_list { position: relative; width: 541px; z-index: 30;}
.dh_layer.add_address .tbl_address {width: 100%; table-layout: fixed; border-collapse: collapse; border-spacing:0; border: 0;}
.dh_layer.add_address .hTitle {border-bottom: none !important;}

.dh_layer caption { position: relative; display: table-caption; overflow: hidden; top: 0; left: 0; width: 0; height: 0; border: 0; background: 0 0; font-size: 0; line-height: 0;}
.dh_layer.add_address .tbl_address th { border-width: 1px 0; border-style: solid; border-top-color: #ced2d5; border-bottom-color: #e2e2e2; height: 18px; line-height: 18px; padding: 6px 0; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; font-weight: 500;}
.dh_layer.add_address .tbl_address td {line-height: 24px; padding: 7px; border-top: 1px solid #f1f1f1; -webkit-box-sizing: border-box; box-sizing: border-box;}
.dh_layer.add_address .tbl_address .imp { width: 30px;}
.dh_layer.add_address .tbl_address .name { width: 154px;}
.dh_layer.add_address .tbl_address .email { width: 180px; text-align: center;}
.dh_layer.add_address .tbl_address td.group { padding-right: 15px; padding-left: 15px;}
.dh_layer.add_address .address_scrl_area { max-height: 245px; overflow: auto; border-bottom: 1px solid #ced2d5;}
.dh_layer.add_address .address_scrl_area .tbl_address tr:first-child td { border-top: 0;}
.dh_layer.add_address .tbl_address .email { width: 180px; padding-right: 0;}
.dh_layer.add_address .tbl_address td.group { padding-right: 15px; padding-left: 15px;}
.dh_layer .importantOff, .dh_layer .importantOn { background-position: -6px -379px; display: inline-block; width: 17px; height: 16px;}
.dh_layer .importantOn { background-position: -28px -379px; }
.dh_layer.add_address .tbl_address .importantOff, .dh_layer.add_address .tbl_address .importantOn { position: relative; top: 2px;}
.dh_layer.add_address .tbl_address .name .ipt_txt { border: 1px solid #ddd; height: 24px; line-height: 26px; width: 140px; padding: 0 8px; box-sizing: border-box;}
.dh_layer.add_address .tbl_address .cell_wrap { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 100%; display: inline-block; vertical-align: top; color: #666;}
.dh_layer.add_address .tbl_address .combo_button { border: 1px solid #ddd; display: block; padding: 0 25px 0 10px; position: relative; color: #666; height: 24px; line-height: 26px\0;}
.dh_layer.add_address .tbl_address .combo_button .current { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 100%; display: block;}
.dh_layer.add_address .tbl_address .combo_button .ico_arrow { background-position: -312px -375px; width: 24px; height: 24px; display: inline-block; vertical-align: top; position: absolute; right: 0; top: 0; border-left: 1px solid #ddd; }
.dh_layer.add_address .combo_layer { position: absolute; border: 1px solid #b3b3b3; min-width: 190px; max-width: 250px; background-color: #fff; display: none; z-index: 50; }
.dh_layer.add_address .combo_layer .group_head { background-color: #f2f5f8; border-bottom: 1px solid #dcdcdc; line-height: 31px; height: 31px; padding-left: 11px; white-space: nowrap;}
.dh_layer.add_address .combo_layer .group_head input { vertical-align: middle;}
.dh_layer.add_address .combo_layer .group_head label { margin-right: 15px; vertical-align: middle;}
.dh_layer.add_address .combo_layer .group_body { min-width: 190px; max-height: 116px; overflow: auto;}
.dh_layer.add_address .combo_layer .group_body ul { padding: 6px 0;}
.dh_layer.add_address .combo_layer .group_body a { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 100%; line-height: 18px; padding: 4px 12px; display: block; color: #666;}
.dh_layer.add_address .combo_layer .group_body .active a { color: var(--main-color);}

.dh_layer .type_a .hTitle { border-bottom:0}
.dh_layer .type_a .addButton { padding:30px 0; position:absolute; bottom:0; left:0; right:0}
.dh_layer .type_a .layer_content { position: relative; padding: 65px 23px 85px;}

.make_mailBox .type_a { width:452px}
.make_mailBox .ipt_cover { color:#ccc}
.make_mailBox .ipt_cover input { width: 100%; padding-left: 6px; padding-right: 6px; vertical-align: top; box-sizing: border-box; height: 32px;line-height: 30px; border: 1px solid #cbcbcb; border-radius: 0; color:#000; font-size: 15px}
.make_mailBox input:focus {color:#000; border-color:var(--main-color)}
.make_mailBox .type_a p.err_mbox_txt {color: var(--error-color); opacity: 0; cursor: default;}
.make_mailBox .type_a p.err_pass_txt {color: var(--error-color); opacity: 0; cursor: default;}
.make_mailBox.error_mbox .type_a p.err_mbox_txt {display: block;}
.make_mailBox.error_mbox .type_a p.err_mbox_txt {font-size: 12px; padding-top: 12px;}
.make_mailBox.error_mbox .type_a input[type=text] {border-color: var(--error-color);}
.make_mailBox.error_mbox .type_a p.err_mbox_txt {opacity: 1; cursor: auto;}
.make_mailBox.error_pass .type_a p.err_pass_txt {display: block;}
.make_mailBox.error_pass .type_a p.err_pass_txt {font-size: 12px; padding-top: 12px;}
.make_mailBox.error_pass .type_a input[type=password] {border-color: var(--error-color);}
.make_mailBox.error_pass .type_a p.err_pass_txt {opacity: 1; cursor: auto;}
ul.slt_ipt { display:block; padding:23px 0 18px}
ul.slt_ipt li { display:inline-block; margin-right:25px}
ul.slt_ipt li input,  ul.slt_ipt li label { vertical-align:middle}
ul.slt_ipt li a { display:none; vertical-align:middle; color:#333; text-decoration:underline; margin-left:15px}
.ipt_pw { padding-top:20px;}
.ipt_pw input { box-sizing:border-box; border:1px solid #cbcbcb; color:#999; width:197px; height:32px; line-height:30px; padding: 0 9px; border-radius:0; font-size: 14px}
.ipt_pw input:first-child { margin-right:12px}
.make_mailBox .info1 { color: var(--error-color); font-size:11px; padding-bottom:15px; margin:0}
#makemailbox_type3:checked ~ a { display:inline-block; }

.label_slt .option_cover { min-height:215px; padding-bottom:20px}
.label_slt .ipt_txt { padding:0 0 6px; display:block}
.label_slt .ipt_txt input { border:1px solid #ddd; width:100%; box-sizing:border-box; height:28px; padding:0 10px; max-width: 100%;}
.label_slt .ipt_txt input:focus {border-color: var(--main-color); }
.label_slt .lst_color { display:block; list-style:none;}
.label_slt .lst_color dt { display:block; padding:8px 0;}
.label_slt .lst_color dd {  display:block;}
.label_slt .lst_color dd a { display:inline-block; width:15px; height:15px; margin:0 3px 3px 0}
.label_slt .lst_color dd a.slt { background:url(../img/ar_main.svg) no-repeat -28px -247px }
.label_slt .lst_color dd a span { border:1px solid #000; background-color:transparent; display:block; width:15px; height:15px; box-sizing:border-box; opacity:0.1}

.dh_layer .spam { width: 420px; }
.dh_layer .spam .form_set { position: relative; line-height:16px}
.dh_layer .info1 { padding: 0 0 6px; margin-bottom: 5px; font-size: 14px; letter-spacing: -1px; line-height: 18px; color: #333;}
.dh_layer .bx_spam, .dh_layer .bx_arrange { padding: 9px 10px 8px; border: 1px solid #d7dadd; background-color: #f8f9fb; }
.dh_layer .bx_spam li:not(:last-of-type) {padding-bottom: 10px}
.dh_layer .bx_spam+.bx_spam { border-top: 0;}
.dh_layer .bx_spam_bottom { border-top: 0; margin-bottom: 7px; }
.dh_layer .bx_spam { padding: 9px 10px 8px; border: 1px solid #d7dadd; background-color: #f8f9fb; } 
.dh_layer .bx_spam .lst_txt li:before { display:inline-block; width:3px;height:3px; background-color:#b3b3b3; vertical-align: middle; content:''; margin-right:8px; border-radius:1px}
.dh_layer .info2 { margin-bottom: -2px; padding: 7px 0 0 32px; text-indent: -16px; font-size: 11px; color: #aaa; } 
.dh_layer .spam .info2 { padding-left: 15px; padding-top: 0; }
.dh_layer .info2 em { font-style: normal; font-size: 12px; } 
.dh_layer .info_chk { padding: 6px 0 0; } 
.dh_layer .input { width: 13px; height: 13px; vertical-align: middle;  margin: 0 3px 2px 0; }

.dh_layer .hd_original { width: 620px; }
.dh_layer .hd_original .originBox { width: 100%; height: 340px;border: 0; padding:10px; background-color: #fff; box-sizing: border-box; border: 1px solid #d7dadd;background-color: #f8f9fb; resize: none;}

.make_mailBox .hTitle {border-bottom: none !important;}

.type_a.recipient_box {width:380px; box-sizing: border-box; padding:20px 5px 15px 25px;; overflow: auto; max-height:300px}
.recipient_box_lst { overflow: auto;}
.recipient_box_lst li {display: block; border-bottom:1px solid #efefef}
.recipient_box_lst li:last-child { border:none}
.recipient_box_lst dl { display: table; line-height: 20px; padding:10px 0 }
.recipient_box_lst dl dt, .recipient_box_lst dl dd { display: table-cell}
.recipient_box_lst dl dt { font-weight: bold; width:90px}
.recipient_box_lst dl .fc06 { font-weight: bold}

.dh_layer.bdRadius { border-radius: 5px}
.type_a.sTip { border-radius: 5px; padding:18px; font-size: 13px}
.type_a.sTip .sTip_lst li { padding-left:10px; line-height: 20px; background-position: 0 -139px;}
.type_a.sTip .sTip_dl { display: block; line-height: 20px; margin-top:8px}
.type_a.sTip .sTip_dl span { font-weight:normal; font-style:normal; color:var(--main-color); font-size: 13px}

.type_c.action_channel {border-radius: 5px; box-sizing: border-box; width:574px; overflow: hidden}
.type_c.action_channel .ac_lst { overflow: hidden; overflow-y: auto; max-height: 152px; margin-bottom:16px; padding:0 10px 5px 5px}
.type_c.action_channel .ac_lst table { width:100%; border:none; border-spacing: 0; border-collapse: collapse; table-layout: fixed; box-sizing: border-box;} 
.type_c.action_channel .ac_lst table th {border-bottom:1px solid #F2F2F2; height:34px; line-height: 34px}
.type_c.action_channel .ac_lst table td { position:relative; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding:0 5px; line-height: 32px; height: 32px; vertical-align: middle; box-sizing: border-box}
.type_c.action_channel .ac_lst table tr td img {vertical-align: middle}
.type_c.action_channel .ac_lst table tr td:first-child { padding-left:0}
.type_c.action_channel .ac_lst table tr td:first-child img { width:16px; height: 16px; border-radius: 5px;}
.type_c.action_channel .ac_lst table tr td:last-child { padding-right:0}
.type_c.action_channel .ac_lst table td.num { padding-left:7px!important}
.type_c.action_channel.info_lst { width:497px}
.type_c.action_channel.info_lst .layer_content { padding: 54px 14px 8px;}
.type_c.action_channel.info_lst .layer_content .hTitle {height: 54px;}
.type_c.action_channel .layer_content .hTitle {height: 60px;}
.type_c.action_channel .layer_content .btn_close {top: 20px;}

.groupRemoveLayer .info1 {color: #595959;}
.groupRemoveLayer .option_cover {padding-bottom: 10px;}
.groupRemoveLayer .subGroupInvolved {border-top: 1px solid #F4F4F4; padding-top: 15px;}
.groupRemoveLayer .subGroupInvolved label {color: #000; font-size: 14px; padding-left: 5px;}
.groupRemoveLayer .subGroupInvolved input {position: relative; top: 2px;}

.mail_preview.layer_content { border: 1px solid #b3b3b3; text-align: left; position: absolute; overflow: hidden; background-color:#fff;
	-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	-moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); width: 700px; min-height: 650px; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.mail_preview.layer_content .preview_area { position: absolute; top: 61px; bottom: 130px; height: auto; margin: 0; left: 0; right: 0; border-bottom: 1px solid #E5E5E5; background: #fff; word-wrap: break-word; overflow: auto; padding:0 30px;}
.mail_preview .hTitle {font-size: 18px;position: absolute;top: 0;left: 0;border-bottom: 1px solid #E5E5E5; width: 100%;height: 60px;line-height: 64px;background-color: #fff;text-indent: 30px;zoom: 1; font-weight: bold; color: #333;}
.mail_preview .btn_close {top: 20px !important; right: 20px !important;}

.mail_preview .preview_area .pre_header { padding: 0; border-bottom: 1px solid #E5E5E5;}
.mail_preview .preview_area .pre_header h4.pre_tit { margin: 0; padding: 25px 0 18px; color: #000; font-size: 18px; word-wrap: break-word; font-weight: bold;}
.mail_preview .preview_area .pre_header ul {padding-bottom:5px}
.mail_preview .preview_area .pre_header ul li { position: relative; padding: 0 0 4px 75px; color: #000; line-height: 24px; zoom: 1; min-height: 24px;}
.mail_preview .preview_area .pre_header ul li em { position: absolute; left: 0; display: block;}
.mail_preview .preview_area .pre_header ul.exp li.cc { display: block;}
.mail_preview .preview_area .pre_header > p {padding: 5px 0 14px; font-size: 13px; color: var(--main-color); font-weight: 500;}
.mail_preview .preview_area .pre_attach { padding: 15px 0; border-bottom: 1px solid #E5E5E5;}
.mail_preview .preview_area .pre_attach ul li { color: #000;}
.mail_preview .preview_area .pre_attach ul li .tit { display: inline-block; font-weight: normal;}
.mail_preview .preview_area .pre_attach ul li .tit:before { background-position: -55px -381px; width: 8px; height: 13px; display: inline-block; margin-right: 8px; vertical-align: -2px; content: '';}
.mail_preview .preview_area .pre_attach ul li em { display: inline-block; width: 69px; font-weight: normal;}
.mail_preview .preview_area .pre_attach ul li strong { font-weight: normal; color: #000;}
.mail_preview .preview_area .pre_attach ul li span strong:first-of-type {color: var(--main-color);font-weight: bold;}
.mail_preview .preview_area .pre_attach ul li span strong:last-of-type {color: #898989;}
.mail_preview .preview_area .pre_body, .readFrame { position: relative; margin: 0; padding: 20px; zoom: 1; color: #000; word-wrap: break-word; word-break: normal;line-height: 1.5;}
.mail_preview .preview_area .pre_body * {max-width: 100%;}
.mail_preview .addButton { position: absolute; bottom: 35px; padding: 0; width: 100%; _padding: 5px 0; zoom: 1;_position: static; text-align: center;}
.mail_preview .preview_check { position: absolute; bottom: 86px; white-space: nowrap; margin: 0; line-height: 30px; left: 30px;}
.mail_preview .preview_check input { width: 13px; height: 13px; overflow: hidden; vertical-align: -3px;  *vertical-align: middle;}
.mail_preview .preview_check label { vertical-align: -1px; margin-right: 10px;}
.mail_preview .preview_check .option_tit { margin-right: 20px; display: inline-block; padding:0}
.mail_preview.layer_content .addButton button {font-size: 14px; border: 1px solid #cbcbcb; box-sizing: border-box; text-align: center; font-weight: normal; width: 104px; height: 32px}
.mail_preview.layer_content .addButton button.b {background-color: #525763; border-color: #525763; color: #fff; margin-right: 6px;}
.preAttachWrap {display: inline-flex; align-items: center;}
.preAttachWrap i {display: inline-block; width: 1px; height: 11px; background-color: #ebebeb; margin: 0 10px;}

/* 보내기 예약 레이어 */

.mail_reserve.layer_content { border: 1px solid #b3b3b3; position: absolute; overflow: hidden; background-color:#fff;
	-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	-moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); display: flex; flex-direction: column; padding: 5px 0; width: 388px;}
.mail_reserve > div {padding: 14px 24px}
.layerHead {display: flex; justify-content: space-between; align-items: center;}
.layerHead > h1 {font-size: 18px; font-weight: bold; color: #333; letter-spacing: -0.5px; position: relative; top: 2px;}
.layerHead > .btn_close {position: relative; top: 0; right: 0;}
.layerContent {display: flex; flex-direction: column; font-size: 12px;}
.layerContent > div {padding: 5px 0; display: flex; align-items: center; flex-wrap: wrap;}
.layerContent > div > label {color: #000; padding-left: 5px; font-weight: 500; position: relative; top: -1px;}
.mail_reserve.layer_content .layerContent > div > label {font-size: 15px;}
.layerContent > div > .userSelect {width: 100%; padding: 15px 18px 0;}
.layerContent > div > .userSelect > div > p {color: #666; font-size: 13px; padding-bottom: 7px;}
.layerContent > div > .userSelect > div > select,
.layerContent > div > .userSelect > div > input {border: 1px solid #cbcbcb; appearance: none; box-sizing: border-box; height: 26px; padding: 0 6px; outline: none; background: url(../img/arrow.gif) no-repeat 100px 50%; position: relative; cursor: pointer;}
.layerContent > div > .userSelect > div > input:focus {border-color: var(--main-color);}
.layerContent > div > .userSelect > div > input:first-of-type {width: 100px; margin-right: 2px; background-image: none;}
.layerContent > div > .userSelect > div:nth-child(1) {padding-bottom: 12px;}
.layerContent > div > .userSelect > div:nth-child(1) > select:first-of-type {width: 95px; background-position: 76px 50%;}
.layerContent > div > .userSelect > div:nth-child(1) > select:last-of-type {width: 95px; background-position: 76px 50%;}
.layerContent > div > .userSelect > div:nth-child(2) > select:last-of-type {width: 300px; background-position: 282px 50%;}
.layerFooter > div {display: flex; justify-content: center;}
.layerFooter > div > button {width: 110px; height: 32px; line-height: 32px;}
.layerFooter > div > button:nth-child(1) {color: #fff; background-color: #525763; border-color: #525763;}
.layerFooter > div > button:nth-child(2) {margin-left: 4px; color: #333;}

/* // 보내기 예약 레이어 */

/* 멀티계정 설정 변경 */
.multiAccountSetting.layer_content { border: 1px solid #b3b3b3; position: absolute; overflow: hidden; background-color:#fff;
	-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	-moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); display: flex; flex-direction: column; padding: 10px 0 16px; width: 510px;}
.multiAccountSetting > div {padding: 14px 30px}
.multiAccountSetting .layerContent > div {display: flex; padding: 15px 0; align-items: flex-start; flex-wrap: nowrap;}
.multiAccountSetting .layerContent > div:nth-child(1) {padding: 4px 0 20px; border-bottom: 1px solid #F4F4F4;}
.multiAccountSetting .layerContent > div:nth-child(2) {padding-top: 24px;}
.multiAccountSetting .layerContent > div > h6 {font-size: 15px; color: #000; font-weight: 600; min-width: 120px;}
.multiAccountSetting .layerContent > div:nth-child(2) > h6 {line-height: 28px;}
.multiAccountSetting .layerContent > div > div {display: flex; flex-direction: column; flex: 1; overflow: hidden;}
.multiAccountSetting .layerContent > div > div > div {display: block; overflow: hidden; line-height: 18px;}
.multiAccountSetting .layerContent > div > div > div:nth-child(2) {display: flex; align-items: center;}
.multiAccountSetting .layerContent > div > div > div + div {margin-top: 14px;}
.multiAccountSetting .layerContent > div > div > div > p {font-size: 15px; font-weight: 600; color: var(--main-color); display: inline-block; white-space: nowrap; margin-right: 16px; text-overflow: ellipsis; max-width: 100%; overflow: hidden;}
.multiAccountSetting .layerContent > div > div > div > label {display: inline-flex; align-items: center; font-size: 14px; color: #000;}
.multiAccountSetting .layerContent > div > div > div > label + label {margin-left: 16px;}
.multiAccountSetting .layerContent > div > div > div > label > input[type=checkbox] {margin-right: 6px;}
.multiAccountSetting .layerContent > div > div > div > label > input[type=radio] {margin-right: 5px;}
.multiAccountSetting .layerContent > div > div > div > select {width: 192px; height: 28px; box-sizing: border-box; border: 1px solid #CBCBCB; background: url(../img/arrow.gif) no-repeat calc(100% + 4px) center; padding: 0 25px 0 12px; appearance: none; outline: none; cursor: pointer;}
.multiAccountSetting .layerContent > div > div > div > input {box-sizing: border-box; height: 28px; padding: 0 10px; border: 1px solid #cbcbcb; border-radius: 0; width: 116px; color: #0f0f0f; font-size: 14px;}
.multiAccountSetting .layerContent > div > div > div > input:focus {border-color: var(--main-color);}
.multiAccountSetting .layerContent > div > div > div > span {padding: 0 5px;}

.dh_layer .infotxt_lst { padding-bottom:10px }
.dh_layer .infotxt_lst li { display: block; line-height: 20px; padding-left:8px; position: relative; padding-bottom:2px}
.dh_layer .infotxt_lst li:before { position:absolute; left:0; top:7px; width:3px; height:3px; background-color:#b3b3b3; content:''; border-radius:1px}
.dh_layer .bx_arrange .lst_txt { font-weight: bold; padding:0 3px 3px; line-height: 20px}
/* PADDING - MARGIN
---------------------------------------------------------------------------------- */
.pd_b20 { padding-bottom:20px}
.pd_l10 { padding-left:10px}
.mg_l5pr { margin-left:5%}

/* SKIN DESIGN 
---------------------------------------------------------------------------------- */
.dsg_left #header { height:auto; min-width:auto; position:unset; top:0; left:0; bottom:0;right:0; width:auto; background-color:transparent!important; z-index:1;}
.dsg_left #header h1 { left:54px; top:0;}
.dsg_left #header.h_mail .pwe_home { color: #000; padding-top:0;}
.dsg_left #container { top:0; left:54px}
.dsg_left .gnb_area { height:100%; padding:0;  width: 54px; position: absolute; left: 0; top: 0; bottom: 0; z-index:30}
.dsg_left .gnb_area .gnb_list_box ul { height:100%; white-space: normal;}
.dsg_left .snb_nav .btn_workset { padding-top: 53px }
.dsg_left .svc_menu_area {top: 160px;}
.dsg_left .login_group { position:unset; right: auto; top: auto; width: auto; white-space: normal;}
.dsg_left .gnb_one { position: unset;}
.dsg_left .login_group .gnb_lst {right:15px; top:4px; position: absolute;}
.dsg_left .login_group .gnb_lst:first-of-type {display: none;}
.dsg_left .content_header .gnb_lst {display: block;}
.dsg_left .login_group .gnb_lst > li { border-right:none}
.dsg_left .login_group .gnb_opt { position:absolute; bottom:0; left:0; right:auto; top:auto}
.dsg_left .login_group .gnb_opt > li { border-left: 0; float:none; position:relative}
.dsg_left .login_group .gnb_opt li a { position:relative}
.dsg_left .login_group .gnb_opt li a:after { width:38px; height:38px; border:1px solid #FFF; box-sizing:border-box; opacity:0.50; -ms-filter: "Alpha(opacity=50)"; filter: alpha(opacity=50);content: '' ; position:absolute; top:8px; left:8px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
.dsg_left .login_group .gnb_opt .gnb_admin_li .gnb_icon { margin-left:5px; z-index: 2023;}
.dsg_left .login_group .gnb_opt .gnb_help_li .gnb_icon { margin-left:2px; z-index: 2023;}
.dsg_left .login_group .gnb_opt .gnb_language_li .gnb_icon { margin-top: -1px; margin-left: 3px; z-index: 2023;}
.dsg_left .login_group .gnb_opt .gnb_help_li a { padding-top:14px; padding-bottom:15px}
.dsg_left .gnb_area .gnb_list_box ul li { width:54px; -ms-filter: "Alpha(opacity=100)"; filter: alpha(opacity=100); position: relative}
.dsg_left .gnb_area .gnb_list_box ul li.on::before {opacity:0.15; -ms-filter: "Alpha(opacity=10)"; filter: alpha(opacity=10);}
.dsg_left .login_group .gnb_lst > li::after { clear: none; height: auto; content: ''; display: block; visibility: hidden;}
.dsg_left .login_group .gnb_lst .gnb_notice_li .gnb_icon { background-position: -94px -277px;}
.dsg_left .login_group .gnb_lst .gnb_setting_li .gnb_icon { background-position: -121px -309px;}
.dsg_left a.gnb_my .gnb_name { color:#000}
.dsg_left a.gnb_my .arrow_more { background-position: -53px -269px;}
.dsg_left .gnb_my_lyr { z-index:40}
.dsg_left .content_header { padding-right:200px; overflow: visible}
.dsg_left .gnb_my_li { padding-right:10px}
.dsg_left .notify_area { right:200px;}

.dsg_left .content_header > div:first-of-type {width: calc(100% - 450px)}
.dsg_left .smart_tab_cover {min-width: auto;}
.dsg_left .content_header .gnb_lst {margin: 0; display: flex; flex-wrap: nowrap; background-color: transparent !important;}
.dsg_left .content_header .gnb_lst > li {border: none;}
.dsg_left .msearch {margin-left: 12px; margin-right: 0;}
.dsg_left .gnb_lst .gnb_notice_li a, .dsg_left .gnb_lst .gnb_setting_li a {width: 34px; min-width: 34px;}
.dsg_left .gnb_lst .gnb_notice_li .gnb_icon {background-position: -97px -268px; }
.dsg_left .gnb_lst .gnb_setting_li .gnb_icon {background-position: -127px -269px;}
.dsg_left .gnb_lst .gnb_setting_li {margin-right: 0;}
.dsg_left .gnb_my_namebox {padding: 1px 0 0 5px;}

.ar_contact .dsg_left .svc_menu_area {top: 201px;}

/* 스크롤바 막대 설정*/
.snb_dark .svc_menu_area::-webkit-scrollbar-thumb { background-color: #2f3542;}

.ar_drive .dsg_left .svc_menu_area { top:195px; bottom:0}

 /* IE10+
---------------------------------------------------------------------------------- */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
 .dsg_left #header { position:fixed ;z-index:auto;}
 .dsg_left .login_group { position: relative; z-index:auto }
 .dsg_left .gnb_one { position: relative; z-index:auto}
 .dsg_left .gnb_opt { position:fixed}
}

/* USER SETTINGS
---------------------------------------------------------------------------------- */
.user_settings { position:absolute; top:105px; left:0; right:0; bottom:0; display: flex; flex-direction: column}

.setup_nav { background-color: #fff; border-bottom:1px solid #e7e7e7; display: flex; height: 40px; box-sizing: border-box; padding-left: 1.25rem; padding-right: 1.25rem;overflow: hidden;}
.setup_nav_inner {align-items: center; display: flex; flex: 1;}

.uset_main {padding:20px 20px 5px 20px; background-color:#f9f9f9; border-top:1px solid #eee; position:absolute; left:0; right:0;top:45px; bottom:0; overflow-x: hidden; overflow-y: auto; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; -o-user-select: text; user-select: text;}
.uset_main .uset_module { display: flex; flex-wrap: wrap;}
.uset_unit { border:1px solid #eee; border-radius: 2px; box-sizing: border-box; display: flex; flex-direction: column; font-size:14px; width:250px;  padding:15px 14px; margin:0 15px 15px 0; min-height: 9.375rem; background-color:#fff; }
.uset_unit.selected { border:1px solid #d6d6d6;
-webkit-box-shadow: 0px 3px 3px 0px rgba(50, 50, 50, 0.15);
-moz-box-shadow:    0px 3px 3px 0px rgba(50, 50, 50, 0.15);
box-shadow:         0px 3px 3px 0px rgba(50, 50, 50, 0.15);}
.uset_unit:hover{-webkit-box-shadow: 0px 1px 5px 0px #00000029;-moz-box-shadow: 0px 1px 5px 0px #00000029;
box-shadow: 0px 1px 5px 0px #00000029; transition: box-shadow .3s ease; transition: border .5s ease;border:1px solid #d6d6d6;}
.uset_unit h4 { font-size:16px; padding-bottom:13px; cursor: pointer; font-weight: bold;}
.uset_unit .uset_card_lst{ flex: 1 1 auto; list-style-type: none; padding: 0;  margin-top: 1.25rem; margin-bottom: .9375rem;overflow: hidden;}
.uset_unit .uset_card_lst li { display:block; line-height:28px; position:relative}
.uset_unit .uset_card_lst li a { color:#000; display:block;margin-right:90px; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; }
.uset_unit .uset_card_lst li a:hover { text-decoration:underline}
.uset_unit .uset_card_lst li span { position:absolute; right:0; top:0; width:90px; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; text-align:right; color:#ababab}
.uset_unit.stl_wd .uset_card_lst li a { margin-right:145px;}
.uset_unit.stl_wd .uset_card_lst li span {width:145px;}
.uset_unit .uset_card_lst li a.mg0 { margin:0}
.set_catg { color: #878787; font-size:12px; margin-right: auto; text-transform: lowercase;}

.setup_gnb { display: flex; height:35px; box-sizing: border-box; padding:0 20px;}
.setup_gnb .setup_gnb_inner { align-items: center; display: flex; flex: 1; flex-wrap: nowrap; min-width: 600px;}
.breadcrumb_lst { line-height: 35px; margin: 0;padding: 0; position: relative; z-index:35}
.breadcrumb_lst > li { margin-right:20px; position: relative; display: inline-block; font-size: 15px; vertical-align: middle;}
.breadcrumb_lst > li button{ transition: color .3s ease;}
.breadcrumb_lst > li i{ opacity: .5;  transition: opacity .2s;}
.breadcrumb_lst > li:after { content: "/"; cursor: default; pointer-events: none; position: absolute; margin-left: 8px; color:#878a92;}
.breadcrumb_lst.noSeperator>li:after, .breadcrumb_lst > li:last-child:after  { content: "";}
.breadcrumb_lst > li .dropbtn:hover { color:#18191b}
.breadcrumb_lst > li .dropbtn:hover i { opacity: 1;}

.dropbtn { padding:0 ; font-size: 15px; border: none; color:#878a92; height:auto; line-height:normal}
.dropbtn.tit { color:#18191b }
.dr_arw { background-position:-30px -784px ; width:7px; height:5px; display: inline-block; vertical-align: 2px}
.drs_arw {position:absolute; right:10px; with:7px;height:7px; font-style: normal; }

.dd_content, .dd_content_sub { visibility: hidden; position: absolute; left:0; top:44px; margin-left:-20px; background-color: #fff;  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.15);border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border:1px solid #ccc; font-size: 14px; opacity: 0;  transition: all .3s ; z-index:3; }
.dd_content:after { content:''; width: 0; height: 0; border-style: solid; border-width: 0 10px 12px 10px; border-color: transparent transparent #fff transparent; position:absolute; top:-12px; left:center; margin-left:30px; z-index: 1;}
.dd_content:before{ content: ''; position: absolute; border-style: solid; border-width: 0 10px 12px 10px; border-color: transparent transparent #999 transparent; display: block; width: 0; top: -13px; left: center;  margin-left:30px ; z-index: 0;}

.dd_content p {display: block; overflow: hidden; overflow-y: auto; min-width: 160px; max-height: 360px;}
.dd_content a { color: #18191b; padding: 0 10px; text-decoration: none;overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; position: relative}
.dd_content a:hover {background-color: var(--main-color); color:#fff }

.dd_content_sub { left:160px; top:0; margin:0}
.ddc_inner02 .dd_content_sub {top:35px}
.ddc_inner03 .dd_content_sub {top:70px}

.dropdown_all:hover .dd_content, .dropdown_all:hover .dd_content:after, .dropdown_all:hover .dd_content:before,
.dropdown_mail:hover .dd_content, .dropdown_mail:hover .dd_content:after, .dropdown_mail:hover .dd_content:before,
.dropdown_adrs:hover .dd_content, .dropdown_adrs:hover .dd_content:after, .dropdown_adrs:hover .dd_content:before,
.dropdown_drive:hover .dd_content, .dropdown_drive:hover .dd_content:after, .dropdown_drive:hover .dd_content:before,
.ddc_inner01:hover .dd_content_sub, .ddc_inner01:hover .dd_content_sub:after, .ddc_inner01:hover .dd_content_sub:before,
.ddc_inner02:hover .dd_content_sub, .ddc_inner02:hover .dd_content_sub:after, .ddc_inner02:hover .dd_content_sub:before,
.ddc_inner03:hover .dd_content_sub, .ddc_inner03:hover .dd_content_sub:after, .ddc_inner03:hover .dd_content_sub:before
{ visibility:visible; opacity: 1; }

.setup_scroll {overflow:auto; border-top: 1px solid #eee; height: 100%;}
.setup_lnb {padding:34px 0 0 20px; border-bottom:0}
.setup_lnb .list_menu { width:960px; box-sizing:border-box}
.setup_lnb .list_menu:after { clear:both; float:none; content:''; display:block; }
.setup_lnb .list_menu li { display:inline-block; position:relative; float:left; padding:0; margin-left:-1px }
.setup_lnb .list_menu li a { color:#000; display:block; overflow:hidden; padding:0 20px; min-width:130px; box-sizing:border-box; border:1px solid #e7e7e7; height:29px; line-height:29px; width:auto; text-align:center}
.setup_lnb .list_menu li.on a {background-color:#525763; color:#fff; border:1px solid #525763}
.setup_lnb .list_menu li:first-child { margin-left:0}

.setup_content { padding:27px 25px 0 24px; min-width: 1000px}
.description { padding:0 10px 14px; font-size:13px; color:#898989; line-height:20px }
.description strong {color:var(--main-color); font-weight:400}
ul.description { display:table}
ul.description li { display: table-cell; height:48px; box-sizing: border-box}
ul.description li.des_img { width:220px; background-position: -243px -775px; text-align: center;}
ul.description li.des_img p { position:relative; width:214px; display: block; height:48px; margin: auto}
ul.description li.des_img .upto_data { position:absolute; width:12px; height:48px;margin-left:-6px; top:0; background-position: -470px -793px; padding:0 3px}
ul.description li.des_txt { vertical-align: top; padding-left:20px; padding-top:2px }
ul.description li.des_txt .upto_data_txt { font-size: 16px; font-weight: bold; color:#000}
.import_from_mail_list_region .description {padding: 30px 0 34px 3px !important;}
.import_from_file_list_region .description {padding: 30px 0 34px 3px !important;}
#mboxes-usage-region .description {padding-bottom: 10px;}

.description.lst_style { display: block; }
.description.lst_style li { display: block; height: auto; position: relative; padding-left:8px;}
.description.lst_style li:before { position: absolute; left: 0; top: 7px; width: 3px; height: 3px; background-color: #898989; content: ''; border-radius: 1px;}

.dcrt_line { border:1px solid #e2e2e2; border-width:1px 0; padding:12px 0; line-height:12px; margin-bottom:15px }

.setup_guide {border: 1px solid #e7e7e7; padding: 20px 26px; line-height: 22px; box-sizing: border-box; margin: 0 0 30px; min-height:86px; display: table; width: 90%}
.setup_guide span { vertical-align: middle; display:table-cell}
.setup_guide strong.fc01 {font-weight: bold; font-size: 14px;}

.set_action {display: flex; padding: 20px 10px; border-top: 1px solid #f5f5f7;}
.set_action:first-child {border-top: none;}
.set_action.directionColumn {display: flex; flex-direction: column;}
.set_action .sub_tit { font-size:16px; color:#000; font-weight: bold; line-height: 25px; width: 220px; min-width: 220px; box-sizing: border-box;}
.set_action .sub_tit.titleBottom {padding-bottom: 22px; width: 100%;}
.set_action .sub_tit  strong.fc01 { font-weight:bold; font-size: 16px}
.set_action .sub_tit button.btn_add { vertical-align:1px; box-sizing:border-box; padding:0 8px; font-size:13px; color:#333; height:24px; line-height:24px; margin-left:14px}
.set_action .sub_tit button.btn_add .buAdd { display:inline-block; width:10px; height:10px; background-position:-648px -139px;margin-right:6px;}
.set_action .sub_tit .chk_use { font-weight: normal; font-size: 12px; margin-left:10px; vertical-align: middle}
.set_action .sub_tit .chk_use label {vertical-align: 2px}
.sa_group {display: flex; flex-direction: column; flex: 1; min-width: fit-content;}
.sa_group.first-mail-option {padding-top: 14px;}
.set_action.themeOption .sa_group {min-width: auto;}
.setup_content .sub_tit + .buttonSet { padding-top:1px}
.setup_option .group_btn { display: inline-block; vertical-align: top; margin-right: 3px; font-size: 0;}
.set_action .inbox_action .buttonSet { padding:0; vertical-align:middle;}
.set_action .buttonSet .ico { display:inline-block; width:9px; height:8px; margin:auto;}
.set_action .buttonSet .txt_bar { height:28px; width:1px; background-color:#efefef; display: inline-block; margin:0 7px 0 3px; vertical-align: middle}

.setup_allUsage .set_action:first-of-type .sub_tit {font-size: 20px;}
.setup_allUsage .set_action:first-of-type .sub_tit strong.fc01 {font-size: 20px; margin-right: 6px;}

.moveto { display:inline-block; box-sizing:border-box; width:28px; height:28px; text-align:center; }
.group_btn .moveto { line-height:26px; }
.bu_up { background-position:-143px -840px}
.bu_down { background-position:-187px -840px}
.bu_top { background-position:-231px -840px}
.bu_bottom { background-position:-275px -841px}

.set_action .paginate { position: relative}

.setup_option .inbox_action { width: auto; display:block; padding:1px 0 12px; position:relative}
.setup_option .inbox_action .search_bar {display:inline-block; width: 297px; vertical-align:middle; border-left:1px solid #efefef; padding-left:13px; margin-left:8px}
.setup_option .inbox_action .search_form { display:block; position: relative; right: auto; left: auto; top: auto;}
.setup_option .area_right {position: absolute; right:0; top:0}

.setup_option .set_forms.search_form {border:1px solid #e7e7e7; padding:22px 36px 10px; margin-bottom:34px}
.setup_option .set_forms.search_form dl { display:table; margin-bottom:12px}
.setup_option .set_forms.search_form dl dt, .setup_option .search_form dl dd { display: table-cell; line-height:24px; padding:2px 0}
.setup_option .set_forms.search_form dl dt { font-weight: bold; width:64px;}
.setup_option .set_forms.search_form dl dt.sf_tit { width:125px; vertical-align: top; padding-top:5px;}
.setup_option .set_forms.search_form dl dd.sf_area { border-left:1px solid #f2f2f2; padding-left:12px;}
.setup_option .set_forms.search_form dl dd.sf_area .btn_square { width:88px; height:68px; box-sizing: content-box}
.setup_option .set_forms.search_form dl dd.sf_item { padding-right:12px; vertical-align: top;}
.setup_option .set_forms.search_form dl dd.sf_item p { padding-bottom:13px}
.setup_option .set_forms.search_form dl dd.sf_item p:last-child { padding-bottom:0}
.setup_option .set_forms.search_form dl dd .ipt_mtxt { width:270px; }
.setup_option .set_forms.search_form dl dd .ipt_mtxt .sfin_ipt {width:150px}
.multiAccountContent > p:first-of-type {display: flex; align-items: center;}
.multiDuplicate {margin-left: 4px;}

.ipt_mtxt { display: inline-block; border: 1px solid #cbcbcb;height: 28px;line-height: 28px; box-sizing: border-box;}
.ipt_mtxt input[type=text] { border:none!important; height: 26px!important; vertical-align: top!important }
.space_bar { width:1px; background-color:#f2f2f2; height:24px; vertical-align: middle; margin: 0 7px; display: inline-block}
.bar_dash { display:inline-block; margin-right:7px}

.setup_option .set_forms.search_form input { font-size: 14px}
.set_forms.search_form select, .set_forms.search_form input { margin-right:2px}

.inbox_set.cstmzed .inbox_action { width: 50%;box-sizing: border-box;display: table-cell; padding:0; vertical-align: top}
.inbox_set.cstmzed .inbox_cover { display: table; width:100%; max-width:850px}
.inbox_set.cstmzed .inbox_action .search_bar {display:block; width: 100%; vertical-align:inherit; border:none; padding-left:0; margin-left:0}
.inbox_set.cstmzed .inbox_action .search_form { position: absolute; right: 0; left: 95px; top: 0;}

.setfont_preview {border:1px solid #e7e7e7; height:55px; padding:0 19px; width:690px; line-height:55px; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.setfont_preview span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size:14px}
.user_settings select::-ms-expand { display: none;}
.user_settings select { -o-appearance: none;  -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.user_settings select { box-sizing:border-box; height:28px; line-height:28px; background: url(../img/arrow.gif) no-repeat 100% 50%; padding: 0 40px 0 12px; border:1px solid #cbcbcb; outline: 0 none; margin-right:7px; vertical-align: middle; max-width: 200px; overflow: hidden; text-overflow: ellipsis; cursor: pointer;}
.setfont_preview { margin-bottom:14px}
.set_forms select, .set_forms input { vertical-align:middle}
.set_forms input[type=text], .setup_table input[type=text] {border:1px solid #cbcbcb; box-sizing:border-box; height:28px; overflow:hidden; line-height:28px; padding:0 10px; font-size: 14px }
.set_forms input[type=text]:focus, .setup_table input[type=text]:focus {border-color: var(--main-color);}
.set_forms input[type=password] {border:1px solid #cbcbcb; box-sizing:border-box; height:28px; overflow:hidden; line-height:28px; padding:0 10px }
.set_forms input[type=password]:focus {border-color: var(--main-color);}
.set_forms textarea {border:1px solid #cbcbcb; padding:20px; box-sizing: border-box}
.set_forms { line-height:25px}
.set_forms label { vertical-align:-2px}
.set_forms span {vertical-align: -3.3px}
.set_forms label {padding:0 10px 0 0}
.set_forms label + .ico { margin:0 20px 0 -5px}
.set_forms button {height:28px; vertical-align: middle}
.set_forms .dark {background-color: #525763; color:#fff; border:1px solid #525763}
.set_forms .img { display:inline-block; width:71px; height:31px; vertical-align:middle; margin:0 30px 0 7px}
.set_forms .lst_basic { background-position:-426px -341px}
.set_forms .lst_wide { background-position:-500px -341px}
.set_forms .lst_narrow { background-position:-574px -341px}
.set_forms .lstView_nm, .set_forms .lstView_lr, .set_forms .lstView_tb { width:46px; height:32px;}
.set_forms .lstView_nm { background-position:-656px -341px}
.set_forms .lstView_lr { background-position:-705px -341px}
.set_forms .lstView_tb { background-position:-754px -341px}
.set_forms .new_password + .fc01 {display: block; padding-left: 0; padding-top: 6px;}
.set_forms .confirm_password + .fc01 {display: block; padding-left: 0; padding-top: 6px;}

.set_forms .text_type dt { display:inline-block; width:54px; vertical-align: middle}
.set_forms .text_type dd { display:inline-block; vertical-align: middle; margin-right:4px }
.set_forms .text_type dd a { display:block; box-sizing:border-box; height:22px; border:1px solid #eee; line-height:22px; overflow:hidden; padding:0 5px; color:#000; position:relative}
.set_forms .text_type dd a.on { border:1px solid #8c8d8e; background-color:#8c8d8e; color:#fff}
.set_forms .tx_clr dd {margin-right:0}
.set_forms .tx_clr dd a { padding-left:24px; padding-right:7px; border:none;}
.set_forms .tx_clr dd:nth-of-type(1) a{ background-color:#000; color:#676767}
.set_forms .tx_clr dd:nth-of-type(2) a{ background-color:#111; color:#fff}
.set_forms .tx_clr dd:nth-of-type(3) a{ background-color:#333; color:#908f8f}
.set_forms .tx_clr dd:nth-of-type(4) a{ background-color:#595959; color:#908f8f}
.set_forms .tx_clr dd a.on {border:none}
.set_forms .tx_clr dd a.on:before { position:absolute; left:5px; top:6px; width:14px; height:11px; background:url(../img/ar_main.png) no-repeat -25px -258px; content:''}

.set_info { color:#898989; line-height:18px; margin-top:14px; font-size: 13px}
.set_info.mgt0 {margin-top:4px; padding-bottom: 30px}
.set_info.pb {padding-bottom: 12px;}

.set_sender .sa_group .set_forms {display: flex; align-items: center; position: relative;}
.set_insertBtn {display: inline-flex; height: 28px; width: 72px; align-items: center; border: 1px solid #BBBBBB; justify-content: center; box-sizing: border-box; color: #000; font-size: 13px; line-height: 29px}
.set_sender_add {border: 1px solid #CBCBCB; width: 335px; margin-top: 10px; display: flex; flex-direction: column;}
.set_sender_add > input {width: 100%; box-sizing: border-box; border: none; padding: 8px 12px;}
.set_sender_add > div {display: flex; justify-content: space-between;align-items: center; padding: 5px 12px;}
.set_sender_add > div > div > p {font-size: 12px; color: #BFBFBF;}
.set_sender_add > div > div > p > span {color: #000; display: inline-block;}
.set_sender_add > div > a {display: inline-flex; font-size: 11px; border: 1px solid #CACACA; color: #595959; padding: 3px 4px 3px 18px; position: relative;}
.set_sender_add > div > a::before {position: absolute; display: block; top: 3px; left: 1px; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -644px -138px; content: '';}
.optionLayer {position: absolute; width: 260px; border: 1px solid #B3B3B3; box-shadow: 0 3px 6px #00000029; background-color: #fff; display: flex; flex-direction: column; box-sizing: border-box; padding: 10px 0; top: 28px; left: 0;}
.optionLayer > a {display: flex; padding: 0 14px; justify-content: space-between; align-items: center; height: 32px; cursor: pointer;}
.optionLayer > a:hover {background-color: #F3F5F6;}
.optionLayer > a > p {color: #000; font-size: 14px; padding-bottom: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.optionLayer > a > button {width: 16px; height: 16px; border: none; background: url(../img/ar_main.svg) no-repeat -161px -334px; min-width: 16px;}

.user_settings .btn_box { position: relative; height: 60px; padding-top: 30px; text-align: center; border-top:1px solid #eee; margin-top:30px; min-width: 1000px;}
.user_settings .btn_box .inner_btn { display: inline-block; height: 38px; margin: 0 auto;}
.user_settings .btn_box button { border:1px solid #cbcbcb; height:30px; box-sizing:border-box; overflow:hidden; line-height:30px; min-width:80px; text-align:center; padding:0 20px; font-weight:normal; margin:0 1px; color:#666 }
.user_settings .btn_box button.b {border:1px solid #525763; background-color:#525763; color:#fff}
.user_settings .btn_box .inner_btn span { display:inline-block}
.user_settings .btn_box .inner_btn span:last-child { border-left:1px solid #eee; padding-left:6px; margin-left:2px}

.user_settings .innerBtn {display: flex; align-items: center; justify-content: center; position: relative; padding: 0 14px;}
.user_settings .innerBtn > div {display: inline-flex; align-items: center;}
.user_settings .innerBtn button {all: unset; min-width: 80px; display: inline-flex; cursor: pointer; box-sizing: border-box; border: 1px solid #CBCBCB; align-items: center; justify-content: center; font-weight: normal; color: #333; height: 32px; padding: 0 20px; margin: 0 3px;}
.user_settings .innerBtn button.b {color: #fff; background-color: #525763; border-color: #525763;}
.user_settings .innerBtn .revertSettingBtn {position: absolute; left: 14px; top: 50%; transform: translateY(-50%); border: 1px solid #e7e7e7; background-color: #fff;}

.setup_table { width:100%; box-sizing: border-box; table-layout:fixed; border: 0; padding: 0; border-collapse: collapse; }
.setup_table th, .setup_table td { vertical-align:top; text-align:left; padding:10px; line-height:16px; position:relative; overflow:hidden; white-space:nowrap; text-overflow: ellipsis;}
.setup_table th { border-bottom:1px solid #ddd; font-weight: bold;}
.setup_table td { border-bottom:1px solid #efefef}
.setup_table td > div.text_cont {text-overflow: ellipsis; overflow: hidden;}
.setup_table td > div.text_cont:not(:last-of-type) {padding-bottom: 6px;}

.setup_table th input { vertical-align:-2px}
.setup_table tr.thead th { border:1px solid #ddd; border-width:1px 0; font-weight: bold;}
.setup_table tr.tbottom th, .setup_table tr.tbottom td { border-bottom:1px solid #ddd}
.setup_table tr.tfoot th, .setup_table tr.tfoot td { border-bottom:1px solid #ddd; background-color:#f9f9f9; color:#000;}
.setup_table tr.tfoot th a, .setup_table tr.tfoot td a { color:#000}
.setup_table tr .chk { padding-left:15px !important}
.setup_table tr .txt_cont { line-height:24px; padding:3px 0}
.setup_table input { vertical-align:middle}
.setup_table label {padding:0 10px 0 0; vertical-align:middle}
.setup_table th a, .setup_table td a { color:#000}
.setup_table th a:hover, .setup_table td a:hover { text-decoration: underline}
.setup_table .box_btn button, .set_forms .box_btn button {border: 0; margin: 0; font-size: 15px; color: #666; padding: 0;  vertical-align: middle; height: auto; line-height: 130%;}
.setup_table .box_btn button:disabled, .set_forms .box_btn button:disabled { color:#ccc}
.setup_table .box_btn .bar, .set_forms .box_btn .bar { font-size: 11px; color: #e2e2e2; *margin-right: 4px; margin: 0 10px; vertical-align: middle; position: relative; *top: 1px;}
.setup_table .btn_add { border:1px solid #e7e7e7; box-sizing:border-box; height:20px; padding:0 6px 0 5px; line-height:20px; vertical-align:middle; font-size:12px; color:#595959; overflow:hidden; position:absolute; right:25px; top:7px }
.setup_table .btn_add .ico { display:inline-block; width:10px; height:10px; background-position:-648px -139px; vertical-align:-1px; margin-right:5px}

.setup_table tr.mbox_depth1 td:first-child .tdepth { margin-left:6px}
.setup_table tr.mbox_depth2 td:first-child .tdepth { margin-left:12px}
.setup_table tr.mbox_depth3 td:first-child .tdepth { margin-left:18px}
.setup_table tr.mbox_depth4 td:first-child .tdepth { margin-left:24px}
.setup_table tr.mbox_depth5 td:first-child .tdepth { margin-left:30px}
.setup_table tr.tb_modify td { vertical-align: middle; padding:5px 10px}
.setup_table input[type=text] { padding:0 5px; text-align: center}

.setup_table.word_br td { word-break: break-all; overflow:auto; white-space:normal; text-overflow:inherit;}
.setup_table.word_br.deleted-mail td { word-break: break-all; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.setup_table.word_br.deleted-mail td.under-line span:hover { text-decoration: underline; cursor: pointer;}
.setup_table.word_br.recipient-group-settings td { word-break: break-all; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

/* 환경설정 > 메일 자동 분류 */
.setup_table.auto-division-settings td { border-top:1px solid #efefef; border-bottom:1px solid #efefef}
.setup_table.auto-division-settings tr td.setupSortDrag span { display:none;}
.setup_table.auto-division-settings tr:hover td.setupSortDrag span { display:block;}

.none_group_txt {line-height: 22px}

.totalof { box-sizing: border-box; border:1px solid #ddd; border-width:1px 0; padding: 0 16px; line-height: 37px; position: relative; margin-top:-1px}
.total_result {font-weight: bold}
.total_result .fc01 { font-weight: bold; font-size: 15px;}

.tdepth { display:inline-block; width:7px; height:7px; border:1px solid #c4c4c4; border-width:0 0 1px 1px; margin-right:9px; box-sizing:border-box; vertical-align:1px}
.sharing_to, .sharing_from { width:16px; height:15px; display:inline-block;  background-position:-333px -190px; vertical-align:-3px; margin-right:4px}
.sharing_from { background-position:-355px -190px; }

.label_tag { display:inline-block; border:1px solid #ddd; border-radius:2px; line-height:18px; height:18px; box-sizing:border-box; background-color:#fff; color:#111; padding:0 6px 0 4px; font-size:12px }
.label_tag .color_tag { display:inline-block; border-radius:2px; width:10px; height:10px; margin-right:4px; vertical-align: 0 }

.ly_tooltip { border-radius:6px; background-color:#3a3a3c; position:absolute; line-height:18px; padding:8px 12px; color:#fff;zoom: 1; z-index:10; letter-spacing:-1px; font-size: 13px;}
.ly_tooltip:after { content: ''; position: absolute; top:50%; left: -6px; margin-top:-6px; width: 0; height: 0; border-style: solid; border-width: 6px 6px 6px 0; border-color: transparent #3a3a3c transparent transparent;}

.dh_layer .type_b.make_mailbox { padding-bottom:55px}
.set_forms p {padding-bottom:15px}
.set_forms .inline_info {color: #898989;font-size: 14px; padding:0 10px}
.set_forms .inform_grp { display:inline-block; margin-right:40px; padding:0 }
.setup_content .buttonSet { padding:12px 0; display:inline-block;}
.setup_content .buttonSet.no_pd_top {padding-top:0}
.setup_content .buttonSet input[type="text"] { border: 1px solid #cbcbcb; box-sizing: border-box; height: 28px; overflow: hidden; line-height: 28px; padding: 0 10px; vertical-align: middle}
.setup_content .buttonSet input[type="text"]:focus {border-color: var(--main-color);}
.setup_content .buttonSet .buttonSet_tit { font-weight:bold; margin-right:10px}

.option_tit { font-size:14px; padding:0 0 7px; display:block; color:#000}
.option_cover .sub_tit { font-size:14px; color:#000; padding:20px 0 15px; display:block; font-weight: bold;}

.form_set select::-ms-expand { display: none;}
.form_set select { -o-appearance: none;  -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.form_set select { box-sizing:border-box; height:28px; line-height:28px; background: url(../img/arrow.gif) no-repeat 100% 50%; padding: 0 40px 0 12px; border:1px solid #cbcbcb; outline: 0 none; margin-right:7px; cursor: pointer;}
.form_set select, .form_set input { vertical-align:middle}
.form_set input[type="text"] {border:1px solid #cbcbcb; box-sizing:border-box; height:28px; overflow:hidden; line-height:28px; padding:0 10px; vertical-align: middle; font-size: 14px}
.form_set { line-height:28px}
.form_set label {padding:0 10px 0 0}

.lst_form li {display:block; padding-bottom:5px;}
.lst_form li label.tit { width:80px; display:inline-block; box-sizing:border-box}
.lst_form li select {margin-right:0}
.dh_layer .sTipTxt { font-size:13px; color:#999; display:block; padding:5px 0 10px; letter-spacing: -0.5px}
.dh_layer .sTipTxt em { color:var(--main-color); font-style:normal}
.lst_form .sTipTxt { padding-left:80px}
.dh_layer .type_b.make_mailbox .lst_form .sTipTxt {line-height: 18px; padding-top: 10px;}

.dh_layer .type_b.inbox_set { padding-bottom:70px}
.inbox_set .inbox_cover { display: table; width:100%}
.inbox_cover .inbox_action:first-child { padding-right:13px}
.inbox_cover .inbox_action:last-child { padding-left:13px}
.inbox_action { width:50%; box-sizing:border-box; display:table-cell}
.inbox_action .search_bar { position:relative; display:block; width:100%;}
.inbox_action .search_bar .sub_tit { padding-bottom:4px}
.inbox_action .search_form { position:absolute; right:0; left:95px; top:14px}
.inbox_action .search_form .ipt_wrap { height: 24px; border-radius:13px; border-color:#dfdfdf}
.inbox_action .search_form .ipt_wrap .btn_submit {height: 24px;right:7px; background-position: -69px -682px;}
.add_form { border-bottom:1px solid #dfdfdf; position:relative; height:33px; margin-bottom:3px; box-sizing:border-box}
.add_form .ico_plus { width:13px; height:13px; display:inline-block; background-position:-53px -688px; margin:10px 0 0 2px }
.add_form .ipt_adrs {position:absolute; right:38px;left:25px; bottom:1px }
.add_form input { height:28px; border:none; box-sizing:border-box; width:100%}
.add_form button { border:none; width:38px; height:26px; font-size:13px; color:#666; padding:0; vertical-align:middle; position:absolute; right:0; bottom:3px}
.set_action.proxy .add_form  button { position: relative}
.set_action.proxy .inbox_action { width:450px}
.set_action.proxy .inbox_action .ico_add { background-position: -643px -1050px; background-repeat: no-repeat; width: 10px; height: 10px; display: inline-block;}
.set_action.proxy .inbox_action .add_form button {width:auto}
.set_action.proxy .inbox_action .add_form .ipt_adrs {right: 110px;}
.set_action.proxy .inbox_action .add_form .bar {font-size: 14px; color: #efefef;  vertical-align:0; margin: 0 7px 0 5px;}

.setupPriority {text-align: center !important;}
.setupSortDrag > span {display: inline-flex; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -346px -420px; cursor: pointer;}

.position_right { position:absolute; right:0; top:8px}
.position_right button { background-color:transparent}

.inbox_btn { padding:6px 0 3px 11px}
.inbox_btn span { display:inline-block;}
.inbox_btn .bar { font-size: 14px; color: #efefef; vertical-align:middle; margin:0 0 0 2px}
.inbox_btn input {vertical-align: -3px}
.inbox_btn button { border:none; vertical-align:middle; color:#666; padding:0 8px 0 1px; box-sizing:border-box; height:24px; line-height:24px}

.lst_adrs { margin-bottom:23px}
.lst_adrs .default_group { border:1px solid #cacaca; padding:3px; height:213px; box-sizing:border-box; overflow:hidden; overflow-y: auto}
.lst_adrs .default_group .addr_list li {box-sizing: border-box; border: 1px solid #fff;}
.lst_adrs .default_group .addr_list li.click { border: 1px solid #e4ebff; background-color: #f7f9ff;}
.lst_adrs.caution .default_group .addr_list li.click { border: 1px solid #fddada; background-color: #fff5f5;}
.lst_adrs .default_group .addr_list li .mail_adrs {display: block; position: relative;}
.lst_adrs .mail_adrs .ipt_cvr { position: absolute; width: 54px;left: 0; padding-left: 17px;}
.lst_adrs .default_group .empty_lst { text-align:center; padding-top:30px}

.lst_keyword { margin:90px 0 0 50px}
.lst_keyword li { line-height:20px; color:#999}
.lst_keyword li .kw_dt { display: inline-block; width:80px}
.lst_keyword li .ico {padding-right: 10px;}

.mail_adrs .del, .choose_box dl dd ul li .del { background-color: transparent; border: none; border-radius: 0; background-position: -147px -770px;position:absolute; right:7px; top:4px; width:15px; height:15px; padding:0}
.mail_adrs input { position:absolute; left:6px; top:5px}
.mail_adrs label { padding:0 30px 0 29px; display:block;line-height: 24px; height: 23px; overflow:hidden; white-space: nowrap; text-overflow:ellipsis;}	
.madrs .adrs_content.have_subtit {top: 106px;}
.madrs .adrs_content.have_subtit .cont_subtit { font-size:12px; position:absolute; top:-54px; left:0; right:0; height:51px; border-top:1px solid #e2e2e2; line-height:51px; padding-left:20px}
.madrs .adrs_content.have_subtit { overflow:visible}
.folder_naming .form_set { padding:20px 0 }
.make_folder .guide_txt { margin:8px 0 15px}
.option_cover.madrs .default_group { position: relative; left: auto; top: auto; bottom: auto; border:1px solid #e6e7e8; border-width:1px 0; box-sizing: border-box; width:100%; padding:10px 0 15px; overflow: auto; height:310px}
.make_folder .madrs .default_group .group_list li { min-height: 26px; }
.make_folder .madrs .default_group .group_list li.click,  .make_folder .madrs .default_group .group_list li.ovr{ background:none; border-color:#fff;}
.make_folder .madrs .default_group .group_list li.click label, .make_folder .madrs .default_group .group_list li.ovr label { color:var(--main-color); font-weight:bold}
.make_folder .madrs .group_mem label {height: 24px;line-height: 24px; left:37px}
.make_folder .madrs .adrs_category li input[type=checkbox] { margin: 5px 0 0;}
.make_folder .madrs .group_mem button { margin-top:5px}
.make_folder .madrs .group_mem .ipt_cvr { width:auto}
.make_folder .sTipTxt { padding:17px 0 9px}
#allowed-address-filter-region .addr_list > li:hover {border-color: #E4EBFF; background-color: #F7F9FF;}
#allowed-domain-filter-region .addr_list > li:hover {border-color: #E4EBFF; background-color: #F7F9FF;}
#blocked-address-filter-region .addr_list > li:hover {border-color: #FDDBDB; background-color: #FFEEEE;}
#blocked-domain-filter-region .addr_list > li:hover {border-color: #FDDBDB; background-color: #FFEEEE;}
#keyword-filters-region .addr_list > li:hover {border-color: #FDDBDB; background-color: #FFEEEE;}

.dh_layer .option_cover .ipt_search { padding-bottom:25px; display:block}
.dh_layer .option_cover .ipt_search input[type=text] { height: 32px; box-sizing: border-box; line-height: 32px; border: 1px solid #cbcbcb; border-radius: 0; padding: 0 6px; font-size: 14px}
.dh_layer .option_cover .ipt_search  input[type=text]:focus {border-color: var(--main-color);}
.dh_layer .type_b.make_newfolder { padding-bottom:85px}
.make_newfolder .ipt_search { padding-top:15px}
.make_newfolder .slt_normal {padding:10px 0 20px}
.make_newfolder .slt_normal .ipt_search  {padding:0}
.dh_layer .lnk_pp { text-decoration:underline; color:#000; vertical-align:-2px}
.dh_layer .type_b.make_sort {padding:43px 40px 85px}
.dh_layer .message { font-size:16px; line-height:26px }
.dh_layer .message em { color:var(--main-color)}
.dh_layer .message_sm { line-height:22px; font-weight:500;  }
.dh_layer .txt_deco {text-decoration:underline; font-style:normal}
.dh_layer .type_b.make_sort .sTipTxt {padding: 20px 0}
.dh_layer .type_b.make_sort .form_set { text-align:right}
.dh_layer .type_b.make_sort .form_set button { color:#666}
.dh_layer .type_b.make_sortsetting .option_cover .ipt_search, .dh_layer .type_b.recipient_add .option_cover .ipt_search { padding-bottom:5px;}
.dh_layer .type_b.make_sortsetting, .dh_layer .type_b.recipient_add { padding-bottom:90px}
.type_b.make_sortsetting .lst_form li label.tit { width:100px}
.dh_layer .type_b.make_sortsetting .message { padding:16px 0 0 }
.dh_layer .type_b.make_sortsetting .message_sm { padding:22px 0 7px}

.dh_layer .type_b.recipient_add { min-width:432px}
.dh_layer .type_b.recipient_add .form_set > li:first-of-type > button { white-space: nowrap; }
.dh_layer .type_b.recipient_add .form_set > li:first-of-type {display: flex; flex-wrap: nowrap;}
.dh_layer .type_b.recipient_add .form_set > li:first-of-type > ul { border: 1px solid #cbcbcb; height:82px; vertical-align: top; box-sizing: border-box; padding: 8px 10px; line-height: 20px; margin-right: 5px; overflow-y: auto;}
.dh_layer .type_b.recipient_add .form_set > li:first-of-type > ul > li {display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center;}
.dh_layer .type_b.recipient_add .form_set > li:first-of-type > ul > li > p {font-size: 14px; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.dh_layer .type_b.recipient_add .form_set > li:first-of-type > ul > li > button {display: inline-block; width: 15px; height: 15px; min-width: 15px; background: url(../img/ar_main.svg) no-repeat -147px -770px; border: none; padding: 0; margin-left: 5px;}

.user_profile { display: table}
.user_profile dt { display:table-cell; width:54px; height:54px; text-align: center;}
.user_profile dt a.user_photo { display: block; width:54px; height:54px; border-radius: 15px; overflow: hidden}
.user_profile dt a.user_photo.default-img { background: url(../img/ar_main.svg) no-repeat -304px -258px;}
.user_profile dt > button {all: unset; cursor: pointer; font-size: 14px; color: #000; text-decoration: underline; font-weight: bold; margin-top: 2px;}
.user_profile dd { display:table-cell; vertical-align: top; padding-left: 16px;}
.user_profile dd strong {display: block; font-size: 16px; position: relative; top: 6px;}
.user_profile dd span {display: block; color: #898989;}

.set_forms .slt_forms {margin-top:10px}
.set_forms .slt_forms:first-child { margin-top:0}
.set_forms .slt_forms dt { font-weight: bold}
.set_forms .slt_forms dt label {padding-left:10px}
.set_forms .slt_forms dd p { padding:0 0 0 24px; display: block; line-height: 37px}
.set_forms .slt_forms dd p input[type="text"] { width:254px;}
.set_forms .slt_forms dd p input, .set_forms .slt_forms dd p button {vertical-align: middle}
.set_forms .slt_forms dd p button {min-width:80px; height:28px}
.set_forms .box_btn { vertical-align: middle}

.set_forms.quick_reply {border-top:1px solid #E5E5E5; border-bottom:1px solid #E5E5E5}
.set_forms.quick_reply > div {padding: 5px 0;}
.set_forms.quick_reply li { border-bottom:1px solid #E5E5E5; padding:18px 0; line-height: 16px; position: relative}
.set_forms.quick_reply li > div {width: calc(100% - 140px);}
.set_forms.quick_reply li > div > p {display: block; padding-bottom: 0; line-height: 20px;}
.set_forms.quick_reply li:last-of-type {border-bottom: none;}
.set_forms.quick_reply li .box_btn { position:absolute; right:20px; opacity: 0; top: 18.5px;}
.set_forms.quick_reply li:hover .box_btn {opacity: 1;}

.choose_box { display: table}
.choose_box dl, .choose_box .btn_area { display: table-cell; box-sizing: border-box}
.choose_box dl { width:343px; border:1px solid #cacaca}
.choose_box dl dt, .choose_box dl dd { display: block; box-sizing: border-box}
.choose_box dl dt { border-bottom:1px solid #e6e7e8; height:38px; line-height: 38px; overflow: hidden; padding:0 12px 0 18px; position: relative}
.choose_box dl dt .lst_tit, .choose_box dl dt .lst_tit .fc01 { font-weight: 500;}
.choose_box dl dt button { border:none; line-height: 18px; height: 18px; position:absolute; right:8px; top:10px; color:#999} .choose_box dl dt button .ico_del { background-position: -736px -139px; }
.choose_box dl dd { height:242px; overflow: auto; overflow-x: hidden; }
.choose_box dl dd ul { padding:10px 12px 8px 18px;}
.choose_box dl dd ul li { position: relative; display: block; line-height: 22px}
.choose_box dl dd ul li input, .choose_box dl dd ul li label { vertical-align: middle}
.choose_box dl dd ul li input {margin-right:5px}
.choose_box dl dd ul li .del { right:10px}
.choose_box .selected_lst dd ul { padding-right:0}
.choose_box .btn_area {width:56px; text-align: center; vertical-align: middle}
.choose_box .btn_area button { width:27px; height:63px; box-sizing: border-box;}
.choose_box .btn_area button .ico_move { display: inline-block; width:7px; height:9px; background-position: -165px -773px}

.signature_box { border-bottom:1px solid #eee; padding-bottom:15px; margin-bottom:17px}
.signature_box span {vertical-align: unset;}
.signature_box .signature_view { margin-top:5px;margin-left:10px; padding:10px}
.signature_box .signature_view p {padding-bottom: 0;}

.security_step { display:block;; border:1px solid #cbcbcb; box-sizing: border-box; width:328px; height:78px; overflow: hidden; padding:0; float: none; clear: both; margin-bottom:16px;}
.security_step span { display: inline-block; width:248px; float: left}
.security_step button { width:77px; height:77px; box-sizing: border-box; overflow: hidden; float: left; border:none; border-left:1px solid #ebebeb; text-align: center; position:relative; color:#676766; padding-top:29px; font-size: 13px}
.security_step button em.ico { width:19px; height:22px; display: inline-block; background-position: -668px -1038px; display: block; position:absolute; top:15px; left:50%; margin-left:-10px; background-image: url(../img/ar_main.svg); background-repeat: no-repeat; background-size: 859px 3300px;}

.qrcode_box { border:1px solid #e7e7e7; padding:23px 25px; margin-top:20px; max-width: 840px; box-sizing: border-box}
.qrcode_box .ipt_code {line-height: 20px}
.qrcode_box .ipt_code dt { color:#000; margin-bottom:13px}
.qrcode_box .ipt_code dd { color:#999; }
.qrcode_box .ipt_code dd em {color:#000}
.qrcode_box .ipt_code dd.confirm_ipt { margin-top:12px}
.qrcode_box .ipt_code dd.confirm_ipt button {height:28px; width:80px; color: #0f0f0f;}

.sms_container > p {font-size: 14px; color: #000; padding-bottom: 3px;}
.sms_container .confirm_ipt input {width: 256px; border-color: #ddd;}
.sms_container .send_sms {width: 124px !important;}

.qr_howto { margin-top:34px}
.qr_howto dt {display:block; font-weight: 500;}
.qr_howto dd { margin-top:12px}
.qr_howto dd div.qr_img, .qr_howto dd div.qr_info {display:inline-block; vertical-align: top}
.qr_howto dd div.qr_img { vertical-align: middle; width:136px;}
.qr_howto dd div.qr_img span { display: block; width:136px; height:136px; vertical-align: middle}
.qr_howto dd div.qr_img button { width:137px; height:28px; margin-top:6px; color: #0f0f0f;}
.qr_howto dd div.qr_info { margin-left:17px}
.qr_howto dd div.qr_info .qr_info_tit { font-weight: 500; color:#000; line-height: 12px; padding-bottom:14px; display: block}
.qr_howto dd div.qr_info ul {line-height:20px; }
.qr_howto dd div.qr_info ul li {line-height:22px; color:#595959}
.qr_howto dd div.qr_info ul li a { color:#000; font-weight: 500; text-decoration: underline}
.authentication_code {border-color: #ddd !important;}
.authentication_code:focus {border-color: var(--main-color) !important;}

.form_search { margin-bottom:24px; margin-top:-13px}
.form_search select { margin-right:0;}
.form_search button {min-width:80px}

.dh_layer .type_c.add_signature { width:850px}
.dh_layer .type_c.add_signature .hTitle {font-size: 18px; line-height: 58px; border-bottom: none; font-weight: bold; color: #333;}
.dh_layer .type_c.add_signature .btn_close {top: 15px;}
.dh_layer .type_c.add_signature .form_set {padding-bottom: 20px; border-bottom: 1px solid #E5E5E5;}
.dh_layer .type_c.add_signature #signature-daum-editor-region {border-left: 1px solid #E7E7E7; border-right: 1px solid #E7E7E7;}
.dh_layer .type_c.add_signature #signature-daum-editor-region .editorBottomWrap {bottom: -26px; z-index: 100;}
.dh_layer .type_c.add_signature .addButton {padding: 34px 0 17px;}
.dh_layer .type_c.add_reply {width:500px}
.dh_layer .type_c.add_reply .form_set textarea {height:150px; box-sizing: border-box; padding:10px}
.add_signature .tx-toolbar-boundary {min-width: auto;}

.fsize { font-size: 18px; color:#898989}

.wdpx1 { width:260px!important; box-sizing:border-box; overflow: hidden;}
.wdpx2 { width:125px!important; box-sizing:border-box}
.wdpx3 { min-width:165px!important; box-sizing:border-box}
.wdpx4 { width:366px!important; box-sizing:border-box}
.wdpx5 { width:530px!important; box-sizing:border-box}
.wdpc1 { width:75%!important; box-sizing:border-box}
.wdpc2 { width:100%!important; box-sizing:border-box}
.wdpc3 { width:90%!important; box-sizing:border-box}
.wmin {min-width :80px!important; box-sizing:border-box; font-size: 15px}

.hipx1 {height:120px}

.fc01 { font-weight:normal; font-style:normal; color:var(--main-color); font-size: 13px}
.fc02 { font-weight:normal; font-style:normal; color:var(--error-color)!important}
.fc03 { font-weight:normal; font-style:normal; color:#999}
.fc04 { font-weight:normal; font-style:normal; color:#778de5}
.fc05 { font-weight:normal; font-style:normal; color:#666}
.fc06 { font-weight:normal; font-style:normal; color:#364fff}
.fc07 { font-weight:normal; font-style:normal; color:#29AF01}

.ta_c { text-align:center!important}
.ta_l { text-align:left!important}
.ta_r { text-align:right!important}

.bdc01 {border-color: var(--main-color)!important}
.bdc02 {border-color: var(--error-color)!important}

.lineH01 { line-height: 26px}

.ico_security { background-position:-176px -655px}
.ico_share { background-position:-196px -655px}
.ico_sharedown { background-position:-219px -655px}
.ico_del { background-position:-164px -381px; width:11px; height:11px; display:inline-block; vertical-align:-1px; margin-right:5px;}
.ico_smarrow {  background-position:-537px -151px; width:4px; height:7px;}
.ico_set { width:13px; height:13px; background-position: -185px -666px; display:inline-block; vertical-align:-3px; margin-right:3px}
.ico_info { width:15px; height:14px; background-position: -140px -248px; display:inline-block; vertical-align:top; margin-left:10px}
.ico_info.more-geo-ip { width:15px; height:15px; background-position:-140px -248px; display:inline-block; margin-left:1px; position: relative; top: 3px;}
.ico_scrt { width:13px; height:15px; display:inline-block; background-position:-312px -190px; vertical-align:-2px; margin-right:7px }
.ico_q { width:15px; height:14px; background-position:-118px -248px; display:inline-block; vertical-align:middle;}
.ico_p { width: 10px; height: 10px; display: inline-block; background-position: -670px -139px; margin-right: 6px; }
.ico_eyehide { background-position:-646px -1058px }

#country-settings-layer .setup_table .fc01 {font-size: 15px;}

.dh_layer .type_b.setting_adrslst_option .hTitle {font-size: 18px; font-weight: bold; height: 45.5px; box-sizing: border-box; border-bottom: 1px solid #f4f4f4; line-height: 45.5px;}
.dh_layer .type_b.setting_adrslst_option .addButton {border-top: 1px solid #f4f4f4; padding: 15px 0 0;}
.dh_layer .type_b.setting_adrslst_option .btn_close {top: 13px;}
.dh_layer .type_b.setting_adrslst_option  .hTitle:after {content:""; position: absolute; top: -5px; right: 10px; width: 7px; height: 7px; border-top: 1px solid #B3B3B3; border-right: 1px solid #B3B3B3; background: #fcfcfc; transform: rotateZ(-45deg);}
.setting_adrslst_option .option_cover { min-width: auto; margin-bottom: 22px;}
.sharer_view { width:280px; height:auto}
.dh_layer .type_a.sharer_view .layer_content { padding:0}
.sharer_tit { border-bottom:1px solid #E5E5E5; padding:14px}
.sharer_tit dt { font-size: 16px; font-weight: bold; display: block; padding-bottom:2px}
.sharer_tit dd { display: block; padding-bottom:1px}
.sharer_lst { overflow: hidden; overflow-y: auto; margin:14px; max-height:120px; box-sizing:border-box}
.sharer_lst ul li { line-height: 20px}
.dh_layer .share_info {display: block; margin:52px 20px 0}
.share_info + .adrs_content { top:78px}

.dh_layer .type_c.adrsGroup,.dh_layer .type_c.adrsGroup_form { width:400px}
.dh_layer .type_c.adrsGroup .layer_content .hTitle, .dh_layer .type_c.adrsGroup_form .layer_content .hTitle { border-bottom:none}
.dh_layer .type_c.adrsGroup .addButton { padding-top:45px}
.dh_layer .type_c.adrsGroup_form .layer_content {padding-top:78px}
.dh_layer .type_c.adrsGroup_form .addButton { padding-top:35px}
.dh_layer .type_c.adrsGroup_form .ipt_cover { padding-left:22px; position: relative}
.dh_layer .type_c.adrsGroup_form .ipt_cover .ico_mbox { position: absolute; width: 18px; height:18px; left:0; top:7px; background-position:-551px -145px;}
.txtarea {box-sizing: border-box; height:70px; border:1px solid #BEBFC1; width:100%; padding: 9px 12px; resize: none ;overflow-y: auto;}
.dh_layer .type_b.msgSm { padding: 25px 25px 70px; display: flex; align-items: center; justify-content: center; flex-direction: column; border-radius: 4px;}
#org-group-add-contact-layer {border-radius: 4px;}
#org-group-add-contact-layer .addButton {border-radius: 0 0 4px 4px;}

/** 프로필 **/
.profile_wrapper .ico {display: block; width: 16px; height: 16px; text-indent: -9999px; font-size: 0;}
.make_mailBox .type_a.profile_wrapper{width: 540px; background: #fff;}
.dh_layer .type_a.profile_wrapper .layer_content{padding: 0;}
.profile_wrapper .profile_wrap{display: flex; width: 100%; padding: 30px 28px 0; box-sizing: border-box; }
.profile_wrapper .profile_wrap .pf_l{width: 54px; height: 54px; margin-right: 12px;}
.profile_wrapper .profile_wrap .pf_l .pf_photo{width: 100%; height: 100%; background-position:-300px -266px; border-radius: 18px; overflow: hidden;}
.profile_wrapper .profile_wrap .pf_l .pf_photo.readonly{background-position:-235px -253px;}
.profile_wrapper .profile_wrap .pf_rt{display: flex; padding-top: 5px;}
.profile_wrapper .profile_wrap .pf_rt .favo{display: block; margin: 1px 6px 0 0; background-position: -6px -378px; cursor: pointer;}
.profile_wrapper .profile_wrap .pf_rt .favo.on { background-position: -28px -378px; cursor: pointer;}
.profile_wrapper .profile_wrap .pf_rt .user_name{display: block; margin-right: 10px; line-height: 21px; font-weight: bold;max-width: 250px; white-space: nowrap; overflow: hidden;  text-overflow: ellipsis; font-size: 16px;}
.profile_wrapper .profile_wrap .pf_rt .user_team{ border: 1px solid #e7e7e7; font-size: 12px; height: 20px; line-height: 20px; box-sizing: border-box; padding:0 5px; color: #898989; max-width: 120px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.profile_wrapper .profile_wrap .pf_rb{display: flex; margin-top:6px;}
.profile_wrapper .profile_wrap .pf_rb .email{margin-right: 8px; line-height: 18px; color: #898989; max-width: 380px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.profile_wrapper .profile_wrap .pf_rb .copy_btn{position: relative; top: 2px; background-position: -224px -422px;}

.profile_wrapper .tool_wrap{width: 100%; margin-top: 28px; padding: 0 28px 20px; box-sizing: border-box;}
.profile_wrapper .tool_wrap .tool_list{display: flex; width: 100%; gap: 40px;}
.profile_wrapper .tool_wrap .tool_list li a{display: flex; gap: 7px;}
.profile_wrapper .tool_wrap .tool_list li a p{line-height: 18px; color: #000;}
.profile_wrapper .tool_wrap .tool_list li a em.write{background-position:-159px -421px;}
.profile_wrapper .tool_wrap .tool_list li a em.repair{background-position:-158px -399px;}
.profile_wrapper .tool_wrap .tool_list li a em.group{background-position:-181px -421px;}
.profile_wrapper .tool_wrap .tool_list li a em.del{background-position:-202px -421px;}
.profile_wrapper .user_info_wrap {overflow: auto; position: relative; height: auto; max-height: 590px; margin: 0 0 10px; padding:10px 10px 0; z-index: 10; border-top: 1px solid #e5e5e5; box-sizing: border-box; }
.user_info_list { position:relative; padding-bottom: 25px}
.user_info_list .ico {display: block; width: 18px; height: 18px; text-indent: -9999px; font-size: 0;}
.user_info_list li { box-sizing: border-box; padding: 5px 18px 3px 60px;line-height:18px; position: relative; *zoom: 1; min-height: 36px;}

.user_info_list li .tit { *float: left; position: absolute; width:18px; left: 20px; top:14px}
.user_info_list li .info_user { padding: 2px 0; margin: 0; position: relative; word-break: break-word; word-wrap: break-word;}
.user_info_list li .tit + .info_user {padding-top: 8px;}
.kindof { border: 1px solid #e7e7e7; font-size: 12px; height: 20px; line-height: 20px; box-sizing: border-box; padding:0 5px; color: #898989; margin-left:6px;display: inline-block; text-align: center}
.user_info_list .ico.pin { background-position:-602px -448px; width:10px; height:13px; display: inline-block; position: absolute; top: 12px; left: -15px;}
.ic_phone {background-position: -224px -445px;}
.ic_email {background-position: -201px -445px;}
.ic_memo {background-position:-408px -445px;}
.ic_group {background-position: -247px -445px;}
.ic_birth {background-position: -270px -445px;}
.ic_special_day {background-position: -293px -445px;}
.ic_hompy {background-position: -316px -445px;}
.ic_sns {background-position: -339px -444px;}
.ic_adrs {background-position: -362px -444px;}
.ic_team{background-position: -385px -445px;}
/** // 프로필 **/
/** 연락처 수정 **/
.make_mailBox .type_a.rep_contact_wrapper{width: 560px;}
.dh_layer .type_a.rep_contact_wrapper h3{height: auto; line-height: 26px;  top: 25px; text-indent: 30px; font-weight: bold; font-size: 18px;}
.dh_layer .type_a.rep_contact_wrapper .layer_content{padding: 65px 0px 31px 33px;}
.rc_content_wrap{max-height: 462px; overflow-y: auto; background: #fff;}
.rep_contact_wrapper .ico {display: block; width: 18px; height: 18px; text-indent: -9999px; font-size: 0;}

.rep_contact_wrapper .input_wrapper{display: flex; flex-wrap: wrap;}
.rep_contact_wrapper .input_box{display: flex;}
.rep_contact_wrapper .input_wrap{width: 380px; margin-right: 12px;}

.rep_contact_wrapper .input_wrapper .btns{display: flex; gap: 7px; padding-top: 14px;}
.rep_contact_wrapper .input_wrapper .btns em{margin: 0;}
.rep_contact_wrapper .input_wrapper .btns em.pin{margin-top: 1px;}
.rep_contact_wrapper em{margin-top: 10px; margin-right: 22px;}
.rep_contact_wrapper em.rc_name{background-position: -155px -444px;}
.rep_contact_wrapper em.rc_mail{background-position: -201px -445px;}
.rep_contact_wrapper em.rc_pnum{background-position: -224px -444px;}
.rep_contact_wrapper em.rc_group{background-position: -247px -444px;}
.rep_contact_wrapper .more_conts em.rc_birth{background-position: -270px -444px; }
.rep_contact_wrapper .more_conts em.rc_special_day{background-position: -293px -444px;}
.rep_contact_wrapper .more_conts em.rc_link{background-position: -316px -444px;}
.rep_contact_wrapper .more_conts em.rc_sns{background-position: -339px -444px;}
.rep_contact_wrapper .more_conts em.rc_adrs{background-position: -361px -444px;}
.rep_contact_wrapper .more_conts em.rc_team{background-position: -385px -444px;}
.rep_contact_wrapper em.rc_memo{background-position:-408px -445px; }
.rep_contact_wrapper em.favo{background-position: -429px -445px; cursor: pointer;}
.rep_contact_wrapper em.favo.on{background-position: -450px -445px; cursor: pointer;}
.rep_contact_wrapper .btns em.del{background-position: -26px -685px; cursor: pointer;}
.rep_contact_wrapper .btns em.pin{background-position: -576px -447px; cursor: pointer;}
.rep_contact_wrapper .btns em.pin.on{background-position: -597px -447px; cursor: pointer;}
.rep_contact_wrapper a.add_input_btn{display: block; background-position:-471px -447px; cursor: pointer; margin-top: 14px; margin-left: 7px}

.rep_contact_wrapper .rc_adrs_wrap .input_wrap{position: relative;}
.rep_contact_wrapper .rc_adrs_wrap .input_wrap .search_adrs{position: absolute; top: 12px; left: 228px; width: 16px; height: 16px; background-position:-73px -381px;}

.rep_contact_wrapper input, .rep_contact_wrapper select, .rep_contact_wrapper textarea{height: 26px; margin: 5px 0 12px; font-family: 'AppleM00', sans-serif; line-height: 19px; border: none; border-bottom: 1px solid #ddd; box-sizing: border-box; background: #fff; font-size: 15px; outline: none;}
.rep_contact_wrapper textarea{height: 26px; resize: none; overflow-y: hidden; padding-top:3px; box-sizing: border-box; min-height: 41px}
.rep_contact_wrapper .f_name, .rep_contact_wrapper .pnum, .rep_contact_wrapper .more_conts .link, .sns, .special_day, .rep_contact_wrapper .more_conts .adrs{width: 246px; margin-right: 3px !important;}
.rep_contact_wrapper .l_name, .rep_contact_wrapper .cate_num, .rep_contact_wrapper .more_conts .cate_link, .cate_sns, .cate_special_day, .rep_contact_wrapper .more_conts .cate_adrs{width: 126px;}
.rep_contact_wrapper input::placeholder, .rep_contact_wrapper textarea::placeholder, .rep_contact_wrapper .btn_group_settings::placeholder{color: #bfbfbf;}
.rep_contact_wrapper .width_full{width: 380px;}
.rep_contact_wrapper .btn_group_settings{border: 0 none; padding: 2px 21px 5px 0; line-height: 19px; text-align: left; border-bottom: 1px solid #ddd; line-height: 19px; text-align: left; width: 100%; height: 26px; margin: 5px 0 12px;}

.rep_contact_wrapper .rc_content_wrap .more_conts{display: none;}
.rep_contact_wrapper .rc_content_wrap .more_conts.on{display: block;}

.dh_layer .type_a button.btn_close{top: 20px; right: 20px;}
.type_a.rep_contact_wrapper .bottom_btns{display: flex; justify-content: center; align-items: center; position: relative; margin-top: 43px;}
.type_a.rep_contact_wrapper .bottom_btns .addButton{position: static; padding: 0; border: none;}
.type_a.rep_contact_wrapper .bottom_btns .addButton button{width: 104px; height: 32px;}
.type_a.rep_contact_wrapper .bottom_btns .more_view{display: flex; justify-content: center; align-items: center; gap: 5px; position: absolute; bottom: 2px; right: 26px; line-height: 19px; color: #000;}
.type_a.rep_contact_wrapper .bottom_btns .more_view .more_view_arrow{width: 16px; height: 16px; margin: 0; background-position:-494px -448px;}
.type_a.rep_contact_wrapper .bottom_btns .more_view .more_view_arrow.on{width: 16px; height: 16px; margin: 0; background-position:-515px -448px;}
/** // 연락처 수정 **/
/* S : 승인 팝업 */
.dh_layer.approve_popup .type_c{width: 528px; background: #fff;}
.dh_layer.approve_popup .type_c .layer_content{padding: 35px 27px 30px;}
.aprv_wrap .title{ position:relative; min-height:35px;}
.aprv_wrap .title .tit_ico { width: 35px; height: 35px; position: absolute; left: -3px; top:0; background-position:-295px -1030px; text-indent: -9999px; font-size: 0;}
.aprv_wrap .title h3 { padding-top: 7px; padding-left:47px; line-height:21px; font-weight: bold; font-size: 16px; display: block}
.aprv_wrap .title span.main {color: var(--main-color);}
.aprv_wrap .title span.error {color: var(--error-color);}
.approve_popup .reason_wrap{margin-top: 22px;}
.approve_popup h4{line-height: 17px; color: #666;}
.approve_popup .reason_wrap .reason_cont{width: 100%; margin-top: 6px; padding: 15px; background: #f6f6f6; box-sizing: border-box;}
.approve_popup .reason_wrap .reason_cont p{line-height: 23px;}
.approve_popup .reason_wrap .reason_cont p .dot_ico{display: inline-block; width: 4px; height: 4px; position: relative; top: 4px; margin-right: 11px; background: #000; border-radius: 100%; text-indent: -9999px; font-size: 0;}
.approve_popup .reason_wrap > p {color: var(--error-color); padding-bottom: 20px; line-height: 20px;}
.approve_popup .aprv_person{display: flex; justify-content: space-between; align-items: center; padding: 18px 0 16px; border-bottom: 1px solid #e5e5e5;}
.approve_popup .aprv_person .l_part .name{display: inline-block; margin-top: 8px; margin-right: 9px; line-height: 20px; color:#000; font-size: 13px; font-weight: bold}
.approve_popup .aprv_person .l_part .email{color: #898989; font-size: 13px;}
.approve_popup .aprv_person .l_part .team_n_rank{margin-top: 5px; line-height: 17px; color: #666;}
.approve_popup .aprv_person .r_part{display: flex; align-items: center;}
.approve_popup .aprv_person.missed .name, .approve_popup .aprv_person.missed .email, .approve_popup .aprv_person.missed .team_n_rank{color: #bfbfbf;}
.approve_popup .aprv_person .r_part .status{display: none; line-height: 19px; color: #898989; margin-right: 45px;font-size: 13px}
.approve_popup .aprv_person .r_part .status.on{display: block;}
.approve_popup .aprv_person .r_part .change_btn{display: flex; padding: 7px 12px 5px; line-height: 17px; color: #666; border: 1px solid #CBCBCB;}
.dh_layer.approve_popup .addButton{ margin-top: 27px; padding: 0; border: none;}
.dh_layer.approve_popup .addButton button{width: 104px; font-weight: 400; height: 32px;}
/* E : 승인 팝업 */
/* S : 승인권자 변경 팝업 */
.change_aprv_popup.on { display: flex;}
.dh_layer.change_aprv_popup .type_c{width: 528px; background: #fff; box-sizing: border-box;}
.dh_layer.change_aprv_popup .type_c .layer_content{padding: 65px 27px 30px;}
.dh_layer.change_aprv_popup .type_c .layer_content .hTitle{border-bottom:0; font-size: 16px; top:11px;text-indent: 27px;}
.change_aprv_wrap .aprv_user_wrapper{width: 100%; max-height: 290px; border: 1px solid #ddd; overflow-y: auto;}
.change_aprv_wrap .aprv_user_wrapper::-webkit-scrollbar { width:8px;}
.change_aprv_wrap .aprv_user_wrapper::-webkit-scrollbar-thumb { background-color: #e5e5e5;border-radius: 10px; background-clip: padding-box; border: 3px solid transparent; border-left:0}
.change_aprv_wrap .aprv_user_wrapper::-webkit-scrollbar-track { background-color: transparent; }
.change_aprv_wrap .aprv_user_wrapper .user_wrap{display: flex; justify-content: space-between; padding: 13px 29px 2px 16px;}
.change_aprv_wrap .aprv_user_wrapper .user_wrap:last-child {padding-bottom:12px}
.change_aprv_wrap .aprv_user_wrapper .user_wrap .user_info_wrap{display: flex; width: 100%;}
.change_aprv_wrap .aprv_user_wrapper .user_wrap input.radiobox{width: 14px; height: 14px; margin-top: 3px; margin-right: 11px; cursor: pointer;}
.change_aprv_wrap .aprv_user_wrapper .user_wrap .user_info .name{display: inline-block; margin-right: 9px; line-height: 20px;color:#000; font-size: 13px; font-weight: bold}
.change_aprv_wrap .aprv_user_wrapper .user_wrap .user_info .email{ color: #898989; font-size: 13px; line-height: 19px}
.change_aprv_wrap .aprv_user_wrapper .user_wrap .user_info .name em{color: #898989;}
.change_aprv_wrap .aprv_user_wrapper .user_wrap .user_info .team_n_rank{margin-top: 4px; line-height: 17px; color: #666;}
.change_aprv_wrap .aprv_user_wrapper .user_wrap.missed .user_info *{color: #bfbfbf;}
.change_aprv_wrap .aprv_user_wrapper .status{display: none; margin-left: auto; line-height: 19px; color: #898989;}
.change_aprv_wrap .aprv_user_wrapper .status.on{display: block;}
.dh_layer .change_aprv_popup .addButton{position: static; margin-top: 31px; padding: 0; border: none;}
.dh_layer .change_aprv_popup .addButton button{width: 104px; font-weight: 400; height: 32px;}
/* E : 승인권자 변경 팝업 */

.dh_layer .type_c.reject_popup {width:412px}
.dh_layer .type_c.reject_popup .layer_content { padding: 37px 27px 11px;}
.ico_warring { display: block; width: 35px; height: 35px; margin: 0 auto; background-position:-291px -1039px;}
.msg_txt {text-align: center; display: block; word-break: break-all; overflow: hidden; line-height: 24px; font-size: 16px; padding:24px 0 0}
.dh_layer .type_c.reject_popup .txtarea { height:96px}
.dh_layer .type_c.reject_popup span.msg_txt {font-weight: bold;margin-bottom: 15px;}
.dimed.on{display: flex;}
.dimed{display: none; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; z-index: 999; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.3);}

/* S : 보안메일 발송 */
.secu_mail_send_popup {width: 528px; margin: 30px auto;}
.dh_layer.secu_mail_send_popup .type_c {width: 528px; background: #fff;}
.dh_layer.secu_mail_send_popup .type_c .layer_content{padding: 37px 29px 31px;}
.secu_mail_send_popup .aprv_wrap { padding-bottom:24px; border-bottom:1px solid #e5e5e5}
.secu_mail_send_popup .aprv_wrap .title h3 {padding-top:0; margin-top:0; padding-bottom:3px; line-height:17px}
.addressee_wrap { color:var(--main-color); padding-left:47px; line-height: 17px}
.addressee_wrap span {display:inline-block;}
.addressee_wrap p { display:inline-block; margin-left: 5px;}
.secu_mail_send_popup .b_part{padding-top: 28px;}
.secu_mail_send_popup .b_part .pw_wrap input{width: 470px; padding: 9px 10px 7px; line-height: 17px; border: 1px solid #ddd; box-sizing: border-box;}
.secu_mail_send_popup .b_part .pw_wrap input:focus{color: #000; border: 1px solid var(--main-color);}
.secu_mail_send_popup .b_part .pw_wrap p{margin-top: 8px; line-height: 16px; color: #ababab;}
.secu_mail_send_popup .b_part .pw_wrap p.error {color: var(--error-color);}
.secu_mail_send_popup .setting_wrap{margin-top: 26px;}
.secu_mail_send_popup .setting_wrap .term_set_wrap{margin-bottom: 12px;}
.secu_mail_send_popup .setting_wrap .set_wrap{display: flex; align-items: center; overflow: hidden;}
.secu_mail_send_popup .setting_wrap .set_wrap p{line-height: 18px; color: #0f0f0f; white-space: nowrap;}
.secu_mail_send_popup .setting_wrap .set_wrap p:first-of-type {min-width: 100px; width: 100px;}
.secu_mail_send_popup .setting_wrap .set_wrap .input_wrap{display: flex; gap: 8px;}
.secu_mail_send_popup .setting_wrap .set_wrap .input_wrap select{padding: 6px 8px 5px; line-height: 18px; color: #0f0f0f; border: 1px solid #BBBBBB; box-sizing: border-box; outline: none; cursor: pointer; background: url(../img/arrow.gif) no-repeat 100% 50%; -webkit-appearance: none; appearance: none;}
.secu_mail_send_popup .setting_wrap .set_wrap .input_wrap input{padding: 6px 8px 5px; line-height: 18px; color: #0f0f0f; border: 1px solid #BBBBBB; box-sizing: border-box;}
.secu_mail_send_popup .setting_wrap .set_wrap .input_wrap span{margin-top: 7px;}
.secu_mail_send_popup .setting_wrap .set_wrap.term_set_wrap .input_wrap {flex: 1;}
.secu_mail_send_popup .setting_wrap .set_wrap.term_set_wrap .input_wrap input {flex: 1; width: 0;}
.dh_layer.secu_mail_send_popup .addButton{ margin-top: 48px; padding: 0; border: none;}
/* E : 보안메일 발송 */
/* S : 보안메일 첨부 파일 확인 방법 */
.file_check_popup {position: relative; margin: 30px auto; width: 604px;}
.dh_layer.file_check_popup .type_a, .secu_mail_pw_popup .type_a {width: 604px; background: #fff;}
.dh_layer.file_check_popup .type_a .layer_content, .secu_mail_pw_popup .type_a .layer_content, .bigAttach_pw_popup .type_a .layer_content{padding: 23px 23px 31px;}
.title.logo_title {width: 100%; position: relative; height: 50px; line-height: 34px; border-bottom: 2px solid #e5e5e5;}
.title.logo_title  .hTitle{top: 0px; text-indent: 0; font-size: 20px}
.title.logo_title  .logo{width: 95px; height: 23px; background-position: -7px -8px;}
.secu_mail_wrap .secu_mail_cont{padding-top: 24px; box-sizing: border-box;}
.secu_mail_wrap .secu_mail_cont h4{line-height: 24px; font-size: 18px; padding-bottom: 10px;}
.secu_mail_wrap .secu_mail_cont ol{display: flex; justify-content: space-between; align-items: center; width: 100%; margin-top: 14px;}
.secu_mail_wrap .secu_mail_cont ol li{position: relative; width: 174px; height: 174px; padding: 14px 0 22px; text-align: center; border: 1px solid #E2E2E2; box-sizing: border-box}
.secu_mail_wrap .secu_mail_cont ol li::after{content: ""; position: absolute; top: 50%; left: 100%; width: 18px; height: 18px; transform: translateY(-50%); background: url("../img/ar_main.png") no-repeat -523px -511px;}
.secu_mail_wrap .secu_mail_cont ol li.step_03::after{display: none}
.secu_mail_wrap .secu_mail_cont ol li .step{line-height: 24px; font-weight: bold; font-size: 18px}
.secu_mail_wrap .secu_mail_cont ol li .img{display: block; width: 87px; height: 64px; margin: 11px auto 17px;}
.secu_mail_wrap .secu_mail_cont ol li.step_01 .img{width: 56px; background-position: -254px -483px;}
.secu_mail_wrap .secu_mail_cont ol li.step_02 .img{background-position: -335px -479px;}
.secu_mail_wrap .secu_mail_cont ol li.step_03 .img{background-position: -430px -480px;}
.secu_mail_wrap .secu_mail_cont ol li p{line-height: 21px; font-size: 16px;font-weight: 500}
.secu_mail_wrap .file_secu_info{width: 100%; margin-top: 20px; box-sizing: border-box; border: 1px solid #E2E2E2; padding: 18px 22px 16px; background-color: #FBFBFB;}
.secu_mail_wrap .file_secu_info .secu_info{display: flex; line-height: 20px; font-weight: bold}
.secu_mail_wrap .file_secu_info .secu_info.times_wrap{margin-top: 8px;}
.secu_mail_wrap .file_secu_info .secu_info span{width: 110px;}
.secu_mail_wrap .file_secu_info .secu_info em{margin-left: 4px;}
.wrapper_footer{width: 100%; padding: 20px 25px; line-height: 17px; color: #595959; border-top: 1px solid #EEEEEE; box-sizing: border-box;}
/* E : 보안메일 첨부 파일 확인 방법 secu_mail_pw_wrapper*/
/* S : 보안메일 비밀번호 입력 */
.secu_mail_pw_popup {position: relative; width: 604px; margin: 100px auto;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap{width: 100%; margin-top: 18px; padding:22px 25px 24px; border: 1px solid #E2E2E2; box-sizing: border-box;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_hint_wrap{display: flex; gap: 24px; line-height: 21px; font-size:14px; font-weight: bold}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_hint_wrap span.pw_hint{position: relative;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_hint_wrap span.pw_hint::after{content: ""; display: block; width: 16px; height: 16px; position: absolute; top: 2px; right: 100%; background: url("../img/ar_main.png") no-repeat -528px -512px;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap{width: 100%; height: 62px;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap{display: flex; justify-content: space-between; align-items: center; margin-top: 25px;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap input{padding: 8px 10px 7px; line-height: 17px; border: 1px solid #ddd; box-sizing: border-box;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap input::placeholder{font-family: 'AppleM00', sans-serif; color: #898989;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap input:focus{color: #000; border: 1px solid var(--main-color);}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap  p.pw_status{display: none; margin-top: 12px; color: var(--error-color);}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap button.pw_check_btn{display: flex; justify-content: center; align-items: center; width: 102px; height: 34px; line-height: 22px; color: #fff; background: #525763;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.wrong .input_wrap input{border-color: var(--error-color);}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.exceeded .input_wrap input{border-color: var(--error-color);}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.recalled .input_wrap input{border-color: var(--error-color);}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.expired .input_wrap input{border-color: var(--error-color);}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.avaliable .input_wrap input{border-color: var(--error-color);}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.wrong  p.pw_status.wrong{display: block;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.exceeded  p.pw_status.exceeded{display: block;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.recalled  p.pw_status.recalled{display: block;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.expired  p.pw_status.expired{display: block;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.avaliable  p.pw_status.avaliable{display: block;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info{margin-top: 15px;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info{display: flex; line-height: 20px;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info.times_wrap{margin-top: 10px;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info span{width: 110px;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info em{margin-left: 0px;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info p{display: inline-block;}
.secu_mail_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info p.times_count{color: var(--main-color);}
.secu_mail_pw_popup .secu_mail_cont p.contact{margin-top: 9px; line-height: 18px; color: #555; text-align: right;}
.secu_mail_pw_popup .secu_mail_cont p.contact em.contact_ico{display: inline-block; width: 16px; height: 16px; position: relative; top: 2px; background: url("../img/ar_main.png") no-repeat -545px -512px;}
.secu_mail_pw_popup .secu_mail_cont p.contact span.contact_num{display: inline-block; margin-left: 12px; font-weight: bold}
/* E : 보안메일 비밀번호 입력 */

/* 대용량첨부파일 비밀번호 입력 */
.bigAttach_pw_popup {position: relative; width: 604px; margin: 30px auto;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap{width: 100%; margin-top: 18px; padding:22px 25px 24px; border: 1px solid #E2E2E2; box-sizing: border-box;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_hint_wrap{display: flex; gap: 24px; line-height: 21px; font-size:14px; font-weight: bold}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_hint_wrap span.pw_hint{position: relative;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_hint_wrap span.pw_hint::after{content: ""; display: block; width: 16px; height: 16px; position: absolute; top: 2px; right: 100%; background: url("../img/ar_main.png") no-repeat -528px -512px;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap{width: 100%; height: 62px;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap{display: flex; justify-content: space-between; align-items: center; margin-top: 25px;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap input{padding: 8px 10px 7px; line-height: 17px; border: 1px solid #ddd; box-sizing: border-box;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap input::placeholder{font-family: 'AppleM00', sans-serif; color: #898989;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap input:focus{color: #000; border: 1px solid var(--main-color);}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap  p.pw_status{display: none; margin-top: 12px; color: var(--error-color);}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap .input_wrap button.pw_check_btn{display: flex; justify-content: center; align-items: center; width: 102px; height: 34px; line-height: 22px; color: #fff; background: #525763;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.wrong .input_wrap input{border-color: var(--error-color);}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.times_over .input_wrap input{border-color: var(--error-color);}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.not_found .input_wrap input{border-color: var(--error-color);}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.wrong  p.pw_status.wrong{display: block;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.times_over  p.pw_status.times_over{display: block;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .pw_wrap.not_found  p.pw_status.not_found{display: block;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info{margin-top: 15px;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info{display: flex; line-height: 20px;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info.times_wrap{margin-top: 10px;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info span{width: 110px;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info em{margin-left: 0px;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info p{display: inline-block;}
.bigAttach_pw_popup .secu_mail_cont .input_pw_wrap .file_secu_info .secu_info p.times_count{color: var(--main-color);}
.bigAttach_pw_popup .secu_mail_cont p.contact{margin-top: 9px; line-height: 18px; color: #555; text-align: right;}
.bigAttach_pw_popup .secu_mail_cont p.contact em.contact_ico{display: inline-block; width: 16px; height: 16px; position: relative; top: 2px; background: url("../img/ar_main.png") no-repeat -545px -512px;}
.bigAttach_pw_popup .secu_mail_cont p.contact span.contact_num{display: inline-block; margin-left: 12px; font-weight: bold}
/* 대용량첨부파일 비밀번호 입력 */

/* S : 그룹설정 */
.group_setting_wrap .add_group_wrap{display: flex; align-items: center; gap: 6px;}
.group_setting_wrap .add_group_wrap input{height: 28px; border: 1px solid #ddd; padding: 7px 10px 5px; font-size: 14px; line-height: 16px; box-sizing: border-box;}
.group_setting_wrap .add_group_wrap input:focus{border-color: var(--main-color);}
.group_setting_wrap .add_group_wrap input.group_name{width: 180px;}
.group_setting_wrap .add_group_wrap input.group_memo{width: 240px;}
.group_setting_wrap .add_group_wrap button.btn_add{padding: 0 6px; border: 1px solid #ababab; box-sizing: border-box; font-size: 13px}
.group_setting_wrap .add_group_wrap button.btn_add .ico.buAdd{display: inline-block; width: 16px; height: 16px; background-position: -667px -133px;}
.group_setting_wrap .description{margin-top: 16px; padding-bottom: 22px;}
.group_setting_wrap .buttonSet{display: flex;}
.group_setting_wrap .buttonSet .l_part button.sel_all{width: 76px;}
.group_setting_wrap .buttonSet .l_part button.del_btn{width: 64px;}
.group_setting_wrap .buttonSet .r_part{display: flex; gap: 8px;}
.group_setting_wrap .buttonSet .up_n_down{display: flex;}
.group_setting_wrap .buttonSet .up_n_down button{display: flex; justify-content: center; align-items: center; width: 32px; height: 28px; margin: 0; padding: 0; box-sizing: border-box;}
.group_setting_wrap .buttonSet .up_n_down button:first-child{border-right: none;}
.group_setting_wrap .buttonSet .up_n_down button .ico { display: inline-block; width: 16px; height: 16px;}
.group_setting_wrap .buttonSet .single button.up .ico { background-position: -139px -836px;}
.group_setting_wrap .buttonSet .single button.down .ico { background-position: -183px -836px;}
.group_setting_wrap .buttonSet .double button.up .ico { background-position: -227px -836px;}
.group_setting_wrap .buttonSet .double button.down .ico { background-position: -271px -836px;}

table.group_table thead{border-top: 1px solid #E5E5E5;}
table.group_table tr.tcontent.cloneTR{display: none;}
table.group_table tr td input[type=text] {height:20px; line-height: 20px; text-align: left; width:90%}
table.group_table tr{width: 100%; border-bottom: 1px solid #efefef;}
table.group_table td.g_memo.default{color: #bfbfbf;}
table.group_table td{border: none; box-sizing: border-box;}
table.group_table td.box_btn{display: flex; justify-content: end; align-items: center; gap: 15px;}
table.group_table td.box_btn button{display: block; width: 16px; height: 16px;}
table.group_table td.box_btn button.write{background-position: -326px -420px;}
table.group_table td.box_btn button.del{background-position: -161px -378px;}
table.group_table td.box_btn button.save{background-position: -30px -708px;}
table.group_table td.box_btn button.cancel{background-position: -52px -706px;}
table.group_table td.box_btn button.sort_btn{background-position: -368px -420px;}
table.group_table td.box_btn .bar{margin: 0;}
.group_sortable .ui-sortable-helper{display: table;}
.group_sortable .ui-sortable-helper td{text-align: left;}
.group_sortable .ui-sortable-helper td.chk{width: 6%;}
.group_sortable .ui-sortable-helper td.g_name{width: 21.3%;}
.group_sortable .ui-sortable-helper td.g_memo{width: 40%;}
/* E : 그룹설정 */
/* S : 외부연락처 불러오기 */
.load_to_mail{padding-left: 45px; padding-right: 45px;}
.load_contact_box{padding: 24px; border: 1px solid #E5E5E5;}
.load_contact_box p{color: #898989; line-height: 20px; font-size: 13px;}
.load_contact_box .buttonSet.btn_wrap{display: block;}
.load_contact_box .buttonSet.btn_wrap span.download{display: inline-block; width: 16px; height: 16px; position: relative; top: 3px; margin-right: 5px; background: url("../img/ar_main.svg") no-repeat -73px -664px;}
.load_contact_wrap{display: none;}
.load_contact_wrap.on{display: block;}
.load_contact_wrap{border-bottom: 1px solid #E5E5E5; margin-bottom: 31px;}
.load_contact_wrap .buttonSet.load_btn{display: flex; justify-content: center; align-items: center; padding-top: 20px; padding-bottom: 26px;}
.buttonSet button span.down_arrow_ico{display: inline-block; width: 16px; height: 16px; position: relative; top: 3px; margin-left: 2px; background: url("../img/ar_main.png") no-repeat -353px -387px;}
.load_to_mail_wrap{display: flex;}
.load_to_mail_wrap p{width: 100px; font-weight: bold; color: #000; font-size: 14px;}
.load_to_mail_wrap.sel_mailpack .input_wrap input{position: relative; margin-right: 5px;}
.load_to_mail_wrap.sel_mailpack .input_wrap .b_input_wrap{margin-top: 15px; display: flex; flex-wrap: wrap; max-width: 1000px;}
.load_to_mail_wrap.sel_mailpack .input_wrap .b_input_wrap > li {display: inline-flex; position: relative; width: 120px; margin-top: 11px; line-height: 15px; margin-right: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; align-items: center}
.load_to_mail_wrap.sel_mailpack .input_wrap .b_input_wrap > li > label {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.load_to_mail_wrap.set_condition{margin-top: 21px;}
.load_to_mail_wrap.set_condition p{margin-top: 6px;}
.load_to_mail_wrap.set_condition .input_wrap{display: flex; align-items: center; gap: 10px;}
.load_to_mail_wrap.set_condition .input_wrap select{margin-right: 0;}
.description strong.fc_black{color: #000;}

.load_contact_box .inner_content {display: inline-block; max-width: 80%; min-height: 28px; padding-top: 10px;}
.load_contact_box .inner_content .box_file {width: 368px; display: flex; align-items: flex-start; white-space: nowrap; position: relative;}
.inner_content .box_file .box_tf {flex: 1; overflow: hidden; width: auto; border-bottom: 0 none; text-align: left; box-sizing: border-box; border: 1px solid #ddd; height: 28px; display: inline-flex; align-items: center; padding: 0 10px; margin-right: 6px;}
.inner_content .box_file .txt_guide {color: #959595; display: block; overflow: hidden; height: 17px; line-height: 17px; text-overflow: ellipsis; white-space: nowrap;}
.inner_content .box_file .btn_file{display: inline-block; position: static; overflow: hidden; border: 1px solid #bfbfbf; box-sizing: border-box; height: 28px;}
.box_file .lab_file{display: block; min-width: 68px; padding:6px 11px 6px; font-weight:bold; font-size:13px; line-height:17px; text-align:center; box-sizing:border-box;}
.box_file .inp_file {position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.01; cursor: pointer;}

/* E : 외부연락처 불러오기 */
/* S : 연락처 저장 및 내보내기 */
.set_forms .radio_wrap{display: flex; align-items: center;}
.set_forms .radio_wrap .input_box{width: 80px; font-weight: bold; color: #000; min-width: 80px;}
.set_forms .radio_wrap p{padding: 0; min-width: 600px; color: #666;}
.set_action .si_input_wrapper input{position: relative; margin-right: 8px;}
.set_action .si_input_wrapper .b_input_wrap .input_wrap{display: flex; margin-top: 15px; min-width: 812px;}
.set_action .si_input_wrapper .b_input_wrap .input_wrap:first-of-type {margin-top: 0;}
.set_action .si_input_wrapper .b_input_wrap .input_wrap .input_box{display: flex; width: 116px; }
.set_action .st_input_wrapper em.txt_bar{height: 12px; width: 1px; background-color: #ddd; display: inline-block; margin: 0 21px 0 10px; vertical-align: middle;}
.set_action .st_input_wrapper .t_input_wrap{min-width: 812px;}
.set_action .st_input_wrapper .b_input_wrap{display: flex; align-items: center; flex-wrap: wrap; width: 812px;}
.set_action .st_input_wrapper .b_input_wrap .input_box {display: flex; width: 111px; margin-right: 5px; line-height: 28px;}
.set_action .st_input_wrapper .b_input_wrap .input_box input{margin-right: 8px;}
.set_action .st_input_wrapper .b_input_wrap .input_box label{padding: 0 !important; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.set_action .st_input_wrapper #ST_indiv_sel label strong{color: var(--main-color);}
/* E : 연락처 저장 및 내보내기 */

.set_action.inline_style .sub_tit { display: inline-block; padding: 10px 0 0;}
.set_action.inline_style .sa_group { display: inline-block; padding: 0 0 0 10px; vertical-align: 3px}

.sa_group.lst_table dl { border:1px solid #CACACA; width:542px; height:250px; box-sizing: border-box; padding:5px 15px 0; display: -webkit-box; display: -ms-flexbox; display: flex;  -moz-flex-direction: column; -ms-flex-direction: column; -webkit-box-orient: vertical; -webkit-box-direction: normal;	flex-direction: column;}
.sa_group.lst_table dt { font-weight: 500; line-height: 32px; height:32px; border-bottom:1px solid #E5E5E5;-ms-flex: 0 0 auto; -webkit-box-flex: 0; flex: 0 0 auto; display: flex;}
.sa_group.lst_table dt.lst_hd span:first-child { flex-grow: 1; padding-left:5px}
.sa_group.lst_table dt.lst_hd span:last-child { flex-shrink:0;width:72px;}
.sa_group.lst_table dd { overflow:hidden; overflow-y: scroll; margin:8px 0; -ms-flex: 1 1 auto; -webkit-box-flex: 1; flex: 1 1 auto; display: block;}
.sa_group.lst_table dd ul.lst_detail {display: table; width:100%; box-sizing: border-box; table-layout: fixed;}
.sa_group.lst_table dd ul.lst_detail li.row { display:table-row; line-height: 22px}
.sa_group.lst_table dd ul.lst_detail li.row  div.cell { display: table-cell; box-sizing: border-box; }

.lst_detail li.row .cell .ico { width:15px; height:15px; display: inline-block;}
.lst_detail li.row .cell button {border:none; padding:0; margin-top:-2px  }

.lst_detail li.row .cell.fold_name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-left:5px}
.lst_detail li.row .cell.fold_name .ico { margin-right:5px; vertical-align:-2px}
.lst_detail li.row .cell.fold_size { width:80px; box-sizing: border-box; text-align: right}
.lst_detail li.row .cell.fold_function { width:35px; text-align: right}

.ico_folder { background-position: -12px -932px }
.del_folder { background-position: -147px -770px; }
.del_empty { background-position: -183px -357px;}

.inline_depth, .inline_depth1, .inline_depth2, .inline_depth3, .inline_depth4, .inline_depth5 { display: inline-block; width:12px; height:10px; background-position:-557px -150px; }
.inline_depth2 { margin-left:8px}
.inline_depth3 { margin-left:16px}
.inline_depth4 { margin-left:24px}
.inline_depth5 { margin-left:32px}

/* AUTOCOMPLETE */
.dh_layer .autoAddr{overflow:auto;overflow-x:hidden;position:relative;min-width:320px;max-height:241px;border-bottom:1px solid #E5E5E5;background:#fff; box-sizing: border-box; padding: 8px 0;}
.dh_layer .autoAddr li{position:relative;height:23px;padding:0 28px 0 0;vertical-align:top}
.dh_layer .autoAddr li strong{text-decoration:underline; color: var(--main-color);}
.dh_layer .autoAddr li a{display:block;padding:7px 0 4px 7px;color:#333;text-decoration:none}
.dh_layer .autoAddr a.btn_del{display:block;position:absolute;top:2px;right:3px;padding:4px}
.dh_layer .autoAddr a.btn_del .deleteBtn{background:url(../img/ar_main.svg) no-repeat -7px -685px;width:15px; height:15px}
.dh_layer .autoAddr li.no_addr,.dh_layer .send_name li.no_addr{margin:10px 0 0 8px;color:#666;letter-spacing:-1px}
.dh_layer .autoAddr li.no_addr em,.dh_layer .send_name li.no_addr em{color:#38b601}
.dh_layer .autoAddr li.no_addr p,.dh_layer .send_name li.no_addr p{margin-top:6px;line-height:16px;font-size:11px;color:#999;letter-spacing:-1px}
.dh_layer .autoAddr .selected,.dh_layer .autoAddr .ovr{background:#f0f1f1}
.dh_layer .autoAddr .deleteBtn2{position:absolute;top:9px;right:7px;background:url(../img/btn_mail.gif) no-repeat -202px -104px }

.dh_layer.autoComplete {border-radius: 4px}
.dh_layer .autoBook{position:relative;width:auto;min-width:320px;border-bottom: none; border-radius: 4px 4px 0 0; box-sizing: border-box;}
.dh_layer ul.autoAddr li{display:block;position:relative;height:auto;padding:0;white-space:nowrap;cursor:pointer}
.dh_layer ul.autoAddr li:not(:last-of-type) {border-bottom: 1px solid #f4f4f4;}
.dh_layer .autoAddr li strong{text-decoration:underline; color: var(--main-color)}
.dh_layer ul.autoAddr li a{padding:10px 35px 9px 16px;line-height:14px;vertical-align:top;white-space:nowrap; font-size: 14px;}
.dh_layer .autoAddr .name{margin-right:1px}
.dh_layer .autoAddr .title{margin-right:3px;color:#0459c1}
.dh_layer .autoAddr .title strong{color:#0ba506;text-decoration:none}
.dh_layer .autoAddr .corp{margin-right:1px;color:#999}
.dh_layer .autoAddr .team{margin-right:1px;color:#444}
.dh_layer .autoAddr .email{color:#000}
.dh_layer .autoAddr .delete_btn{position:absolute;right:3px;*right:20px;z-index:30;width:10px;height:10px;margin-top:-17px;padding:0;border:0;background:url(../img/btn_mail.gif) no-repeat -201px -102px transparent;cursor:pointer}
.dh_layer .autoAddr .delete_btn.disabled{display:none}
.dh_layer .autoAddr .delete_btn:hover {background-position:-190px -102px !important}
.dh_layer ul.autoAddr a.btn_del{top:5px;*top:2px;*right:20px;zoom:1}
.dh_layer .autoAddr .EndOfRecent{border-bottom:1px solid #e1e1e1}
div.dh_layer .autoAddr .selected{background:transparent}
.autoAddr .selected a{background:#F3F5F6}

.dh_layer .quickMenu{position:relative;height:20px;padding:11px 15px 7px 0;background-color:#fff;font-size:14px;color:#eee;text-align:right;zoom:1;border: 1px solid #b3b3b3;border-top:none; border-radius: 0 0 4px 4px;}
.dh_layer .quickMenu a{display:inline-block;color:#0f0f0f;letter-spacing:-1px}
.dh_layer .quickMenu a:hover{color:#333;text-decoration:none}
.dh_layer .quickMenu a.selected{color:var(--main-color)}
.dh_layer .quickMenu span.bar {margin: 0 4px}

.form-layer .paginate {position: absolute; width: 100%; left: 0; bottom: 0;}
.form-layer .msearch .search {margin-right: -33px}
.stationery-layer .paginate {position: absolute; width: 100%; left: 0; bottom: 0;}

.dh_layer.text_file_helper .type_c .layer_content .hTitle {border-bottom: none;}

/* ATTAHCEMNT UPLOAD */
.upld .hTitle {margin-bottom: 18px}
.upld_box {width: 496px;border: 1px solid #eaeaea}
.upld_box .upload_status {padding: 17px 19px 9px}
.upld_box .upload_status p.progress_bar {line-height: 1.4;border-bottom: 1px solid #e6e6e7;padding-bottom: 10px}
.upld_box .upload_status p.progress_bar:after {content: "";clear: both;height: 0;display: block;visibility: hidden}
.progress_bar .tit {float: left;margin-right: 7px;font-weight: 700;color: #333}
.progress_bar .total {float: right;width: 40px;font-weight: 700;color: var(--main-color); vertical-align: middle;text-align: right}
.p_bar {background: #fff;display: block;height: 9px;overflow: hidden;position: relative;top: 6px}
.p_bar:before {content: '';border: 1px solid rgba(0, 0, 0, .15);position: absolute;top: 0;left: 0;right: 0;bottom: 0}
.p_bar_value {background-color: var(--main-color); -webkit-transition: all .1s linear;height: 100%;display: block}
.upload_status .status {border-top: 1px solid #fff;padding-top: 9px}
.upload_status .status table, .upload_status .status td, .upload_status .status th {border: 0;color: #333;line-height: 23px;white-space: nowrap;border-collapse: collapse}
.upload_status .status td {padding-left: 12px; font-size: 14px;}
.upld_file_head, .upld_file_list li {border: 1px solid #eaeaea;border-width: 1px 0;height: 23px;line-height: 23px;position: relative;padding: 0 91px 0 162px;background-color: #f8f9fb;color: #666}
.upld_file .file_name, .upld_file .transfer_status {width: 162px;text-align: center;position: absolute;left: 0;top: 0; font-size: 14px;}
.upld_file .file_progress {display: block;border: 1px solid #eaeaea;border-width: 0 1px;text-align: center}
.upld_file .transfer_status {width: 91px;right: 0;left: auto}
.upld_file_list {height: 134px;padding-top: 2px;overflow-y: scroll;background: #fff}
.upld_file_list li {border: 0;background: 0 0;height: 23px;line-height: 23px;padding-right: 83px}
.upld_file_list li .file_name {text-align: left;text-indent: 8px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
.upld_file_list li .file_name .fic {vertical-align: middle}
.upld_file_list li .file_progress {border: 0;padding: 0 2px 0 8px}
.upld_file_list li .file_progress .st {float: right;margin-left: 6px;width: 80px;font-size: 11px; text-align: left;white-space: nowrap}
.upld_file_list li .file_progress .p_bar {top: 7px}
.upld_file_list li .transfer_status {width: 72px}
.upld .addButton {padding: 10px 0}
.upld .addButton button {padding: 5px 8px 4px 9px;font-weight: 700;line-height: 1.4}
.icon_pause {background:url(../img/icon_pause.png) no-repeat;width: 5px;height: 8px;display: inline-block}
.upld .addButton .icon_pause {margin-right: 7px;vertical-align: baseline}


/* 대용량 첨부파일 팝업 */
.big_attach_popup {box-shadow: none !important; position: relative;}
.big_attach_popup .btn_close {right: 20px !important;}
.big_attach_popup .type_c{width: 100%; background: #fff; border: none !important;}
.big_attach_popup .type_c .layer_header h1 {font-size: 20px;}
.big_attach_popup .type_c .layer_content{padding: 0 30px 30px;}
.big_attach_popup .buttonSet > .selectWrap {display: flex; flex-wrap: nowrap; align-items: center; height: 67px; padding: 0 30px;}
.big_attach_popup .buttonSet > .selectWrap > a {font-size: 20px; color: #000000; display: inline-block; font-weight: 500; position: relative; padding: 4px 0;}
.big_attach_popup .buttonSet > .selectWrap > a::before {content: ''; display: none; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background-color: var(--main-color);}
.big_attach_popup .buttonSet > .selectWrap > a:first-of-type {margin-right: 30px;}
.big_attach_popup .buttonSet > .selectWrap > a.on {color: var(--main-color);}
.big_attach_popup .buttonSet > .selectWrap > a.on::before {display: block;}
.big_attach_popup .mailListBtn {border-bottom: none; height: auto; padding-bottom: 0;}
.big_attach_popup .mailListBtn > div {display: flex; align-items: center; justify-content: space-between;}
.big_attach_popup .mailListBtn .deep_path {padding: 0; overflow: hidden;}
.big_attach_popup .mailListBtn .deep_path > div {display: flex; align-items: center;}
.big_attach_popup .mailListBtn .layoutSelect > div {display: flex; align-items: center;}
.big_attach_popup .mailListBtn .layoutSelect p {display: inline-block; font-size: 14px; color: #555; line-height: 30px; padding-right: 12px; font-weight: bold;}
.big_attach_popup .mailListBtn .layoutSelect select {height: 28px; border-color: #cbcbcb; margin-right: 4px; width: 66px; background: url(../img/arrow.gif) no-repeat calc(100% + 5px) center; -webkit-appearance: none; appearance: none; cursor: pointer; outline: none; padding: 0 12px;}
.big_attach_popup .mailListBtn .layoutSelect .mode_thumbnail {position: relative;}
.big_attach_popup .mailListBtn .layoutSelect .mode_thumbnail::before {display: block; content: ''; width: 1px; height: 30px; position: absolute; left: -7px; top: 50%; transform: translateY(-50%); background-color: #eee;}
.big_attach_popup .content_box.drive .scroller {max-height: 360px; min-height: 360px;}
.big_attach_popup .paginate {position: relative; height: 72px;}
.big_attach_popup .addButton {padding-top: 7px;}
.big_attach_popup .addButton button{height: 32px; width: 104px;}

/* 이동위치선택 팝업 */
.dh_layer.move_select_popup .type_c{width: 400px; background: #fff; box-shadow: 5px 5px 10px rgb(0 0 0 / 10%);}
.dh_layer.move_select_popup .type_c .layer_header{padding: 20px 27px; display: flex; justify-content: space-between; align-items: flex-end;}
.dh_layer.move_select_popup .type_c .layer_header h1 {font-size: 18px; font-weight: bold; color: #333;}
.dh_layer.move_select_popup .type_c .layer_header a {font-size: 13px; color: #000; }
.dh_layer.move_select_popup .type_c .layer_content{padding: 0 27px 20px;}
.dh_layer.move_select_popup .svc_menu_area {position: relative; top: 0; bottom: 0; padding-top: 0; height: 342px; border: 1px solid #cacaca;}
.dh_layer.move_select_popup .section_mymail:not(:last-child) {border-bottom: 1px solid #f4f4f4;}
.dh_layer.move_select_popup .h_lft_menu {padding: 9px 5px 4px; font-size: 14px;}
.dh_layer.move_select_popup .h_lft_menu_title {color: #000; padding-left: 12px; border-radius: 5px;}
.dh_layer.move_select_popup .h_lft_menu_title.clicked {color: var(--main-color); font-weight: 500;}
.dh_layer.move_select_popup .list_menu ul li {padding: 1px 9px 1px 24px;}
.dh_layer.move_select_popup .list_menu .item_wrap {padding: 0 0 0 32px;}
.dh_layer.move_select_popup .list_menu .item_wrap .ico_mbox.bu9 { background-position: -89px -797px;}
.dh_layer.move_select_popup .list_menu .item_wrap a {color: #000;}
.dh_layer.move_select_popup .list_menu .fold_folder .btn_folder {opacity: 1; background-position: -3px -779px;}
.dh_layer.move_select_popup .list_menu .spread_folder .btn_folder {opacity: 1; background-position: -25px -779px;}
.dh_layer.move_select_popup .list_menu .spread_folder .ico_mbox.bu9 {opacity: 1; background-position: -110px -797px;}
.dh_layer.move_select_popup .list_menu .spread_folder a {color: var(--main-color); font-weight: bold;}
.dh_layer.move_select_popup .content_box_bottom {display: flex; justify-content: center; border-top: 1px solid #eaeaea; padding: 15px 0 20px;}
.dh_layer.move_select_popup .content_box_bottom button {width: 104px; height: 32px;}
.dh_layer.move_select_popup .content_box_bottom button.save {background-color: #525763; color: #fff; margin-right: 7px;}
/* 이동위치선택 팝업 윈도우 팝업*/
.dh_layer.move_select_popup.new-window {-webkit-box-shadow: none; box-shadow: none;}
.dh_layer.move_select_popup.new-window .type_c{width: 465px; background: #fff; box-shadow: none; border: none;}

/* 드라이브 총사용량 - 도넛차트 부분 */
.piechart {display: flex; align-items: center;}
.pieWrap { width: 260px; position: relative; min-width: 260px;}
.pieWrap .totalUsage {position: absolute; width: 200px; height: 200px; display: flex; align-items: center; justify-content: center; top: 0; left: 0; font-size: 20px; font-weight: 500; color: #000;}
.inchart {display: flex; flex-direction: column; flex-wrap: wrap; height: 99px;}
.inchart li {height: 33px; display: flex; width: 200px; align-items: center; font-size: 15px;}
.inchart li span {display: inline-block; width: 14px; height: 14px; margin-right: 6px;}
.inchart li:nth-child(1) span {background-color: #F4909D;}
.inchart li:nth-child(2) span {background-color: #FDDD00;}
.inchart li:nth-child(3) span {background-color: #53C127;}
.inchart li:nth-child(4) span {background-color: #56A6F5;}
.inchart li:nth-child(5) span {background-color: #675FFF;}
.inchart li:nth-child(6) span {background-color: #C9CBD0;}
.inchart li em {color: #000; font-weight: 500; margin-right: 4px;}
.inchart li strong {color: var(--main-color); font-weight: 500; margin-right: 6px;}
.inchart li p {font-weight: 500;}
.setup_allUsage .set_action_bottom {padding: 20px 0;}
.setup_allUsage .set_action_bottom > .sa_group {border-color: none !important;}
/* // 드라이브 총사용량 - 도넛차트 부분 */

/* 전체메일함, 수신대기함 - 스팸신고팝업 */

.mail_spam.layer_content { border: 1px solid #b3b3b3; position: absolute; overflow: hidden; background-color:#fff;
	-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	-moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); display: flex; flex-direction: column; padding: 5px 0; width: 350px; border-radius: 4px;}
.mail_spam > div {padding: 14px 24px}
.mail_spam .layerContent {padding: 0 24px 0 !important;}
.layerContent > div > textarea {resize: none; width: 100%; height: 80px; padding: 8px; border-color: #ddd; font-size: 14px;}
.spamProcess {padding: 18px 0 16px !important; border-bottom: 1px solid #f4f4f4;}
.spamProcess > p {color: #0f0f0f; font-size: 15px; padding-bottom: 12px; font-weight: 600; width: 100%;}
.spamProcess > div:first-of-type {margin-right: 24px;}
.spamProcess > div > label {color: #000; font-size: 14px; position: relative; top: -1px; padding-left: 1px;}
.includedMail {padding-top: 10px;}
.spamOption {padding: 18px 0 !important;}
.spamOption > div:first-of-type  {padding-bottom: 12px;}
/* .spamOption > div:nth-of-type(2)  {display: none;}  */  /* <- 수신대기함에서는 해당 주석 해제하시면 됩니다. */
.spamOption > div > label {font-size: 14px; color: #0f0f0f; position: relative; top: -1px; padding-left: 1px;}
.mail_spam .layerFooter {border-top: 1px solid #e5e5e5;}
.mail_spam .layerFooter > div > button {width: 90px;}
.hackCheck {display: flex; align-items: center; padding-top: 10px;}
.hackCheck > label {font-size: 14px; padding-left: 4px; color: #000; position: relative;}
.includedMail > label {font-size: 13px !important; color: #7A7A7A !important;}

/* // 전체메일함, 수신대기함 - 스팸신고팝업 */

/* 수신대기함 - 수신허용 */

.mail_receiveAllow.layer_content { border: 1px solid #b3b3b3; position: absolute; overflow: hidden; background-color:#fff; top: 840px; left: 520px;
	-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	-moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); display: flex; flex-direction: column; padding: 5px 0; width: 390px; border-radius: 4px;}
.mail_receiveAllow > div {padding: 14px 24px}
.mail_receiveAllow .layerContent {padding: 0 24px 0 !important;}
.mail_receiveAllow .layerContent > div:first-of-type {padding: 5px 0 12px;}
.mail_receiveAllow .layerContent > div > div {width: 50%;}
.storageMethod {border-top: 1px solid #f4f4f4; border-bottom: 1px solid #f4f4f4; padding: 14px 0 !important;}
.storageMethod > p {color: #0f0f0f; font-size: 14px; font-weight: bold; width: 100%; padding-bottom: 12px;}
.storageMethod > div {width: 100% !important; display: flex;}
.storageMethod > div > div {width: 50%;}
.mail_receiveAllow .layerContent label {color: #000; font-size: 14px; position: relative; top: -1px; padding-left: 1px;}
.allowOption {padding: 18px 0 !important;}
.allowOption > div {width: 100% !important;}
.mail_receiveAllow .layerFooter {border-top: 1px solid #e5e5e5;}
.mail_receiveAllow .layerFooter > div > button {width: 90px;}

/* // 수신대기함 - 수신허용 */


/* 전체 toast popup */
.toastPopup {position: absolute; top: 10px; right: 10px; background-color: #202124; color: #fff; border-radius: 8px; display: flex; justify-content: space-between; align-items: center; flex-wrap: nowrap; min-width: 260px; padding: 14px 22px; box-shadow: 0 3px 6px #00000029;z-index: 2023;}
.toastWrapper {display: flex; flex-wrap: nowrap; padding-right: 25px;}
.toastWrapper > a {color: var(--main-color); display: inline-block; text-decoration: underline !important; letter-spacing: -0.5px; position: relative; top: 1px;}
.toastWrapper > a:nth-of-type(2) {margin-left: 12px;}
.toastText {padding-right: 20px; position: relative; top: 1px;}
.toastText > span {color: var(--main-color);}
.toastClose {display: inline-block; width: 10px; height: 10px; background: url(../img/ar_main.svg) no-repeat -54px -623px; opacity: 0.8;}
/* // 전체 toast popup */

/* 메일 읽기 > 보낸 사람 마우스 오버 시 프로필 레이어 */

.layerPopup {position: absolute; border: 1px solid #b3b3b3; border-radius: 4px; box-shadow: 0 3px 6px #00000029; box-sizing: border-box; background-color: #fff;}
.profilePopup {display: flex; flex-direction: column; min-width: 360px; padding-top: 20px;}

.profileTitle {display: flex; flex-direction: column; border-bottom: 1px solid #E5E5E5; padding: 7px 20px 0;}
.profileTitle > div {width: 100%;}
.profileTitle > div:nth-child(2) {display: flex; justify-content: space-between; align-items: center; padding: 20px 0;}
.profileTitle h6 {font-size: 16px; font-weight: bold; color: #000; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.profileTitle p {font-size: 14px; font-weight: normal; color: #898989; display: flex; align-items: center; padding-top: 6px;}
.profileTitle a {color: #000; padding-left: 20px; display: inline-block; position: relative;}
.profileTitle a::before {background: url(../img/ar_main.svg) no-repeat; content: ''; display: block; width: 15px; height: 15px; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.profileTitle a:nth-child(1)::before {background-position: -160px -422px;}
.profileTitle a:nth-child(2)::before {background-position: -182px -401px;}
.profileTitle a:nth-child(3)::before {background-position: -204px -401px;}
.copyText {all: unset; width: 14px; height: 14px; background: url(../img/ar_main.svg) no-repeat -226px -422px; cursor: pointer; margin-left: 6px; display: inline-block;}

.profileItem {display: flex; flex-direction: column; padding: 16px 20px; border-bottom: 1px solid #f4f4f4;}
.profileItem:hover {background-color: #fafafa;}
.profileItem > div {display: flex; align-items: center;}
.profileItem > div:nth-child(1) {justify-content: space-between;}
.profileItem > div:nth-child(1) h6 {font-size: 15px; color: #000; width: calc(100% - 80px); font-weight: 500; max-width: 236px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: bold;}
.profileItem > div:nth-child(1) > div {display: inline-flex; align-items: center;}
.profileItem > div:nth-child(1) p {font-size: 13px; color: #555; padding: 0 10px 0 6px; white-space: nowrap; font-weight: bold;}
.profileItem > div:nth-child(1) .profileImportant {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -6px -380px; align-self: flex-start;}
.profileItem > div:nth-child(1) .profileImportant.on {background-position: -28px -380px;}
.profileItem > div:nth-child(2) {padding-top: 6px;}
.profileItem > div:nth-child(2) a {display: inline-flex; max-width: 298px; color: #000; margin-right: 6px; white-space: nowrap; overflow: hidden; align-items: center;}
.profileItem > div:nth-child(2) a span {display: inline-block; border: 1px solid #e7e7e7; color: #000 !important; font-size: 13px; padding: 2px 4px; max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.profileItem > div:nth-child(2) a p {display: inline-block; margin-left: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1 1; font-weight: bold;}
.profileItem > div:nth-child(2) .profileAttach {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -50px -380px; min-width: 16px;}
.profileItem.readMail > div:nth-child(1) h6,
.profileItem.readMail > div:nth-child(1) p,
.profileItem.readMail > div:nth-child(2) a span,
.profileItem.readMail > div:nth-child(2) a p {color: #414141 !important; font-weight: normal;}

.profileBottom button {all: unset; display: flex; width: 100%; padding: 25px 0; cursor: pointer; color: #000; align-items: center; justify-content: center;}
.profileBottom button span {background: url(../img/ar_main.svg) no-repeat -226px -402px; display: inline-block; width: 12px; height: 13px; margin-left: 4px;}

/* // 메일 읽기 > 보낸 사람 마우스 오버 시 프로필 레이어 */

/* 전체 공용 context menu */

.allContextMenu {min-width: 136px; display: flex; flex-direction: column; font-size: 15px; padding: 10px 0;}
.allContextMenu > a {color: #0f0f0f; padding: 8px 18px; font-weight: normal; display: inline-block;}
.allContextMenu > a.disabled {color: #BFBFBF; pointer-events: none; cursor: default;}
.allContextMenu > a.importance {color: var(--error-color);}
.allContextMenu > a:hover {background-color: #F3F5F6;}
.allContextMenu .contextBorderTop {border-top: 1px solid #f4f4f4;}
.allContextMenu .contextBorderBottom {border-bottom: 1px solid #f4f4f4;}
.allContextMenu > div {padding: 8px 18px 8px;}
.allContextMenu > div > p {display: flex; align-items: center; flex-wrap: nowrap; white-space: nowrap;}
.allContextMenu > div > p > i {display: inline-block; width: 15px; height: 15px; background: url(../img/ar_main.svg) no-repeat -598px -1048px; min-width: 15px;}
.allContextMenu > div > p > span {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

/* // 전체 공용 context menu */

.moreLabelsLayer {max-width: 300px;}
.moreLabelsLayer > a {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/* 메일 본문 제목 마우스 오버 시 미리보기 레이어 */

.mailPreviewPopup {min-width: 440px; display: flex; flex-direction: column;padding: 20px; font-size: 14px; max-width: 380px;}
.mailPreviewPopup > .mailPreviewLineClamp {padding-bottom: 10px;}
.mailPreviewPopup > .mailPreviewLineClamp > p {line-height: 22px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box; text-overflow: ellipsis; overflow: hidden;}
.mailPreviewPopup > a {display: inline-block; border: 1px solid #d1d1d1; color: #555; width: max-content; padding: 2px 6px; font-size: 14px; letter-spacing: -1px}

/* // 메일 본문 제목 마우스 오버 시 미리보기 레이어 */


/* 메일 이동 버튼 클릭 팝업 */

.mailMovePopup {min-width: 225px; display: flex; flex-direction: column; font-size: 15px; padding: 10px 0; max-width: 320px;}
.mailMovePopup > ul {width: 100%; min-height: 71px; max-height: 207px; overflow-x: hidden; overflow-y: auto;}
.mailMovePopup > ul li > a {color: #0f0f0f; padding: 8px 0; display: inline-block; width: 100%; }
.mailMovePopup > ul li > a > p {text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding: 0 10px 0 18px; position: relative;}
.mailMovePopup > ul li > a:hover {background-color: #F3F5F6;}

.groupDepth > a > p::before {content: ''; display: block; position: absolute; top: 50%; left: 4px; transform: translateY(-50%); width: 12px; height: 10px; background: url(../img/ar_main.png) no-repeat -557px -150px;}
.groupDepth01 > a > p {margin-left: 18px;}
.groupDepth02 > a > p {margin-left: 36px;}
.groupDepth03 > a > p {margin-left: 54px;}
.groupDepth04 > a > p {margin-left: 72px;}

.mailMovePopup > .newMailBox {border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5;}
.mailMovePopup > .newMailBox > button {all: unset; padding: 12px 0; display: flex; align-items: center; cursor: pointer; color: #0f0f0f; width: 100%; text-indent: 18px;}
.mailMovePopup > .newMailBox > button > span {background: url(../img/ar_main.svg) no-repeat -227px -402px; display: inline-block; width: 12px; height: 13px; margin-left: 4px;}
.mailMovePopup > .newMailBox > .addMailBox {display: none; padding: 12px 18px; }
.mailMovePopup > .newMailBox > .addMailBox > input  {height: 28px; border: 1px solid #ddd; box-sizing: border-box; width: calc(100% - 54px); padding: 0 8px;}
.mailMovePopup > .newMailBox > .addMailBox > input:focus  {border-color: var(--main-color);}
.mailMovePopup > .newMailBox > .addMailBox > button  {height: 28px; border-color: #525763; background-color: #525763; color: #fff; width: 48px; margin-left: 6px;}
.mailMovePopup > .newMailBox.clicked > button {display: none;}
.mailMovePopup > .newMailBox.clicked > .addMailBox {display: flex;}

.mailMovePopup > .moveMail {display: flex; flex-direction: column; padding-top: 12px;}
.mailMovePopup > .moveMail > div {display: flex; align-items: center; padding: 0 18px 10px;}
.mailMovePopup > .moveMail > div > input {cursor: pointer;}
.mailMovePopup > .moveMail > div > label {padding-left: 6px; color: #0f0f0f; position: relative;}

/* // 메일 이동 버튼 클릭 팝업 */

/* 메일 라벨 버튼 클릭 팝업 */

.mailLabelPopup {min-width: 167px; display: flex; flex-direction: column; max-width: 215px; padding: 10px 0; font-size: 14px;}
.mailLabelPopup > ul {width: 100%; min-height: 71px; max-height: 138px; overflow-x: hidden; overflow-y: auto;}
.mailLabelPopup > ul > li > a {color: #0f0f0f; padding: 8px 0; display: inline-flex; width: 100%; align-items: center; position: relative;}
.mailLabelPopup > ul > li > a > p {text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding-right: 10px;}
.mailLabelPopup > ul > li > a::before {content: ''; display: none; position: absolute; background: url(../img/ar_main.svg) no-repeat -8px -401px; width: 16px; height: 14px; top: 50%; left: 14px; transform: translateY(-50%);}
.mailLabelPopup > ul > li > a:hover {background-color: #F3F5F6;}
.mailLabelPopup > ul > li > a.clicked {background-color: #F3F5F6; color: var(--main-color);}
.mailLabelPopup > ul > li > a.clicked::before {display: block;}
.mailLabelPopup > ul > li > a.removeLabel::before {display: block; background-position: -30px -422px;}
.mailLabelPopup > ul > li > a > .labelColor {display: inline-block; width: 12px; height: 12px; border-radius: 2px; margin: 1px 6px 0 36px; min-width: 12px;}
.mailLabelPopup > ul > li > p {display: flex; align-items: center; justify-content: center; height: 70px; min-height: 70px;}

.mailLabelPopup > .newLabel {border-top: 1px solid #E5E5E5;}
.mailLabelPopup > .newLabel.clicked > button {display: none;}
.mailLabelPopup > .newLabel.clicked > .addNewLabel {display: flex;}
.mailLabelPopup > .newLabel > button {all: unset; padding: 12px 0; display: flex; align-items: center; cursor: pointer; color: #0f0f0f; width: 100%; text-indent: 18px;}
.mailLabelPopup > .newLabel > button > span {background: url(../img/ar_main.svg) no-repeat -227px -402px; display: inline-block; width: 12px; height: 13px; margin-left: 4px;}
.mailLabelPopup > .newLabel > .addNewLabel {display: none; flex-wrap: wrap; padding: 12px 18px;}
.mailLabelPopup > .newLabel > .addNewLabel > input {height: 28px; border: 1px solid #ddd; box-sizing: border-box; width: calc(100% - 54px); padding: 0 8px;}
.mailLabelPopup > .newLabel > .addNewLabel > input:focus {border-color: var(--main-color);}
.mailLabelPopup > .newLabel > .addNewLabel > button {height: 28px; border-color: #525763; background-color: #525763; color: #fff; width: 48px; margin-left: 6px;}
.mailLabelPopup > .newLabel > .addNewLabel > .labelCollection {display: grid;grid-template-columns: repeat(7, 16px); grid-template-rows: repeat(5, 16px); gap: 8px; padding-top: 16px;}
.mailLabelPopup > .newLabel > .addNewLabel > .labelCollection > a {display: inline-block; position: relative;}
.mailLabelPopup > .newLabel > .addNewLabel > .labelCollection > a.clicked > span {position: absolute; top: 0; left: 0; display: block; background: url(../img/ar_main.svg) no-repeat -28px -248px; width: 16px; height: 16px;}

.labelColor.colorBox_ffffff{background-color:#ffffff;}
.labelColor.colorBox_ffdee6{background-color:#ffdee6;}
.labelColor.colorBox_ffd5c2{background-color:#ffd5c2;}
.labelColor.colorBox_ffeb65{background-color:#ffeb65;}
.labelColor.colorBox_a9f2d4{background-color:#a9f2d4;}
.labelColor.colorBox_b4e6ff{background-color:#b4e6ff;}
.labelColor.colorBox_d1c8ff{background-color:#d1c8ff;}
.labelColor.colorBox_e0e0e0{background-color:#e0e0e0;}
.labelColor.colorBox_e6adb6{background-color:#e6adb6;}
.labelColor.colorBox_ff9c71{background-color:#ff9c71;}
.labelColor.colorBox_f9bc23{background-color:#f9bc23;}
.labelColor.colorBox_baf97b{background-color:#baf97b;}
.labelColor.colorBox_83bbff{background-color:#83bbff;}
.labelColor.colorBox_bba3ff{background-color:#bba3ff;}
.labelColor.colorBox_adadad{background-color:#adadad;}
.labelColor.colorBox_f691b2{background-color:#f691b2;}
.labelColor.colorBox_f96a6f{background-color:#f96a6f;}
.labelColor.colorBox_d19b22{background-color:#d19b22;}
.labelColor.colorBox_7bd148{background-color:#7bd148;}
.labelColor.colorBox_379ef4{background-color:#379ef4;}
.labelColor.colorBox_cd74e6{background-color:#cd74e6;}
.labelColor.colorBox_555555{background-color:#555555;}
.labelColor.colorBox_f74487{background-color:#f74487;}
.labelColor.colorBox_f83a22{background-color:#f83a22;}
.labelColor.colorBox_b37e09{background-color:#b37e09;}
.labelColor.colorBox_00bf36{background-color:#00bf36;}
.labelColor.colorBox_4685f9{background-color:#4685f9;}
.labelColor.colorBox_9b65d9{background-color:#9b65d9;}
.labelColor.colorBox_333333{background-color:#333333;}
.labelColor.colorBox_c9102a{background-color:#c9102a;}
.labelColor.colorBox_bd400f{background-color:#bd400f;}
.labelColor.colorBox_9d775f{background-color:#9d775f;}
.labelColor.colorBox_009651{background-color:#009651;}
.labelColor.colorBox_0f6adb{background-color:#0f6adb;}
.labelColor.colorBox_705ae0{background-color:#705ae0;}

/* // 메일 라벨 버튼 클릭 팝업 */

/* 메일 리스트 우클릭 context menu */

.mailListContextMenu a > .labelColor {display: inline-block; width: 12px; height: 12px; border-radius: 2px; margin-right: 6px; min-width: 12px; position: relative; top: 2px;}

/* // 메일 리스트 우클릭 context menu */

/* 언어설정 context menu */
.allContextMenu.language {min-width: 114px;}
.allContextMenu.language a.clicked {background-color: #F3F5F6; color: var(--main-color);}
/* // 언어설정 context menu */

/* 분할 여부 팝업 */

.mailListDivision {top: 520px; left: 600px; padding: 10px 0; min-width: 136px;}
.mailListDivision > ul {display: flex; flex-direction: column;}
.mailListDivision > ul > li {width: 100%; }
.mailListDivision > ul > li > a {font-size: 12px; color: #0f0f0f; padding: 8px 0; display: inline-flex; width: 100%; position: relative; align-items: center;}
.mailListDivision > ul > li > a::before {position: absolute; content: ''; display: none; background: url(../img/ar_main.svg) no-repeat -8px -401px; width: 16px; height: 14px; top: 50%; left: 14px; transform: translateY(-50%);}
.mailListDivision > ul > li > a.clicked {background-color: #F3F5F6; color: var(--main-color);}
.mailListDivision > ul > li > a.clicked::before {display: block;}
.mailListDivision > ul > li > a:hover {background-color: #F3F5F6;}
.mailListDivision > ul > li > a > span {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.png) no-repeat; margin-left: 36px;}
.mailListDivision > ul > li:nth-child(1) > a > span {background-position: -357px -366px;}
.mailListDivision > ul > li:nth-child(2) > a > span {background-position: -379px -366px;}
.mailListDivision > ul > li:nth-child(3) > a > span {background-position: -401px -366px;}
.mailListDivision > ul > li > a > p {padding-left: 2px;}

/* // 분할 여부 팝업 */

/* 필터 */

.mailFilter {padding: 10px 0; min-width: 146px;}
.mailFilter > ul {display: flex; flex-direction: column;}
.mailFilter > ul.mailFilterOptionWrap1 {padding-bottom: 6px;}
.mailFilter > ul.mailFilterOptionWrap2 {padding-top: 6px; border-top: 1px solid #f4f4f4;}
.mailFilter > ul > li {width: 100%; }
.mailFilter > ul > li > a {font-size: 15px; color: #0f0f0f; padding: 8px 0; display: inline-flex; width: 100%; position: relative; align-items: center; letter-spacing: -0.5px}
.mailFilter > ul > li > a::before {position: absolute; content: ''; display: none; background: url(../img/ar_main.svg) no-repeat -8px -402px; width: 16px; height: 14px; top: 50%; left: 10px; transform: translateY(-50%);}
.mailFilter > ul > li > a.clicked {background-color: #F3F5F6; color: var(--main-color);}
.mailFilter > ul > li > a.clicked::before {display: block;}
.mailFilter > ul > li > a:hover {background-color: #F3F5F6;}
.mailFilter > ul > li > a > p {padding-left: 32px;}
.mailFilter > ul.mailFilterOptionWrap2 > li > a > button {all: unset; background: url(../img/ar_main.svg) no-repeat -394px -1045px; display: block; width: 17px; height: 17px; position: absolute; top: 50%; right: 14px; transform: translateY(-50%);}
.mailFilter > ul.mailFilterOptionWrap2 > li > a > button.toggle {background-position: -412px -1045px;}

/* // 필터 */

/* 메일 리스트 미리보기 아이콘 클릭 시 레이어 */

.mailPreviewDetailPopup {min-width: 380px; display: flex; flex-direction: column; padding: 28px 20px; font-size: 15px; max-width: 440px;}
.mailPreviewDetailPopup > .mailPreviewLineClamp {width: calc(100% - 30px);}
.mailPreviewDetailPopup > .mailPreviewLineClamp > p {line-height: 22px; -webkit-line-clamp: 6; -webkit-box-orient: vertical; display: -webkit-box; text-overflow: ellipsis; overflow: hidden;}
.mailPreviewDetailPopup > .mailPreviewAttachFile {display: flex; flex-wrap: wrap; width: calc(100% + 6px); max-height: 140px; overflow-y: scroll; margin-top: 20px;}
.mailPreviewDetailPopup > .mailPreviewAttachFile > .mailPreviewAttachItem {display: flex; flex-wrap: nowrap; align-items: center; padding: 0 30px 0 12px; justify-content: space-between; width: 100%; height: 28px; overflow: hidden;}
.mailPreviewDetailPopup > .mailPreviewAttachFile > .mailPreviewAttachItem > div {display: flex; flex-wrap: nowrap; align-items: center; width: calc(100% - 46px);}
.mailPreviewDetailPopup > .mailPreviewAttachFile > .mailPreviewAttachItem > div > span {display: inline-block; width: 15px; height: 15px; margin-right: 6px; min-width: 15px;}
.mailPreviewDetailPopup > .mailPreviewAttachFile > .mailPreviewAttachItem > div > p {font-size: 14px; color: #555555; font-weight: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mailPreviewDetailPopup > .mailPreviewAttachFile > .mailPreviewAttachItem > span.attachDownload {display: inline-block; width: 15px; height: 15px; min-width: 15px; background: url(../img/ar_main.svg) no-repeat -74px -665px;}
.mailPreviewDetailPopup .closePopup {right: 20px;}

.layerPopup span.folder{background: url("../img/file/svg/file_folder.svg");}/* 폴더 */
.layerPopup span.ai{background-image: url("../img/file/svg/file_ext_ai.svg");}/* 일러스트 */
.layerPopup span.doc{background-image: url("../img/file/svg/file_ext_doc.svg");}/* 문서 */
.layerPopup span.etc{background-image: url("../img/file/svg/file_ext_etc.svg");}/* 기타 */
.layerPopup span.exe{background-image: url("../img/file/svg/file_ext_exe.svg");}/* 설치파일 */
.layerPopup span.fla{background-image: url("../img/file/svg/file_ext_fla.svg");}/* 플래시 */
.layerPopup span.gul{background-image: url("../img/file/svg/file_ext_gul.svg");}/* gul? */
.layerPopup span.htm{background-image: url("../img/file/svg/file_ext_htm.svg");}/* html */
.layerPopup span.hwp{background-image: url("../img/file/svg/file_ext_hwp.svg");}/* 한글파일 */
.layerPopup span.image{background-image: url("../img/file/svg/file_ext_img.svg");}/* 이미지 */
.layerPopup span.mp3{background-image: url("../img/file/svg/file_ext_mp3.svg");}/* mp3 */
.layerPopup span.mp4{background-image: url("../img/file/svg/file_ext_mp4.svg");}/* mp4 */
.layerPopup span.pdf{background-image: url("../img/file/svg/file_ext_pdf.svg");}/* pdf */
.layerPopup span.ppt{background-image: url("../img/file/svg/file_ext_ppt.svg");}/* ppt */
.layerPopup span.psd{background-image: url("../img/file/svg/file_ext_psd.svg");}/* 포토샵 */
.layerPopup span.txt{background-image: url("../img/file/svg/file_ext_txt.svg");}/* 텍스트 */
.layerPopup span.xls{background-image: url("../img/file/svg/file_ext_xls.svg");}/* 엑셀 */
.layerPopup span.zip{background-image: url("../img/file/svg/file_ext_zip.svg");}/* 압축파일 */

/* // 메일 리스트 미리보기 아이콘 클릭 시 레이어 */


/* 메일 목록설정 레이어 */

.balloonPopup {min-width: 358px; max-width: 385px; border-radius: 0;z-index: 10000;}
.balloonPopup::before {content: ""; position: absolute; top: -5px; right: 10px; width: 7px; height: 7px; border-top: 1px solid #B3B3B3; border-right: 1px solid #B3B3B3; background: #fcfcfc; transform: rotateZ(-45deg);}
.balloonPopup > div {display: flex;}

.balloonTitle {justify-content: space-between; align-items: center; padding: 13px 22px;}
.balloonTitle > h1 {font-size: 18px; font-weight: bold; color: #333; position: relative; top: 2px;}
.balloonTitle > a.closePopup {position: relative; top: 0; right: 0;}

.balloonContent {border-top: 1px solid #F4F4F4; border-bottom: 1px solid #F4F4F4; padding: 18px 22px; display: flex; flex-direction: column;}
.balloonSection {display: flex; flex-wrap: wrap;}
.balloonSection > h6 {font-size: 15px; font-weight: bold; color: #000; width: 100%;}
.balloonSection > div {width: 100%; padding-top: 12px; display: flex; flex-wrap: nowrap; align-items: center;}
.balloonSection > div > select {width: 74px; height: 28px; border: 1px solid #cbcbcb; -webkit-appearance: none; appearance: none; outline: none; background: url(../img/arrow.gif) no-repeat calc(100% + 4px) center; padding: 0 25px 0 12px; cursor: pointer;}
.balloonSection > div > p {font-size: 14px; color: #333; padding-left: 6px;}
.balloonSection > div > div {min-width: 30%;}
.balloonSection > div > div > label {display: flex; flex-wrap: wrap;}
.balloonSection > div > div > label > p {display: flex; flex-wrap: nowrap; align-items: center;}
.balloonSection > div > div > label > p > input {position: relative; top: 1px; margin-right: 4px;}
.balloonSection:nth-child(3) > div > div > label > span {display: inline-block; width: 70px; height: 31px; background: url(../img/ar_main.svg) no-repeat; margin-top: 10px;}
.balloonSection:nth-child(3) > div > div:nth-child(1) > label > span {background-position: -426px -341px;}
.balloonSection:nth-child(3) > div > div:nth-child(2) > label > span {background-position: -500px -341px;}
.balloonSection:nth-child(3) > div > div:nth-child(3) > label > span {background-position: -574px -341px;}
.balloonSection:nth-child(4) > div > div > label > span {display: inline-block; width: 46px; height: 31px; background: url(../img/ar_main.svg) no-repeat; margin-top: 10px;}
.balloonSection:nth-child(4) > div > div:nth-child(1) > label > span {background-position: -656px -341px;}
.balloonSection:nth-child(4) > div > div:nth-child(2) > label > span {background-position: -705px -341px;}
.balloonSection:nth-child(4) > div > div:nth-child(3) > label > span {background-position: -754px -341px;}

.balloonSection:nth-child(1) > p {font-size: 13px; color: #ABABAB; font-weight: normal; letter-spacing: -0.5px;}
.balloonSection:not(:last-of-type) {padding-bottom: 24px;}
.balloonSection:last-of-type {padding-bottom: 12px;}
.balloonSection.addressBalloonSection:last-of-type {padding-bottom: 2px;}

.balloonBottom {display: flex; justify-content: center; align-items: center; padding: 14px 22px;}
.balloonBottom button {all: unset; box-sizing: border-box; width: 80px; height: 28px; border: 1px solid #CBCBCB; text-align: center; color: #333; font-size: 15px; cursor: pointer; background-color: #fff;}
.balloonBottom button.b {background-color: #525763; border-color: #525763; color: #fff; margin-right: 2px;}

/* // 메일 목록설정 레이어 */


/* 인쇄항목 선택 팝업 */

.printSelectPopup { min-width: 200px; max-width: 200px; padding: 0;}
.printSelectPopup > div {padding: 14px 24px;}
.printSelectPopup > .layerFooter {border-top: 1px solid #F4F4F4;}
.printSelectPopup > ul {padding-bottom: 10px;}
.printSelectPopup > ul > li {padding: 7px 24px; display: flex; align-items: center; cursor: pointer;}
.printSelectPopup > ul > li > label {padding-left: 4px; font-size: 15px; color: #333333;}
.printSelectPopup > ul > li:hover {background-color: #F3F5F6;}

/* // 인쇄항목 선택 팝업 */

/* 사이드바 라벨 우클릭 context menu */

.editLabelContextMenu {min-width: 112px;}

/* // 사이드바 라벨 우클릭 context menu */

/* 보안메일함 비밀번호 팝업 */

.password_secumail {border-radius: 0; min-width: 420px; padding: 20px 26px;}
.password_secumail > .layerHead > h1 {font-size: 18px;}
.password_secumail > .layerContent {padding: 50px 0;}
.password_secumail > .layerContent > input {height: 32px; padding: 0 6px; border: 1px solid #DDDDDD;}
.password_secumail > .layerContent > input:focus {border-color: var(--main-color);}
.password_secumail > .layerContent > p {font-size: 13px; padding-top: 12px;}
.password_secumail > .layerContent > p.ok_txt {display: block; color: #ABABAB;}
.password_secumail > .layerContent > p.err_txt {display: none; color: var(--error-color);}
.password_secumail.error > .layerContent > input {border-color: var(--error-color);}
.password_secumail.error > .layerContent > p.ok_txt {display: none;}
.password_secumail.error > .layerContent > p.err_txt {display: block;}

/* // 보안메일함 비밀번호 팝업 */

/* 대용량 첨부파일 비밀번호 팝업 */

.password_bigAttach {border-radius: 0; min-width: 420px; padding: 20px 26px;}
.password_bigAttach > .layerHead > h1 {font-size: 18px;}
.password_bigAttach > .layerContent {padding-bottom: 15px;}
.password_bigAttach > .layerContent > div:nth-of-type(1) {padding: 22px 0; display: flex; flex-wrap: wrap; flex-direction: column; align-items: baseline;}
.password_bigAttach > .layerContent > div:nth-of-type(1) > p {font-size: 13px; color: #000; line-height: 1.6;}
.password_bigAttach > .layerContent > div:nth-of-type(1) > p > span {color: var(--main-color);}
.password_bigAttach > .layerContent > input {height: 32px; padding: 0 6px; border: 1px solid #DDDDDD;}
.password_bigAttach > .layerContent > input:nth-of-type(2) {margin-top: 8px;}
.password_bigAttach > .layerContent > input:focus {border-color: var(--main-color);}
.password_bigAttach > .layerContent > p {font-size: 13px; padding-top: 12px;}
.password_bigAttach > .layerContent > p.err_txt {color: var(--error-color); opacity: 0; cursor: default;}
.password_bigAttach > .layerContent > div:nth-of-type(2) {display: flex; flex-wrap: wrap; flex-direction: column; align-items: baseline; padding-top: 14px;}
.password_bigAttach > .layerContent > div:nth-of-type(2) > input {height: 32px; padding: 0 6px; border: 1px solid #DDDDDD; width: -webkit-fill-available;}
.password_bigAttach > .layerContent > div:nth-of-type(2) > input:focus {border-color: var(--main-color);}
.password_bigAttach > .layerContent > div:nth-of-type(2) > p {font-size: 12px; color: #ABABAB; padding-top: 10px;}
.password_bigAttach > .layerContent > div:nth-of-type(2) > p.hint_err_txt {font-size: 12px; cursor: default; color: var(--error-color); padding-top: 14px; opacity: 0;}
.password_bigAttach.error > .layerContent > input {border-color: var(--error-color);}
.password_bigAttach.error_hint > .layerContent > div:nth-of-type(2) > input {border-color: var(--error-color);}
.password_bigAttach.error > .layerContent > p.err_txt {opacity: 1; cursor: auto;}
.password_bigAttach.error_hint > .layerContent > div:nth-of-type(2) > p.hint_err_txt {opacity: 1; cursor: auto;}

/* // 대용량 첨부파일 비밀번호 팝업 */

/* 예약메일 수정 팝업 */

.customConfirmPopup {border-radius: 0; min-width: 400px; padding: 20px 26px 40px; top: 570px; left: 40px;}
.customConfirmPopup > .layerContent {padding: 20px 0; align-items: center;}
.customConfirmPopup > .layerContent > span {display: inline-block; width: 35px; height: 35px; background: url(../img/ar_main.svg) no-repeat -295px -1030px;}
.customConfirmPopup > .layerContent > h6 {font-size: 16px; padding-top: 24px; color: #000; font-weight: bold;}
.customConfirmPopup > .layerContent > p {font-size: 14px; padding-top: 12px; color: #666; text-align: center; line-height: 22px; letter-spacing: -0.5px;}

/* // 예약메일 수정 팝업 */

/* 서명 레이어 */

.signaturePopup {top: 520px; left: 450px; padding: 10px 0; min-width: 136px; border-radius: 0; max-width: 160px;}
.signaturePopup > ul {display: flex; flex-direction: column;}
.signaturePopup > ul:first-of-type {padding-bottom: 10px;}
.signaturePopup > ul:last-of-type {border-top: 1px solid #f4f4f4; padding-top: 5px;}
.signaturePopup > ul > li {width: 100%;}
.signaturePopup > ul > li > a {font-size: 14px; color: #000; padding: 8px 0; display: inline-flex; width: 100%; position: relative; align-items: center;}
.signaturePopup > ul > li > a::before {position: absolute; content: ''; display: none; background: url(../img/ar_main.svg) no-repeat -8px -401px; width: 16px; height: 14px; top: 50%; left: 14px; transform: translateY(-50%);}
.signaturePopup > ul > li > a.clicked {background-color: #F3F5F6; color: var(--main-color);}
.signaturePopup > ul > li > a.clicked::before {display: block;}
.signaturePopup > ul > li > a:hover {background-color: #F3F5F6;}
.signaturePopup > ul > li > a > p {padding-left: 36px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 14px;}
.signaturePopup > ul:last-of-type > li > a:hover {background-color: transparent;}
.signaturePopup > ul:last-of-type > li > a > p {padding-left: 16px;}

/* // 서명 레이어 */

/* 템플릿 목록 레이어 */

.templateListPopup {top: 150px; left: 850px; padding: 10px 0; min-width: 282px; max-width: 300px;}
.templateListPopup > ul {display: flex; flex-direction: column;}
.templateListPopup > ul:first-of-type {padding-bottom: 10px; max-height: 134px; overflow-y: auto;}
.templateListPopup > ul:last-of-type {border-top: 1px solid #f4f4f4; padding-top: 10px;}
.templateListPopup > ul > li {width: 100%;}
.templateListPopup > ul > li > a {font-size: 14px; color: #595959; padding: 5px 16px; display: flex; align-items: center; justify-content: space-between;}
.templateListPopup > ul > li > a:hover {background-color: #F3F5F6;}
.templateListPopup > ul > li > a > p {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 14px;}
.templateListPopup > ul > li > a > button {width: 16px; height: 16px; display: inline-block; border: none; background: url(../img/ar_main.svg) no-repeat -160px -334px; min-width: 16px;}
.templateListPopup > ul:last-of-type > li > a:hover {background-color: transparent;}
.templateListPopup > ul:last-of-type > li > a {padding: 5px 16px; display: inline-flex;}
.templateListPopup > ul:last-of-type > li > a > span {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -51px -685px; }
.templateListPopup > ul:last-of-type > li > a > p {padding-left: 5px; color: #000;}

/* // 템플릿 목록 레이어 */


/* 스팸해제 팝업 */

.unSpamPopup {border-radius: 0; min-width: 442px; padding: 20px 26px 40px; top: 850px; left: 40px;}
.unSpamPopup > .layerContent {padding: 20px 0 50px; align-items: center;}
.unSpamPopup > .layerContent > h6 {font-size: 16px; padding-top: 24px; color: #000; font-weight: bold;}
.unSpamPopup > .layerContent > h6 > span {color: var(--main-color);}
.unSpamPopup > .layerContent > p {font-size: 14px; padding-top: 22px; color: #666; text-align: center; line-height: 22px; letter-spacing: -0.5px;}

/* // 스팸해제 팝업 */


/* 수신차단 팝업 */

.receiveBlock.layer_content { border: 1px solid #b3b3b3; position: absolute; overflow: hidden; background-color:#fff;
	-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	-moz-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); 
	box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.24); display: flex; flex-direction: column; padding: 5px 0; min-width: 380px; border-radius: 4px;}
.receiveBlock > div {padding: 14px 24px}
.receiveBlock .layerContent {padding: 0 24px 0 !important;}
.receiveBlock .layerContent > div {display: flex; flex-direction: column; flex-wrap: wrap; align-items: baseline;}
.receiveBlock .layerContent > div > p {font-size: 14px; color: #666;}
.receiveBlock .layerContent > div > div {display: flex; width: calc(100% - 40px); justify-content: center; align-items: center; border: 1px solid #E5E5E5; height: 45px; margin: 15px 0; padding: 0 20px;}
.receiveBlock .layerContent > div > div > p {color: var(--error-color); font-size: 14px; white-space: nowrap;}
.receiveBlock .layerContent > div > div > span {color: #000; font-size: 14px; padding-left: 2px; white-space: nowrap;}
.receiveBlock .layerFooter {border-top: 1px solid #e5e5e5;}
.receiveBlock .layerFooter > div > button {width: 90px;}

/* // 수신차단 팝업 */


/* 공지사항 팝업 */

.notificationPopup {border-radius: 0; min-width: 480px; max-width: 550px; display: flex; flex-direction: column; justify-content: space-between;}
.notificationPopup > .layerHead {border-bottom: 1px solid #E4E4E4; padding: 26px 62px 20px 26px; position: relative;}
.notificationPopup > .layerHead::after {position: absolute; left: 26px; bottom: 0; width: 65px; height: 2px; display: inline-block; content: ''; background-color: #000;}
.notificationPopup > .layerHead > h1 {font-size: 18px; font-weight: bold; letter-spacing: -1px; line-height: 30px;}
.notificationPopup > .layerContent {padding: 26px; max-height: 330px; overflow-y: auto; min-height: 150px;}
.notificationPopup > .layerContent img {display: inline-block; max-width: 100%;}
.notificationPopup > .layerContent > p {font-size: 14px; color: #000; line-height: 28px;}
.notificationPopup > .layerFooter {border-top: 1px solid #F4F4F4; padding: 26px;}
.notificationPopup > .layerFooter > div {display: flex; justify-content: space-between; align-items: center; flex-wrap: nowrap;}
.notificationPopup > .layerFooter > div > div {display: flex; align-items: center;}
.notificationPopup > .layerFooter > div > div > label {font-size: 15px; letter-spacing: -0.5px; padding-left: 5px;}
.notificationPopup > .layerFooter > div > a {display: inline-flex; justify-content: center; align-items: center; font-size: 15px; color: #333333; width: 104px; height: 32px; box-sizing: border-box; border: 1px solid #CBCBCB;}
.notificationPopup .closePopup {top: 27px; right: 22px;}

/* // 공지사항 팝업 */

/* 이미지로 미리보기 팝업 */

.mailPreviewImgPopup {top: 1150px; left: 600px; min-width: 940px; max-width: 940px; display: flex; flex-direction: column; height: 680px; max-height: 90%; padding-bottom: 26px;}
.mailPreviewImgPopup > .layerHead {border-bottom: 1px solid #E4E4E4; padding: 26px 62px 20px 26px; position: relative;}
.mailPreviewImgPopup > .layerHead > h1 {font-size: 18px; font-weight: bold; letter-spacing: -1px; line-height: 30px;}
.mailPreviewImgPopup > .layerContent {padding: 26px; overflow-y: auto; min-height: 150px;}
.mailPreviewImgPopup > .layerContent img {display: inline-block; max-width: 100%;}
.mailPreviewImgPopup .closePopup {top: 30px; right: 22px;}

/* // 이미지로 미리보기 팝업 */


/* 템플릿 저장하기 팝업 */

.templateSavePopup {border-radius: 0; min-width: 412px; padding: 24px 30px 30px; top: 1550px; left: 40px;}
.templateSavePopup > .layerHead > h1 {font-size: 18px; font-weight: bold;}
.templateSavePopup > .layerContent {padding: 35px 0;}
.templateSavePopup > .layerContent > input {height: 32px; padding: 0 6px; border: 1px solid #DDDDDD;}
.templateSavePopup > .layerContent > input:focus {border-color: var(--main-color);}
.templateSavePopup > .layerContent > p {font-size: 13px; padding-top: 12px; color: #ABABAB; line-height: 20px;}
.templateSavePopup > .layerContent > p > span {color: var(--main-color);}

/* // 템플릿 저장하기 팝업 */


/* 전체 알림 레이어 */

.totalNotificationPopup {min-width: 322px; max-width: 322px; border-radius: 0;z-index: 10000; top: 1500px; left: 1000px; box-sizing: border-box;}
.totalNotificationPopup::before {content: ""; position: absolute; top: -5px; right: 49px; width: 7px; height: 7px; border-top: 1px solid #B3B3B3; border-right: 1px solid #B3B3B3; background: #fcfcfc; transform: rotateZ(-45deg);}
.totalNotificationPopup > div {display: flex;}
.totalNotificationPopup > ul {display: flex;}

.totalNotificationTitle {justify-content: space-between; align-items: center; padding: 11px 16px;}
.totalNotificationTitle > h1 {font-size: 16px; font-weight: bold; color: #000;}
.totalNotificationTitle > div {display: inline-flex; align-items: center;}
.totalNotificationTitle > div > button {display: inline-flex; align-items: center; box-sizing: border-box; border: 1px solid #CBCBCB; height: 27px; padding: 0 7px; font-size: 12px; line-height: 27px;}
.totalNotificationTitle > div > button:last-of-type {margin-left: 6px;}
.totalNotificationTitle > div > button > p {display: inline-block; height: 16px; line-height: 18px;}
.totalNotificationTitle > div > button > span {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -202px -421px; margin-right: 2px;}

.totalNotificationContent {border-top: 1px solid #F4F4F4; border-bottom: 1px solid #F4F4F4; flex-direction: column; box-sizing: border-box;}
.totalNotificationContent > li {box-sizing: border-box; border-bottom: 1px solid #f4f4f4;}
.totalNotificationContent > li:last-of-type {border-bottom: none;}
.totalNotificationContent > li > a {display: flex; justify-content: space-between; align-items: center; flex-wrap: nowrap; padding: 10px 16px; box-sizing: border-box;}
.totalNotificationContent > li.read > a > div:first-of-type > p {color: #ABABAB; font-weight: normal;}
.totalNotificationContent > li.read > a > div:first-of-type > div > p:first-of-type {color: #ABABAB;}
.totalNotificationContent > li > a > div {display: inline-flex; justify-content: center; flex-direction: column; overflow: hidden;}
.totalNotificationContent > li > a > div:first-of-type {width: calc(100% - 40px); line-height: 20px;}
.totalNotificationContent > li > a > div:first-of-type > p {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; color: #000; font-weight: bold;}
.totalNotificationContent > li > a > div:first-of-type > p > span {display: inline-block; padding-right: 4px;}
.totalNotificationContent > li > a > div:first-of-type > div {display: inline-flex; flex-wrap: nowrap;}
.totalNotificationContent > li > a > div:first-of-type > div > p {font-size: 13px; color: #000; font-weight: normal;}
.totalNotificationContent > li > a > div:first-of-type > div > p:first-of-type {padding-right: 12px; position: relative;}
.totalNotificationContent > li > a > div:first-of-type > div > p:first-of-type::after {position: absolute; width: 1px; height: 12px; background-color: #DDD; right: 0; top: 50%; transform: translateY(-50%); content: ''; display: block;}
.totalNotificationContent > li > a > div:first-of-type > div > p:last-of-type {color: #ABABAB; padding-left: 12px;}
.totalNotificationContent > li > a > div:last-of-type {align-items: flex-end; width: 40px; min-width: 40px;}
.totalNotificationContent > li > a > div:last-of-type > button {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -182px -333px; border: none;}

.totalNotificationBottom {position: relative}
.totalNotificationBottom > button {all: unset; box-sizing: border-box; text-align: center; color: #000; font-size: 16px; cursor: pointer; background-color: #F8F8F8; display: flex; align-items: center; justify-content: center; height: 44px; width: 100%; font-weight: bold;}
.totalNotificationBottom > a {display: inline-block; position: absolute; font-size: 14px; color: #000; font-weight: bold; left: 16px; top: 50%; transform: translateY(-50%);}

/* // 전체 알림 레이어 */


/* 내 메일함 더보기 팝업 */

.treeDepthMorePopup {border-radius: 0; width: 800px; padding: 26px 30px 30px; top: 1850px; left: 40px; height: 600px;}
.treeDepthMorePopup > .layerHead > h1 {font-size: 18px; font-weight: bold;}
.treeDepthMorePopup .treeSelectableMenuContainer {border-top: none;}
.treeDepthMorePopup > .layerContent {padding: 30px 0; font-size: 15px;}
.treeDepthMorePopup > .layerContent > ul {border: 1px solid #DDD; padding: 5px 0; height: 413px; max-height: 413px; overflow-y: auto;}
/* // 내 메일함 더보기 팝업 */


/* 공유받은 메일함 우클릭 context menu */

.sharedMailboxContextMenu {top: 70px; left: 500px; max-width: 225px;}
.sharedMailboxContextMenu > div {padding: 8px 18px;}
.sharedMailboxContextMenu > div > p {font-size: 14px; color: #0f0f0f; display: flex; align-items: center; flex-wrap: nowrap; white-space: nowrap;}
.sharedMailboxContextMenu > div > p > i {display: inline-block; width: 15px; height: 15px; background: url(../img/ar_main.svg) no-repeat -598px -1047px; min-width: 15px;}
.sharedMailboxContextMenu > div > p > span {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

/* // 공유받은 메일함 우클릭 context menu */

/* 미리보기 첨부 레이어 */

.previewAttachList {min-width: 334px; max-width: 334px; padding: 20px;}
.previewAttachList > div {display: flex; flex-direction: column; overflow-y: auto; max-height: 182px;}
.previewAttachList > div > div {height: 28px; min-height: 28px; display: flex; align-items: center; padding: 0 8px; overflow: hidden; margin-bottom: 2px;}
.previewAttachList > div > div:last-child {margin-bottom: 0;}
.previewAttachList > div > div > span {display: inline-block; width: 15px; height: 15px; min-width: 15px; margin-right: 8px;}
.previewAttachList > div > div > p {display: inline-block; color: #555555; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.previewAttachList > div > div > p > span {display: inline-block; padding-left: 4px; white-space: nowrap;}

/* // 미리보기 첨부 레이어 */

/* 자동완성 레이어 */
.layerPopup.autocomplete {width: 320px;}
.layerPopup.autocomplete > ul {display: flex; flex-direction: column; padding: 8px 0;}
.layerPopup.autocomplete > ul > li {display: flex; align-items: center;}
.layerPopup.autocomplete > ul > li + li {border-top: 1px solid #F4F4F4;}
.layerPopup.autocomplete > ul > li > a {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; width: 100%; height: 34px; line-height: 34px; padding: 0 16px; color: #000; font-size: 14px; font-weight: 400;}
.layerPopup.autocomplete > ul > li > a:hover {background-color: #F3F5F6;}
.layerPopup.autocomplete > ul > li.on > a {color: var(--main-color); pointer-events: none;}

/* 주소록 더보기 버튼 레이어 */

.addressMoreOption {top: 70px; left: 50px; min-width: 154px;}

/* // 주소록 더보기 버튼 레이어 */


/* 주소록 리스트 우클릭 context menu */

.addressListContextMenu {top: 70px; left: 250px;}

/* // 주소록 리스트 우클릭 context menu */


/* 주소록 그룹지정 버튼 클릭 레이어 */

.addressGroupPopup {min-width: 225px; display: flex; flex-direction: column; font-size: 14px; padding: 10px 0; max-width: 320px;}
.addressGroupPopup > ul {width: 100%; min-height: 71px; max-height: 224px; overflow-x: hidden; overflow-y: auto;}
.addressGroupPopup > ul li > a {color: #0f0f0f; padding: 8px 0; display: inline-block; width: 100%;}
.addressGroupPopup > ul li > a > p {text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding: 0 10px 0 18px; position: relative;}
.addressGroupPopup > ul li > a:hover {background-color: #F3F5F6;}

.addressGroupPopup > .newGroupBox {border-top: 1px solid #E5E5E5;}
.addressGroupPopup > .newGroupBox > button {all: unset; padding: 12px 0; display: flex; align-items: center; cursor: pointer; color: #0f0f0f; width: 100%; text-indent: 18px;}
.addressGroupPopup > .newGroupBox > button > span {background: url(../img/ar_main.svg) no-repeat -227px -402px; display: inline-block; width: 12px; height: 13px; margin-left: 4px;}
.addressGroupPopup > .newGroupBox > .addGroupBox {display: none; padding: 12px 18px; }
.addressGroupPopup > .newGroupBox > .addGroupBox > input  {height: 28px; border: 1px solid #ddd; box-sizing: border-box; width: calc(100% - 54px); padding: 0 8px;}
.addressGroupPopup > .newGroupBox > .addGroupBox > input:focus  {border-color: var(--main-color);}
.addressGroupPopup > .newGroupBox > .addGroupBox > button  {height: 28px; border-color: #525763; background-color: #525763; color: #fff; width: 48px; margin-left: 6px;}
.addressGroupPopup > .newGroupBox.clicked > button {display: none;}
.addressGroupPopup > .newGroupBox.clicked > .addGroupBox {display: flex;}

/* //주소록 그룹지정 버튼 클릭 레이어 */


/* 공유받은 - 사이드바 우클릭 context menu */

.addressListSharedContextMenu {top: 70px; left: 800px; max-width: 225px;}
.addressListSharedContextMenu > div {padding: 8px 18px 16px;}
.addressListSharedContextMenu > div > p {font-size: 12px; color: #898989; display: flex; align-items: center; flex-wrap: nowrap; white-space: nowrap;}
.addressListSharedContextMenu > div > p > i {display: inline-block; width: 15px; height: 15px; background: url(../img/ar_main.svg) no-repeat -598px -1047px; min-width: 15px;}
.addressListSharedContextMenu > div > p > span {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

/* // 공유받은 - 사이드바 우클릭 context menu */


/* 공유자 표시창 팝업 */

.addressSharedPopup {min-width: 278px; max-width: 350px;}
.addressSharedPopup > div {padding: 8px 18px; color: #000; display: flex; flex-direction: column;}
.addressSharedPopup > div:nth-child(1) {overflow: hidden;}
.addressSharedPopup > div:nth-child(1) > h6 {font-size: 16px; font-weight: bold;}
.addressSharedPopup > div:nth-child(1) > p {font-size: 14px; padding-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.addressSharedPopup > div:nth-child(2) {max-height: 235px; overflow-y: auto; overflow-x: hidden;}
.addressSharedPopup > div:nth-child(2) > p {font-size: 14px; height: 24px; line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-height: 24px;}

/* // 공유자 표시창 팝업 */


/* 주소록 목록설정 레이어 */

.addressBalloonSection > div {flex-wrap: wrap;}
.addressBalloonSection > div > div {display: flex; align-items: center; width: 25%; min-width: 25%; margin-bottom: 10px;}
.addressBalloonSection > div > div > label {padding-left: 4px; color: #333;}

/* // 주소록 목록설정 레이어 */

/* 드라이브 리스트 우클릭 context menu */

.driveListContextMenu {top: 60px; left: 40px;}

/* // 드라이브 리스트 우클릭 context menu */


/* 드라이브 상세정보 팝업 */

.driveDetailInfor {border-radius: 0; min-width: 550px; padding: 24px 30px 30px; max-width: 550px;}
.driveDetailInfor > .layerHead > h1 {font-size: 18px; color: #333; font-weight: bold;}
.driveDetailInfor > .layerContent {padding: 32px 0 65px;}
.driveDetailInfor > .layerContent > h3 {font-size: 18px; font-weight: bold; color: #000; line-height: 22px;}
.driveDetailInfor .detailInforWrap {padding-top: 15px; display: flex; flex-wrap: nowrap; overflow: hidden;}
.driveDetailInfor .detailInforWrap .detailInforImg {display: inline-flex; width: 160px; height: 160px; box-sizing: border-box; border: 1px solid #E5E5E5; background-color: #F9F9F9; min-width: 160px; align-items: center; justify-content: center;}
.driveDetailInfor .detailInforWrap .detailInforTxt {display: flex; flex-direction: column; justify-content: flex-start; height: 160px; font-size: 14px; padding-left: 26px; width: calc(100% - 190px);}
.driveDetailInfor .detailInforWrap .detailInforTxt > dl {display: flex; flex-wrap: nowrap; padding-bottom: 17px;}
.driveDetailInfor .detailInforWrap .detailInforTxt.many-items > dl {padding-bottom: 10px;}
.driveDetailInfor .detailInforWrap .detailInforTxt > dl:last-of-type {padding-bottom: 0;}
.driveDetailInfor .detailInforWrap .detailInforTxt > dl > dt {width: 75px; margin-right: 32px; color: #898989; min-width: 75px;}
.driveDetailInfor .detailInforWrap .detailInforTxt.many-items > dl > dt {width: 87px;}
.driveDetailInfor .detailInforWrap .detailInforTxt > dl > dd {color: #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.driveDetailInfor .detailInforWrap .detailInforTxt > dl > dd > input {position: relative; top: -1.5px;}
.driveDetailInfor > .layerFooter button {color: #fff !important;}
.driveDetailInfor > .closePopup {top: 20px;}

.detailInforImgType {display: inline-block; box-sizing: border-box; width: 42px; height: 50px;}
.detailInforImgType.folder {background: url(../img/ar_main.svg) no-repeat -11px -968px !important; width: 50px !important; height: 48px !important; }
.detailInforImgType.ai{background: url(../img/ar_main.svg) no-repeat -122px -967px !important;}/* 일러스트 */
.detailInforImgType.doc{background: url(../img/ar_main.svg) no-repeat -278px -967px !important;}/* 문서 */
.detailInforImgType.etc{background: url(../img/ar_main.svg) no-repeat -694px -967px !important;}/* 기타 */
.detailInforImgType.exe{background: url(../img/ar_main.svg) no-repeat -746px -903px !important;}/* 설치파일 */
.detailInforImgType.fla{background: url(../img/ar_main.svg) no-repeat -174px -967px !important;}/* 플래시 */
.detailInforImgType.gul{background: url(../img/ar_main.svg) no-repeat -486px -967px !important;}/* gul? */
.detailInforImgType.htm{background: url(../img/ar_main.svg) no-repeat -694px -903px !important;}/* html */
.detailInforImgType.hwp{background: url(../img/ar_main.svg) no-repeat -538px -967px !important;}/* 한글파일 */
.detailInforImgType.image{background: url(../img/ar_main.svg) no-repeat -434px -967px !important;}/* 이미지 */
.detailInforImgType.mp3{background: url(../img/ar_main.svg) no-repeat -642px -903px !important;}/* mp3 */
.detailInforImgType.mp4{background: url(../img/ar_main.svg) no-repeat -590px -903px !important;}/* mp4 */
.detailInforImgType.pdf{background: url(../img/ar_main.svg) no-repeat -226px -967px !important;}/* pdf */
.detailInforImgType.ppt{background: url(../img/ar_main.svg) no-repeat -330px -967px !important;}/* ppt */
.detailInforImgType.psd{background: url(../img/ar_main.svg) no-repeat -70px -967px !important;}/* 포토샵 */
.detailInforImgType.txt{background: url(../img/ar_main.svg) no-repeat -642px -967px !important;}/* 텍스트 */
.detailInforImgType.xls{background: url(../img/ar_main.svg) no-repeat -382px -967px !important;}/* 엑셀 */
.detailInforImgType.zip{background: url(../img/ar_main.svg) no-repeat -590px -967px !important;}/* 압축파일 */
.detailInforImgType.rawImage {width: 100% !important; height: 100% !important; background-position: center center; background-size: cover; background-repeat: no-repeat;}

/* // 드라이브 상세정보 팝업 */

/* 드라이브 덮어쓰기 팝업 */

.driveOverwritePopup {border-radius: 0; min-width: 430px; padding: 20px 30px 30px;}
.driveOverwritePopup > .layerContent {padding: 20px 0 26px; align-items: center;}
.driveOverwritePopup > .layerContent > span {display: inline-block; width: 35px; height: 35px; background: url(../img/ar_main.svg) no-repeat -295px -1030px;}
.driveOverwritePopup > .layerContent > h6 {font-size: 16px; padding: 28px 0 26px; color: #000; text-align: center; line-height: 25px;}
.driveOverwriteWrap {display: flex; flex-direction: column; border: 1px solid #CACACA; box-sizing: border-box; width: 100%; padding-bottom: 0 !important;}
.driveOverwriteWrap > dl {border-bottom: 1px solid #f4f4f4; padding: 12px 0;}
.driveOverwriteWrap > div {width: 100%; padding: 20px 0;}
.driveOverwriteWrap > div dd {display: flex; justify-content: space-between; width: calc(100% - 114px);}
.driveOverwriteWrap dl {display: flex; flex-wrap: nowrap; font-size: 14px; width: 100%;}
.driveOverwriteWrap dl:first-of-type {padding-bottom: 16px;}
.driveOverwriteWrap dt {color: #B0B0B0; width: 60px; text-align: right;}
.driveOverwriteWrap dd {color: #000; padding: 0 30px 0 24px;}
.driveOverwritePopup > .closePopup {top: 20px;}

/* // 드라이브 덮어쓰기 팝업 */

/* 드라이브 목록설정 */
.balloonSection.drive > div {flex-direction: column; align-items: flex-start;}
.balloonSection.drive > div > div {display: flex; align-items: center; padding-top: 10px;}
.balloonSection.drive > div > div:first-of-type {padding-top: 0;}
.balloonSection.drive > div > div:last-of-type {padding-top: 4px;}
.balloonSection.drive > div > div > label {display: flex; align-items: center; font-size: 14px; color: #333;}
.balloonSection.drive > div > div > label > input {margin-right: 5px;}
.balloonSection.drive > div > div > div {display: inline-flex; align-items: center; padding-left: 12px;}
.balloonSection.drive > div > div > div.hidden {pointer-events: none; opacity: 0;}
.balloonSection.drive > div > div > div > input {border: 1px solid #cbcbcb; height: 28px; box-sizing: border-box; width: 100px; padding: 0 10px;}
.balloonSection.drive > div > div > div > input:focus {border-color: var(--main-color);}
.balloonSection.drive > div > div > div > button {background-color: #525763; border-color: #525763; color: #fff; padding: 0 12px; font-size: 14px;}
.balloonSection.drive > div > div > div > input + button {margin-left: 5px;}
/* // 드라이브 목록설정 */

/* 환경설정 - 정보변경 확인 레이어 */

.changeInfoPopup {display: flex; flex-direction: column; min-width: 424px; padding-top: 20px;border-radius: 0;}

.changeInfoTitle {display: flex; flex-direction: column; padding: 0 22px;}
.changeInfoTitle > h1 {font-size: 18px; font-weight: bold; color: #333;}

.changeInfoContent {display: flex; flex-direction: column; padding: 0 22px;}
.changeInfoContent > div:nth-child(1) {padding-bottom: 16px; border-bottom: 1px solid #F4F4F4;}
.changeInfoContent > div:nth-child(1) > p {font-size: 13px; color: #898989; padding: 18px 0 20px;}
.changeInfoContent > div:nth-child(1) > input {font-size: 14px; height: 24px; padding: 0 6px; border: 1px solid #ddd; color: #000; width: calc(100% - 12px);}
.changeInfoContent > div:nth-child(1) > input:focus {border-color: var(--main-color);}
.changeInfoContent > div:nth-child(1) > input.error {border-color: var(--error-color);}
.changeInfoContent > div:nth-child(2) {padding: 16px 0;}
.changeInfoContent > div:nth-child(2) > p {color: #000; font-size: 15px; font-weight: bold; padding-bottom: 12px;}
.changeInfoContent > div:nth-child(2) > div {width: 100%; border: 1px solid #ddd; display: flex; flex-wrap: nowrap; height: 84px; margin-bottom: 16px;}
.changeInfoContent > div:nth-child(2) > div > div {width: calc(100% - 90px); height: 100%; display: flex; align-items: center; justify-content: center;}
.changeInfoContent > div:nth-child(2) > div > a {display: flex; width: 90px; height: 100%; border-left: 1px solid #ddd; align-items: center; justify-content: center;}
.changeInfoContent > div:nth-child(2) > div > a > span {display: inline-block; font-size: 12px; color: #666666; position: relative; padding-top: 30px;}
.changeInfoContent > div:nth-child(2) > div > a > span::before {position: absolute; content: ''; display: block; background: url(../img/ar_main.svg) no-repeat -665px -1038px; width: 25px; height: 25px; top: 0; left: 50%; transform: translateX(-50%);}
.changeInfoContent > div:nth-child(2) > input {font-size: 13px; height: 24px; padding: 0 6px; border: 1px solid #ddd; color: #000; width: calc(100% - 12px);}
.changeInfoContent > div:nth-child(2) > input:focus {border-color: var(--main-color);}
.changeInfoContent > div:nth-child(2) > input.error {border-color: var(--error-color);}

.changeInfo_error > p {font-size: 13px; color: var(--error-color); letter-spacing: -0.5px; font-weight: normal; line-height: 1.4;}

.changeInfoBottom {padding: 26px 22px; display: flex; align-items: center; justify-content: center;}
.changeInfoBottom > div > button {all: unset; box-sizing: border-box; width: 80px; height: 30px; border: 1px solid #CBCBCB; text-align: center; color: #333; font-size: 15px; cursor: pointer; background-color: #fff; display: inline-flex; align-items: center; justify-content: center}
.changeInfoBottom > div > button.b {background-color: #525763; border-color: #525763; color: #fff; margin-right: 2px;}


/* // 환경설정 - 정보변경 확인 레이어 */


/* 환경설정 - 메일함 백업 레이어 */

.mailBoxBackUpPopup {display: flex; flex-direction: column; min-width: 524px; padding-top: 22px;border-radius: 0;}

.closePopup {position: absolute; display: inline-block; width: 16px; height: 16px; right: 28px; top: 24px; background: url(../img/ar_main.svg) no-repeat -7px -555px;}

.mailBoxBackUpTitle {display: flex; flex-direction: column; padding: 0 28px;}
.mailBoxBackUpTitle > h1 {font-size: 18px; font-weight: bold; color: #333;}

.mailBoxBackUpContent {display: flex; flex-direction: column; padding: 0 28px 12px;}
.mailBoxBackUpContent > div:nth-child(1) > p {font-size: 13px; color: #ababab; padding: 22px 0;}
.mailBoxBackUpContent > div:nth-child(2) > p {font-size: 14px; color: #000; font-weight: bold;}
.mailBoxBackUpContent > div:nth-child(2) > div {display: flex; flex-wrap: nowrap; padding-top: 15px; justify-content: space-between;}
.backUpDateSelect {position: relative;}
.backUpDateSelectBox {width: 115px; height: 28px; box-sizing: border-box; border: 1px solid #CBCBCB; display: flex; align-items: center; padding-left: 8px; background: url(../img/arrow.gif) no-repeat 100% 50%; cursor: pointer;}
.backUpDateSelect .optionLayer {width: 115px; }
.backUpDateSelect .optionLayer > a {color: #000;}
.mailBoxBackUpContent > div:nth-child(2) > div > input {width: 168px; border: 1px solid #CBCBCB; box-sizing: border-box; height: 28px; padding: 0 8px;}
.mailBoxBackUpContent > div:nth-child(2) > div > input:focus {border-color: var(--main-color);}

.mailBoxBackUpBottom {padding: 26px 28px; display: flex; align-items: center; justify-content: center;}
.mailBoxBackUpBottom > div > button {all: unset; box-sizing: border-box; width: 80px; height: 30px; border: 1px solid #CBCBCB; text-align: center; color: #333; font-size: 15px; cursor: pointer; background-color: #fff; display: inline-flex; justify-content: center; align-items: center}
.mailBoxBackUpBottom > div > button.b {background-color: #525763; border-color: #525763; color: #fff; margin-right: 2px;}

/* // 환경설정 - 메일함 백업 레이어 */

/* 서명 템플릿 선택 레이어 */

.signatureSelectPopup {display: flex; width: 630px;padding: 0 40px; border-radius: 0;}
.signatureSelectPopup > div {display: flex; flex-direction: column; padding: 60px 0 25px; width: 100%;}
.signatureSelectPopup > div > p {color: #898989; font-size: 15px; padding-bottom: 20px;}
.signatureSelectPopup > div > ul {display: flex; flex-direction: row; flex-wrap: nowrap; height: 102px; width: 100%; box-sizing: border-box; border: 1px solid #EBEBEB;}
.signatureSelectPopup > div > ul > li {width: 25%; background-color: #F9F9F9;}
.signatureSelectPopup > div > ul > li:hover {background-color: #EBEBEB;}
.signatureSelectPopup > div > ul > li:not(:last-of-type) {border-right: 1px solid #EBEBEB;}
.signatureSelectPopup > div > ul > li > a {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.signatureSelectPopup > div > ul > li:nth-of-type(1) > a > span {background: url(../img/ar_main.svg) no-repeat -26px -880px; display: inline-block; width: 98px; height: 33px;}
.signatureSelectPopup > div > ul > li:nth-of-type(2) > a > span {background: url(../img/ar_main.svg) no-repeat -129px -880px; display: inline-block; width: 54px; height: 33px;}
.signatureSelectPopup > div > ul > li:nth-of-type(3) > a > span {background: url(../img/ar_main.svg) no-repeat -191px -881px; display: inline-block; width: 98px; height: 33px;}
.signatureSelectPopup > div > ul > li:nth-of-type(4) > a > span {font-size: 15px; color: #000;}
.signatureSelectPopup > div > div {width: 100%; display: flex; align-items: center; justify-content: center; padding-top: 55px;}
.signatureSelectPopup > div > div > a {display: flex; width: 104px; height: 32px; box-sizing: border-box; border: 1px solid #CBCBCB; color: #000; font-size: 14px; align-items: center; justify-content: center;}

/* // 서명 템플릿 선택 레이어 */


/* otp 앱 비밀키 팝업 */

.otpSecretKeyPopup {border-radius: 0; min-width: 282px; padding: 20px 28px 40px; top: 350px; left: 700px;}
.otpSecretKeyPopup > .closePopup {right: 22px; top: 20px;}
.otpSecretKeyPopup > .layerTitle > h6 {font-size: 18px; color: #333; font-weight: bold; letter-spacing: -1px;}
.otpSecretKeyPopup > .layerContent {padding-top: 25px;}
.otpSecretKeyPopup > .layerContent > p {font-size: 15px; color: #000; text-align: center; padding-bottom: 0;}

/* // otp 앱 비밀키 팝업 */

/* 메일복구 받는사람 오버 팝업 */

.restoreMailReceptionPopup {top: 50px; left: 1050px; min-width: 356px; max-width: 356px; border-radius: 0;}
.restoreMailReceptionPopup > div {padding: 8px 18px; color: #000; display: flex; flex-direction: column; max-height: 350px; overflow-y: auto; overflow-x: hidden;}
.restoreMailReceptionPopup > div > p {display: inline-block; font-size: 15px; height: 24px; line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-height: 24px;}

/* // 메일복구 받는사람 오버 팝업 */


/* 메일복구 제목 오버 팝업 */

.restoreMailTitlePopup {min-width: 356px; display: flex; flex-direction: column; top: 450px; left: 1050px; padding: 20px; font-size: 15px; max-width: 356px; border-radius: 0;}
.restoreMailTitlePopup > .restoreMailTitleLineClamp > p {line-height: 24px; -webkit-line-clamp: 6; -webkit-box-orient: vertical; display: -webkit-box; text-overflow: ellipsis; overflow: hidden;}

/* // 메일복구 제목 오버 팝업 */


/* 빠른답장 추가 팝업 */

.quickReplyAddPopup {border-radius: 0; min-width: 485px; padding: 24px 30px 30px;}
.quickReplyAddPopup > .layerHead > h1 {font-size: 18px; font-weight: bold; color: #333;}
.quickReplyAddPopup > .layerContent {padding: 26px 0;}
.quickReplyAddPopup > .layerContent > textarea {height: 182px; padding: 10px; border: 1px solid #DDDDDD; resize: none; box-sizing: border-box;}
.quickReplyAddPopup > .layerContent > textarea::placeholder {color: #bfbfbf;}
.quickReplyAddPopup > .layerContent > textarea:focus {border-color: var(--main-color);}
.quickReplyAddPopup > .layerContent > p {font-size: 12px; padding-top: 12px; color: #ABABAB; line-height: 20px;}
.quickReplyAddPopup > .layerContent > p > span {color: var(--main-color);}

/* // 빠른답장 추가 팝업 */

/* 수신자그룹에 등록 */
.registerRecipientPopup {border-radius: 0; width: 475px; overflow: hidden; height: 777px; max-height: 90%; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.registerRecipientPopup .layerHead {padding: 20px;}
.registerRecipientPopup .layerContent {padding: 0 20px; overflow-y: auto; height: calc(100% - 153.5px);}
.registerRecipientPopup .layerFooter {padding: 35px 20px 25px;}
.registerRecipientPopup .layerFooter > div {position: relative;}
.registerRecipientPopup .layerFooter > div > button {width: 100px;}
.registerRecipientPopup .recipientInputWrap {display: flex; flex-direction: column;}
.registerRecipientPopup .recipientInputWrap > div {display: flex; flex-direction: column; align-items: flex-start; width: 100%;}
.registerRecipientPopup .recipientInputWrap > div + div {padding-top: 10px;}
.registerRecipientPopup .recipientInputWrap > div > input {box-sizing: border-box; height: 32px; border: 1px solid #cbcbcb; border-radius: 0; display: flex; align-items: center; padding: 0 6px; font-size: 14px; width: 366px;}
.registerRecipientPopup .recipientInputWrap > div > input:focus {border-color: var(--main-color);}
.registerRecipientPopup .recipientInputWrap > div > input + p {padding-top: 6px;}
.registerRecipientPopup .recipientInputWrap > div > p {font-size: 13px; color: var(--main-color); font-weight: 600;}

.registerRecipientPopup .recipientListWrap {display: flex; flex-direction: column; padding-top: 20px;}
.registerRecipientPopup .recipientListWrap > div {display: flex; flex-direction: column; width: 100%;}
.registerRecipientPopup .recipientListWrap > div + div {padding-top: 20px;}
.registerRecipientPopup .recipientListWrap > div > h6 {font-size: 14px; color: #000; font-weight: bold; padding-bottom: 10px;}
.registerRecipientPopup .recipientListWrap > div > div {display: flex; align-items: flex-start;}
.registerRecipientPopup .recipientListWrap > div > div > div {display: flex; flex-direction: column; width: 366px;}
.registerRecipientPopup .recipientListWrap > div > div > div > div {display: flex; align-items: center; padding-top: 6px;}
.registerRecipientPopup .recipientListWrap > div > div > div > div > input {box-sizing: border-box; height: 28px; border: 1px solid #cbcbcb; border-radius: 0; display: flex; align-items: center; padding: 0 6px; font-size: 14px; margin-right: 4px;}
.registerRecipientPopup .recipientListWrap > div > div > div > div > input:focus {border-color: var(--main-color);}
.registerRecipientPopup .recipientListWrap > div > div > div > div > input:nth-child(1) {width: 100px;}
.registerRecipientPopup .recipientListWrap > div > div > div > div > input:nth-child(2) {width: 210px;}
.registerRecipientPopup .recipientListWrap > div > div > div > div > button {all: unset; box-sizing: border-box; height: 28px; flex: 1; border: 1px solid #c3c3c3; color: #333; display: flex; align-items: center; justify-content: center; font-size: 14px; cursor: pointer;}
.registerRecipientPopup .recipientListWrap .recipientList {display: flex; flex-direction: column; padding: 8px 10px; border: 1px solid #cbcbcb; box-sizing: border-box; min-height: 82px; height: 82px; overflow-y: auto;}
.registerRecipientPopup .recipientListWrap .recipientList > li {display: flex; align-items: center; justify-content: space-between; overflow: hidden; min-height: 17px;}
.registerRecipientPopup .recipientListWrap .recipientList > li + li {padding-top: 5px;}
.registerRecipientPopup .recipientListWrap .recipientList > li > p {font-size: 14px; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.registerRecipientPopup .recipientListWrap .recipientList > li > button {all: unset; display: inline-block; width: 15px; height: 15px; min-width: 15px; background: url(../img/ar_main.svg) no-repeat -147px -769px; cursor: pointer; margin-left: 10px;}
.registerRecipientPopup .recipientListWrap > div > div > button {all: unset; box-sizing: border-box; height: 28px; flex: 1; border: 1px solid #c3c3c3; color: #333; display: flex; align-items: center; justify-content: center; font-size: 14px; cursor: pointer; margin-left: 5px;}

.registerRecipientPopup .closePopup {right: 20px;}
/* // 수신자그룹에 등록 */

/* 메일 자동 분류 추가 */
.autoClassificationPopup {border-radius: 0; width: 552px; height: 730px; overflow: hidden; max-height: 90%; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.autoClassificationPopup .layerHead {padding: 20px;}
.autoClassificationPopup .layerContent {padding: 0 20px; overflow-y: auto; height: calc(100% - 153.5px);}
.autoClassificationPopup .layerFooter {padding: 35px 20px 25px;}
.autoClassificationPopup .layerFooter > div {position: relative;}
.autoClassificationPopup .layerFooter > div > button {width: 100px;}
.autoClassificationPopup .classificationInputWrap {display: flex; flex-direction: column;}
.autoClassificationPopup .classificationInputWrap > div {display: flex; flex-direction: column; align-items: flex-start; width: 100%;}
.autoClassificationPopup .classificationInputWrap > div > input {box-sizing: border-box; height: 32px; border: 1px solid #cbcbcb; border-radius: 0; display: flex; align-items: center; padding: 0 6px; font-size: 14px; width: 370px;}
.autoClassificationPopup .classificationInputWrap > div > input:focus {border-color: var(--main-color);}
.autoClassificationPopup .classificationInputWrap > div > input + p {padding-top: 6px;}
.autoClassificationPopup .classificationInputWrap > div > p {font-size: 13px; color: var(--main-color); font-weight: 600;}

.autoClassificationPopup .classificationListWrap {display: flex; flex-direction: column; padding-top: 20px;}
.autoClassificationPopup .classificationListWrap > div {display: flex; flex-direction: column; width: 100%;}
.autoClassificationPopup .classificationListWrap > div + div {padding-top: 20px;}
.autoClassificationPopup .classificationListWrap > div > h6 {font-size: 14px; color: #000; font-weight: bold; padding-bottom: 10px;}
.autoClassificationPopup .classificationListWrap > div > div {display: flex; flex-direction: column;}
.autoClassificationPopup .classificationListWrap > div > div > label {display: inline-flex; align-items: center; min-height: 28px; padding-top: 5px; font-size: 15px; color: #333;}
.autoClassificationPopup .classificationListWrap > div > div > label > input {margin-right: 4px;}
.autoClassificationPopup .classificationListWrap > div > div > div {display: flex; align-items: center;}
.autoClassificationPopup .classificationListWrap > div > div > div > label {font-size: 15px; color: #333; display: inline-flex; align-items: center;}
.autoClassificationPopup .classificationListWrap > div > div > div > label > input {margin-right: 5px;}
.autoClassificationPopup .classificationListWrap > div > div > div > label + label {margin-left: 12px;}
.autoClassificationPopup .classificationList {display: flex; flex-direction: column;}
.autoClassificationPopup .classificationList > li {display: flex; align-items: center;}
.autoClassificationPopup .classificationList > li + li {margin-top: 5px;}
.autoClassificationPopup .classificationList > li > label {font-size: 15px; color: #333; min-width: 110px;}
.autoClassificationPopup .classificationList > li > div {display: flex; align-items: center;}
.autoClassificationPopup .classificationList > li > div > div {display: inline-flex; align-items: center; width: 260px;}
.autoClassificationPopup .classificationList > li > div > div > input {min-width: 196px; height: 28px; border: 1px solid #cbcbcb; box-sizing: border-box; padding: 0 6px; flex: 1;}
.autoClassificationPopup .classificationList > li > div > div > input:focus {border-color: var(--main-color);}
.autoClassificationPopup .classificationList > li > div > div > button {all: unset; box-sizing: border-box; height: 28px; border: 1px solid #c3c3c3; color: #333; display: flex; align-items: center; justify-content: center; font-size: 14px; cursor: pointer; padding: 0 10px; min-width: 58px;}
.autoClassificationPopup .classificationList > li > div > div > input + button {margin-left: 5px;}
.autoClassificationPopup .classificationList > li > div > p {font-size: 15px; color: #333; padding-left: 5px;}

.autoClassificationPopup .classificationOption {display: flex; flex-direction: column;}
.autoClassificationPopup .classificationOption > li {display: flex; flex-direction: column;}
.autoClassificationPopup .classificationOption > li > div {display: flex; align-items: center; min-height: 28px;}
.autoClassificationPopup .classificationOption > li > div.disabled {opacity: 0.4; pointer-events: none;}
.autoClassificationPopup .classificationOption > li > div > label {display: flex; align-items: center; font-size: 15px; color: #333; white-space: nowrap;}
.autoClassificationPopup .classificationOption > li > div > label + label {margin-left: 12px;}
.autoClassificationPopup .classificationOption > li > div > label > input {margin-right: 5px;}
.autoClassificationPopup .classificationOption > li > div > label > input[type=text] {height: 28px; border: 1px solid #cbcbcb; box-sizing: border-box; padding: 0 6px; min-width: 0; width: 160px;}
.autoClassificationPopup .classificationOption > li > div > label > input[type=text]:focus {border-color: var(--main-color);}
.autoClassificationPopup .classificationOption > li > div > label > input ~ input {margin-left: 5px;}
.autoClassificationPopup .classificationOption > li > div > label > select {background: url(../img/arrow.gif) no-repeat right center; -webkit-appearance: none; appearance: none; box-sizing: border-box; height: 28px; border: 1px solid #c3c3c3; color: #333; padding: 0 30px 0 6px; width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; outline: none; cursor: pointer;}

.autoClassificationPopup .closePopup {right: 20px;}
/* // 메일 자동 분류 추가 */

/* 중복확인 팝업 */

.doubleCheckPopup {border-radius: 0; min-width: 420px; padding: 20px 26px 30px; top: 100px; left: 40px;}
.doubleCheckPopup > .layerContent {padding: 60px 0 50px; align-items: center;}
.doubleCheckPopup > .layerContent > p {font-size: 16px; color: #000; text-align: center; letter-spacing: -0.5px; display: none;}
.doubleCheckPopup > .layerContent > p > span {color: var(--main-color);}
.doubleCheckPopup > .layerFooter > div > button {color: #fff; margin: 0; font-size: 15px;}
.doubleCheckPopup.checkSuccess > .layerContent > .successVerse {display: block;}
.doubleCheckPopup.checkFailure > .layerContent > .failureVerse {display: block;}

/* // 중복확인 팝업 */


/* 중복확인 팝업 */

.signUpFalsePopup {border-radius: 0; min-width: 420px; padding: 20px 26px 30px; top: 100px; left: 500px;}
.signUpFalsePopup > .layerContent {padding: 60px 0 50px; align-items: center;}
.signUpFalsePopup > .layerContent > p {font-size: 16px; color: #000; text-align: center; line-height: 26px;}
.signUpFalsePopup > .layerContent > p > span {color: var(--main-color);}
.signUpFalsePopup > .layerFooter > div > button {color: #fff; margin: 0; font-size: 15px;}

.passwordResetPopup {border-radius: 0; min-width: 420px; padding: 20px 26px 30px; top: 100px; left: 950px;}
.passwordResetPopup > .layerContent {padding: 60px 0 50px; align-items: center;}
.passwordResetPopup > .layerContent > p {font-size: 16px; color: #000; text-align: center; line-height: 26px;}
.passwordResetPopup > .layerContent > p > span {color: var(--main-color);}
.passwordResetPopup > .layerFooter > div > button {color: #fff; margin: 0; font-size: 15px;}

/* // 중복확인 팝업 */

/* 빠른답장 Context Menu */

.quickReplyContextMenu {top: 660px; left: 301px; z-index: 2023; min-width: 89px;}

.quickReplySelectContextMenu {top: 660px; right: 332px; z-index: 2023; min-width: 176px; max-width: 392px;}
.quickReplySelectContextMenu > a {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/* // 빠른답장 Context Menu */

/* New Mail List */
.mailListContainer {height: 100%; overflow: hidden;}
.mailListContainer > div {display: flex; flex-wrap: wrap; width: 100%; height: 100%;}
.mailListContainer > div > div {width: 100%; box-sizing: border-box;}

.mailListWrap {height: 100%; overflow-y: auto;}
.mailListItem {display: flex; flex-wrap: wrap; width: 100%; box-sizing: border-box; border-bottom: 1px solid #F4F4F4; background-color: #fff;}
.mailListItem:hover {background-color: #FBFCFF;}
.mailListItem > div {display: flex; align-items: center; flex-wrap: nowrap; width: 100%; box-sizing: border-box; padding-right: 14px;}
.mailListItem > div:nth-of-type(2) {padding-bottom: 6px;}
.mailListItem > div > div {display: flex; align-items: center; height: 36px;}
.mailListItem > div > div > span.selected {font-weight: bold;}
.mailListItem.selected {background-color: #F7F9FF;}

.mailListHeadWrap {height: 36px;}
.mailListHeadWrap > .mailListItem {height: 36px; border-bottom: 1px solid #E5E5E5;}
.mailListHeadWrap .mailListSender > span {font-size: 14px; color: #666; font-weight: normal; display: inline-flex; align-items: center; cursor: pointer;}
.mailListHeadWrap .mailListSender > span > a {display: inline-block; width: 12px; height: 16px; background: url(../img/ar_main.svg) no-repeat -5px -1026px;}
.mailListHeadWrap .mailListSender > span.toggle > a {background-position: -23px -1026px;}
.mailListHeadWrap .mailListTitle > span {font-size: 14px; color: #666; font-weight: normal; display: inline-flex; align-items: center; cursor: pointer;}
.mailListHeadWrap .mailListTitle > span > a {display: inline-block; width: 12px; height: 16px; background: url(../img/ar_main.svg) no-repeat -5px -1026px;}
.mailListHeadWrap .mailListTitle > span.toggle > a {background-position: -23px -1026px;}

#content_approval_list .mailListHeadWrap .mailListItem > div > div > span {font-size: 13px; position: relative;}

.mailListCheck {width: 35px; justify-content: right; min-width: 35px; padding-right: 6px; cursor: pointer;}
.mailListTotalToggle {width: 20px; justify-content: center; min-width: 20px; position: relative;}
.mailListTotalToggle > * {display: none;}
.mailListItem > div:nth-of-type(2) > .mailListTotalToggle {padding-left: 41px;}

.mailListItem.conversationStart .mailListTotalToggle > a.mailListTotalNum {display: inline-flex; width: 17px; height: 17px; border-radius: 50%; border: 1px solid #C3C5C8; color: #000; text-align: center; font-size: 10px; background-color: #fff; z-index: 10; align-items: center; justify-content: center;}
.mailListItem.conversationStart .mailListTotalToggle > a.mailListTotalNum:hover, .mailListItem.conversationStart .mailListTotalToggle > a.mailListTotalNum.hover {border-color: var(--main-color); background-color: var(--main-color); color: #fff;}
.mailListItem.conversationMiddle .mailListTotalToggle > span.mailListTotalDot,
.mailListItem.conversationEnd .mailListTotalToggle > span.mailListTotalDot {display: inline-block; width: 5px; height: 5px; z-index: 10; background-color: #B0B0B0; border-radius: 50%; }

.mailListItem.conversationMiddle > div:nth-of-type(1) > .mailListTotalToggle::before,
.mailListItem.conversationEnd > div:nth-of-type(1) > .mailListTotalToggle::before {content: ''; display: block; position: absolute; top: 0; left: calc(50% - 0.5px); transform: translateX(calc(-50% + 0.5px)); width: 1px; height: 50%; background-color: #DADBDD;}
.mailListItem.conversationStart > div:nth-of-type(1) > .mailListTotalToggle::after {content: ''; display: none; position: absolute; top: 50%; left: calc(50% - 0.5px); transform: translateX(calc(-50% + 0.5px)); width: 1px; height: 50%; background-color: #DADBDD;}
.mailListItem.conversationMiddle > div:nth-of-type(1) > .mailListTotalToggle::after {content: ''; display: block; position: absolute; top: 50%; left: calc(50% - 0.5px); transform: translateX(calc(-50% + 0.5px)); width: 1px; height: 50%; background-color: #DADBDD;}

.mailListItem.conversationStart > div:nth-of-type(2) > .mailListTotalToggle > span.mailListToggleLine,
.mailListItem.conversationMiddle > div:nth-of-type(2) > .mailListTotalToggle > span.mailListToggleLine {display: inline-block; width: 100%; height: 100%; position: relative;}
.mailListItem.conversationStart > div:nth-of-type(2) > .mailListTotalToggle > span.mailListToggleLine::before {content: ''; display: none; position: absolute; top: 0; left: calc(50% - 0.5px); width: 1px; height: calc(100% + 6px); background-color: #DADBDD; transform: translateX(calc(-50% + 0.5px));}
.mailListItem.conversationMiddle > div:nth-of-type(2) > .mailListTotalToggle > span.mailListToggleLine::before {content: ''; display: block; position: absolute; top: 0; left: calc(50% - 0.5px); width: 1px; height: calc(100% + 6px); background-color: #DADBDD; transform: translateX(calc(-50% + 0.5px));}

.mailListItem.conversationStart .mailListTotalToggle::before {display: none !important;}

.mailListItem.conversationStart.active > div:nth-of-type(1) > .mailListTotalToggle::after {display: block;}
.mailListItem.conversationStart.active > div:nth-of-type(2) > .mailListTotalToggle > span.mailListToggleLine::before {display: block;}

.mailListItem.conversationStart.active {border-bottom: none;}
.mailListConversationWrap > .mailListItem:not(:last-of-type) {border-bottom: none;}

.mailListImportant {width: 26px; justify-content: center; min-width: 26px;}
.mailListImportant > a {display: none; width: 15px; height: 15px; background: url(../img/ar_main.svg) no-repeat -7px -379px;}
.mailListImportant > a.selected {background-position: -29px -379px; display: inline-block;}
.mailListRead {width: 26px; justify-content: center; min-width: 26px;}
.mailListRead > a {display: inline-block; width: 22px; height: 20px; background: url(../img/ar_main.svg) no-repeat;}
.mailListRead > a.no {background-position: -5px -441px;}
.mailListRead > a.yes {background-position: -5px -462px;}
.mailListRead > a.nore {background-position: -27px -441px;}
.mailListRead > a.re {background-position: -26px -463px;}
.mailListRead > a.nofw {background-position: -50px -441px;}
.mailListRead > a.fw {background-position: -50px -463px;}
.mailListRead > a.nosecu {background-position: -72px -441px;}
.mailListRead > a.secu {background-position: -72px -463px;}
.mailListRead > a.noadmin {background-position: -94px -442px;}
.mailListRead > a.admin {background-position: -94px -463px;}
.mailListAttach {width: 26px; justify-content: center; min-width: 26px;}
.mailListAttach > span {display: inline-block; width: 8px; height: 14px; background: url(../img/ar_main.svg) no-repeat -55px -380px;}
.mailListSender {width: 110px; justify-content: left; padding-left: 4px; margin-right: 15px; min-width: 110px;}
.mailListSender > a {font-size: 15px; color: #000; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; padding-right: 6px;}
.mailListSender > a > strong {background-color: #DBE2FF;}
.mailListSender > a::after {display: none; content: ''; position: absolute; background: url(../img/ico_mail.png) no-repeat 100% 0; width: 5px; height: 5px; bottom: 0; right: 0;}
.mailListSender > a:hover {text-decoration: underline;}
.mailListSender > a:hover::after {display: block;}
.mailListSender > a.sub-delivery-item:hover {text-decoration: none;}
.mailListSender > a.sub-delivery-item:hover::after {display: none;}
.mailListFlag {width: 26px; justify-content: center; padding-right: 8px; min-width: 26px;}
.mailListTitle {justify-content: left; min-width: 200px; overflow: hidden; flex: 1; box-sizing: border-box; padding-right: 12px;}
.mailListSort {display: inline-block; color: #84878B; border: 1px solid #e9e9e9; font-size: 14px; padding: 1px 6px; margin-right: 8px; text-align: center; white-space: nowrap;}
.mailListLabel {display: inline-flex; align-items: center;}
.mailListLabel > a.mailListLabelItem {display: inline-flex; color: #000; border: 1px solid #e9e9e9; font-size: 14px; padding: 1px 6px; margin-right: 8px; text-align: center; white-space: nowrap; align-items: center;}
.mailListLabel > a.mailListLabelItem > span.mailListLabelColor {display: inline-block; width: 10px; height: 10px; box-sizing: border-box; border-radius: 2px; margin-right: 4px;}
.mailListSpam {display: inline-flex; width: 15px; align-items: center; margin-right: 6px;}
.mailListSpam > span {display: inline-block; width: 14px; height: 14px; background: url(../img/ar_main.svg) no-repeat -464px -1047px;}
.mailListIndividual {display: inline-flex; align-items: center; margin-right: 6px;}
.mailListIndividual > p {border: 1px solid #e9e9e9; border-radius: 10px; font-size: 14px; color: #84878B; padding: 1px 6px; white-space: nowrap;}
.mailListForgery {display: inline-flex; width: 15px; align-items: center; margin-right: 6px;}
.mailListForgery > span {display: inline-block; width: 14px; height: 14px; background: url(../img/ar_main.svg) no-repeat -444px -1047px;}
.mailListReserve {display: inline-flex; min-width: 200px; justify-content: left; padding-left: 14px;}
.mailListReserve > p {font-size: 12px; color: var(--main-color); font-weight: normal; display: flex; align-items: center;}
.mailListReserve > p > span {display: inline-block; width: 22px; height: 22px; background: url(../img/ar_main.svg) no-repeat -123px -441px; margin-right: 5px;}

.mailListStatus {width: 72px; justify-content: center; min-width: 72px;}
.mailListStatus > span {display: inline-block; font-size: 14px; color: #666666; font-weight: normal;}
.mailListWrap .mailListStatus > span {background: url(../img/ar_main.svg) no-repeat; width: 16px; height: 16px;}
.mailListWrap .mailListStatus > span.approve {background-position: -4px -1050px;}
.mailListWrap .mailListStatus > span.deny {background-position: -26px -1050px;}
.mailListWrap .mailListStatus > span.process {background-position: -48px -1050px;}
.mailListWrap .mailListStatus > span.return {background-position: -70px -1050px;}

.mailListTitle > a {display: inline-block; font-size: 15px; color: #000; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.mailListTitle > a:hover {text-decoration: underline;}
.mailListTitle > a > strong {background-color: #DBE2FF;}
.mailListTitleOption {display: none; align-items: center; justify-content: left; padding: 0 0 0 10px;}
.mailListTitleOption > a {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat;}
.mailListTitleOption > a.mailPreview {background-position: -73px -379px;}
.mailListTitleOption > a.mailNewView {background-position: -94px -379px;}
.mailListTitleOption > span {display: inline-block; width: 1px; height: 12px; background-color: #ddd; margin: 0 5px;}

.viewer_body .mailListTitleOption {display: inline-flex; height: 20px; padding-left: 10px; box-sizing: border-box;}
.viewer_body .mailListTitleOption > *:first-child {margin-right: 6px;}
.viewer_body .mailListTitleOption > a.mailPreview {background-position: -73px -378px;}

.mailListTime {width: 130px; justify-content: right; min-width: 130px;}
.mailListTime > span {display: inline-flex; color: #000; font-size: 14px; font-weight: normal; align-items: center;cursor: pointer; white-space: nowrap;}
.mailListTime > span > a {display: inline-block; width: 12px; height: 16px; background: url(../img/ar_main.svg) no-repeat -5px -1026px; position: absolute; right: -12px; top: 50%; transform: translateY(-50%);}
.mailListTime > span.toggle > a {background-position: -22px -1026px;}
.mailListVolume {width: 100px; justify-content: right; min-width: 100px;}
.mailListVolume > span {display: inline-flex; color: #000; font-size: 14px; font-weight: normal; align-items: center;cursor: pointer;}
.mailListVolume > span > a {display: inline-block; width: 12px; height: 16px; background: url(../img/ar_main.svg) no-repeat -5px -1026px; position: absolute; right: -12px; top: 50%; transform: translateY(-50%);}
.mailListVolume > span.toggle > a {background-position: -22px -1026px;}
.mailListStorageDate {width: 260px; justify-content: right; min-width: 260px; position: relative;}
.mailListStorageDate::before {content: ''; display: block; width: 1px; height: 12px; position: absolute; left: 32px; top: 50%; transform: translateY(-50%); background-color: #ddd;}
.mailListStorageDate > p {display: inline-flex; align-items: center; cursor: pointer; white-space: nowrap; color: #B0B0B0; font-weight: normal; font-size: 14px;}
.mailListStorageDate > p > span {color: #000; padding-right: 4px;}
.mailListReception {width: 170px; min-width: 170px; justify-content: right;}
.mailListReception > span {display: inline-flex; color: #000; font-size: 14px; font-weight: normal; align-items: center; position: relative;}
.mailListReception > span > i {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -368px -1044px; margin-right: 5px;}
.mailListReception > span > a {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -139px -247px; position: absolute; right: -21px; top: 50%; transform: translateY(-50%);}
.mailListCancel {width: 150px; min-width: 150px; justify-content: right;}
.mailListCancel > a {display: inline-block; font-weight: 500; font-size: 14px; position: relative; color: #666;}
.mailListCancel > a.cancelDeliveryStatus {padding-left: 16px}
.mailListCancel > a.recompose-undo-send {padding-right: 9.5px; color: #666;}
.mailListCancel > a.recompose-undo-send::after {content: ''; display:block; position:absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 11px; background-color: #e4e4e5}
.mailListCancel > a.confirm-undo-send {padding-left: 9.5px; color: var(--error-color);}
.mailListCancel > a.modify-mail {padding-right: 9.5px; color: #666;}
.mailListCancel > a.modify-mail::after {content: ''; display:block; position:absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 11px; background-color: #e4e4e5}
.mailListCancel > a.cancel-mail {padding-left: 9.5px; color: var(--error-color);}
.mailListCancel > a.cancelDeliveryStatus::before {position: absolute; content: ''; display: block; top: 50%; left: 0; transform: translateY(-50%); width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -147px -768px;}
.mailListOption {display: none !important; width: 230px; justify-content: right; min-width: 230px;}
.mailListOption > a {display: inline-block; width: 16px; height: 16px;}
.mailListOption > a.mailListReNotice {background: url(../img/ar_main.svg) no-repeat -117px -378px;}
.mailListOption > a.mailListTrash {background: url(../img/ar_main.svg) no-repeat -161px -378px; margin-left: 12px;}

.mailListAttachFile {padding-left: 241px;}
.mailListAttachFile > a.mailAttachItem {display: flex; align-items: center; border: 1px solid #DBE0E5; color: #84878B; font-size: 14px; padding: 4px 12px; max-width: 156px; border-radius: 15px; flex-wrap: nowrap; margin-right: 8px; box-sizing: border-box; background-color: #fff;}
.mailListAttachFile > a.mailAttachItem:hover {border-color: #CED0D8; background-color: #F1F5FF;}
.mailListAttachFile > a.mailAttachItem > span {display: inline-block; width: 15px; height: 15px; margin-right: 6px; min-width: 15px;}
.mailListAttachFile > a.mailAttachItem > p {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mailListAttachFile > span.moreItem {display: inline-block; font-size: 15px; color: #000;}

.mailListAttachFile span.folder{background: url("../img/file/svg/file_folder.svg");}/* 폴더 */
.mailListAttachFile span.ai{background-image: url("../img/file/svg/file_ext_ai.svg");}/* 일러스트 */
.mailListAttachFile span.doc{background-image: url("../img/file/svg/file_ext_doc.svg");}/* 문서 */
.mailListAttachFile span.etc{background-image: url("../img/file/svg/file_ext_etc.svg");}/* 기타 */
.mailListAttachFile span.exe{background-image: url("../img/file/svg/file_ext_exe.svg");}/* 설치파일 */
.mailListAttachFile span.fla{background-image: url("../img/file/svg/file_ext_fla.svg");}/* 플래시 */
.mailListAttachFile span.gul{background-image: url("../img/file/svg/file_ext_gul.svg");}/* gul? */
.mailListAttachFile span.htm{background-image: url("../img/file/svg/file_ext_htm.svg");}/* html */
.mailListAttachFile span.hwp{background-image: url("../img/file/svg/file_ext_hwp.svg");}/* 한글파일 */
.mailListAttachFile span.image{background-image: url("../img/file/svg/file_ext_img.svg");}/* 이미지 */
.mailListAttachFile span.mp3{background-image: url("../img/file/svg/file_ext_mp3.svg");}/* mp3 */
.mailListAttachFile span.mp4{background-image: url("../img/file/svg/file_ext_mp4.svg");}/* mp4 */
.mailListAttachFile span.pdf{background-image: url("../img/file/svg/file_ext_pdf.svg");}/* pdf */
.mailListAttachFile span.ppt{background-image: url("../img/file/svg/file_ext_ppt.svg");}/* ppt */
.mailListAttachFile span.psd{background-image: url("../img/file/svg/file_ext_psd.svg");}/* 포토샵 */
.mailListAttachFile span.txt{background-image: url("../img/file/svg/file_ext_txt.svg");}/* 텍스트 */
.mailListAttachFile span.xls{background-image: url("../img/file/svg/file_ext_xls.svg");}/* 엑셀 */
.mailListAttachFile span.zip{background-image: url("../img/file/svg/file_ext_zip.svg");}/* 압축파일 */

.mailListReserveDate {width: 240px; justify-content: left; min-width: 240px; padding: 0 6px 0 20px;}
.mailListReserveDate > span {display: inline-block; width: 22px; height: 22px; background: url(../img/ar_main.svg) no-repeat -124px -441px; min-width: 22px; margin-right: 6px;}
.mailListReserveDate > p {display: inline-block; font-size: 14px; color: var(--main-color); font-weight: 400;}
.mailListReserveContainer .mailListItem {cursor: pointer;}
.mailListReserveContainer .mailListOption > a {width: auto; height: auto; white-space: nowrap; font-size: 13px; font-weight: 400;}
.mailListReserveContainer .mailListOption > span {display: inline-block; width: 1px; height: 12px; background-color: #ddd; margin: 0 15px;}
.mailListReserveEdit {color: #666666;}
.mailListReserveCancel {color: var(--error-color);}
.mailListReserveContainer .mailListSender > a:hover {text-decoration: none !important;}
.mailListReserveContainer .mailListSender > a:hover::after {display: none !important;}
.mailListReserveContainer .mailListTitle > a:hover {text-decoration: none !important;}

.mailListItem:hover .mailListOption,
.mailListItem:hover .mailListTitleOption {display: flex !important;}
.mailListItem:hover .mailListTime,
.mailListItem:hover .mailListVolume,
.mailListItem:hover .mailListStorageDate {display: none !important;}
.mailListItem:hover .mailListImportant > a {display: inline-block;}

.mailListItem.readMail .mailListSender > a {font-weight: normal;}
.mailListItem.readMail .mailListTitle > a {font-weight: normal;}
.mailListItem.readMail .mailListTime > span {color: #878787;}
.mailListItem.readMail .mailListVolume > span {color: #878787;}

.mailListWrap.moreHeight .mailListItem > div:nth-of-type(2) {display: none;}
.mailListWrap.lessHeight .mailListItem > div:nth-of-type(2) {display: none;}
.mailListWrap.lessHeight .mailListItem > div > div {height: 30px;}

.mailListPaginator {height: 50px; box-sizing: border-box;}

.mailListContainer.mailScrollY .mailListItem > div {padding-right: 6px;}
.mailListContainer.mailScrollY .mailListHeadWrap .mailListItem > div {padding-right: 14px;}

.bin_cont .mailListOption {width: 490px; min-width: 490px;}

.approval_cont .mailListWrap {height: calc(100% - 36px)}
.approval_cont .mailListSender {padding-left: 10px;}
.approval_cont .mailListTime {width: 150px; min-width: 150px;}
.approval_cont .mailListHeadWrap .mailListTime > span {color: #666; font-size: 14px}
.approval_cont .mailListVolume {width: 150px; min-width: 150px;}
.approval_cont .mailListHeadWrap .mailListVolume > span {color: #666; font-size: 14px}
.approval_cont .mailListHeadWrap .mailListSender > a {color: #666;}
.approval_cont .mailListHeadWrap .mailListTitle > p {color: #666;}

.approval_cont .mailListContainer > div > div:not(.mailListWrap) > .mailListItem:hover {background-color: #fff;}
.approval_cont .mailListContainer > div > div > .mailListItem:hover .mailListTime,
.approval_cont .mailListContainer > div > div > .mailListItem:hover .mailListVolume {display: flex !important;}
.approval_cont .mailListContainer > div > div > .mailListItem:hover .mailListOption {display: none !important;}
.approval_cont .mailListHeadWrap .mailListItem:hover {background-color: #fff;}
.approval_cont .mailListHeadWrap .mailListItem:hover .mailListTime,
.approval_cont .mailListHeadWrap .mailListItem:hover .mailListVolume {display: flex !important;}
.approval_cont .mailListHeadWrap .mailListItem:hover .mailListOption {display: none !important;}

.reception_cont .mailListTime .reser_txt {padding-left: 8px}
.reception_cont .mailListItem:hover .mailListTime {display: flex !important;}
.reception_cont .mailListItem:hover .mailListOption {display: none !important;}
.reception_cont .mailListSender {width: 162px; min-width: 162px; padding-left: 8px;}
.reception_cont .mailListSender > span {display: inline-block; width: 14px; height: 14px; min-width: 14px; background: url(../img/ar_main.svg) no-repeat -110px -643px;}
.reception_cont .mailListTime {width: 150px; min-width: 150px;}
.reception_cont .mailListAttachFile {padding-left: 210px;}

.receptionBtnWrap {display: flex; align-items: center; justify-content: space-between; padding: 0px 14px 12px; border-bottom: 1px solid #E5E5E5; margin-bottom: 12px;}
.receptionBtnWrap > div {display: inline-flex; align-items: center;}
.receptionBtnWrap > div > p {font-size: 15px; color: #000; font-weight: bold; padding-right: 6px; white-space: nowrap;}
.receptionBtnWrap > div > p > span {color: var(--main-color);}
.receptionBtnWrap > div > span {display: inline-block; width: 14px; height: 14px; min-width: 14px; background: url(../img/ar_main.svg) no-repeat -109px -644px;}
.receptionBtnWrap > div > ul {display: inline-flex; align-items: center; padding-left: 10px;}
.receptionBtnWrap > div > ul > li {position: relative; padding: 0 12px;}
.receptionBtnWrap > div > ul > li::after {position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 12px; background-color: #E5E5E5; content: ''; display: block;}
.receptionBtnWrap > div > ul > li:first-child {padding-left: 0;}
.receptionBtnWrap > div > ul > li:last-child {padding-right: 0;}
.receptionBtnWrap > div > ul > li:last-child::after {display: none;}
.receptionBtnWrap > div > ul > li > a {font-size: 14px; color: #555; font-weight: normal; white-space: nowrap;}
.receptionBtnWrap > div > ul > li.selected > a {font-weight: bold; color: #000;}
.receptionBtnWrap > a {font-size: 14px; color: #000; display: inline-block; white-space: nowrap;}
.reception_cen .mailListBtn .searchBox {min-width: 280px; height: 28px; border-color: #ddd;}
.reception_cen .mailListBtn .searchBox.inFocus {border-color: var(--main-color);}

.reservation_cont .mailListItem:hover .mailListTime {display: flex !important;}
.reservation_cont .mailListItem:hover .mailListVolume {display: flex !important;}
.reservation_cont .mailListCancel > a {display: none;}
.reservation_cont .mailListItem:hover .mailListCancel > a {display: flex !important;}
.reservation_cont .mailListSender {width: 112px; min-width: 112px; padding-left: 8px;}
.reservation_cont .mailListTime {width: 150px; min-width: 150px;}
.reservation_cont .mailListAttachFile {padding-left: 414px;}

.mailNotification {width: 100%; height: 42px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; background-color: #F1F3F9 !important; padding: 0 14px; flex-wrap: nowrap; border-bottom: 1px solid #ddd; cursor: pointer;}
.mailNotification > div {font-size: 15px; display: flex; align-items: center;}
.mailNotification > div:nth-of-type(1) > span {display: flex; height: 22px; align-items: center; background-color: var(--main-color); color: #fff; border-radius: 4px; font-size: 13px; padding: 0 8px; letter-spacing: -0.5px; white-space: nowrap;}
.mailNotification > div:nth-of-type(1) > p {padding-left: 12px; color: #333; font-weight: bold; white-space: nowrap;}
.mailNotification > div:nth-of-type(2) > button {border: none;}
.mailNotification > div:nth-of-type(2) > button:nth-of-type(1) {color: #ABABAB; letter-spacing: -0.5px; white-space: nowrap;}
.mailNotification > div:nth-of-type(2) > button:nth-of-type(2) {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -7px -555px; margin-left: 10px;}


/* GROUP BY DATE */
.mailListWrap .infor_date { position: relative; width: 100%; height: 32px; overflow: hidden; background-color: #FAFAFA; cursor: pointer; display: flex; align-items: center; flex-wrap: nowrap;}
.mailListWrap .infor_date li { display: inline-block; zoom: 1; font-size: 15px; color: #373737; background: none;}
.mailListWrap .infor_date li.chk { width: 5px; padding: 0; height: 100%;}
.mailListWrap .infor_date li.date { width: auto; padding: 0; white-space: nowrap; font-weight: bold; display: flex; align-items: center;}
.mailListWrap .infor_date li.date em { width: 10px; height: 10px; display: inline-block; overflow: hidden; font-size: 0; margin: 0 10px 0 18px; }
.mailListWrap .infor_date li.date em.ic_fold { background-position: -319px -382px;}
.mailListWrap .infor_date.fold li.date em.ic_fold { background-position: -341px -381px; }
.mailListWrap .infor_date li.date a { display: inline-flex; *display: inline; zoom: 1; color: #000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 500px;}
.mailListWrap .infor_date li.date a > strong {padding: 0 5px;}
.mailListWrap .infor_date.fold { border-color: #e4e4e4;}

.mailListWrap .infor_name { position: relative; width: 100%; height: 32px; overflow: hidden; background-color: #fff; cursor: pointer; display: flex; align-items: center; flex-wrap: nowrap;}
.mailListWrap .infor_name:not(:first-of-type) {border-top: 1px solid #f4f4f4}
.mailListWrap .infor_name li { display: inline-block; zoom: 1; font-size: 14px; color: #373737; background: none;}
.mailListWrap .infor_name li.chk { width: 5px; padding: 0; height: 100%;}
.mailListWrap .infor_name li.inforName { width: auto; padding: 0; white-space: nowrap; font-weight: 700; display: flex; align-items: center;}
.mailListWrap .infor_name li.inforName em { width: 10px; height: 10px; display: inline-block; overflow: hidden; font-size: 0; margin: 0 10px 0 18px; }
.mailListWrap .infor_name li.inforName em.ic_fold { background-position: -319px -382px;}
.mailListWrap .infor_name.fold li.inforName em.ic_fold { background-position: -340px -382px; }
.mailListWrap .infor_name li.inforName a { display: inline-flex; *display: inline; zoom: 1; color: #000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 500px;}
.mailListWrap .infor_name li.inforName a > div {padding-left: 10px; font-size: 12px; color: #cacaca;}
.mailListWrap .infor_name li.inforName a > div > span {color: var(--main-color); font-weight: bold;}

.mailListBindingWrap {border-bottom: 1px solid #f4f4f4; }
.mailListBindingWrap > .mailListItem,
.mailListBindingWrap > .mailListItemMore {background-color: #fff;}
.mailListBindingWrap > .mailListItem {border-bottom: none;}
.mailListBindingWrap > .mailListItem:hover {background-color: #fbfcff;}
.mailListItemMore {width:100%; height: 36px; display: flex; align-items: center; justify-content: center;}
.mailListItemMore > button {display: inline-flex; flex-wrap: nowrap; align-items: center; justify-content: center; width: 100%; border: 0;}
.mailListItemMore > button > p {font-size: 14px; color: #000; font-weight: bold; letter-spacing: -0.5px;}
.mailListItemMore > button > span {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -108px -644px;}

.paginate_btnWrap {width: 180px; display: flex; justify-content: space-between; align-items: center;}
.paginate_btnWrap > button {all: unset; width: 85px; height: 20px; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; border: 1px solid #ccc; color: #ccc; letter-spacing: -0.5px; box-sizing: border-box; line-height: 20px;}
.paginate_btnWrap > button.on {border: 1px solid #ccc; color: #000; cursor: pointer;}
.paginate_btnWrap > button > p {position: relative; top: 1px;}
.paginate_btnWrap > button > span {display: inline-block; width: 15px; height: 20px; background-image: url(../img/ar_main.svg); background-repeat: no-repeat;}
.paginatePrev > span {background-position: -44px -641px;}
.paginatePrev.on > span {background-position: -66px -641px;}
.paginateNext > span {background-position: -87px -641px;}
.paginateNext.on > span {background-position: -109px -641px;}

.mailListItem + .infor_date,
.mailListItem + .infor_name {border-top: none !important}


/* 목록 글자 크기 */
/* 작게 -> .fontSmaller / 크게 -> .fontBigger */

.mailListWrap.fontSmaller .mailListSender > a,
.mailListWrap.fontSmaller .mailListTitle > a,
.mailListWrap.fontSmaller .mailListTime > span,
.mailListWrap.fontSmaller .mailListVolume > span,
.mailListWrap.fontSmaller .mailListAttachFile > a.mailAttachItem,
.mailListWrap.fontSmaller .mailListAttachFile > span.moreItem,
.mailListWrap.fontSmaller .mailListReserveDate > p,
.mailListWrap.fontSmaller .mailListReception > span,
.mailListWrap.fontSmaller .mailListCancel > a,
.mailListWrap.fontSmaller .mailListStorageDate > p {font-size: 13px;}
.mailListWrap.fontSmaller .mailListLabel > a.mailListLabelItem,
.mailListWrap.fontSmaller .mailListSort {font-size: 11px;}

.mailListWrap.fontBigger .mailListSender > a,
.mailListWrap.fontBigger .mailListTitle > a,
.mailListWrap.fontBigger .mailListAttachFile > span.moreItem,
.mailListWrap.fontBigger .mailListTime > span,
.mailListWrap.fontBigger .mailListVolume > span,
.mailListWrap.fontBigger .mailListReserveDate > p,
.mailListWrap.fontBigger .mailListReception > span,
.mailListWrap.fontBigger .mailListCancel > a {font-size: 17px;}
.mailListWrap.fontBigger .mailListAttachFile > a.mailAttachItem {font-size: 16px;}
.mailListWrap.fontBigger .mailListLabel > a.mailListLabelItem,
.mailListWrap.fontBigger .mailListSort,
.mailListWrap.fontBigger .mailListStorageDate > p {font-size: 15px;}
/* 환경설정 목록 폰트 사이즈 preview */
.setfont_preview.fontSmaller span.list-font-preview {font-size: 13px;}
.setfont_preview.fontBigger span.list-font-preview {font-size: 17px;}

/* 좌우분할 */
#cont_flex_area.list_horizontal {display: flex; flex-wrap: nowrap; overflow: hidden;}
#cont_flex_area.list_horizontal > div:not(.layerPopup, .dh_layer) {width: 50%;}
#cont_flex_area.list_horizontal > div.mailListContainer {border-right: 1px solid rgba(0,0,0,0.05); z-index: -1;}
#cont_flex_area.list_horizontal .mailListWrap {overflow-x: hidden;}
#cont_flex_area.list_horizontal .mailListTitle {min-width: 0;}
#cont_flex_area.list_horizontal .mailListItem {width: 100%; overflow: hidden;}
#cont_flex_area.list_horizontal .mailListContentContainer {overflow-x: auto; overflow-y: hidden; box-shadow: -2px 0px 5px rgba(0,0,0,0.15);}
#cont_flex_area.list_horizontal .mailListVolume {display: none;}
#cont_flex_area.list_horizontal .mailListTime {width: 130px; min-width: 130px;}
#cont_flex_area.list_horizontal .mailListOption {width: 100px; min-width: 100px;}
#cont_flex_area.list_horizontal .mailListSender {width: 90px; min-width: 90px;}
#cont_flex_area.list_horizontal .mailListAttachFile {padding-left: 220px; overflow: hidden;}
#cont_flex_area.list_horizontal .mailListAttachFile > a.mailAttachItem {min-width: 40px;}

/* 상하분할 */
#cont_flex_area.list_vertical {display: flex; flex-wrap: wrap; overflow-y: hidden;}
#cont_flex_area.list_vertical > div:not(.layerPopup, .dh_layer) {height: 50%;}
#cont_flex_area.list_vertical > div.mailListContainer {border-bottom: 1px solid rgba(0,0,0,0.05);display: flex;flex-wrap: wrap;width: 100%; z-index: -1;}
#cont_flex_area.list_vertical .mailListContentContainer {box-shadow: 0 -2px 5px rgba(0,0,0,0.15);}

/* 좌우, 상하 공통 */
.mailListContentContainer {display: flex; flex-direction: column; width: 100%;}
.mailListContentContainer .mailListBtn {display: flex; justify-content: space-between; align-items: center; padding: 0 14px; height: 50px; z-index: 10;}
.mailListContentContainer .mailListBtn .buttonSet {padding-left: 0; height: 50px; display: flex; align-items: center;}
.mailListContentContainer .divContent {height: calc(100% - 50px);}
.mailListContentContainer .divisionClose {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -7px -555px;}
.mailListContentContainer .mailListBtn > div {width: 100%;justify-content: space-between;display: flex;align-items: center;}

.mailListContentEmpty {width: 100%; height: 100%; display: flex; justify-content: center;}
.mailListContentEmpty > div {padding-top: 100px; text-align: center;}
.mailListContentEmpty > div > h1 {font-size: 18px; color: #000;}
.mailListContentEmpty > div > p {font-size: 14px; color: #969696; padding: 10px 0 25px; white-space: nowrap;}
.mailListContentEmpty > div > a {font-size: 13px; color: #555555; border: 1px solid #D1D1D1; background-color: #fff; padding: 2px 6px;}

#cont_flex_area.list_horizontal .mailListWrap.fontBigger .mailListTime {min-width: 134px;}

/* // New Mail List */


/* 문서함 */

.documentBoxContainer {display: flex; flex-direction: column;}
.documentBoxWrap {display: flex; flex-direction: column;}
.documentBoxSort {display: flex; padding: 0 14px; height: 46px; border-bottom: 1px solid #E5E5E5; align-items: center; cursor: pointer; justify-content: space-between; box-sizing: border-box;}
.documentBoxSort > div {display: inline-flex; align-items: center; height: 100%;}
.documentBoxSort > div > button {all: unset; display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -315px -380px; cursor: pointer;}
.documentBoxSort.toggle > div > button {background-position: -337px -379px;}
.documentBoxSort > div > p {font-size: 14px; color: #0f0f0f; font-weight: bold; display: inline-block; padding-left: 10px;}
.documentBoxSort > div > a {display: inline-flex; align-items: center; font-size: 14px; color: #000; font-weight: 400; height: 100%;}
.documentBoxSort > div > a > span {display: inline-block; width: 15px; height: 15px; background: url(../img/ar_main.svg) no-repeat -109px -644px; margin-left: 4px;}

.documentBoxBasicList {display: none; flex-direction: column; padding-bottom: 30px;}
.documentBoxBasicList .documentBoxItem {display: flex; align-items: center; height: 62px; box-sizing: border-box; border-bottom: 1px solid #F4F4F4;}
.documentBoxBasicList .documentBoxItem.selected {background-color: #F7F9FF;}
.documentBoxBasicList .documentBoxItem > div {display: flex; align-items: center; height: 100%;}
.documentBoxBasicList .documentBoxItem .boxItemCheck {width: 35px; min-width: 35px; padding-right: 6px; justify-content: flex-end;}
.documentBoxBasicList .documentBoxItem .boxItemImportant {width: 64px; min-width: 64px; justify-content: center;}
.documentBoxBasicList .documentBoxItem .boxItemImportant > a {display: inline-block; width: 15px; height: 15px; background: url(../img/ar_main.svg) no-repeat -7px -379px; opacity: 0;}
.documentBoxBasicList .documentBoxItem .boxItemImportant > a.on {background-position: -29px -379px; opacity: 1;}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail {width: 64px; min-width: 64px;}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail > div {display: inline-block; width: 46px; height: 46px; background-image: url(../img/ar_main.png); background-repeat: no-repeat; background-size: cover; border: 1px solid #E4E6E9; box-sizing: border-box; position: relative;}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type > div {background-image: none;}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type > div::before {position: absolute; content: ''; display: block; width: 25px; height: 30px; background-position: center; background-size: cover; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.ai > div::before{background-image: url("../img/file/svg/file_ext_ai.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.doc > div::before{background-image: url("../img/file/svg/file_ext_doc.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.etc > div::before{background-image: url("../img/file/svg/file_ext_etc.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.exe > div::before{background-image: url("../img/file/svg/file_ext_exe.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.fla > div::before{background-image: url("../img/file/svg/file_ext_fla.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.gul > div::before{background-image: url("../img/file/svg/file_ext_gul.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.htm > div::before{background-image: url("../img/file/svg/file_ext_htm.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.hwp > div::before{background-image: url("../img/file/svg/file_ext_hwp.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.image > div::before{background-image: url("../img/file/svg/file_ext_img.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.mp3 > div::before{background-image: url("../img/file/svg/file_ext_mp3.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.mp4 > div::before{background-image: url("../img/file/svg/file_ext_mp4.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.pdf > div::before{background-image: url("../img/file/svg/file_ext_pdf.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.ppt > div::before{background-image: url("../img/file/svg/file_ext_ppt.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.psd > div::before{background-image: url("../img/file/svg/file_ext_psd.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.txt > div::before{background-image: url("../img/file/svg/file_ext_txt.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.xls > div::before{background-image: url("../img/file/svg/file_ext_xls.svg");}
.documentBoxBasicList .documentBoxItem .boxItemThumbnail.type.zip > div::before{background-image: url("../img/file/svg/file_ext_zip.svg");}

.documentBoxBasicList .documentBoxItem .boxItemTitle {min-width: 200px; flex-direction: column; justify-content: center; align-items: flex-start; width: calc(100% - 436px); overflow: hidden;}
.documentBoxBasicList .documentBoxItem .boxItemTitle > div {font-size: 16px; font-weight: 400; color: #000; display: inline-flex; align-items: center; overflow: hidden; max-width: 100%;}
.documentBoxBasicList .documentBoxItem .boxItemTitle > div > p {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.documentBoxBasicList .documentBoxItem .boxItemTitle > div > span {flex: 1;}
.documentBoxBasicList .documentBoxItem .boxItemTitle > p {font-size: 14px; font-weight: 400; color: #ababab; margin-top: 2px; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.documentBoxBasicList .documentBoxItem .boxItemTime {width: 130px; min-width: 130px; justify-content: flex-end;}
.documentBoxBasicList .documentBoxItem .boxItemTime > span {font-size: 12px; color: #878787; font-weight: 400;}
.documentBoxBasicList .documentBoxItem .boxItemVolume {width: 118px; min-width: 118px; justify-content: flex-end;}
.documentBoxBasicList .documentBoxItem .boxItemVolume > span {font-size: 12px; color: #878787; font-weight: 400;}
.documentBoxBasicList .documentBoxItem .boxItemOptions {width: 248px; min-width: 248px; justify-content: flex-end; display: none;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a {display: inline-block; width: 16px; height: 16px; margin: 0 10px; background: url(../img/ar_main.svg) no-repeat; position: relative;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a:first-child {margin-left: 0;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a:last-child {margin-right: 0;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a::after {display: block; content: ''; position: absolute; right: -11px; top: 50%; transform: translateY(-50%); width: 1px; height: 12px; background-color: #ddd; pointer-events: none;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a:last-child::after {display: none;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a.readMail {background-position: -258px -420px;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a.writeMail {background-position: -221px -2207px;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a.fileDownload {background-position: -285px -2207px;}
.documentBoxBasicList .documentBoxItem .boxItemOptions > a.saveDrive {background-position: -349px -2207px;}
.documentBoxBasicList .documentBoxItem:hover {background-color: #F7F9FF;}
.documentBoxBasicList .documentBoxItem:hover .boxItemImportant > a {opacity: 1;}
.documentBoxBasicList .documentBoxItem:hover .boxItemTime,
.documentBoxBasicList .documentBoxItem:hover .boxItemVolume {display: none;}
.documentBoxBasicList .documentBoxItem:hover .boxItemOptions {display: flex;}

.documentBoxThumbList {display: flex; padding: 34px 34px 7px; flex-wrap: wrap;}
.documentBoxThumbList .documentBoxItem {display: inline-flex; flex-direction: column; width: 180px; height: 212px; box-sizing: border-box; border: 1px solid #E4E6E9; transition: 0.2s; min-width: 180px; margin: 0 12px 28px 0;}
.documentBoxThumbList .documentBoxItem.selected {border-color: var(--main-color);}
.documentBoxThumbList .documentBoxItem.selected .itemThumb {background-color: #869fff33;}
.documentBoxThumbList .itemThumb {display: flex; flex-direction: column; height: calc(100% - 44px); justify-content: space-between; background-image: url(../img/ar_main.png); background-repeat: no-repeat; background-size: cover; transition: 0.4s ease; background-color: #FAFBFE; position: relative;}
.documentBoxThumbList .itemThumb > .itemStatus {padding: 9px; display: flex; background-color: transparent; align-items: center; justify-content: space-between;}
.documentBoxThumbList .itemThumb > .itemStatus > input {width: 20px; height: 20px; opacity: 0; transition: opacity 0.2s;}
.documentBoxThumbList .itemThumb > .itemStatus > input:checked {opacity: 1;}
.documentBoxThumbList .itemThumb > .itemStatus > button {all: unset; display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -7px -379px; cursor: pointer; opacity: 0; transition: opacity 0.2s;}
.documentBoxThumbList .itemThumb > .itemStatus > button.on {background-position: -29px -379px; opacity: 1;}
.documentBoxThumbList .itemThumb > .itemOptions {display: flex; align-items: center; justify-content: center; height: 44px; background-color: #fff; opacity: 0; transition: opacity 0.4s ease;}
.documentBoxThumbList .itemThumb > .itemOptions > div {display: inline-flex; align-items: center; justify-content: center;}
.documentBoxThumbList .itemThumb > .itemOptions > div > a {display: inline-block; width: 26px; height: 26px; margin-right: 13px; background: url(../img/ar_main.svg) no-repeat; border-radius: 3px;}
.documentBoxThumbList .itemThumb > .itemOptions > div > a:last-child {margin-right: 0;}
.documentBoxThumbList .itemThumb > .itemOptions > div > a:hover {background-color: #F2F3F4;}
.documentBoxThumbList .itemThumb > .itemOptions > div > a.readMail {background-position: -14px -2201px;}
.documentBoxThumbList .itemThumb > .itemOptions > div > a.writeMail {background-position: -52px -2201px;}
.documentBoxThumbList .itemThumb > .itemOptions > div > a.fileDownload {background-position: -89px -2201px;}
.documentBoxThumbList .itemThumb > .itemOptions > div > a.saveDrive {background-position: -128px -2201px;}
.documentBoxThumbList .itemThumb.type {background-image: none;}
.documentBoxThumbList .itemThumb.type::before {content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 42px; height: 50px; background-image: url(../img/ar_main.svg); background-repeat: no-repeat;}
.documentBoxThumbList .itemThumb.type.ai::before {background-position: -122px -967px;}
.documentBoxThumbList .itemThumb.type.doc::before {background-position: -278px -967px;}
.documentBoxThumbList .itemThumb.type.etc::before {background-position: -694px -967px;}
.documentBoxThumbList .itemThumb.type.exe::before {background-position: -746px -903px;}
.documentBoxThumbList .itemThumb.type.fla::before {background-position: -174px -967px;}
.documentBoxThumbList .itemThumb.type.gul::before {background-position: -486px -967px;}
.documentBoxThumbList .itemThumb.type.htm::before {background-position: -694px -903px;}
.documentBoxThumbList .itemThumb.type.hwp::before {background-position: -538px -967px;}
.documentBoxThumbList .itemThumb.type.image::before {background-position: -434px -967px;}
.documentBoxThumbList .itemThumb.type.mp3::before {background-position: -642px -903px;}
.documentBoxThumbList .itemThumb.type.mp4::before {background-position: -590px -903px;}
.documentBoxThumbList .itemThumb.type.pdf::before {background-position: -226px -967px;}
.documentBoxThumbList .itemThumb.type.ppt::before {background-position: -330px -967px;}
.documentBoxThumbList .itemThumb.type.psd::before {background-position: -70px -967px;}
.documentBoxThumbList .itemThumb.type.txt::before {background-position: -642px -967px;}
.documentBoxThumbList .itemThumb.type.xls::before {background-position: -382px -967px;}
.documentBoxThumbList .itemThumb.type.zip::before {background-position: -590px -967px;}

.documentBoxThumbList .itemTitle {display: flex; flex-direction: column; box-sizing: border-box; height: 44px; background-color: #fff; border-top: 1px solid #E5E5E5; padding: 7px 9px 4px; justify-content: space-between;}
.documentBoxThumbList .itemTitle > div {font-size: 14px; color: #000; font-weight: 500; overflow: hidden; display: flex; align-items: center; flex-wrap: nowrap;}
.documentBoxThumbList .itemTitle > div > p {display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.documentBoxThumbList .itemTitle > div > span {display: inline-block; flex: 1;}
.documentBoxThumbList .itemTitle > p {font-size: 12px; font-weight: 500; color: #ababab;}

.documentBoxThumbList .documentBoxItem:hover {border-color: var(--main-color);}
.documentBoxThumbList .documentBoxItem:hover .itemThumb {background-color: #869fff33;}
.documentBoxThumbList .documentBoxItem:hover .itemThumb > .itemStatus > input,
.documentBoxThumbList .documentBoxItem:hover .itemThumb > .itemStatus > button {opacity: 1;}
.documentBoxThumbList .documentBoxItem:hover .itemThumb > .itemOptions {opacity: 1;}

.documentBoxContainer.listView .documentBoxBasicList {display: flex;}
.documentBoxContainer.listView .documentBoxThumbList {display: none;}

.documentBoxContainer.notSorting .documentBoxSort {display: none;}

/* // 문서함 */


/* 문서함 목록설정 레이어 */

.documentBoxBalloonPopup {min-width: 252px; max-width: 252px;}
.documentBoxBalloonPopup .balloonContent .balloonSection input {margin-right: 6px;}
.documentBoxBalloonPopup .balloonContent .balloonSection > div > div {min-width: 40%;}

/* // 문서함 목록설정 레이어 */


/* 문서함 상세 레이어 */

.documentBoxDetailSearch .detailSearch_cont:not(.addCont) > div:not(:nth-child(2), :nth-child(4), :nth-child(5)) > select {width: 110px !important; background-position: 92px 50% !important;}
.documentBoxDetailSearch .detailSearch_cont:not(.addCont) > div:nth-of-type(3) > input[type=text] {width: 160px !important;}
.documentBoxDetailSearch .addCont {position: relative;} 
.documentBoxDetailSearch .addCont::before {position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: calc(100% - 36px); height: 1px; background-color: #F4F4F4; content: ''; display: block;}
.documentBoxDetailSearch .addCont > div > label {width: 80px !important;}
.documentBoxDetailSearch .addCont > div > select {width: 266px !important; background-position: 248px 50% !important; margin-right: 0 !important;}

/* // 문서함 상세 레이어 */


/* default 컬러 */
#wrap.themeColor_96bffd #header {background-color: var(--color-96bffd);}
#wrap.themeColor_10bc83 #header {background-color: var(--color-10bc83);}
#wrap.themeColor_ffc000 #header {background-color: var(--color-ffc000);}
#wrap.themeColor_e5410e #header {background-color: var(--color-e5410e);}
#wrap.themeColor_484b52 #header {background-color: var(--color-484b52);}

/* 지정 컬러 */
#wrap.themeColor_eb8a9f #header {background-color: var(--color-eb8a9f);}
#wrap.themeColor_f35055 #header {background-color: var(--color-f35055);}
#wrap.themeColor_a02031 #header {background-color: var(--color-a02031);}

#wrap.themeColor_ff9c71 #header {background-color: var(--color-ff9c71);}
#wrap.themeColor_f87331 #header {background-color: var(--color-f87331);}
#wrap.themeColor_be5233 #header {background-color: var(--color-be5233);}

#wrap.themeColor_eab01c #header {background-color: var(--color-eab01c);}
#wrap.themeColor_ce920b #header {background-color: var(--color-ce920b);}
#wrap.themeColor_9f766a #header {background-color: var(--color-9f766a);}

#wrap.themeColor_83b730 #header {background-color: var(--color-83b730);}
#wrap.themeColor_35a23a #header {background-color: var(--color-35a23a);}
#wrap.themeColor_007135 #header {background-color: var(--color-007135);}

#wrap.themeColor_42aedc #header {background-color: var(--color-42aedc);}
#wrap.themeColor_4984d9 #header {background-color: var(--color-4984d9);}
#wrap.themeColor_14479e #header {background-color: var(--color-14479e);}

#wrap.themeColor_9b65d9 #header {background-color: var(--color-9b65d9);}
#wrap.themeColor_744dc8 #header {background-color: var(--color-744dc8);}
#wrap.themeColor_5830b3 #header {background-color: var(--color-5830b3);}

#wrap.themeColor_adadad #header {background-color: var(--color-adadad);}
#wrap.themeColor_333333 #header {background-color: var(--color-333333);}
#wrap.themeColor_111111 #header {background-color: var(--color-111111);}

#wrap.themeColor_111111 .gnb_area .gnb_list_box ul li.on:before {background-color: #fff; opacity: 0.18;}


#wrap.themeColor_gradient01 #header {background-image: linear-gradient(to right, #c2e9fb, #93b4f5);}
#wrap.themeColor_gradient02 #header {background-image: linear-gradient(to right, #9ee9ec, #daa3f3);}
#wrap.themeColor_gradient03 #header {background-image: linear-gradient(to right, #f4d9fe, #ff81aa);}
#wrap.themeColor_gradient04 #header {background-image: linear-gradient(to right, #ffd5d4, #ffa3c2);}
#wrap.themeColor_gradient05 #header {background-image: linear-gradient(to right, #f5d5e3, #ecb231);}
#wrap.themeColor_gradient06 #header {background-image: linear-gradient(to right, #9de4f5, #eec0c6);}
#wrap.themeColor_gradient07 #header {background-image: linear-gradient(to right, #beeaac, #859fe3);}
#wrap.themeColor_gradient08 #header {background-image: linear-gradient(to right, #99c99c, #dcb0ed);}
#wrap.themeColor_gradient09 #header {background-image: linear-gradient(to right, #fbc2eb, #a18cd1);}
#wrap.themeColor_gradient10 #header {background-image: linear-gradient(to right, #f69b7e, #df335d);}
#wrap.themeColor_gradient11 #header {background-image: linear-gradient(to right, #f8e07a, #88e3c4);}
#wrap.themeColor_gradient12 #header {background-image: linear-gradient(to right, #c1e372, #77d884);}
#wrap.themeColor_gradient13 #header {background-image: linear-gradient(to right, #4ecbc7, #105578);}
#wrap.themeColor_gradient14 #header {background-image: linear-gradient(to right, #178e65, #095867);}
#wrap.themeColor_gradient15 #header {background-image: linear-gradient(to right, #006fa2, #1b4060);}
#wrap.themeColor_gradient16 #header {background-image: linear-gradient(to right, #4b86b5, #243949);}
#wrap.themeColor_gradient17 #header {background-image: linear-gradient(to right, #5c5860, #20348c);}
#wrap.themeColor_gradient18 #header {background-image: linear-gradient(to right, #611f69, #0a3f32);}
#wrap.themeColor_gradient19 #header {background-image: linear-gradient(to right, #5fd1bc, #912fa8);}
#wrap.themeColor_gradient20 #header {background-image: linear-gradient(to right, #56a6e8, #842570);}
#wrap.themeColor_gradient21 #header {background-image: linear-gradient(to right, #c6c6c0, #898b82);}
#wrap.themeColor_gradient22 #header {background-image: linear-gradient(to right, #92b9a7, #583d53);}
#wrap.themeColor_gradient23 #header {background-image: linear-gradient(to right, #608113, #654317);}
#wrap.themeColor_gradient24 #header {background-image: linear-gradient(to right, #dbc872, #2f4809);}
#wrap.themeColor_gradient25 #header {background-image: linear-gradient(to right, #d9b055, #3677ff);}
#wrap.themeColor_gradient26 #header {background-image: linear-gradient(to right, #01a09f, #675de4);}
#wrap.themeColor_gradient27 #header {background-image: linear-gradient(to right, #55aea7, #7d78fc);}
#wrap.themeColor_gradient28 #header {background-image: linear-gradient(to right, #a671e2, #5369be);}
#wrap.themeColor_gradient29 #header {background-image: linear-gradient(to right, #d89955, #88388f);}
#wrap.themeColor_gradient30 #header {background-image: linear-gradient(to right, #fd694c, #935dc6);}

#wrap.themeColor_96bffd.dsg_left .gnb_area {background-color: var(--color-96bffd);}
#wrap.themeColor_10bc83.dsg_left .gnb_area {background-color: var(--color-10bc83);}
#wrap.themeColor_ffc000.dsg_left .gnb_area {background-color: var(--color-ffc000);}
#wrap.themeColor_e5410e.dsg_left .gnb_area {background-color: var(--color-e5410e);}
#wrap.themeColor_484b52.dsg_left .gnb_area {background-color: var(--color-484b52);}

/* 지정 컬러 */
#wrap.themeColor_eb8a9f.dsg_left .gnb_area {background-color: var(--color-eb8a9f);}
#wrap.themeColor_f35055.dsg_left .gnb_area {background-color: var(--color-f35055);}
#wrap.themeColor_a02031.dsg_left .gnb_area {background-color: var(--color-a02031);}

#wrap.themeColor_ff9c71.dsg_left .gnb_area {background-color: var(--color-ff9c71);}
#wrap.themeColor_f87331.dsg_left .gnb_area {background-color: var(--color-f87331);}
#wrap.themeColor_be5233.dsg_left .gnb_area {background-color: var(--color-be5233);}

#wrap.themeColor_eab01c.dsg_left .gnb_area {background-color: var(--color-eab01c);}
#wrap.themeColor_ce920b.dsg_left .gnb_area {background-color: var(--color-ce920b);}
#wrap.themeColor_9f766a.dsg_left .gnb_area {background-color: var(--color-9f766a);}

#wrap.themeColor_83b730.dsg_left .gnb_area {background-color: var(--color-83b730);}
#wrap.themeColor_35a23a.dsg_left .gnb_area {background-color: var(--color-35a23a);}
#wrap.themeColor_007135.dsg_left .gnb_area {background-color: var(--color-007135);}

#wrap.themeColor_42aedc.dsg_left .gnb_area {background-color: var(--color-42aedc);}
#wrap.themeColor_4984d9.dsg_left .gnb_area {background-color: var(--color-4984d9);}
#wrap.themeColor_14479e.dsg_left .gnb_area {background-color: var(--color-14479e);}

#wrap.themeColor_9b65d9.dsg_left .gnb_area {background-color: var(--color-9b65d9);}
#wrap.themeColor_744dc8.dsg_left .gnb_area {background-color: var(--color-744dc8);}
#wrap.themeColor_5830b3.dsg_left .gnb_area {background-color: var(--color-5830b3);}

#wrap.themeColor_adadad.dsg_left .gnb_area {background-color: var(--color-adadad);}
#wrap.themeColor_333333.dsg_left .gnb_area {background-color: var(--color-333333);}
#wrap.themeColor_111111.dsg_left .gnb_area {background-color: var(--color-111111);}

#wrap.themeColor_gradient01.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #c2e9fb, #93b4f5);}
#wrap.themeColor_gradient02.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #9ee9ec, #daa3f3);}
#wrap.themeColor_gradient03.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #f4d9fe, #ff81aa);}
#wrap.themeColor_gradient04.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #ffd5d4, #ffa3c2);}
#wrap.themeColor_gradient05.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #f5d5e3, #ecb231);}
#wrap.themeColor_gradient06.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #9de4f5, #eec0c6);}
#wrap.themeColor_gradient07.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #beeaac, #859fe3);}
#wrap.themeColor_gradient08.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #99c99c, #dcb0ed);}
#wrap.themeColor_gradient09.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #fbc2eb, #a18cd1);}
#wrap.themeColor_gradient10.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #f69b7e, #df335d);}
#wrap.themeColor_gradient11.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #f8e07a, #88e3c4);}
#wrap.themeColor_gradient12.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #c1e372, #77d884);}
#wrap.themeColor_gradient13.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #4ecbc7, #105578);}
#wrap.themeColor_gradient14.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #178e65, #095867);}
#wrap.themeColor_gradient15.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #006fa2, #1b4060);}
#wrap.themeColor_gradient16.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #4b86b5, #243949);}
#wrap.themeColor_gradient17.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #5c5860, #20348c);}
#wrap.themeColor_gradient18.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #611f69, #0a3f32);}
#wrap.themeColor_gradient19.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #5fd1bc, #912fa8);}
#wrap.themeColor_gradient20.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #56a6e8, #842570);}
#wrap.themeColor_gradient21.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #c6c6c0, #898b82);}
#wrap.themeColor_gradient22.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #92b9a7, #583d53);}
#wrap.themeColor_gradient23.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #608113, #654317);}
#wrap.themeColor_gradient24.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #dbc872, #2f4809);}
#wrap.themeColor_gradient25.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #d9b055, #3677ff);}
#wrap.themeColor_gradient26.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #01a09f, #675de4);}
#wrap.themeColor_gradient27.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #55aea7, #7d78fc);}
#wrap.themeColor_gradient28.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #a671e2, #5369be);}
#wrap.themeColor_gradient29.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #d89955, #88388f);}
#wrap.themeColor_gradient30.dsg_left .gnb_area {background-image: linear-gradient(to bottom, #fd694c, #935dc6);}

/* 사이드바 그레이 */

/* 메일 */
#wrap.themeSideGray #nav_snb {background-color: #f2f3f3;}
#wrap.themeSideGray .menubox_list ul li > div:hover {background-color: rgba(0,0,0,0.05);}
#wrap.themeSideGray .menubox_list ul li .btn_use {background-color: #fbfbfb;}
#wrap.themeSideGray .menu_scroll_area::-webkit-scrollbar-thumb {background-color: #d8d9d9;}
#wrap.themeSideGray .menu_scroll_area::-webkit-scrollbar-thumb:hover { background-color: #b5b5b5;}
#wrap.themeSideGray .menu_scroll_area::-webkit-scrollbar-thumb:active { background-color: #6b6b6b;}

/* 주소록 */
#wrap.themeSideGray .snb_tab ul li.slt {background-color: #f2f3f3;}
#wrap.themeSideGray .snb_tab ul li.slt a {border-bottom: 1px solid #f2f3f3;}
.ar_contact #wrap.themeSideGray .svc_menu_area::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.2);}
.ar_contact #wrap.themeSideGray .svc_menu_area::-webkit-scrollbar-thumb:hover { background-color: #6b6b6b;}
.ar_contact #wrap.themeSideGray .svc_menu_area::-webkit-scrollbar-thumb:active { background-color: #6b6b6b;}


/* 드라이브 */
#wrap.themeSideGray .capacity_info .graph {background-color: #fff;}
.ar_drive #wrap.themeSideGray .svc_menu_area::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.2);}
.ar_drive #wrap.themeSideGray .svc_menu_area::-webkit-scrollbar-thumb:hover { background-color: #6b6b6b;}
.ar_drive #wrap.themeSideGray .svc_menu_area::-webkit-scrollbar-thumb:active { background-color: #6b6b6b;}


/* 사이드바 블랙 */

/* 메일 */
.dsg_left.themeSideBlack #header h1 .ci > img.logoDefault {display: none;}
.dsg_left.themeSideBlack #header h1 .ci > img.logoWhite {display: inline-block;}
.dsg_left.themeSideBlack #header.h_mail .pwe_home {color: #fff}
#wrap.themeSideBlack .btn_workset a strong {background-color: #9A9CA0;}
#wrap.themeSideBlack #nav_snb {background-color: #525763;}
#wrap.themeSideBlack .snb_nav a {color: #CACACA}
#wrap.themeSideBlack .snb_nav .btn_workset a {color: #fff}
#wrap.themeSideBlack .snb_nav .btn_more {background-position: -685px -189px;}
#wrap.themeSideBlack .snb_nav .btn_more:hover {background-position: -707px -189px;}
#wrap.themeSideBlack .snb_nav .btn_setup {background-position: -597px -189px;}
#wrap.themeSideBlack .snb_nav .btn_setup:hover {background-position: -619px -189px;}
#wrap.themeSideBlack .snb_nav .btn_add {background-position: -641px -189px;}
#wrap.themeSideBlack .snb_nav .btn_add:hover {background-position: -663px -189px;}
#wrap.themeSideBlack .snb_nav .btn_clean {background-position: -729px -189px;}
#wrap.themeSideBlack .snb_nav .btn_clean:hover {background-position: -751px -189px;}
#wrap.themeSideBlack .section_typemail {border-bottom: 1px solid #41454f}
#wrap.themeSideBlack .section_typemail .important .icon {background-position: -3px -114px}
#wrap.themeSideBlack .section_typemail .important.click .icon {background-position: -124.5px -114px}
#wrap.themeSideBlack .section_typemail .attach .icon {background-position: -25px -114px;}
#wrap.themeSideBlack .section_typemail .attach.click .icon {background-position: -146px -114px}
#wrap.themeSideBlack .section_typemail .notice .icon {background-position: -180px -2275px;}
#wrap.themeSideBlack .section_typemail .notice.click .icon {background-position: -180px -2297px;}
#wrap.themeSideBlack .section_typemail .myselfTxt .icon {background-position: -206px -2275px;}
#wrap.themeSideBlack .section_typemail .myselfTxt.click .icon {background-position: -206px -2297px;}
#wrap.themeSideBlack .section_typemail .bookmark .icon {background-position: -231px -2275px;}
#wrap.themeSideBlack .section_typemail .bookmark.click .icon {background-position: -231px -2297px;}

#wrap.themeSideBlack .section_etcmail {border-top: 1px solid #464A54}
#wrap.themeSideBlack .snb_footer {border-top: 1px solid #464A54;}
#wrap.themeSideBlack .menubox_list ul li > div:hover {background-color: rgba(0,0,0,0.2);}
#wrap.themeSideBlack .menubox_list ul li .btn_use {background-color: #636873; border: 1px solid #454a55; color: #b4b6b9 !important}
#wrap.themeSideBlack .menubox_list ul li.click > div > span.menuitem_wrap > a.item_txt {color: var(--main-color)}
#wrap.themeSideBlack .menubox_title {color: #CACACA}

#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu1 .ico_mbox           { background-position: -2px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu1 .ico_mbox  { background-position: -2px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu2 .ico_mbox           { background-position: -24px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu2 .ico_mbox  { background-position: -24px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu3 .ico_mbox           { background-position: -111px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu3 .ico_mbox  { background-position: -111px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu4 .ico_mbox           { background-position: -46px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu4 .ico_mbox  { background-position: -46px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu5 .ico_mbox           { background-position: -133px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu5 .ico_mbox  { background-position: -133px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu6 .ico_mbox           { background-position: -156px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu6 .ico_mbox  { background-position: -156px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu7 .ico_mbox           { background-position: -68px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu7 .ico_mbox  { background-position: -68px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu8 .ico_mbox           { background-position: -177px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu8 .ico_mbox  { background-position: -177px -167px;}

#wrap.themeSideBlack .ico_mbox.bu9  { background-position: -199px -189px; }
#wrap.themeSideBlack .ico_mbox.bu10 { background-position: -177px -188px; }
#wrap.themeSideBlack .ico_mbox.bu11 { background-position: -177px -188px; }

#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu12 .ico_mbox          { background-position: -266px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu12 .ico_mbox { background-position: -266px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu13 .ico_mbox          { background-position: -287px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu13 .ico_mbox { background-position: -287px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu14 .ico_mbox          { background-position: -397px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu14 .ico_mbox { background-position: -397px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu23 .ico_mbox          { background-position: -395px -255px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu23 .ico_mbox { background-position: -395px -233px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu24 .ico_mbox          { background-position: -416px -255px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu24 .ico_mbox { background-position: -416px -233px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu15 .ico_mbox          { background-position: -419px -189px; }
#wrap.themeSideBlack .ico_mbox.bu14 { background-position: -397px -189px; }
#wrap.themeSideBlack .menubox_title.click .btn_fd_up .ico_mbox.bu14 {background-position: -397px -167px;}

#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu15 .ico_mbox { background-position: -419px -167px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu16 .ico_mbox          { background-position: -440px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu16 .ico_mbox { background-position: -440px -167px;}
#wrap.themeSideBlack .menubox_list .ico_blt.bu17                      { background-position: -310px -188px;}
#wrap.themeSideBlack .menubox_list li.click .ico_blt.bu17             { background-position: -310px -166px;}
#wrap.themeSideBlack .menubox_list .ico_blt.bu18                      { background-position: -332px -188px;}
#wrap.themeSideBlack .menubox_list li.click .ico_blt.bu18             { background-position: -332px -166px;}
#wrap.themeSideBlack .menubox_list .ico_blt.bu19                      { background-position: -354px -188px;}
#wrap.themeSideBlack .menubox_list li.click .ico_blt.bu19             { background-position: -354px -166px;}
#wrap.themeSideBlack .ico_mbox.bu20  { background-position: -222px -189px; }
#wrap.themeSideBlack .ico_mbox.bu21  { background-position: -243px -189px; }
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu22 .ico_mbox           { background-position: -91px -189px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu22 .ico_mbox  { background-position: -91px -167px;}
#wrap.themeSideBlack .ico_mbox.bu25 {background-position: -750px -211px;}
#wrap.themeSideBlack .menubox_list .menuitem_wrap.bu26 .ico_mbox          { background-position: -438px -254px; }
#wrap.themeSideBlack .menubox_list li.click .menuitem_wrap.bu26 .ico_mbox { background-position: -438px -232px;}
#wrap.themeSideBlack .section_mymail .ico_fold {background-position: -510px -192px;}
#wrap.themeSideBlack .snb_nav .foldup .ico_fold {background-position: -533px -192px;}
#wrap.themeSideBlack .menubox_list .spread_folder > div > .btn_folder {background-position: -510px -192px;}
#wrap.themeSideBlack .menubox_list .btn_folder {background-position: -533px -192px;}

#wrap.themeSideBlack .snb_footer {color: #cacaca}
#wrap.themeSideBlack .snb_footer em {color: #bbb}

#wrap.themeSideBlack .menu_scroll_area::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.2);}
#wrap.themeSideBlack .menu_scroll_area::-webkit-scrollbar-thumb:hover { background-color: #6b6b6b;}
#wrap.themeSideBlack .menu_scroll_area::-webkit-scrollbar-thumb:active { background-color: #e5e5e5;}

/* 주소록 */
#wrap.themeSideBlack .section_typemail .recent .icon {background-position: -146px -91px;}
#wrap.themeSideBlack .section_typemail .recent.click .icon {background-position: -168px -91px}
#wrap.themeSideBlack .snb_tab ul li {background-color: #494D57; border-left: 1px solid #42464F;}
#wrap.themeSideBlack .snb_tab ul li.slt {background-color: #525763;}
#wrap.themeSideBlack .snb_tab ul li a {border-bottom: 1px solid #464A54; }
#wrap.themeSideBlack .snb_tab ul li.slt a {border-bottom: 1px solid #525763;}
.ar_contact #wrap.themeSideBlack .svc_menu_area::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.2);}
.ar_contact #wrap.themeSideBlack .svc_menu_area::-webkit-scrollbar-thumb:hover { background-color: #6b6b6b;}
.ar_contact #wrap.themeSideBlack .svc_menu_area::-webkit-scrollbar-thumb:active { background-color: #e5e5e5;}

/* 드라이브 */
#wrap.themeSideBlack .section_typemail .star .icon {background-position: -3px -114px}
#wrap.themeSideBlack .section_typemail .star.click .icon {background-position: -124.5px -114px}
.ar_drive #wrap.themeSideBlack .svc_menu_area::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.2);}
.ar_drive #wrap.themeSideBlack .svc_menu_area::-webkit-scrollbar-thumb:hover { background-color: #6b6b6b;}
.ar_drive #wrap.themeSideBlack .svc_menu_area::-webkit-scrollbar-thumb:active { background-color: #e5e5e5;}
#wrap.themeSideBlack .capacity_info .graph {background-color: #404550;}

/* 사이드바 컬러별 */
#wrap.themeSide_96bffd #nav_snb {background-color: var(--color-96bffd);}
#wrap.themeSide_10bc83 #nav_snb {background-color: var(--color-10bc83);}
#wrap.themeSide_ffc000 #nav_snb {background-color: var(--color-ffc000);}
#wrap.themeSide_e5410e #nav_snb {background-color: var(--color-e5410e);}
#wrap.themeSide_484b52 #nav_snb {background-color: var(--color-484b52);}
#wrap.themeSide_eb8a9f #nav_snb {background-color: var(--color-eb8a9f);}
#wrap.themeSide_f35055 #nav_snb {background-color: var(--color-f35055);}
#wrap.themeSide_a02031 #nav_snb {background-color: var(--color-a02031);}
#wrap.themeSide_ff9c71 #nav_snb {background-color: var(--color-ff9c71);}
#wrap.themeSide_f87331 #nav_snb {background-color: var(--color-f87331);}
#wrap.themeSide_be5233 #nav_snb {background-color: var(--color-be5233);}
#wrap.themeSide_eab01c #nav_snb {background-color: var(--color-eab01c);}
#wrap.themeSide_ce920b #nav_snb {background-color: var(--color-ce920b);}
#wrap.themeSide_9f766a #nav_snb {background-color: var(--color-9f766a);}
#wrap.themeSide_83b730 #nav_snb {background-color: var(--color-83b730);}
#wrap.themeSide_35a23a #nav_snb {background-color: var(--color-35a23a);}
#wrap.themeSide_007135 #nav_snb {background-color: var(--color-007135);}
#wrap.themeSide_42aedc #nav_snb {background-color: var(--color-42aedc);}
#wrap.themeSide_4984d9 #nav_snb {background-color: var(--color-4984d9);}
#wrap.themeSide_14479e #nav_snb {background-color: var(--color-14479e);}
#wrap.themeSide_9b65d9 #nav_snb {background-color: var(--color-9b65d9);}
#wrap.themeSide_744dc8 #nav_snb {background-color: var(--color-744dc8);}
#wrap.themeSide_5830b3 #nav_snb {background-color: var(--color-5830b3);}
#wrap.themeSide_adadad #nav_snb {background-color: var(--color-adadad);}
#wrap.themeSide_333333 #nav_snb {background-color: var(--color-333333);}
#wrap.themeSide_111111 #nav_snb {background-color: var(--color-111111);}

#wrap.themeSide_gradient01 #nav_snb {background-image: linear-gradient(to bottom, #c2e9fb, #93b4f5);}
#wrap.themeSide_gradient02 #nav_snb {background-image: linear-gradient(to bottom, #9ee9ec, #daa3f3);}
#wrap.themeSide_gradient03 #nav_snb {background-image: linear-gradient(to bottom, #f4d9fe, #ff81aa);}
#wrap.themeSide_gradient04 #nav_snb {background-image: linear-gradient(to bottom, #ffd5d4, #ffa3c2);}
#wrap.themeSide_gradient05 #nav_snb {background-image: linear-gradient(to bottom, #f5d5e3, #ecb231);}
#wrap.themeSide_gradient06 #nav_snb {background-image: linear-gradient(to bottom, #9de4f5, #eec0c6);}
#wrap.themeSide_gradient07 #nav_snb {background-image: linear-gradient(to bottom, #beeaac, #859fe3);}
#wrap.themeSide_gradient08 #nav_snb {background-image: linear-gradient(to bottom, #99c99c, #dcb0ed);}
#wrap.themeSide_gradient09 #nav_snb {background-image: linear-gradient(to bottom, #fbc2eb, #a18cd1);}
#wrap.themeSide_gradient10 #nav_snb {background-image: linear-gradient(to bottom, #f69b7e, #df335d);}
#wrap.themeSide_gradient11 #nav_snb {background-image: linear-gradient(to bottom, #f8e07a, #88e3c4);}
#wrap.themeSide_gradient12 #nav_snb {background-image: linear-gradient(to bottom, #c1e372, #77d884);}
#wrap.themeSide_gradient13 #nav_snb {background-image: linear-gradient(to bottom, #4ecbc7, #105578);}
#wrap.themeSide_gradient14 #nav_snb {background-image: linear-gradient(to bottom, #178e65, #095867);}
#wrap.themeSide_gradient15 #nav_snb {background-image: linear-gradient(to bottom, #006fa2, #1b4060);}
#wrap.themeSide_gradient16 #nav_snb {background-image: linear-gradient(to bottom, #4b86b5, #243949);}
#wrap.themeSide_gradient17 #nav_snb {background-image: linear-gradient(to bottom, #5c5860, #20348c);}
#wrap.themeSide_gradient18 #nav_snb {background-image: linear-gradient(to bottom, #611f69, #0a3f32);}
#wrap.themeSide_gradient19 #nav_snb {background-image: linear-gradient(to bottom, #5fd1bc, #912fa8);}
#wrap.themeSide_gradient20 #nav_snb {background-image: linear-gradient(to bottom, #56a6e8, #842570);}
#wrap.themeSide_gradient21 #nav_snb {background-image: linear-gradient(to bottom, #c6c6c0, #898b82);}
#wrap.themeSide_gradient22 #nav_snb {background-image: linear-gradient(to bottom, #92b9a7, #583d53);}
#wrap.themeSide_gradient23 #nav_snb {background-image: linear-gradient(to bottom, #608113, #654317);}
#wrap.themeSide_gradient24 #nav_snb {background-image: linear-gradient(to bottom, #dbc872, #2f4809);}
#wrap.themeSide_gradient25 #nav_snb {background-image: linear-gradient(to bottom, #d9b055, #3677ff);}
#wrap.themeSide_gradient26 #nav_snb {background-image: linear-gradient(to bottom, #01a09f, #675de4);}
#wrap.themeSide_gradient27 #nav_snb {background-image: linear-gradient(to bottom, #55aea7, #7d78fc);}
#wrap.themeSide_gradient28 #nav_snb {background-image: linear-gradient(to bottom, #a671e2, #5369be);}
#wrap.themeSide_gradient29 #nav_snb {background-image: linear-gradient(to bottom, #d89955, #88388f);}
#wrap.themeSide_gradient30 #nav_snb {background-image: linear-gradient(to bottom, #fd694c, #935dc6);}

/* 사이드바 화이트 투명도 */
#wrap.themeSideBlackOpacity #nav_snb,
#wrap.themeSideWhiteOpacity #nav_snb {border-right-color: rgba(0, 0, 0, 0.1);}

body:not(.ar_calendar) #wrap.themeSideBlackOpacity #nav_snb > div > *,
body:not(.ar_calendar) #wrap.themeSideWhiteOpacity #nav_snb > div > * {background-color: rgba(255, 255, 255, 0.2);}

.ar_calendar #wrap.themeSideBlackOpacity #nav_snb > *,
.ar_calendar #wrap.themeSideWhiteOpacity #nav_snb > * {background-color: rgba(255, 255, 255, 0.2);}

#wrap.themeSideWhiteOpacity .btn_workset a strong {background-color: rgba(255, 255, 255, 0.3);}

#wrap.themeSideWhiteOpacity .snb_nav a,
#wrap.themeSideWhiteOpacity #header.h_mail .pwe_home,
#wrap.themeSideWhiteOpacity .treeTopWrap > ul > li > button,
#wrap.themeSideWhiteOpacity .snb_footer,
#wrap.themeSideWhiteOpacity .snb_footer em,
#wrap.themeSideWhiteOpacity .treeTopWrap > ul > li.click > a > div > p:not(.beanVolume),
#wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > ul > li.click > a > div > p:not(.beanVolume),
#wrap.themeSideWhiteOpacity .treeChild > li.click > a > div > p,
#wrap.themeSideWhiteOpacity .section_typemail a.unread .cnt,
#wrap.themeSideWhiteOpacity .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeTotalNum,
#wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeTotalNum,
#wrap.themeSideWhiteOpacity .snb_footer strong,
#wrap.themeSideWhiteOpacity .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeTotalNum,
#wrap.themeSideWhiteOpacity .beanVolume,
#wrap.themeSideWhiteOpacity .capacity_info .text strong,
#wrap.themeSideWhiteOpacity .sideDatePicker .ui-datepicker th.ui-datepicker-week-end:first-child,
#wrap.themeSideWhiteOpacity .sideDatePicker .ui-datepicker th {color: #fff;}

#wrap.themeSideWhiteOpacity .section_typemail,
#wrap.themeSideWhiteOpacity .treeTopWrap,
#wrap.themeSideWhiteOpacity .snb_footer,
.ar_contact #wrap.themeSideWhiteOpacity .treeTopWrap > ul.treeFixMenuWrap,
.ar_drive #wrap.themeSideWhiteOpacity .treeTopWrap > div:nth-of-type(3),
.ar_calendar #wrap.themeSideWhiteOpacity .treeTopWrap > ul.treeFixMenuWrap,
.ar_calendar #wrap.themeSideWhiteOpacity .treeSelectableMenuContainer + .treeSelectableMenuContainer,
.ar_board #wrap.themeSideWhiteOpacity .treeSelectableMenuContainer + .treeSelectableMenuContainer,
.ar_board #wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > div > ul,
.ar_board #wrap.themeSideWhiteOpacity .treeTopWrap > ul.treeFixMenuWrap,
#wrap.themeSideWhiteOpacity .sideDatePickerWrap {border-color: rgba(255, 255, 255, 0.15);}

#wrap.themeSideWhiteOpacity .section_typemail a .icon,
#wrap.themeSideWhiteOpacity .treeTopWrap > ul > li > a > div:nth-child(1) > span:nth-of-type(1),
#wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span:nth-of-type(1),
#wrap.themeSideWhiteOpacity .treeTopWrap > ul > li > a > div:nth-child(2) > button,
#wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button:not(.treeQuickBtn),
#wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > i,
#wrap.themeSideWhiteOpacity .treeChild > li > a > div:nth-child(1) > i,
#wrap.themeSideWhiteOpacity .treeChild > li > a > div:nth-child(1) > span:not(.treeIcon_label):nth-of-type(1),
#wrap.themeSideWhiteOpacity .treeDepthMore > li > a > div > p,
#wrap.themeSideWhiteOpacity .treeChild > li > a > div:nth-child(2) > button,
#wrap.themeSideWhiteOpacity .treeBottomWrap > ul > li > a > div:nth-child(1) > span:nth-of-type(1),
#wrap.themeSideWhiteOpacity .treeTopWrap > ul > li > button > span,
.ar_drive #wrap.themeSideWhiteOpacity .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span:nth-of-type(1),
.ar_drive #wrap.themeSideWhiteOpacity .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > i,
.ar_drive #wrap.themeSideWhiteOpacity .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button,
.ar_calendar #wrap.themeSideWhiteOpacity .treeChild > li > a > div:nth-child(1) > span:not(.treeIcon_label),
.ar_calendar #wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button,
.ar_calendar #wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span,
.ar_calendar #wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i,
.ar_board #wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i,
.ar_board #wrap.themeSideWhiteOpacity .treeChild li > a > div:nth-child(1) > p::after,
#wrap.themeSideWhiteOpacity .treeBottomWrap > ul > li > a > div:nth-child(2) > button,
#wrap.themeSideWhiteOpacity .sideDatePicker .ui-datepicker .ui-datepicker-title select,
#wrap.themeSideWhiteOpacity .sideDatePicker .ui-datepicker .ui-datepicker-prev, #wrap.themeSideWhiteOpacity .sideDatePicker .ui-datepicker .ui-datepicker-next {filter: brightness(0) saturate(100%) invert(100%) sepia(55%) saturate(2%) hue-rotate(254deg) brightness(111%) contrast(100%);}

#wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeQuickBtn {color: #fff; background-color: rgba(255, 255, 255, 0.2); border-color: rgba(255, 255, 255, 0.15);}

#wrap.themeSideWhiteOpacity .treeTopWrap > ul > li:not(.treeTitle) > a:hover,
#wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > ul > li:not(.treeTitle) > a:hover,
#wrap.themeSideWhiteOpacity .treeChild > li > a:hover,
.ar_drive #wrap.themeSideWhiteOpacity .treeTopWrap > div > div > ul > li:not(.treeTitle) > a:hover {background-color: rgba(255, 255, 255, 0.2);}

#wrap.themeSideWhiteOpacity .treeTopWrap > ul > li.click > a,
#wrap.themeSideWhiteOpacity .treeSelectableMenuContainer > ul > li.click > a,
#wrap.themeSideWhiteOpacity .treeChild > li.click > a {background-color: rgba(255, 255, 255, 0.3) !important;}

#wrap.themeSideWhiteOpacity .snb_tab ul li {background-color: rgba(255, 255, 255, 0.15); border-color: rgba(255, 255, 255, 0.15);}
#wrap.themeSideWhiteOpacity .snb_tab ul li a {border-color: rgba(255, 255, 255, 0.15); color: rgba(255, 255, 255, 0.8);}
#wrap.themeSideWhiteOpacity .snb_tab ul li.slt {background-color: rgba(255, 255, 255, 0);}
#wrap.themeSideWhiteOpacity .snb_tab ul li.slt a {border-bottom-color: transparent; color: #fff;}

#wrap.themeSideWhiteOpacity .capacity_info .graph .bar {background-color: #fff;}
#wrap.themeSideWhiteOpacity .capacity_info .graph {background-color: rgba(255, 255, 255, 0.2);}

#wrap.themeSideWhiteOpacity .menu_scroll_area *::-webkit-scrollbar-thumb {background-color: rgba(255, 255, 255, 0.3);}
#wrap.themeSideWhiteOpacity .menu_scroll_area *::-webkit-scrollbar-thumb:hover { background-color: rgba(255, 255, 255, 0.7);}
#wrap.themeSideWhiteOpacity .menu_scroll_area *::-webkit-scrollbar-thumb:active { background-color: rgba(255, 255, 255, 1);}

#wrap.themeSideWhiteOpacity .section_typemail .click em,
.ar_drive #wrap.themeSideWhiteOpacity .treeTopWrap > div > div > ul > li.click > a > div > p:not(.beanVolume) {font-weight: 600; color: #fff !important}

#wrap.themeSideWhiteOpacity .ui-widget-header, #wrap.themeSideWhiteOpacity .sideDatePicker .ui-datepicker .ui-datepicker-title select {color: #fff !important;}

#wrap.themeSideWhiteOpacity .sideDatePicker .ui-state-active, #wrap.themeSideWhiteOpacity .sideDatePicker .ui-widget-content .ui-state-active {background-color: rgba(255, 255, 255, 0.3); border: none;}

/* 사이드바 블랙 투명도 */
#wrap.themeSideBlackOpacity .btn_workset a strong {background-color: rgba(82, 87, 99, 0.7); color: #fff;}

#wrap.themeSideBlackOpacity .snb_nav a,
#wrap.themeSideBlackOpacity #header.h_mail .pwe_home,
#wrap.themeSideBlackOpacity .treeTopWrap > ul > li > button,
#wrap.themeSideBlackOpacity .snb_footer,
#wrap.themeSideBlackOpacity .snb_footer em,
#wrap.themeSideBlackOpacity .treeTopWrap > ul > li.click > a > div > p:not(.beanVolume),
#wrap.themeSideBlackOpacity .treeSelectableMenuContainer > ul > li.click > a > div > p:not(.beanVolume),
#wrap.themeSideBlackOpacity .treeChild > li.click > a > div > p,
#wrap.themeSideBlackOpacity .section_typemail a.unread .cnt,
#wrap.themeSideBlackOpacity .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeTotalNum,
#wrap.themeSideBlackOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeTotalNum,
#wrap.themeSideBlackOpacity .snb_footer strong,
#wrap.themeSideBlackOpacity .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeTotalNum,
#wrap.themeSideBlackOpacity .beanVolume,
#wrap.themeSideBlackOpacity .capacity_info .text strong,
#wrap.themeSideBlackOpacity .sideDatePicker .ui-datepicker th,
#wrap.themeSideBlackOpacity .sideDatePicker .ui-datepicker th.ui-datepicker-week-end:first-child {color: #000;}

#wrap.themeSideBlackOpacity .section_typemail,
#wrap.themeSideBlackOpacity .treeTopWrap,
#wrap.themeSideBlackOpacity .snb_footer,
.ar_contact #wrap.themeSideBlackOpacity .treeTopWrap > ul.treeFixMenuWrap,
.ar_drive #wrap.themeSideBlackOpacity .treeTopWrap > div:nth-of-type(3),
.ar_calendar #wrap.themeSideBlackOpacity .treeTopWrap > ul.treeFixMenuWrap,
.ar_calendar #wrap.themeSideBlackOpacity .treeSelectableMenuContainer + .treeSelectableMenuContainer,
.ar_board #wrap.themeSideBlackOpacity .treeSelectableMenuContainer + .treeSelectableMenuContainer,
.ar_board #wrap.themeSideBlackOpacity .treeSelectableMenuContainer > div > ul,
.ar_board #wrap.themeSideBlackOpacity .treeTopWrap > ul.treeFixMenuWrap,
#wrap.themeSideBlackOpacity .sideDatePickerWrap {border-color: rgba(0, 0, 0, 0.1);}

#wrap.themeSideBlackOpacity .section_typemail a .icon,
#wrap.themeSideBlackOpacity .treeTopWrap > ul > li > a > div:nth-child(1) > span:nth-of-type(1),
#wrap.themeSideBlackOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span:nth-of-type(1),
#wrap.themeSideBlackOpacity .treeTopWrap > ul > li > a > div:nth-child(2) > button,
#wrap.themeSideBlackOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button:not(.treeQuickBtn),
#wrap.themeSideBlackOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > i,
#wrap.themeSideBlackOpacity .treeChild > li > a > div:nth-child(1) > i,
#wrap.themeSideBlackOpacity .treeChild > li > a > div:nth-child(1) > span:not(.treeIcon_label):nth-of-type(1),
#wrap.themeSideBlackOpacity .treeDepthMore > li > a > div > p,
#wrap.themeSideBlackOpacity .treeChild > li > a > div:nth-child(2) > button,
#wrap.themeSideBlackOpacity .treeBottomWrap > ul > li > a > div:nth-child(1) > span:nth-of-type(1),
#wrap.themeSideBlackOpacity .treeTopWrap > ul > li > button > span,
.ar_drive #wrap.themeSideBlackOpacity .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span:nth-of-type(1),
.ar_drive #wrap.themeSideBlackOpacity .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > i,
.ar_drive #wrap.themeSideBlackOpacity .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button,
.ar_calendar #wrap.themeSideBlackOpacity .treeChild > li > a > div:nth-child(1) > span:not(.treeIcon_label),
.ar_calendar #wrap.themeSideBlackOpacity .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button,
.ar_calendar #wrap.themeSideBlackOpacity .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span,
.ar_calendar #wrap.themeSideBlackOpacity .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i,
.ar_board #wrap.themeSideBlackOpacity .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i,
.ar_board #wrap.themeSideBlackOpacity .treeChild li > a > div:nth-child(1) > p::after,
#wrap.themeSideBlackOpacity .treeBottomWrap > ul > li > a > div:nth-child(2) > button {filter: brightness(0) saturate(100%) invert(45%) sepia(11%) saturate(194%) hue-rotate(173deg) brightness(96%) contrast(88%);}

#wrap.themeSideBlackOpacity .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeQuickBtn {color: #595959; background-color: rgba(255, 255, 255, 0.1); border-color: rgba(0, 0, 0, 0.2);}

#wrap.themeSideBlackOpacity .treeTopWrap > ul > li:not(.treeTitle) > a:hover,
#wrap.themeSideBlackOpacity .treeSelectableMenuContainer > ul > li:not(.treeTitle) > a:hover,
#wrap.themeSideBlackOpacity .treeChild > li > a:hover,
.ar_drive #wrap.themeSideBlackOpacity .treeTopWrap > div > div > ul > li:not(.treeTitle) > a:hover {background-color: rgba(0, 0, 0, 0.05);}

#wrap.themeSideBlackOpacity .treeTopWrap > ul > li.click > a,
#wrap.themeSideBlackOpacity .treeSelectableMenuContainer > ul > li.click > a,
#wrap.themeSideBlackOpacity .treeChild > li.click > a {background-color: rgba(0, 0, 0, 0.08) !important;}

#wrap.themeSideBlackOpacity .snb_footer .bar {color: rgba(0, 0, 0, 0.1);}
#wrap.themeSideBlackOpacity .snb_footer .slash {color: #000;}

#wrap.themeSideBlackOpacity .snb_tab ul li {background-color: rgba(0, 0, 0, 0.05); border-color: rgba(0, 0, 0, 0.1);}
#wrap.themeSideBlackOpacity .snb_tab ul li a {border-color: rgba(0, 0, 0, 0.1); color: #555;}
#wrap.themeSideBlackOpacity .snb_tab ul li.slt {background-color: rgba(255, 255, 255, 0);}
#wrap.themeSideBlackOpacity .snb_tab ul li.slt a {border-bottom-color: transparent; color: #000;}

#wrap.themeSideBlackOpacity .capacity_info .graph .bar {background-color: rgba(82, 87, 99, 0.7);}
#wrap.themeSideBlackOpacity .capacity_info .graph {background-color: rgba(64, 69, 80, 0.2);}

#wrap.themeSideBlackOpacity .menu_scroll_area *::-webkit-scrollbar-thumb {background-color: rgba(0, 0, 0, 0.15);}
#wrap.themeSideBlackOpacity .menu_scroll_area *::-webkit-scrollbar-thumb:hover { background-color: rgba(0, 0, 0, 0.3);}
#wrap.themeSideBlackOpacity .menu_scroll_area *::-webkit-scrollbar-thumb:active { background-color: rgba(0, 0, 0, 0.5);}

#wrap.themeSideBlackOpacity .section_typemail .click em,
.ar_drive #wrap.themeSideBlackOpacity .treeTopWrap > div > div > ul > li.click > a > div > p:not(.beanVolume) {font-weight: 600; color: #000 !important}

#wrap.themeSideBlackOpacity .sideDatePicker .ui-state-active, #wrap.themeSideBlackOpacity .sideDatePicker .ui-widget-content .ui-state-active {border-color: #525763; background-color: #525763; color: #fff !important;}

#wrap.themeSideBlackOpacity .ui-widget-header, #wrap.themeSideBlackOpacity .sideDatePicker .ui-datepicker .ui-datepicker-title select {color: #000 !important;}
#wrap.themeSideBlackOpacity .sideDatePicker .ui-datepicker .ui-datepicker-title select {filter: brightness(0) saturate(100%) invert(0%) sepia(93%) saturate(28%) hue-rotate(105deg) brightness(109%) contrast(106%);}

/* // 전체 테마 색상 옵션 */

/* 환경설정 - 테마 */
.colorThemeContainer {display: flex; flex-wrap: wrap;}
.colorThemeContainer > li {padding: 0 36px 22px 0;}
.colorThemeContainer > li > p {color: #000; font-size: 14px; padding-bottom: 8px;}
.colorThemeWrap {display: flex; flex-wrap: nowrap;}
.colorThemeWrap > div {border: 1px solid #EEEEEE; box-sizing: border-box; width: 67px; height: 67px; display: flex; flex-wrap: nowrap;}
.colorThemeWrap > div + div {margin-left: 10px;}
.colorThemeWrap > div > div {cursor: pointer;}
.colorThemeWrap > div.selected {border-color: #00FCFF; outline: 1px solid #00FCFF;}
.colorThemeWrap > div > div:nth-child(1) {width: 18px;}

.colorThemeWrap.themeColor_96bffd > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-96bffd);}
.colorThemeWrap.themeColor_10bc83 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-10bc83);}
.colorThemeWrap.themeColor_ffc000 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-ffc000);}
.colorThemeWrap.themeColor_e5410e > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-e5410e);}
.colorThemeWrap.themeColor_484b52 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-484b52);}

.colorThemeWrap.themeColor_eb8a9f > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-eb8a9f);}
.colorThemeWrap.themeColor_f35055 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-f35055);}
.colorThemeWrap.themeColor_a02031 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-a02031);}

.colorThemeWrap.themeColor_ff9c71 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-ff9c71);}
.colorThemeWrap.themeColor_f87331 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-f87331);}
.colorThemeWrap.themeColor_be5233 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-be5233);}

.colorThemeWrap.themeColor_eab01c > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-eab01c);}
.colorThemeWrap.themeColor_ce920b > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-ce920b);}
.colorThemeWrap.themeColor_9f766a > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-9f766a);}

.colorThemeWrap.themeColor_83b730 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-83b730);}
.colorThemeWrap.themeColor_35a23a > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-35a23a);}
.colorThemeWrap.themeColor_007135 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-007135);}

.colorThemeWrap.themeColor_42aedc > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-42aedc);}
.colorThemeWrap.themeColor_4984d9 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-4984d9);}
.colorThemeWrap.themeColor_14479e > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-14479e);}

.colorThemeWrap.themeColor_9b65d9 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-9b65d9);}
.colorThemeWrap.themeColor_744dc8 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-744dc8);}
.colorThemeWrap.themeColor_5830b3 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-5830b3);}

.colorThemeWrap.themeColor_adadad > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-adadad);}
.colorThemeWrap.themeColor_333333 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-333333);}
.colorThemeWrap.themeColor_111111 > div:not(.colorThemePicker) > div:nth-child(1) {background-color: var(--color-111111);}


.colorThemeWrap.themeColor_gradient01 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #c2e9fb, #93b4f5);}
.colorThemeWrap.themeColor_gradient02 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #9ee9ec, #daa3f3);}
.colorThemeWrap.themeColor_gradient03 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #f4d9fe, #ff81aa);}
.colorThemeWrap.themeColor_gradient04 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #ffd5d4, #ffa3c2);}
.colorThemeWrap.themeColor_gradient05 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #f5d5e3, #ecb231);}
.colorThemeWrap.themeColor_gradient06 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #9de4f5, #eec0c6);}
.colorThemeWrap.themeColor_gradient07 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #beeaac, #859fe3);}
.colorThemeWrap.themeColor_gradient08 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #99c99c, #dcb0ed);}
.colorThemeWrap.themeColor_gradient09 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #fbc2eb, #a18cd1);}
.colorThemeWrap.themeColor_gradient10 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #f69b7e, #df335d);}
.colorThemeWrap.themeColor_gradient11 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #f8e07a, #88e3c4);}
.colorThemeWrap.themeColor_gradient12 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #c1e372, #77d884);}
.colorThemeWrap.themeColor_gradient13 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #4ecbc7, #105578);}
.colorThemeWrap.themeColor_gradient14 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #178e65, #095867);}
.colorThemeWrap.themeColor_gradient15 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #006fa2, #1b4060);}
.colorThemeWrap.themeColor_gradient16 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #4b86b5, #243949);}
.colorThemeWrap.themeColor_gradient17 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #5c5860, #20348c);}
.colorThemeWrap.themeColor_gradient18 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #611f69, #0a3f32);}
.colorThemeWrap.themeColor_gradient19 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #5fd1bc, #912fa8);}
.colorThemeWrap.themeColor_gradient20 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #56a6e8, #842570);}
.colorThemeWrap.themeColor_gradient21 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #c6c6c0, #898b82);}
.colorThemeWrap.themeColor_gradient22 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #92b9a7, #583d53);}
.colorThemeWrap.themeColor_gradient23 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #608113, #654317);}
.colorThemeWrap.themeColor_gradient24 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #dbc872, #2f4809);}
.colorThemeWrap.themeColor_gradient25 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #d9b055, #3677ff);}
.colorThemeWrap.themeColor_gradient26 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #01a09f, #675de4);}
.colorThemeWrap.themeColor_gradient27 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #55aea7, #7d78fc);}
.colorThemeWrap.themeColor_gradient28 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #a671e2, #5369be);}
.colorThemeWrap.themeColor_gradient29 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #d89955, #88388f);}
.colorThemeWrap.themeColor_gradient30 > div:not(.colorThemePicker) > div:nth-child(1) {background-image: linear-gradient(to bottom, #fd694c, #935dc6);}

/* 사이드바 투명도 테마 */
.colorThemeWrap.themeColor_96bffd > .colorThemeOpacity {background-color: var(--color-96bffd);}
.colorThemeWrap.themeColor_10bc83 > .colorThemeOpacity {background-color: var(--color-10bc83);}
.colorThemeWrap.themeColor_ffc000 > .colorThemeOpacity {background-color: var(--color-ffc000);}
.colorThemeWrap.themeColor_e5410e > .colorThemeOpacity {background-color: var(--color-e5410e);}
.colorThemeWrap.themeColor_484b52 > .colorThemeOpacity {background-color: var(--color-484b52);}
.colorThemeWrap.themeColor_eb8a9f > .colorThemeOpacity {background-color: var(--color-eb8a9f);}
.colorThemeWrap.themeColor_f35055 > .colorThemeOpacity {background-color: var(--color-f35055);}
.colorThemeWrap.themeColor_a02031 > .colorThemeOpacity {background-color: var(--color-a02031);}
.colorThemeWrap.themeColor_ff9c71 > .colorThemeOpacity {background-color: var(--color-ff9c71);}
.colorThemeWrap.themeColor_f87331 > .colorThemeOpacity {background-color: var(--color-f87331);}
.colorThemeWrap.themeColor_be5233 > .colorThemeOpacity {background-color: var(--color-be5233);}
.colorThemeWrap.themeColor_eab01c > .colorThemeOpacity {background-color: var(--color-eab01c);}
.colorThemeWrap.themeColor_ce920b > .colorThemeOpacity {background-color: var(--color-ce920b);}
.colorThemeWrap.themeColor_9f766a > .colorThemeOpacity {background-color: var(--color-9f766a);}
.colorThemeWrap.themeColor_83b730 > .colorThemeOpacity {background-color: var(--color-83b730);}
.colorThemeWrap.themeColor_35a23a > .colorThemeOpacity {background-color: var(--color-35a23a);}
.colorThemeWrap.themeColor_007135 > .colorThemeOpacity {background-color: var(--color-007135);}
.colorThemeWrap.themeColor_42aedc > .colorThemeOpacity {background-color: var(--color-42aedc);}
.colorThemeWrap.themeColor_4984d9 > .colorThemeOpacity {background-color: var(--color-4984d9);}
.colorThemeWrap.themeColor_14479e > .colorThemeOpacity {background-color: var(--color-14479e);}
.colorThemeWrap.themeColor_9b65d9 > .colorThemeOpacity {background-color: var(--color-9b65d9);}
.colorThemeWrap.themeColor_744dc8 > .colorThemeOpacity {background-color: var(--color-744dc8);}
.colorThemeWrap.themeColor_5830b3 > .colorThemeOpacity {background-color: var(--color-5830b3);}
.colorThemeWrap.themeColor_adadad > .colorThemeOpacity {background-color: var(--color-adadad);}
.colorThemeWrap.themeColor_333333 > .colorThemeOpacity {background-color: var(--color-333333);}
.colorThemeWrap.themeColor_111111 > .colorThemeOpacity {background-color: var(--color-111111);}

.colorThemeWrap.themeColor_gradient01 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #c2e9fb, #93b4f5);}
.colorThemeWrap.themeColor_gradient02 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #9ee9ec, #daa3f3);}
.colorThemeWrap.themeColor_gradient03 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #f4d9fe, #ff81aa);}
.colorThemeWrap.themeColor_gradient04 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #ffd5d4, #ffa3c2);}
.colorThemeWrap.themeColor_gradient05 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #f5d5e3, #ecb231);}
.colorThemeWrap.themeColor_gradient06 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #9de4f5, #eec0c6);}
.colorThemeWrap.themeColor_gradient07 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #beeaac, #859fe3);}
.colorThemeWrap.themeColor_gradient08 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #99c99c, #dcb0ed);}
.colorThemeWrap.themeColor_gradient09 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #fbc2eb, #a18cd1);}
.colorThemeWrap.themeColor_gradient10 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #f69b7e, #df335d);}
.colorThemeWrap.themeColor_gradient11 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #f8e07a, #88e3c4);}
.colorThemeWrap.themeColor_gradient12 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #c1e372, #77d884);}
.colorThemeWrap.themeColor_gradient13 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #4ecbc7, #105578);}
.colorThemeWrap.themeColor_gradient14 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #178e65, #095867);}
.colorThemeWrap.themeColor_gradient15 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #006fa2, #1b4060);}
.colorThemeWrap.themeColor_gradient16 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #4b86b5, #243949);}
.colorThemeWrap.themeColor_gradient17 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #5c5860, #20348c);}
.colorThemeWrap.themeColor_gradient18 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #611f69, #0a3f32);}
.colorThemeWrap.themeColor_gradient19 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #5fd1bc, #912fa8);}
.colorThemeWrap.themeColor_gradient20 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #56a6e8, #842570);}
.colorThemeWrap.themeColor_gradient21 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #c6c6c0, #898b82);}
.colorThemeWrap.themeColor_gradient22 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #92b9a7, #583d53);}
.colorThemeWrap.themeColor_gradient23 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #608113, #654317);}
.colorThemeWrap.themeColor_gradient24 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #dbc872, #2f4809);}
.colorThemeWrap.themeColor_gradient25 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #d9b055, #3677ff);}
.colorThemeWrap.themeColor_gradient26 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #01a09f, #675de4);}
.colorThemeWrap.themeColor_gradient27 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #55aea7, #7d78fc);}
.colorThemeWrap.themeColor_gradient28 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #a671e2, #5369be);}
.colorThemeWrap.themeColor_gradient29 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #d89955, #88388f);}
.colorThemeWrap.themeColor_gradient30 > .colorThemeOpacity {background-image: linear-gradient(to bottom, #fd694c, #935dc6);}

.colorThemeWrap.themeColor_96bffd > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_10bc83 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_ffc000 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_e5410e > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_484b52 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_eb8a9f > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_f35055 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_a02031 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_ff9c71 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_f87331 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_be5233 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_eab01c > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_ce920b > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_9f766a > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_83b730 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_35a23a > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_007135 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_42aedc > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_4984d9 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_14479e > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_9b65d9 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_744dc8 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_5830b3 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_adadad > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_333333 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_111111 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}

.colorThemeWrap.themeColor_gradient01 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient02 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient03 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient04 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient05 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient06 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient07 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient08 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient09 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient10 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient11 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient12 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient13 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient14 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient15 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient16 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient17 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient18 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient19 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient20 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient21 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(82, 87, 99, 0.7);}
.colorThemeWrap.themeColor_gradient22 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient23 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient24 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient25 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient26 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient27 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient28 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient29 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}
.colorThemeWrap.themeColor_gradient30 > .colorThemeOpacity > div:nth-child(2)::before {background-color: rgba(255, 255, 255, 0.3);}

.colorThemeWrap > div > div:nth-child(2) {width: 49px; position: relative;}
.colorThemeWrap > div > div:nth-child(2)::before {position: absolute; top: 10px; width: 30px; height: 10px; left: 50%; transform: translateX(-50%); display: block; content: '';}
.colorThemeWhite > div:nth-child(2) {background-color: #fff;}
.colorThemeWhite > div:nth-child(2)::before {background-color: #525763;}
.colorThemeGray > div:nth-child(2) {background-color: #f2f3f3;}
.colorThemeGray > div:nth-child(2)::before {background-color: #525763;}
.colorThemeBlack > div:nth-child(2) {background-color: #525763;}
.colorThemeBlack > div:nth-child(2)::before {background-color: #9a9ca0;}
.colorThemeOpacity > div:nth-child(2) {background-color: rgba(255, 255, 255, 0.2);}

.colorThemeWrap > .colorThemePicker {flex-wrap: wrap; width: 149px; min-width: 149px; margin-left: 16px; align-content: space-between; border: none; position: relative; gap: 5px;}
.colorThemeWrap > .colorThemePicker + .colorThemePicker::before {content: ''; display: block; position: absolute; width: 1px; height: 100%; left: -14px; top: 50%; transform: translateY(-50%); background-color: #EEEEEE;}
.colorThemeWrap > .colorThemePicker.gradient {width: 215px; min-width: 215px; margin-left: 27px;}
.colorThemeWrap > .colorThemePicker > div {width: 17px !important; height: 17px !important; display: block; box-sizing: border-box; position: relative;}
.colorThemeWrap > .colorThemePicker > div::before {position: absolute !important; display: none !important; width: 17px !important; height: 17px !important; content: ''; background: url(../img/ar_main.svg) no-repeat -28px -248px !important; top: 0 !important; left: 0 !important; transform: translate(0) !important;}
.colorThemeWrap > .colorThemePicker > div.selected {border: 1px solid #00FCFF;}
.colorThemeWrap > .colorThemePicker > div.selected::before {display: block !important;}

.colorThemePicker > div:nth-child(1) {background-color: var(--color-eb8a9f);}
.colorThemePicker > div:nth-child(2) {background-color: var(--color-ff9c71);}
.colorThemePicker > div:nth-child(3) {background-color: var(--color-eab01c);}
.colorThemePicker > div:nth-child(4) {background-color: var(--color-83b730);}
.colorThemePicker > div:nth-child(5) {background-color: var(--color-42aedc);}
.colorThemePicker > div:nth-child(6) {background-color: var(--color-9b65d9);}
.colorThemePicker > div:nth-child(7) {background-color: var(--color-adadad);}
.colorThemePicker > div:nth-child(8) {background-color: var(--color-f35055);}
.colorThemePicker > div:nth-child(9) {background-color: var(--color-f87331);}
.colorThemePicker > div:nth-child(10) {background-color: var(--color-ce920b);}
.colorThemePicker > div:nth-child(11) {background-color: var(--color-35a23a);}
.colorThemePicker > div:nth-child(12) {background-color: var(--color-4984d9);}
.colorThemePicker > div:nth-child(13) {background-color: var(--color-744dc8);}
.colorThemePicker > div:nth-child(14) {background-color: var(--color-333333);}
.colorThemePicker > div:nth-child(15) {background-color: var(--color-a02031);}
.colorThemePicker > div:nth-child(16) {background-color: var(--color-be5233);}
.colorThemePicker > div:nth-child(17) {background-color: var(--color-9f766a);}
.colorThemePicker > div:nth-child(18) {background-color: var(--color-007135);}
.colorThemePicker > div:nth-child(19) {background-color: var(--color-14479e);}
.colorThemePicker > div:nth-child(20) {background-color: var(--color-5830b3);}
.colorThemePicker > div:nth-child(21) {background-color: var(--color-111111);}

.colorThemePicker.gradient > div:nth-child(1)  {background-image: linear-gradient(to bottom, #c2e9fb, #93b4f5);}
.colorThemePicker.gradient > div:nth-child(2)  {background-image: linear-gradient(to bottom, #9ee9ec, #daa3f3);}
.colorThemePicker.gradient > div:nth-child(3)  {background-image: linear-gradient(to bottom, #f4d9fe, #ff81aa);}
.colorThemePicker.gradient > div:nth-child(4)  {background-image: linear-gradient(to bottom, #ffd5d4, #ffa3c2);}
.colorThemePicker.gradient > div:nth-child(5)  {background-image: linear-gradient(to bottom, #f5d5e3, #ecb231);}
.colorThemePicker.gradient > div:nth-child(6)  {background-image: linear-gradient(to bottom, #9de4f5, #eec0c6);}
.colorThemePicker.gradient > div:nth-child(7)  {background-image: linear-gradient(to bottom, #beeaac, #859fe3);}
.colorThemePicker.gradient > div:nth-child(8)  {background-image: linear-gradient(to bottom, #99c99c, #dcb0ed);}
.colorThemePicker.gradient > div:nth-child(9)  {background-image: linear-gradient(to bottom, #fbc2eb, #a18cd1);}
.colorThemePicker.gradient > div:nth-child(10) {background-image: linear-gradient(to bottom, #f69b7e, #df335d);}
.colorThemePicker.gradient > div:nth-child(11) {background-image: linear-gradient(to bottom, #f8e07a, #88e3c4);}
.colorThemePicker.gradient > div:nth-child(12) {background-image: linear-gradient(to bottom, #c1e372, #77d884);}
.colorThemePicker.gradient > div:nth-child(13) {background-image: linear-gradient(to bottom, #4ecbc7, #105578);}
.colorThemePicker.gradient > div:nth-child(14) {background-image: linear-gradient(to bottom, #178e65, #095867);}
.colorThemePicker.gradient > div:nth-child(15) {background-image: linear-gradient(to bottom, #006fa2, #1b4060);}
.colorThemePicker.gradient > div:nth-child(16) {background-image: linear-gradient(to bottom, #4b86b5, #243949);}
.colorThemePicker.gradient > div:nth-child(17) {background-image: linear-gradient(to bottom, #5c5860, #20348c);}
.colorThemePicker.gradient > div:nth-child(18) {background-image: linear-gradient(to bottom, #611f69, #0a3f32);}
.colorThemePicker.gradient > div:nth-child(19) {background-image: linear-gradient(to bottom, #5fd1bc, #912fa8);}
.colorThemePicker.gradient > div:nth-child(20) {background-image: linear-gradient(to bottom, #56a6e8, #842570);}
.colorThemePicker.gradient > div:nth-child(21) {background-image: linear-gradient(to bottom, #c6c6c0, #898b82);}
.colorThemePicker.gradient > div:nth-child(22) {background-image: linear-gradient(to bottom, #92b9a7, #583d53);}
.colorThemePicker.gradient > div:nth-child(23) {background-image: linear-gradient(to bottom, #608113, #654317);}
.colorThemePicker.gradient > div:nth-child(24) {background-image: linear-gradient(to bottom, #dbc872, #2f4809);}
.colorThemePicker.gradient > div:nth-child(25) {background-image: linear-gradient(to bottom, #d9b055, #3677ff);}
.colorThemePicker.gradient > div:nth-child(26) {background-image: linear-gradient(to bottom, #01a09f, #675de4);}
.colorThemePicker.gradient > div:nth-child(27) {background-image: linear-gradient(to bottom, #55aea7, #7d78fc);}
.colorThemePicker.gradient > div:nth-child(28) {background-image: linear-gradient(to bottom, #a671e2, #5369be);}
.colorThemePicker.gradient > div:nth-child(29) {background-image: linear-gradient(to bottom, #d89955, #88388f);}
.colorThemePicker.gradient > div:nth-child(30) {background-image: linear-gradient(to bottom, #fd694c, #935dc6);}

/* // 환경설정 - 테마 */

/* mail view popup */
#wrap.mailViewPop #container {top: 0;}
#wrap.mailViewPop #content{left: 0;}
#wrap.mailViewPop .mailListBtn .buttonSet {display: flex; align-items: center; height: 40px}

#wrap.mailViewPop .layoutSelectText {display: flex; justify-content: right; align-items: center; height: 40px;}


/* final tree */

.finalTree {padding: 0 !important; display: flex; flex-direction: column; font-size: 15px;}
.finalTree > div {display: flex; flex-direction: column; padding: 10px 0; overflow-x: hidden; overflow-y: auto;}
.ar_drive .finalTree > div {padding-bottom: 30px;}

.treeTopWrap {border-bottom: 1px solid #E5E5E5; height: calc(100% - 130px);}
.ar_contact .treeTopWrap {height: calc(100% - 100px); padding-bottom: 0;}
.ar_drive .treeTopWrap {border-bottom: none; height: 100%;}
.treeTopWrap > ul:not(.treeTitleWrap) {display: flex; flex-direction: column; padding-bottom: 10px;}
.ar_drive .treeTopWrap > ul:not(:first-of-type) {padding-top: 10px;}
.ar_drive .treeTopWrap > ul:nth-of-type(2) {padding-top: 0;}
.ar_drive .treeTopWrap > ul:nth-of-type(4) {padding-top: 0;}
.ar_drive .treeTopWrap > ul:not(:last-of-type) {border-bottom: 1px solid #F2F2F2;}
.treeTopWrap > ul.treeFixMenuWrap {padding-bottom: 5px; }
.ar_contact .treeTopWrap > ul.treeFixMenuWrap {border-bottom: 1px solid #F2F2F2;}
.treeTopWrap > ul.treeTitleWrap {padding-top: 5px;}
.ar_contact .treeTopWrap ul.treeSelectableMenuWrap,
.ar_drive .treeTopWrap ul.treeSelectableMenuWrap {padding-top: 0; border-top: none;}
.ar_drive .treeTopWrap > div > div > ul.treeTitleWrap {border-bottom: none; padding-top: 0;}
.treeTopWrap > ul > li {width: calc(100% - 8px); padding: 0 4px; margin: 1px 0;}
.treeTopWrap > ul > li > button {width: 100%; border: none; text-align: left; padding: 0 20px; color: #000; display: flex; align-items: center; font-size: 14px;}
.treeTopWrap > ul > li > button > span {display: inline-flex; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -469px -136px; margin-right: 6px;}
.treeTopWrap > ul > li > button.toggle > span {background-position: -490px -136px;}
.treeTopWrap > ul > li > a {display: flex; width: calc(100% - 32px); justify-content: space-between; align-items: center; padding: 6px 12px 6px 20px; color: #000; border-radius: 4px;}
.treeTopWrap > ul > li.treeTitle > a {color: #898989; font-size: 12px; cursor: default;}
.treeTopWrap > ul > li > a > div:nth-child(1) > p {letter-spacing: -0.5px;}
.ar_drive .treeTopWrap > div > div > ul > li.treeTitle > a {color: #000; cursor: pointer;}
.ar_drive .treeTopWrap > div > div > ul > li.treeTitle.click > a {color: var(--main-color);}
.treeTopWrap > ul.treeDownWrap > li > a {padding: 5px 12px 5px 0; width: calc(100% - 12px);}
.treeTopWrap > ul > li:not(.treeTitle) > a:hover {background-color: rgba(0,0,0,0.05);}
.treeTopWrap > ul > li > a:hover > div:nth-child(2) > button:not(.treeQuickBtn) {opacity: 1;}
.treeTopWrap > ul > li > a > div {display: flex; flex-wrap: nowrap; align-items: center;}
.treeTopWrap > ul > li.click > a > div > p:not(.beanVolume) {color: var(--main-color); font-weight: 400;}
.treeTopWrap > ul > li.click > a > div > span.treeIcon_mail10 + p,
.treeTopWrap > ul > li.click > a > div > span.treeIcon_mail11 + p,
.treeTopWrap > ul > li.click > a > div > span.treeIcon_mail12 + p {color: #000; font-weight: normal;}
.treeTopWrap > ul > li > a > div:nth-child(1) > i {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; cursor: pointer; margin-left: -16px; min-width: 16px}
.treeTopWrap > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -136px;}
.treeTopWrap > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -137px;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span:nth-of-type(1) {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; margin-right: 6px; min-width: 16px;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeTotalNum {color: var(--main-color); margin-left: 6px; display: inline-flex; align-items: center;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.svg) -7px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.svg) -29px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.svg) -116px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.svg) -51px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.svg) -138px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.svg) -161px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.svg) -74px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.svg) -96px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.svg) -183px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail10 {background: url(../img/ar_main.svg) -204px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail11 {background: url(../img/ar_main.svg) -226px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail12 {background: url(../img/ar_main.svg) -247px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -137px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.png) -333px -145px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.svg) -403px -136px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.png) -200px -145px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.png) -439px -211px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.png) -465px -210px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail26 {background: url(../img/ar_main.svg) -89px -2255px ;}
.treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -16px -1585px ;}

.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.svg) -7px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.svg) -29px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.svg) -116px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.svg) -51px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.svg) -138px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.svg) -161px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.svg) -74px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.svg) -96px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.svg) -183px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -159px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.png) -333px -167px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.svg) -403px -158px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.png) -200px -167px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.png) -439px -233px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.png) -465px -232px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail26 {background: url(../img/ar_main.svg) -89px -2277px ;}
.treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -16px -1606px ;}

.treeTopWrap > ul > li > a > div:nth-child(2) > button {display: flex; width: 16px; height: 16px; border: none; background-repeat: no-repeat; transition: opacity 0.3s; min-width: 16px;}
.treeTopWrap > ul > li > a > div:nth-child(2) > button:not(.treeQuickBtn) {opacity: 0;}
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeQuickBtn {width: auto; border: 1px solid #cbcbcb; align-items: center; height: 18px; color: #a8a8a8; letter-spacing: -1px; font-size: 11px; background-color: #fff; padding: 0 5px;}
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_setting {background: url(../img/ar_main.svg) -601px -136px; }
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_setting:hover {background: url(../img/ar_main.svg) -623px -136px; }
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -136px; margin-right: 8px;}
.treeTopWrap > ul > li.treeTitle > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -136px; margin-right: 0;}
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -136px;}
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -137px; }
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -137px; }
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_clean {background: url(../img/ar_main.svg) -734px -137px; margin-right: 8px;}
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_clean:hover {background: url(../img/ar_main.svg) -756px -137px;}
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_modify {background: url(../img/ar_main.png) -772px -145px;}
.treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_modify:hover {background: url(../img/ar_main.png) -794px -145px;}

/* 드라이브 별도 트리 */
.ar_drive .treeTopWrap > div > div > ul {display: flex; flex-direction: column;}
.ar_drive .treeTopWrap > div:nth-of-type(3) {border-bottom: 1px solid #F2F2F2; padding-bottom: 10px;}
.ar_drive .treeTopWrap > div:nth-of-type(4) {padding-bottom: 10px;}
.ar_drive .treeTopWrap > div:nth-of-type(4) > div > ul.treeTitleWrap {padding-top: 10px;}
.ar_drive .treeTopWrap > div > div > ul > li {width: calc(100% - 8px); padding: 0 4px; margin: 1px 0;}
.ar_drive .treeTopWrap > div > div > ul > li > button {width: 100%; border: none; text-align: left; padding: 0 20px; color: #000; display: flex; align-items: center; font-size: 14px;}
.ar_drive .treeTopWrap > div > div > ul > li > button.toggle > span {background-position: -486px -145px;}
.ar_drive .treeTopWrap > div > div > ul > li > button > span {display: inline-flex; width: 16px; height: 16px; background: url(../img/ar_main.png) no-repeat -464px -145px; margin-right: 6px;}
.ar_drive .treeTopWrap > div > div > ul > li > a {display: flex; width: calc(100% - 32px); justify-content: space-between; align-items: center; padding: 6px 12px 6px 20px; color: #000; border-radius: 4px;}
.ar_drive .treeTopWrap > div > div > ul > li.treeTitle > a {color: #898989; font-size: 13px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > p {letter-spacing: -0.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.ar_drive .treeTopWrap > div > div > ul > li:not(.treeTitle) > a:hover {background-color: rgba(0,0,0,0.05);}
.ar_drive .treeTopWrap > div > div > ul > li > a:hover > div:nth-child(2) > button:not(.treeQuickBtn) {opacity: 1;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div {display: flex; flex-wrap: nowrap; align-items: center;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) {width: calc(100% - 20px);}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div > p:not(.beanVolume) {color: var(--main-color); font-weight: 400;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div > span.treeIcon_mail10 + p,
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div > span.treeIcon_mail11 + p,
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div > span.treeIcon_mail12 + p {color: #000; font-weight: normal;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > i {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; cursor: pointer; margin-left: -16px; min-width: 16px}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -136px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -137px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span:nth-of-type(1) {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; margin-right: 6px; min-width: 16px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeTotalNum {color: var(--main-color); margin-left: 6px; display: inline-flex; align-items: center;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.png) -3px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.png) -25px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.png) -112px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.png) -47px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.png) -134px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.png) -157px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.png) -68px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.png) -91px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.png) -178px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail10 {background: url(../img/ar_main.png) -200px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail11 {background: url(../img/ar_main.png) -222px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail12 {background: url(../img/ar_main.png) -243px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.png) -266px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -137px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.png) -333px -145px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.png) -398px -146px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -137px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.svg) -510px -229px ;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.png) -465px -210px ;}

.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.png) -3px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.png) -25px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.png) -112px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.png) -47px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.png) -134px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.png) -157px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.png) -68px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.png) -91px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.png) -178px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.png) -266px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -159px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.png) -333px -167px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.png) -398px -168px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -159px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.svg) -510px -251px ;}
.ar_drive .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.png) -465px -232px ;}

.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button {display: flex; width: 16px; height: 16px; border: none; background-repeat: no-repeat; transition: opacity 0.3s; min-width: 16px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button:not(.treeQuickBtn) {opacity: 0;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeQuickBtn {width: auto; border: 1px solid #cbcbcb; align-items: center; height: 18px; color: #a8a8a8; letter-spacing: -1px; font-size: 11px; background-color: #fff; padding: 0 5px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_setting {background: url(../img/ar_main.svg) -601px -136px; }
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_setting:hover {background: url(../img/ar_main.svg) -623px -136px; }
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -136px; margin-right: 8px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -136px;}
.ar_drive .treeTopWrap > div > div > ul > li.treeTitle > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -136px; margin-right: 8px;}
.ar_drive .treeTopWrap > div > div > ul > li.treeTitle > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -136px; margin-right: 8px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -137px; }
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -137px; }
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_clean {background: url(../img/ar_main.svg) -734px -137px; margin-right: 0;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_clean:hover {background: url(../img/ar_main.svg) -756px -137px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_modify {background: url(../img/ar_main.png) -772px -145px;}
.ar_drive .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_modify:hover {background: url(../img/ar_main.png) -794px -145px;}

.ar_contact .treeTopWrap > ul.treeFixMenuWrap > li > a:hover {background-color: transparent;}

.treeChild {display: flex; flex-direction: column;}
.treeChild > li {width: 100%; margin: 1px 0;}
.treeChild > li:last-of-type {margin-bottom: 0;}
.treeChild > li > a {display: flex; width: calc(100% - 32px); justify-content: space-between; align-items: center; padding: 6px 12px 6px 20px; color: #000; border-radius: 4px;}
.treeChild > li > a:hover {background-color: rgba(0,0,0,0.05);}
.treeChild > li > a:hover > div:nth-child(2) > button {opacity: 1;}
.treeChild > li > a > div {display: flex; flex-wrap: nowrap; align-items: center;}
.treeChild > li.click > a > div > p {color: var(--main-color); font-weight: 400;}
.treeChild li > a > div:nth-child(1) {width: calc(100% - 28px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 24px;}
.treeChild li > a > div:nth-child(1) > p {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -0.5px;}
.treeChild > li > a > div:nth-child(1) > i {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; cursor: pointer; margin-right: 6px; min-width: 16px; margin-left: -24px;}
.treeChild > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -136px;}
.treeChild > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -137px;}
.treeChild > li > a > div:nth-child(1) > span:nth-of-type(1) {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; margin-right: 6px; min-width: 16px;}
.treeChild > li > a > div:nth-child(1) > span.treeIcon_label {display: inline-flex; width: 12px; height: 12px; margin-right: 6px; min-width: 12px; border-radius: 2px;}
.treeChild > li > a > div:nth-child(1) > span.treeIcon_mail19 {background: url(../img/ar_main.svg) -315px -137px ;}
.treeChild > li > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -337px -137px ;}
.treeChild > li > a > div:nth-child(1) > span.treeIcon_mail21 {background: url(../img/ar_main.svg) -359px -137px ;}
.treeChild > li > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -137px ;}
.treeChild > li > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -11px -2255px ;}
.treeChild > li > a > div:nth-child(1) > span.treeTotalNum {color: var(--main-color); margin-left: 6px; display: inline-flex; align-items: center;}

.treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail19 {background: url(../img/ar_main.svg) -315px -159px ;}
.treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -337px -159px ;}
.treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail21 {background: url(../img/ar_main.svg) -359px -159px ;}
.treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -159px ;}
.treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -11px -2277px ;}

.treeChild > li > a > div:nth-child(2) > button {display: flex; width: 16px; height: 16px; border: none; background-repeat: no-repeat; opacity: 0; min-width: 16px; transition: opacity 0.3s;}
.treeChild > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -137px; }
.treeChild > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -137px; }
.treeChild > li > a > div:nth-child(2) > button.treeIcon_important {background: url(../img/ar_main.svg) -281px -2280px; }
.treeChild > li > a > div:nth-child(2) > button.treeIcon_important:hover {background: url(../img/ar_main.svg) -303px -2280px; }
.treeChild > li > a > div:nth-child(2) > button.treeIcon_important.on {background: url(../img/ar_main.svg) -325px -2280px; }
.treeDepth01 > li > a > div:nth-child(1) {padding-left: 24px;}
.treeDepth01 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth02 > li > a > div:nth-child(1) {padding-left: 48px;}
.treeDepth02 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth03 > li > a > div:nth-child(1) {padding-left: 72px;}
.treeDepth03 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth04 > li > a > div:nth-child(1) {padding-left: 96px;}
.treeDepth04 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth05 > li > a > div:nth-child(1) {padding-left: 120px;}
.treeDepth05 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth06 > li > a > div:nth-child(1) {padding-left: 144px;}
.treeDepth06 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth07 > li > a > div:nth-child(1) {padding-left: 168px;}
.treeDepth07 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth08 > li > a > div:nth-child(1) {padding-left: 192px;}
.treeDepth08 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth09 > li > a > div:nth-child(1) {padding-left: 216px;}
.treeDepth09 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth10 > li > a > div:nth-child(1) {padding-left: 240px;}
.treeDepth10 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth11 > li > a > div:nth-child(1) {padding-left: 264px;}
.treeDepth11 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth12 > li > a > div:nth-child(1) {padding-left: 288px;}
.treeDepth12 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth13 > li > a > div:nth-child(1) {padding-left: 312px;}
.treeDepth13 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth14 > li > a > div:nth-child(1) {padding-left: 336px;}
.treeDepth14 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth15 > li > a > div:nth-child(1) {padding-left: 360px;}
.treeDepth15 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth16 > li > a > div:nth-child(1) {padding-left: 384px;}
.treeDepth16 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth17 > li > a > div:nth-child(1) {padding-left: 408px;}
.treeDepth17 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth18 > li > a > div:nth-child(1) {padding-left: 432px;}
.treeDepth18 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth19 > li > a > div:nth-child(1) {padding-left: 456px;}
.treeDepth19 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepth20 > li > a > div:nth-child(1) {padding-left: 480px;}
.treeDepth20 > li > a > div:nth-child(1) > i {margin-left: 0;}
.treeDepthMore > li > a > div {padding-left: 144px !important;}
.treeDepthMore > li > a > div > p {width: 22px; height: 16.5px; background: url(../img/ar_main.svg) no-repeat -224px -356px;}

li#custom-mboxes ul.ui-sortable li.ui-sortable-handle.ui-sortable-dropover > a { border: 2px solid var(--main-color); border-radius: 3px; }
li#custom-mboxes ul.ui-sortable li.ui-sortable-placeholder.ui-sortable-dropover { background: var(--main-color); }

.treeBottomWrap {min-height: 100px; height: 100px;}
.ar_contact .treeBottomWrap {min-height: 100px; height: 100px;}
.treeBottomWrap > ul {display: flex; flex-direction: column;}
.treeBottomWrap > ul > li {width: calc(100% - 8px); padding: 0 4px; margin: 1px 0;}
.treeBottomWrap > ul > li > button {width: 100%; border: none; text-align: left; padding: 0 16px; color: #000; display: flex; align-items: center;}
.treeBottomWrap > ul > li > a {display: flex; width: calc(100% - 32px); justify-content: space-between; align-items: center; padding: 5px 12px 5px 20px; color: #000; border-radius: 4px;}
.treeBottomWrap > ul > li > a > div {display: flex; flex-wrap: nowrap; align-items: center;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > p {letter-spacing: -0.5px;}
.treeBottomWrap > ul > li.click > a > div > p {color: var(--main-color); font-weight: 400;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span:nth-of-type(1) {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; margin-right: 6px;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeTotalNum {color: var(--main-color); margin-left: 6px; display: inline-flex; align-items: center;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail15 {background: url(../img/ar_main.svg) -381px -137px ;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail16 {background: url(../img/ar_main.svg) -403px -137px ;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail17 {background: url(../img/ar_main.svg) -424px -137px ;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail18 {background: url(../img/ar_main.svg) -447px -137px ;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail19 {background: url(../img/ar_main.svg) -293px -137px ;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -511px -137px ;}
.treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail21 {background: url(../img/ar_main.svg) -532px -137px ;}

.treeBottomWrap > ul > li > a > div:nth-child(2) > button.treeIcon_clean {background: url(../img/ar_main.svg) -734px -137px;}
.treeBottomWrap > ul > li > a > div:nth-child(2) > button.treeIcon_clean:hover {background: url(../img/ar_main.svg) -756px -137px;}

.treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail15 {background: url(../img/ar_main.svg) -381px -159px ;}
.treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail16 {background: url(../img/ar_main.svg) -403px -159px ;}
.treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail19 {background: url(../img/ar_main.svg) -293px -159px ;}
.treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -511px -159px ;}
.treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail21 {background: url(../img/ar_main.svg) -532px -159px ;}

.treeBottomWrap > ul > li > a > div:nth-child(2) > button {display: flex; width: 16px; height: 16px; border: none; background-repeat: no-repeat;}
.ar_contact .treeBottomWrap > ul > li > a > div:nth-child(2) > button {display: none;}
.ar_contact .treeBottomWrap > ul > li > a:hover > div:nth-child(2) > button {display: flex;}

.beanVolume {font-size: 13px; color: #B4B7BB; padding-right: 6px; position: relative;}

/* 사이드바 그레이 */
#wrap.themeSideGray .treeTopWrap > ul.treeSelectableMenuWrap {border-top: 1px solid #e5e5e5;}
.ar_contact #wrap.themeSideGray .treeTopWrap > ul.treeSelectableMenuWrap {border-top: none;}
#wrap.themeSideGray button.treeQuickBtn {color: #5a5a5a; border-color: #e7e7e7; background-color: #f2f3f3;}
.ar_contact #wrap.themeSideGray .treeTopWrap > ul.treeFixMenuWrap {border-bottom: 1px solid #e5e5e5;}
.ar_drive #wrap.themeSideGray .treeTopWrap > div:nth-of-type(3) {border-bottom: 1px solid #e5e5e5;}

/* 사이드바 블랙 */
#wrap.themeSideBlack .treeTopWrap {border-bottom: 1px solid #41454F;}
.ar_contact #wrap.themeSideBlack .treeTopWrap > ul.treeSelectableMenuWrap {border-top: none;}
#wrap.themeSideBlack .treeTopWrap > ul.treeDownWrap {border-top: 1px solid #4A4E59;border-bottom: 1px solid #4A4E59;}
#wrap.themeSideBlack .treeTopWrap > ul > li:not(.treeTitle) > a:hover {background-color: rgba(0,0,0,0.2);}
#wrap.themeSideBlack button.treeQuickBtn {color: #bfc0c2; background-color: #636873; border-color: #464b56;}
#wrap.themeSideBlack .treeTopWrap > ul > li > button {color: #CACACA;}
#wrap.themeSideBlack .treeChild > li > a:hover {background-color: rgba(0,0,0,0.2);}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -180px;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -181px;}
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -180px;}
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -181px;}
#wrap.themeSideBlack .treeDepthMore > li > a > div > p {background-position: -202px -356px;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div > span.treeIcon_mail10 + p,
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div > span.treeIcon_mail11 + p,
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div > span.treeIcon_mail12 + p {color: #CACACA; font-weight: normal;}

.ar_contact #wrap.themeSideBlack .treeTopWrap > ul.treeFixMenuWrap > li > a:hover {background-color: transparent;}

#wrap.themeSideBlack .treeTopWrap > ul > li > button.toggle > span {background-position: -489px -180px;}
#wrap.themeSideBlack .treeTopWrap > ul > li > button > span {background-position: -468px -180px;}

#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.svg) -7px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.svg) -29px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.svg) -116px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.svg) -51px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.svg) -138px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.svg) -161px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.svg) -74px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.svg) -96px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.svg) -183px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail10 {background: url(../img/ar_main.svg) -204px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail11 {background: url(../img/ar_main.svg) -226px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail12 {background: url(../img/ar_main.svg) -247px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -181px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.svg) -403px -180px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.png) -200px -189px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.png) -439px -255px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.png) -465px -254px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail26 {background: url(../img/ar_main.svg) -89px -2299px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -16px -1629px ;}

#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.svg) -7px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.svg) -29px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.svg) -116px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.svg) -51px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.svg) -138px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.svg) -161px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.svg) -74px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.svg) -96px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.svg) -183px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -159px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.svg) -403px -158px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.png) -200px -167px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.png) -439px -233px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.png) -465px -232px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail26 {background: url(../img/ar_main.svg) -89px -2321px ;}
#wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -16px -1651px ;}

#wrap.themeSideBlack .treeChild > li > a > div:nth-child(1) > span.treeIcon_mail19 {background: url(../img/ar_main.svg) -315px -181px ;}
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -338px -181px ;}
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(1) > span.treeIcon_mail21 {background: url(../img/ar_main.svg) -359px -181px ;}
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -181px ;}
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -11px -2299px ;}

#wrap.themeSideBlack .treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail19 {background: url(../img/ar_main.svg) -315px -159px ;}
#wrap.themeSideBlack .treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -337px -159px ;}
#wrap.themeSideBlack .treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail21 {background: url(../img/ar_main.svg) -359px -159px ;}
#wrap.themeSideBlack .treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -159px ;}
#wrap.themeSideBlack .treeChild > li.click > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -11px -2321px ;}

#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail15 {background: url(../img/ar_main.svg) -381px -181px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail16 {background: url(../img/ar_main.svg) -403px -181px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail17 {background: url(../img/ar_main.svg) -424px -181px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail18 {background: url(../img/ar_main.svg) -447px -181px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail19 {background: url(../img/ar_main.svg) -293px -181px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -511px -181px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail21 {background: url(../img/ar_main.svg) -532px -181px ;}

#wrap.themeSideBlack .treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail15 {background: url(../img/ar_main.svg) -381px -159px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail16 {background: url(../img/ar_main.svg) -403px -159px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail19 {background: url(../img/ar_main.svg) -293px -203px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -511px -203px ;}
#wrap.themeSideBlack .treeBottomWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail21 {background: url(../img/ar_main.svg) -532px -203px ;}

#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_setting {background: url(../img/ar_main.svg) -601px -181px; }
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_setting:hover {background: url(../img/ar_main.svg) -623px -181px; }
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -181px; }
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -181px;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -181px; }
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -181px; }
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_clean {background: url(../img/ar_main.svg) -733px -181px; }
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_clean:hover {background: url(../img/ar_main.svg) -755px -181px;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_modify {background: url(../img/ar_main.png) -772px -189px;}
#wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(2) > button.treeIcon_modify:hover {background: url(../img/ar_main.png) -794px -189px;}
#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(2) > button.treeIcon_clean {background: url(../img/ar_main.svg) -733px -181px; }
#wrap.themeSideBlack .treeBottomWrap > ul > li > a > div:nth-child(2) > button.treeIcon_clean:hover {background: url(../img/ar_main.svg) -755px -181px;}

#wrap.themeSideBlack .treeTopWrap::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.2);}
#wrap.themeSideBlack .treeTopWrap::-webkit-scrollbar-thumb:hover { background-color: #6b6b6b;}
#wrap.themeSideBlack .treeTopWrap::-webkit-scrollbar-thumb:active { background-color: #e5e5e5;}

#wrap.themeSideBlack .treeBottomWrap::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.2);}
#wrap.themeSideBlack .treeBottomWrap::-webkit-scrollbar-thumb:hover { background-color: #6b6b6b;}
#wrap.themeSideBlack .treeBottomWrap::-webkit-scrollbar-thumb:active { background-color: #e5e5e5;}

#wrap.themeSideBlack .treeChild > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -181px; }
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -181px; }
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(2) > button.treeIcon_important {background: url(../img/ar_main.svg) -281px -2302px; }
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(2) > button.treeIcon_important:hover {background: url(../img/ar_main.svg) -303px -2302px; }
#wrap.themeSideBlack .treeChild > li > a > div:nth-child(2) > button.treeIcon_important.on {background: url(../img/ar_main.svg) -325px -2280px; }

.ar_contact #wrap.themeSideBlack .treeTopWrap > ul.treeFixMenuWrap {border-bottom: 1px solid #4A4E59;}

.ar_drive #wrap.themeSideBlack .treeTopWrap > div:nth-of-type(3) {border-bottom: 1px solid #464A54}
.ar_drive #wrap.themeSideBlack .treeTopWrap > ul.treeTitleWrap {border-bottom: 0;}

/* 드라이브 별도 사이드바 블랙 */
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul:not(.treeTitleWrap) > li > a:hover {background-color: rgba(0,0,0,0.2);}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > button {color: #CACACA;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -180px;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -181px;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div > span.treeIcon_mail10 + p,
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div > span.treeIcon_mail11 + p,
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div > span.treeIcon_mail12 + p {color: #CACACA; font-weight: normal;}

.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > button.toggle > span {background-position: -486px -189px;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > button > span {background-position: -464px -189px;}

.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.png) -3px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.png) -25px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.png) -112px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.png) -47px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.png) -134px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.png) -157px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.png) -68px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.png) -91px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.png) -178px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail10 {background: url(../img/ar_main.png) -200px -190px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail11 {background: url(../img/ar_main.png) -222px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail12 {background: url(../img/ar_main.png) -243px -190px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.png) -266px -189px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -181px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.png) -398px -190px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -181px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.svg) -510px -273px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.png) -465px -254px ;}

.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.png) -3px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.png) -25px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.png) -112px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.png) -47px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.png) -134px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.png) -157px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.png) -68px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.png) -91px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.png) -178px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.png) -266px -167px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -203px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.png) -398px -168px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -159px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.svg) -510px -295px ;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.png) -465px -232px ;}

.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_setting {background: url(../img/ar_main.svg) -601px -181px; }
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_setting:hover {background: url(../img/ar_main.svg) -623px -181px; }
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -181px; }
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -181px;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -181px; }
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -181px; }
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_clean {background: url(../img/ar_main.svg) -733px -181px; }
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_clean:hover {background: url(../img/ar_main.svg) -755px -181px;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_modify {background: url(../img/ar_main.png) -772px -189px;}
.ar_drive #wrap.themeSideBlack .treeTopWrap > div > div > ul > li > a > div:nth-child(2) > button.treeIcon_modify:hover {background: url(../img/ar_main.png) -794px -189px;}

.ar_drive #wrap.themeSideBlack .treeChild > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -181px; }
.ar_drive #wrap.themeSideBlack .treeChild > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -181px; }

/* // final tree */

/* New Contact List */

.contactListContainer {display: flex; flex-wrap: wrap; width: 100%; height: 100%;}
.contactListWrap {height: 100%; width: 100%; box-sizing: border-box; overflow-y: auto;}
.contactListItem {display: flex; flex-wrap: nowrap; width: 100%; box-sizing: border-box; border-bottom: 1px solid #F4F4F4; background-color: #fff; justify-content: space-between; min-width: fit-content;}
.contactListItem.selected {background-color: #f7f9ff;}
.contactListItem > div {display: flex; align-items: center; flex-wrap: nowrap; width: 100%;}
.contactListItem > div:nth-child(1) {width: calc(100% - 120px);}
.contactListItem > div > div {display: flex; align-items: center; height: 36px;}
.contactFlexibleItemArea {justify-content: space-between; width: calc(100% - 155px);}
.contactFlexibleItemArea > div {display: flex; align-items: center; height: 36px; flex: 1;}

.contactListCheck {width: 35px; justify-content: right; min-width: 35px; padding-right: 6px;}
.contactListImportant {width: 30px; justify-content: center; min-width: 30px;}
.contactListImportant > a {display: none; width: 15px; height: 15px; background: url(../img/ar_main.svg) no-repeat -7px -380px;}
.contactListImportant > a.selected {background-position: -29px -380px; display: inline-block;}
.contactListName {justify-content: left; padding-left: 6px; margin-right: 15px; min-width: 135px; max-width: 135px;}
.contactListName > a {font-size: 14px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 6px;}
.contactListGroup {justify-content: left; padding-right: 15px; min-width: 80px;}
.contactListGroup > span {display: inline-block; font-size: 12px; color: #898989; border: 1px solid #e7e7e7; padding: 0 5px; height: 20px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; width: auto;}
.contactListPhone {justify-content: left; padding-right: 35px; min-width: 80px;}
.contactListPhone > span {display: inline-block; font-size: 14px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; width: auto;}
.contactListMail {justify-content: left; padding-right: 35px; min-width: 110px;}
.contactListMail > span {display: inline-block; font-size: 14px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; width: auto;}
.contactListCompany {justify-content: left; padding-right: 35px; min-width: 70px;}
.contactListCompany > span {display: inline-block; font-size: 14px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; width: auto;}
.contactListDepartment {justify-content: left; padding-right: 35px; min-width: 50px;}
.contactListDepartment > span {display: inline-block; font-size: 14px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; width: auto;}
.contactListPosition {justify-content: left; padding-right: 35px; min-width: 50px;}
.contactListPosition > span {display: inline-block; font-size: 14px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; width: auto;}
.contactListMemo {justify-content: left; padding-right: 38px; width: auto; overflow: hidden;}
.contactListMemo > span {display: inline-block; font-size: 14px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; width: auto;}
.contactListMemo.empty > span {color: #BFBFBF;}

.contactListOption {justify-content: right; padding-right: 8px; width: 110px !important; display: flex;}
.contactListOption > div > a {display: none;}
.contactListWrite {justify-content: center; min-width: 30px; width: 30px;}
.contactListWrite > a {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -258px -421px;}
.contactListEdit {justify-content: center; min-width: 30px; width: 30px;}
.contactListEdit > a {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -303px -421px;}
.contactListTrash {justify-content: center; min-width: 30px; width: 30px;}
.contactListTrash > a {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -182px -357px;}

.contactListItem:hover {background-color: #FBFCFF;}
.contactListItem:hover .contactListOption > div > a {display: inline-block;}
.contactListItem:hover .contactListImportant > a {display: inline-block;}
.contactListItem.selected:hover {background-color: #f7f9ff;}

/* // New Contact List */


/* treeSelectableMenuWrap 개편 */

.treeSelectableMenuContainer {padding-bottom: 0; padding-top: 10px; /*border-top: 1px solid #F2F2F2;*/ display: flex; flex-direction: column;} /* 즐겨찾기 메일함 기능 추가 시, border-top 주석 제거 */
.ar_contact .treeTopWrap .treeSelectableMenuContainer {padding-top: 0; border-top: none; height: calc(100% - 67px);}
.treeSelectableMenuContainer > ul > li {width: calc(100% - 8px); padding: 0 4px; margin: 1px 0;}
.treeSelectableMenuContainer > ul > li > button {width: 100%; border: none; text-align: left; padding: 0 16px; color: #000; display: flex; align-items: center; font-size: 14px;}
.treeSelectableMenuContainer > ul > li > button.toggle > span {background-position: -490px -136px;}
.treeSelectableMenuContainer > ul > li > button > span {display: inline-flex; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -469px -136px; margin-right: 6px;}
.treeSelectableMenuContainer > ul > li > a {display: flex; width: calc(100% - 32px); justify-content: space-between; align-items: center; padding: 6px 12px 6px 20px; color: #000; border-radius: 4px;}
.treeSelectableMenuContainer > ul > li.treeTitle > a {color: #898989; font-size: 12px; cursor: default;}
.treeSelectableMenuContainer > ul > li:not(.treeTitle) > a:hover {background-color: rgba(0,0,0,0.05);}
.treeSelectableMenuContainer > ul > li > a:hover > div:nth-child(2) > button:not(.treeQuickBtn) {opacity: 1;}
.treeSelectableMenuContainer > ul > li > a > div {display: flex; flex-wrap: nowrap; align-items: center;}
.ar_contact .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) {width: calc(100% - 24px);}
.ar_drive .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) {width: calc(100% - 24px);}
.treeSelectableMenuContainer > ul > li.click > a > div > p:not(.beanVolume) {color: var(--main-color); font-weight: 400;}
.treeSelectableMenuContainer > ul > li.click > a > div > span.treeIcon_mail10 + p,
.treeSelectableMenuContainer > ul > li.click > a > div > span.treeIcon_mail11 + p,
.treeSelectableMenuContainer > ul > li.click > a > div > span.treeIcon_mail12 + p {color: #000; font-weight: normal;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > i {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; cursor: pointer; margin-left: -16px; min-width: 16px}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -136px;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -137px;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > p {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -0.5px;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span:nth-of-type(1) {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; margin-right: 6px; min-width: 16px}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeTotalNum {color: var(--main-color); margin-left: 6px; display: inline-flex; align-items: center;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.svg) -7px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.svg) -29px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.svg) -116px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.svg) -51px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.svg) -138px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.svg) -161px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.svg) -74px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.svg) -96px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.svg) -183px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail10 {background: url(../img/ar_main.svg) -204px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail11 {background: url(../img/ar_main.svg) -226px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail12 {background: url(../img/ar_main.svg) -247px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -136px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -336px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.svg) -403px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -137px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.png) -439px -211px ;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.svg) -554px -229px ;}
.treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail28 {background: url(../img/ar_main.svg) -38px -1586px ;}
.treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail29 {background: url(../img/ar_main.svg) -82px -1608px ;}

.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.svg) -7px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.svg) -29px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.svg) -116px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.svg) -51px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.svg) -138px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.svg) -161px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.svg) -74px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.svg) -96px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.svg) -183px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -158px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -336px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.svg) -403px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -159px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.png) -439px -233px ;}
.treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.svg) -554px -251px ;}

.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button {display: flex; width: 16px; height: 16px; border: none; background-repeat: no-repeat; transition: opacity 0.3s; min-width: 16px}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button:not(.treeQuickBtn) {opacity: 0;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeQuickBtn {all: unset; width: auto; border: 1px solid #cbcbcb; align-items: center; height: 18px; color: #5a5a5a; font-size: 12px; background-color: #fff; padding: 0 5px; line-height: 18px; box-sizing: border-box; display: flex;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_setting {background: url(../img/ar_main.svg) -601px -136px; }
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_setting:hover {background: url(../img/ar_main.svg) -623px -136px; }
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -136px; margin-right: 8px;}
.treeSelectableMenuContainer > ul > li.treeTitle > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -136px; margin-right: 0;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -136px;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -137px; }
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -137px; }
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_clean {background: url(../img/ar_main.svg) -734px -137px; margin-right: 8px;}
.treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_clean:hover {background: url(../img/ar_main.svg) -756px -137px;}


.ar_drive .treeTopWrap > ul > li > a > div {overflow: hidden;}
.ar_drive .treeTopWrap > ul > li > a > div:nth-child(1) > p {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 168px; color: #898989;}

/* 사이드바 그레이 */
.ar_contact #wrap.themeSideGray .treeSelectableMenuContainer {border-top: none;}

/* 사이드바 블랙 */
.ar_contact #wrap.themeSideBlack .treeSelectableMenuContainer {border-top: none;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li:not(.treeTitle) > a:hover {background-color: rgba(0,0,0,0.2);}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > button {color: #CACACA;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -180px;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -181px;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div > span.treeIcon_mail10 + p,
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div > span.treeIcon_mail11 + p,
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div > span.treeIcon_mail12 + p {color: #CACACA; font-weight: normal;}

#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > button.toggle > span {background-position: -486px -189px;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > button > span {background-position: -464px -189px;}

#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.svg) -7px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.svg) -29px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.svg) -116px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.svg) -51px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.svg) -138px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.svg) -161px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.svg) -74px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.svg) -96px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.svg) -183px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail10 {background: url(../img/ar_main.svg) -204px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail11 {background: url(../img/ar_main.svg) -226px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail12 {background: url(../img/ar_main.svg) -247px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -180px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -338px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.svg) -403px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -181px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.png) -439px -255px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.svg) -553px -273px ;}
#wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail28 {background: url(../img/ar_main.svg) -38px -1630px ;}
#wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail29 {background: url(../img/ar_main.svg) -82px -1629px ;}

#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail01 {background: url(../img/ar_main.svg) -7px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail02 {background: url(../img/ar_main.svg) -29px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail03 {background: url(../img/ar_main.svg) -116px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail04 {background: url(../img/ar_main.svg) -51px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail05 {background: url(../img/ar_main.svg) -138px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail06 {background: url(../img/ar_main.svg) -161px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail07 {background: url(../img/ar_main.svg) -74px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail08 {background: url(../img/ar_main.svg) -96px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail09 {background: url(../img/ar_main.svg) -183px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -158px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail14 {background: url(../img/ar_main.svg) -292px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail20 {background: url(../img/ar_main.svg) -337px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail22 {background: url(../img/ar_main.svg) -403px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail23 {background: url(../img/ar_main.svg) -204px -159px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail24 {background: url(../img/ar_main.png) -439px -233px ;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail25 {background: url(../img/ar_main.svg) -553px -251px ;}

#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_setting {background: url(../img/ar_main.svg) -601px -181px; }
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_setting:hover {background: url(../img/ar_main.svg) -623px -181px; }
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -181px; }
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -181px;}
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_more {background: url(../img/ar_main.svg) -689px -181px; }
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_more:hover {background: url(../img/ar_main.svg) -711px -181px; }
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_clean {background: url(../img/ar_main.svg) -733px -181px; }
#wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(2) > button.treeIcon_clean:hover {background: url(../img/ar_main.svg) -755px -181px;}

/* // treeSelectableMenuWrap 개편 */


/* 보안메일 읽기 */

.secureMailViewPop {overflow: auto; width: 100%; height: 100%; min-width: 800px;}
.mailViewPopTitle {width: 100%; height: 62px; display: flex; align-items: center; justify-content: flex-start; padding: 0 25px; border-bottom: 1px solid #E5E5E5; box-sizing: border-box;}
.mailViewPopTitle > h1 {display: inline-block; height: 22px;}
.mailViewPopTitle > h1 > img  {display: inline-block; height: 100%;}

.secureMailViewPop #container {width: 80vw; min-width: 710px; border: 1px solid #B3B3B3; position: static; margin: 30px auto;}
.secureMailViewPop #section_cen {position: static;}
.secureMailViewPop #section_cen_fix {position: static;}
.secureMailViewPop #content {position: static;}
.secureMailViewPop #cont_flex_area {position: static;}
.secureMailViewPop .read_normal .divContent {position: static;}
.secureMailViewPop .read_normal .divContent .viewWrap {position: static; overflow: hidden;}
.secureMailViewPop .wrap_movement .btn_print:before {display: none;}

.secureMailTitle {display: flex; width: 100%; height: 62px; border-bottom: 1px solid #e8e8e8; padding: 0 25px; align-items: center;}
.secureMailTitle > h1 {font-size: 18px; font-weight: bold; color: #000;}

.secureMailViewPop .viewTitle {margin: 0 25px;}
.secureMailViewPop .viewTitle > div {padding: 25px 0 12px;}
.secureMailViewPop .viewTitle h4 {padding-left: 0;}
.secureMailViewPop .mail_file {margin: 18px 25px 0;}
.secureMailViewPop .mail_file .file_info {line-height: 23px;}
.secureMailViewPop .mail_file .file_info .link_file {line-height: 26px;}
.secureMailViewPop .viewer_body {padding: 0;}

/* // 보안메일 읽기 */


/* 메일 작은창 보기 */

.mailViewPopup {min-width: 602px; max-width: 602px; position: absolute; right: 14px; bottom: 0; box-sizing: border-box; z-index: 9999; display: flex; flex-direction: column; box-shadow: 0 0 10px rgba(0,0,0,0.25);}
.mailViewPopupTitle {display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; background-color: #525763; color: #fff; height: 40px; padding: 0 12px;}
.mailViewPopupTitle > div {display: flex; flex-wrap: nowrap;}
.mailViewPopupTitle > div:nth-of-type(1) {overflow: hidden;}
.mailViewPopupTitle > div:nth-of-type(1) > span {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -6px -619px; margin-right: 8px; min-width: 16px;}
.mailViewPopupTitle > div:nth-of-type(1) > p {font-size: 16px; padding-right: 40px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mailViewPopupTitle > div:nth-of-type(2) > a {display: inline-block; width: 16px; height: 16px;}
.mailViewPopupTitle > div:nth-of-type(2) > a:nth-of-type(1) {background: url(../img/ar_main.svg) no-repeat -29px -620px;}
.mailViewPopupTitle > div:nth-of-type(2) > a:nth-of-type(2) {background: url(../img/ar_main.svg) no-repeat -50px -620px; margin-left: 10px;}

.mailViewPopupContent {padding: 0 6px 20px; background-color: #fff; border-bottom: 1px solid #f4f4f4;}
.mailViewPopupContent .viewTitle {border-bottom: 1px solid #f4f4f4;}
.mailViewPopupContent .viewTitle h4 {line-height: 22px; padding-left: 6px;}
.mailViewPopupContent .viewTitle dl dd a {color: #555;}
.mailViewPopupContent .viewTitle dl dd a > strong {color: #000; font-weight: bold;}
.mailViewPopupContent .viewTitle dl dd.txt_info > div:first-of-type {padding-right: 25px;}
.mailViewPopupContent .viewTitle dl dd.txt_info > div.info_date {white-space: nowrap;}
.mailViewPopupContent .viewTitle > div {padding: 14px 0 12px;}
.mailViewPopupContent .viewTitle > div > div:nth-child(1) {width: 100%;}

.mailViewPopupContent .viewContent {padding: 20px 14px; min-height: 350px; max-height: 350px; overflow: auto; box-sizing: border-box;}
.mailViewPopupContent .viewContent p {line-height: 24px; font-size: 14px; color: #000;}

.mailViewPopup .mailPreviewAttachFile {display: flex; flex-wrap: wrap; width: 100%; max-height: 96px; overflow-y: auto; padding: 0 14px; max-width: 450px; margin-top: 20px;}
.mailViewPopup .mailPreviewAttachFile > .mailPreviewAttachItem {display: flex; flex-wrap: nowrap; align-items: center; padding: 0 10px; justify-content: space-between; width: 100%; height: 28px; overflow: hidden; background-color: #f9f9f9;}
.mailViewPopup .mailPreviewAttachFile > .mailPreviewAttachItem:not(:last-of-type) {margin-bottom: 4px;}
.mailViewPopup .mailPreviewAttachFile > .mailPreviewAttachItem > div {display: flex; flex-wrap: nowrap; align-items: center; width: calc(100% - 46px);}
.mailViewPopup .mailPreviewAttachFile > .mailPreviewAttachItem > div > span {display: inline-block; width: 15px; height: 15px; margin-right: 6px; min-width: 15px;}
.mailViewPopup .mailPreviewAttachFile > .mailPreviewAttachItem > div > p {font-size: 14px; color: #555555; font-weight: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mailViewPopup .mailPreviewAttachFile > .mailPreviewAttachItem > span.attachDownload {display: inline-block; width: 15px; height: 15px; min-width: 15px; background: url(../img/ar_main.svg) no-repeat -73px -665px;}

.mailViewPopup span.folder{background: url("../img/file/svg/file_folder.svg");}/* 폴더 */
.mailViewPopup span.ai{background-image: url("../img/file/svg/file_ext_ai.svg");}/* 일러스트 */
.mailViewPopup span.doc{background-image: url("../img/file/svg/file_ext_doc.svg");}/* 문서 */
.mailViewPopup span.etc{background-image: url("../img/file/svg/file_ext_etc.svg");}/* 기타 */
.mailViewPopup span.exe{background-image: url("../img/file/svg/file_ext_exe.svg");}/* 설치파일 */
.mailViewPopup span.fla{background-image: url("../img/file/svg/file_ext_fla.svg");}/* 플래시 */
.mailViewPopup span.gul{background-image: url("../img/file/svg/file_ext_gul.svg");}/* gul? */
.mailViewPopup span.htm{background-image: url("../img/file/svg/file_ext_htm.svg");}/* html */
.mailViewPopup span.hwp{background-image: url("../img/file/svg/file_ext_hwp.svg");}/* 한글파일 */
.mailViewPopup span.image{background-image: url("../img/file/svg/file_ext_img.svg");}/* 이미지 */
.mailViewPopup span.mp3{background-image: url("../img/file/svg/file_ext_mp3.svg");}/* mp3 */
.mailViewPopup span.mp4{background-image: url("../img/file/svg/file_ext_mp4.svg");}/* mp4 */
.mailViewPopup span.pdf{background-image: url("../img/file/svg/file_ext_pdf.svg");}/* pdf */
.mailViewPopup span.ppt{background-image: url("../img/file/svg/file_ext_ppt.svg");}/* ppt */
.mailViewPopup span.psd{background-image: url("../img/file/svg/file_ext_psd.svg");}/* 포토샵 */
.mailViewPopup span.txt{background-image: url("../img/file/svg/file_ext_txt.svg");}/* 텍스트 */
.mailViewPopup span.xls{background-image: url("../img/file/svg/file_ext_xls.svg");}/* 엑셀 */
.mailViewPopup span.zip{background-image: url("../img/file/svg/file_ext_zip.svg");}/* 압축파일 */

.mailViewPopupBottom {display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; height: 58px; padding: 0 20px; background-color: #fff;}
.mailViewPopupBottom > div:nth-of-type(1) {position: relative;}
.mailViewPopupBottom > div:nth-of-type(1) > a {box-sizing: border-box; width: 109px; height: 30px; display: flex; align-items: center; font-size: 16px; color: #fff; background: url(../img/ar_main.svg) no-repeat -164px -609px; padding-left: 12px;}
.mailViewPopupBottom > div:nth-of-type(1).click > a {background-position: -275px -609px;}
.mailViewPopupBottom > div:nth-of-type(2) {display: flex; align-items: center;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(1) {display: flex; align-items: center; padding-right: 15px;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(1) > a {display: inline-flex; color: #555; font-size: 14px; align-items: center;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(1) > a > span {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat; margin-right: 2px;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(1) > a:nth-of-type(1) {margin-right: 20px;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(1) > a:nth-of-type(1) > span {background-position: -94px -621px;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(1) > a:nth-of-type(2) > span {background-position: -115px -621px;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(2) {display: flex; align-items: center; padding-left: 15px; position: relative;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(2)::before {content: ''; display: block; position: absolute; width: 1px; height: 100%; background-color: #EEF0F2; left: 0; top: 0;}
.mailViewPopupBottom > div:nth-of-type(2) > div:nth-of-type(2) > a {display: inline-block; width: 18px; height: 18px; background: url(../img/ar_main.svg) no-repeat -137px -619px;}

.mailViewPopupContextMenu {bottom: 100%; left: 0; min-width: 109px;}

/* // 메일 작은창 보기 */


/* 메일 작은창 쓰기 */

.mailWritePopup {min-width: 602px; max-width: 602px; position: absolute; right: 14px; bottom: 0; box-sizing: border-box; z-index: 9999; display: flex; flex-direction: column; box-shadow: 0 0 10px rgba(0,0,0,0.25);}
.mailWritePopupTitle {display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; background-color: #525763; color: #fff; height: 40px; padding: 0 12px;}
.mailWritePopupTitle > div {display: flex; flex-wrap: nowrap;}
.mailWritePopupTitle > div:nth-of-type(1) {overflow: hidden;}
.mailWritePopupTitle > div:nth-of-type(1) > span {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -5px -707px; margin-right: 8px; min-width: 16px;}
.mailWritePopupTitle > div:nth-of-type(1) > p {font-size: 16px; padding-right: 40px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mailWritePopupTitle > div:nth-of-type(2) > a {display: inline-block; width: 16px; height: 16px;}
.mailWritePopupTitle > div:nth-of-type(2) > a:nth-of-type(1) {background: url(../img/ar_main.svg) no-repeat -29px -620px;}
.mailWritePopupTitle > div:nth-of-type(2) > a:nth-of-type(2) {background: url(../img/ar_main.svg) no-repeat -51px -620px; margin-left: 10px;}

.mailWritePopupContent {padding: 0 6px 20px; background-color: #fff; border-bottom: 1px solid #f4f4f4;}
.mailWritePopupContent .divWrite {min-width: fit-content; border-bottom: 1px solid #f4f4f4; padding: 10px 14px 25px;}

.mailWritePopupContent .viewContent {min-height: 350px; max-height: 350px; overflow: auto; box-sizing: border-box;}
.mailWritePopupContent .viewContent textarea {padding: 20px 14px; width: 100%; height: 350px; box-sizing: border-box; resize: none; border: none; display: block; font-size: 14px; line-height: 1.5;}
.mailWritePopupContent .viewContent textarea::placeholder {color: #ABABAB;}

.mailWritePopup .mailPreviewAttachFile {display: flex; flex-wrap: wrap; width: 100%; max-height: 96px; overflow-y: auto; padding: 0 14px; max-width: 450px; margin-top: 20px;}
.mailWritePopup .mailPreviewAttachFile > .mailPreviewAttachItem {display: flex; flex-wrap: nowrap; align-items: center; padding: 0 10px; justify-content: space-between; width: 100%; height: 28px; overflow: hidden; background-color: #f9f9f9;}
.mailWritePopup .mailPreviewAttachFile > .mailPreviewAttachItem:not(:last-of-type) {margin-bottom: 4px;}
.mailWritePopup .mailPreviewAttachFile > .mailPreviewAttachItem > div {display: flex; flex-wrap: nowrap; align-items: center; width: calc(100% - 46px);}
.mailWritePopup .mailPreviewAttachFile > .mailPreviewAttachItem > div > span {display: inline-block; width: 15px; height: 15px; margin-right: 6px; min-width: 15px;}
.mailWritePopup .mailPreviewAttachFile > .mailPreviewAttachItem > div > p {font-size: 14px; color: #555555; font-weight: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mailWritePopup .mailPreviewAttachFile > .mailPreviewAttachItem > div > p > span {display: inline-block; padding-left: 5px;}
.mailWritePopup .mailPreviewAttachFile > .mailPreviewAttachItem > span.attachDownload {display: inline-block; width: 15px; height: 15px; min-width: 15px; background: url(../img/ar_main.svg) no-repeat -52px -708px;}

.mailWritePopup span.folder{background: url("../img/file/svg/file_folder.svg");}/* 폴더 */
.mailWritePopup span.ai{background-image: url("../img/file/svg/file_ext_ai.svg");}/* 일러스트 */
.mailWritePopup span.doc{background-image: url("../img/file/svg/file_ext_doc.svg");}/* 문서 */
.mailWritePopup span.etc{background-image: url("../img/file/svg/file_ext_etc.svg");}/* 기타 */
.mailWritePopup span.exe{background-image: url("../img/file/svg/file_ext_exe.svg");}/* 설치파일 */
.mailWritePopup span.fla{background-image: url("../img/file/svg/file_ext_fla.svg");}/* 플래시 */
.mailWritePopup span.gul{background-image: url("../img/file/svg/file_ext_gul.svg");}/* gul? */
.mailWritePopup span.htm{background-image: url("../img/file/svg/file_ext_htm.svg");}/* html */
.mailWritePopup span.hwp{background-image: url("../img/file/svg/file_ext_hwp.svg");}/* 한글파일 */
.mailWritePopup span.image{background-image: url("../img/file/svg/file_ext_img.svg");}/* 이미지 */
.mailWritePopup span.mp3{background-image: url("../img/file/svg/file_ext_mp3.svg");}/* mp3 */
.mailWritePopup span.mp4{background-image: url("../img/file/svg/file_ext_mp4.svg");}/* mp4 */
.mailWritePopup span.pdf{background-image: url("../img/file/svg/file_ext_pdf.svg");}/* pdf */
.mailWritePopup span.ppt{background-image: url("../img/file/svg/file_ext_ppt.svg");}/* ppt */
.mailWritePopup span.psd{background-image: url("../img/file/svg/file_ext_psd.svg");}/* 포토샵 */
.mailWritePopup span.txt{background-image: url("../img/file/svg/file_ext_txt.svg");}/* 텍스트 */
.mailWritePopup span.xls{background-image: url("../img/file/svg/file_ext_xls.svg");}/* 엑셀 */
.mailWritePopup span.zip{background-image: url("../img/file/svg/file_ext_zip.svg");}/* 압축파일 */

.mailWritePopupBottom {display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; height: 58px; padding: 0 20px; background-color: #fff;}
.mailWritePopupBottom > div:nth-of-type(1) {position: relative; display: flex; align-items: center;}
.mailWritePopupBottom > div:nth-of-type(1) > a {box-sizing: border-box; width: 109px; height: 30px; display: flex; align-items: center; font-size: 16px; color: #fff; background: url(../img/ar_main.svg) no-repeat -164px -609px; padding-left: 12px;}
.mailWritePopupBottom > div:nth-of-type(1).click > a {background-position: -275px -609px;}

.mailWritePopupBottom > div:nth-of-type(1) > .editorArea {display: flex; align-items: center; padding-left: 20px; box-sizing: border-box;}
.mailWritePopupBottom > div:nth-of-type(1) > .editorArea > div:nth-of-type(1) {display: flex; align-items: center; position: relative; padding-right: 15px;}
.mailWritePopupBottom > div:nth-of-type(1) > .editorArea > div:nth-of-type(1)::after {content: ''; display: block; position: absolute; width: 1px; height: 100%; background-color: #EEF0F2; right: 0; top: 0;}
.mailWritePopupBottom > div:nth-of-type(1) > .editorArea > div:nth-of-type(1) > a {display: inline-block; width: 24px; height: 24px; background: url(../img/ar_main.svg) no-repeat -31px -735px;}
.writeEditor {padding-left: 20px; box-sizing: border-box;}/* 추후 삭제될 CSS */

.mailWritePopupBottom > div:nth-of-type(2) > div {display: flex; align-items: center; padding-left: 15px; position: relative;}
.mailWritePopupBottom > div:nth-of-type(2) > div::before {content: ''; display: block; position: absolute; width: 1px; height: 100%; background-color: #EEF0F2; left: 0; top: 0;}
.mailWritePopupBottom > div:nth-of-type(2) > div > a {display: inline-block; width: 18px; height: 18px; background: url(../img/ar_main.svg) no-repeat -137px -619px;}

.mailWritePopupContextMenu {bottom: 100%; left: 0; min-width: 109px;}
.mailWritePopupContextMenu a {padding: 8px 10px;}

/* // 메일 작은창 쓰기 */


/* 수신 허용/차단 목록 */

.receptionListContainer {width: 100%; display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center; max-width: 850px;}
.receptionListContainer > div {width: 49%; display: flex; flex-direction: column;}
.receptionListContainer > div > h1 {font-size: 16px; font-weight: bold; color: #000; letter-spacing: -1px; padding-bottom: 4px;}
.receptionListAdd {width: 100%; display: flex; flex-wrap: nowrap; align-items: center; border-bottom: 1px solid #DFDFDF; padding: 10px 0;}
.receptionListAdd > span {width: 16px; height: 16px; display: inline-block; background: url(../img/ar_main.svg) no-repeat -50px -685px; margin-right: 10px;}
.receptionListAdd > input {border: none; font-size: 15px; color: #000; width: calc(100% - 64px);}
.receptionListAdd > a {display: inline-flex; font-size: 13px; color: #000; width: 26px; justify-content: flex-end; margin-left: 10px;}
.receptionListOption {display: flex; align-items: center; padding: 10px 6px;}
.receptionListOption > input {margin-right: 8px;}
.optionDelete {display: flex; align-items: center; padding: 0 8px; position: relative;}
.optionDelete::before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 13px; background-color:#DDDDDD;}
.optionDelete::after {content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 13px; background-color:#DDDDDD;}
.optionDelete > a {display: inline-flex; align-items: center; color: #666666; font-size: 13px; line-height: 12px;}
.optionDelete > a > span {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -161px -379px;}
.receptionListWrap {display: flex; flex-direction: column; width: 100%; box-sizing: border-box; border: 1px solid #CACACA; padding: 5px; min-height: 242px; max-height: 242px; overflow: hidden;}
.receptionListWrap > div {border: 1px solid #DFDFDF; padding: 0 6px; height: 26px; box-sizing: border-box; display: flex; align-items: center; border-radius: 5px; justify-content: space-between; min-height: 26px;}
.receptionListWrap > div > input {border: none; font-size: 14px; color: #000; width: calc(100% - 25px);}
.receptionListWrap > div > a {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -73px -686px; min-width: 16px;}
.receptionListWrap > ul {display: flex; flex-direction: column; padding-top: 8px; height: calc(100% - 40px); overflow-y: auto;}
.receptionListWrap > ul > li {display: flex; flex-wrap: nowrap; align-items: center; box-sizing: border-box; height: 24px; justify-content: space-between; border: 1px solid #fff; background-color: #fff; padding: 0 4px; min-height: 24px;}
.receptionListContainer.receptionAllow .receptionListWrap > ul > li:hover {border-color: #E4EBFF; background-color: #F7F9FF;}
.receptionListContainer.receptionDeny .receptionListWrap > ul > li:hover {border-color: #FDDBDB; background-color: #FFEEEE;}
.receptionListWrap > ul > li:not(:last-of-type) {margin-bottom: 2px;}
.receptionListWrap > ul > li > div {display: flex; flex-wrap: nowrap; align-items: center; width: calc(100% - 20px); overflow: hidden;}
.receptionListWrap > ul > li > div > label {font-size: 14px; color: #000; padding-left: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.receptionListWrap > ul > li > a {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -146px -769px; min-width: 16px;}
.receptionListEmpty {align-items: center !important;}
.receptionListEmpty > li {font-size: 14px; color: #000; margin-top: 25px !important;}
.receptionListEmpty > li:hover {background-color: transparent !important; border-color: transparent !important;}

/* // 수신 허용/차단 목록 */

/* new search box */

#mailSimpleSearch {margin-left: 20px;}
.searchBox {display: inline-flex; min-width: 274px; max-width: 274px; box-sizing: border-box; border: 1px solid #DADADA; align-items: center; height: 32px; flex-wrap: nowrap; justify-content: space-between;}
.searchBox.inFocus {border-color: var(--main-color);}
.searchBox > input {font-size: 15px; color: #000; border: none; box-sizing: border-box; padding-left: 12px; padding-right: 12px; height: 100%; flex: 1; width: 100%;}
.searchBox > div {display: inline-flex; align-items: center; padding: 0 5px}
.searchBox > div > button {all: unset; color: #898989; font-size: 13px; cursor: pointer; display: inline-flex; align-items: center; margin-right: 12px; height: 30px;}
.searchBox > div > button > span.ico_bu {display: inline-block; width: 11px; height: 11px; background: url(../img/ar_main.svg) no-repeat -53px -270px; margin-left: 4px; min-width: 11px;}
.searchBox > div > button.selected > span.ico_bu {background-position: -75px -270px;}
.searchBox > div > a {display: inline-block; width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -25px -265px; min-width: 16px; padding: 4px;}

.ar_contact .searchBox > div > button {display: none;}

.ar_calendar .searchBox > div > button {display: none;}
/* new search box */

/* new TOP BUTTON */

.moveScroll {display: inline-flex; position: fixed; right: 24px; bottom: 21px; flex-direction: column; z-index: 1000; justify-content: flex-end;}
.moveScroll > button {all: unset; cursor: pointer; display: inline-flex; width: 38px; height: 38px; box-sizing: border-box; justify-content: center; align-items: center; background-color: #E5E5E5; border-radius: 50%;}
.moveScroll > button:hover {background-color: #D6D6D6; box-shadow: 1px 1px 2px #00000014;}
.moveScroll > button > i {display: inline-block; background-image: url(../img/ar_main.svg); background-repeat: no-repeat; width: 10px; height: 6px;}
.moveTop > i {background-position: -142px -841px;}
.moveBottom > i {background-position: -186px -841px;}
.moveBottom {margin-top: 2px !important;}
.moveScroll.bottomFloor .moveBottom {display: none;}

/* // new TOP BUTTON */


/* ----- 팝업 모음 ----- */

/* 버튼 하나일 경우 */
.layerFooter.oneBtn > div > button {margin-left: 0; color: #fff;}

/* 기본 경고창 */
.commonAlertPopup {border-radius: 0; min-width: 440px; padding: 20px 26px 30px; max-width: 500px;}
.commonAlertPopup > .layerContent {padding: 30px 0 56px; align-items: center;}
.commonAlertPopup > .layerContent > span {display: inline-block; width: 35px; height: 35px; background: url(../img/ar_main.svg) no-repeat -295px -1030px;}
.commonAlertPopup > .layerContent > h6 {font-size: 16px; padding-top: 24px; color: #000; line-height: 26px; text-align: center; font-weight: bold;word-break:break-all;}
.commonAlertPopup > .layerContent > h6 > span {color: var(--main-color);}
.commonAlertPopup > .layerContent > p {font-size: 14px; padding-top: 14px; color: #666; letter-spacing: -0.5px; line-height: 22px; text-align: center;word-break: break-all;}

/* 기본 느낌표 경고창 */
.commonExclamationMarkPopup {border-radius: 0; min-width: 400px; padding: 20px 26px 35px;}
.commonExclamationMarkPopup > .layerContent {padding: 30px 0; align-items: center;}
.commonExclamationMarkPopup > .layerContent > span {display: inline-block; width: 35px; height: 35px; background: url(../img/ar_main.svg) no-repeat -295px -1030px;}
.commonExclamationMarkPopup > .layerContent > h6 {font-size: 16px; padding-top: 24px; color: #000; font-weight: bold;}
.commonExclamationMarkPopup > .layerContent > p {font-size: 14px; padding-top: 12px; color: #666; text-align: center; line-height: 22px; letter-spacing: -0.5px;}

/* // ----- 팝업 모음 ----- */


/* 이미지 미리보기 */

.imgPreviewContainer {display: flex; position: fixed; flex-direction: column; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.85); z-index: 2024; overflow: hidden; min-width: 840px;}
.imgPreviewHead {display: flex; align-items: center; justify-content: space-between; height: 80px; flex-wrap: nowrap; padding: 0 30px;}

.imgPreviewTitle {display: flex; align-items: center; width: calc(100% - 200px); overflow: hidden;}
.imgPreviewTitle > div {font-size: 16px; color: #fff; display: inline-flex; align-items: center; flex-wrap: nowrap; overflow: hidden;}
.imgPreviewTitle > div > p {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.imgPreviewTitle > div > span {display: inline-block; flex: 1;}
.imgPreviewTitle > p {font-size: 16px; color: #666666; display: inline-block; flex: 1; margin-left: 10px;}

.imgPreviewOptions {display: flex; align-items: center; min-width: 200px; justify-content: flex-end;}
.imgPreviewOptions > a {display: inline-block; width: 30px; height: 30px; margin-right: 18px; border-radius: 4px;}
.imgPreviewOptions > a.fileDownload {background: url(../img/ar_main.svg) no-repeat -427px -2193px;}
.imgPreviewOptions > a.saveDrive {background: url(../img/ar_main.svg) no-repeat -477.5px -2193px;}
.imgPreviewOptions > a:hover {background-color: rgba(255, 255, 255, 0.1);}
.imgPreviewOptions > div {display: flex; align-items: center; margin-left: 18px; position: relative;}
.imgPreviewOptions > div::before {position: absolute; content: ''; display: block; width: 1px; height: 21px; background-color: #666; left: -18px; top: 50%; transform: translateY(-50%); cursor: default; pointer-events: none;}
.imgPreviewOptions > div > button {all: unset; width: 30px; height: 30px; cursor: pointer; background: url(../img/ar_main.svg) no-repeat -527px -2193px; border-radius: 4px;}
.imgPreviewOptions > div > button:hover {background-color: rgba(255,255,255,0.1);}

.imgPreviewContent {display: flex; flex-direction: column; height: calc(100% - 80px); position: relative;}
.imgPreviewMainSlide {height: calc(100% - 110px); display: flex !important; padding: 30px 30px 65px;}
.imgPreviewMainSlide .slick-track {height: 100%;}
.imgPreviewMainSlide .slick-list {width: 100%;}
.imgPreviewMainSlide .slick-prev {left: 45px; width: 42px; height: 42px; z-index: 2025;}
.imgPreviewMainSlide .slick-prev::before {content: ''; background: url(../img/ar_main.svg) no-repeat -578px -2180px; display: block; width: 42px; height: 42px;}
.imgPreviewMainSlide .slick-next {right: 45px; width: 42px; height: 42px; z-index: 2025;}
.imgPreviewMainSlide .slick-next::before {content: ''; background: url(../img/ar_main.svg) no-repeat -638px -2180px; display: block; width: 42px; height: 42px;}
.imgPreviewMainSlide .slideItem {display: flex !important; align-items: center; justify-content: center;}
.imgPreviewMainSlide .slideItem img {display: inline-block; max-width: 80%; max-height: 100%;}
.paginateNumber {position: absolute; bottom: 130px; left: 50%; transform: translateX(-50%); font-size: 16px; color: #fff;}
.paginateNumber > span {display: inline-block; margin: 0 6px;}
.imgPreviewSubSlide {height: 110px; background-color: #000; padding: 19px 30px;}
.imgPreviewSubSlide .slick-track {margin: 0; width: 100%; height: 100%;}
.imgPreviewSubSlide .slick-list {height: 100%; display: flex !important; justify-content: center;}
.imgPreviewSubSlide .slideItem {display: flex !important; align-items: center; justify-content: center; height: 100%; cursor: pointer; margin: 0 22px; max-width: 98px;}
.imgPreviewSubSlide .slideItem img {display: inline-block; max-width: 100%; max-height: 100%; box-sizing: border-box; border: 1px solid transparent;}
.imgPreviewSubSlide .slideItem.slick-current img {border: 1px solid var(--main-color);}
.imgPreviewSubSlide .slideItem:hover img {border-color: var(--main-color);}

/* // 이미지 미리보기 */

/* 메일 요약 레이어 */
.mailSummaryPopup {top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 632px; max-width: 632px; display: flex; flex-direction: column; max-height: 90%; z-index: 1000; border-radius: 0;}
.mailSummaryPopup .closePopup {position: relative; top: -4px; right: -10px;}
.mailSummaryPopup .layerHead {flex-direction: column; align-items: flex-start; padding: 24px 30px 20px; border-bottom: 1px solid #E5E5E5;}
.mailSummaryPopup .layerHead > div {display: flex; align-items: center; justify-content: space-between; width: 100%;}
.mailSummaryPopup .layerHead > div > h1 {font-size: 20px; color: #000; font-weight: 600; display: inline-flex; align-items: center;}
.mailSummaryPopup .layerHead > div > h1 > i {display: inline-block; width: 25px; height: 20px; min-width: 25px; background: url(../img/ar_main.svg) no-repeat -539px -552px; margin-right: 9px;}
.mailSummaryPopup .layerHead > div > div {display: flex; align-items: center;}
.mailSummaryPopup .layerHead > div > div > label {width: 140px; height: 26px; background-color: #CACACA; border-radius: 13px; overflow: hidden; position: relative; font-size: 14px; margin-right: 20px;}
.mailSummaryPopup .layerHead > div > div > label::before {content: 'ChatGPT'; position: absolute; top: 50%; transform: translateY(-50%); left: 11px; z-index: 10; color: #000;}
.mailSummaryPopup .layerHead > div > div > label::after {content: 'CLOVA'; position: absolute; top: 50%; transform: translateY(-50%); right: 12px; z-index: 10; color: #fff;}
.mailSummaryPopup .layerHead > div > div > label.checked::before {color: #fff;}
.mailSummaryPopup .layerHead > div > div > label.checked::after {color: #000;}
.mailSummaryPopup .layerHead > div > div > label > input {width: 76px; height: calc(100% - 2px); -webkit-appearance: none; appearance: none; position: absolute; left: 1px; top: 50%; transform: translateY(-50%); background-color: #fff; border-radius: 13px; transition: 0.2s;}
.mailSummaryPopup .layerHead > div > div > label > input:checked {left: 73px; width: 66px;}
.mailSummaryPopup .layerHead > div > p {font-size: 13px; color: #898989; font-weight: 400; line-height: 18px;}
.mailSummaryPopup .layerHead > div + div {padding-top: 14px;}
.mailSummaryPopup .layerContent {display: flex; flex-direction: column; padding: 28px 30px 46px; overflow-y: auto;}
.mailSummaryPopup .layerContent > h1 {font-size: 18px; color: #000; font-weight: 600; line-height: 24px;}
.mailSummaryPopup .layerContent > p {font-size: 14px; color: #000; font-weight: 400; line-height: 20px; padding-top: 14px;}

/* // 메일 요약 레이어 */

/* 게시판 */
.ar_board .menu_scroll_area {bottom: 0;}
.ar_board .treeTopWrap {height: 100%;}
.ar_board .treeTopWrap > ul.treeFixMenuWrap {border-bottom: 1px solid #F2F2F2;}
.ar_board .treeTopWrap > ul.treeFixMenuWrap > li > a:hover {background-color: transparent;}
.ar_board .treeSelectableMenuContainer {padding-top: 0;}
.ar_board .treeSelectableMenuContainer + .treeSelectableMenuContainer {border-top: 1px solid #F2F2F2;}
.ar_board .treeSelectableMenuContainer > div {display: flex; flex-direction: column;}
.ar_board .treeSelectableMenuContainer > div > ul {padding: 10px 0; border-bottom: 1px solid #F2F2F2;}
.ar_board .treeSelectableMenuContainer > div > ul:last-child {border-bottom: none;}
.ar_board .treeSelectableMenuContainer > div > ul > li > a {display: flex; width: calc(100% - 32px); justify-content: space-between; align-items: center; padding: 6px 12px 6px 20px; color: #898989; border-radius: 4px; font-size: 13px;}
.ar_board .treeSelectableMenuContainer > div > ul > li:not(.treeTitle) > a:hover {background-color: transparent;}
.ar_board .treeSelectableMenuContainer > div > ul > li > a > div {display: flex; flex-wrap: nowrap; align-items: center;}
.ar_board .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > p {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -0.5px; padding-left: 2px;}
.ar_board .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; cursor: pointer; margin-left: -16px; min-width: 16px}
.ar_board .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -141px -2255px;}
.ar_board .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -115px -2255px;}
.ar_board .treeChild li {padding: 0 4px; width: initial;}
.ar_board .treeChild li > a > div:nth-child(1) {padding-left: 0; flex: 1;}
.ar_board .treeChild li > a > div:nth-child(1) > p {position: relative;}
.ar_board .treeChild li > a > div:nth-child(1) > p::after {content: ''; display: none; width: 4px; height: 4px; position: absolute; top: 0; right: 0; border-radius: 50%; background-color: var(--error-color);}
.ar_board .treeChild li.new > a > div:nth-child(1) > p {padding-right: 8px;}
.ar_board .treeChild li.new > a > div:nth-child(1) > p::after {display: block;}
.ar_board .treeChild li > a > div:nth-child(2) {display: none; padding-left: 6px;}
.ar_board .treeChild > li > a:hover > div:nth-child(2) {display: flex;}

.ar_board #wrap.themeSideGray .treeTopWrap > ul.treeFixMenuWrap {border-bottom-color: #e5e5e5;}
.ar_board #wrap.themeSideGray .treeSelectableMenuContainer > div > ul {border-bottom-color: #e5e5e5;}
.ar_board #wrap.themeSideGray .treeSelectableMenuContainer + .treeSelectableMenuContainer {border-top-color: #e5e5e5;}

.ar_board #wrap.themeSideBlack .treeTopWrap > ul.treeFixMenuWrap {border-bottom-color: #41454f;}
.ar_board #wrap.themeSideBlack .treeTopWrap > ul > li:not(.treeTitle) > a:hover {background-color: transparent;}
.ar_board #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul {border-bottom-color: #41454f;}
.ar_board #wrap.themeSideBlack .treeSelectableMenuContainer + .treeSelectableMenuContainer {border-top-color: #41454f;}
.ar_board #wrap.themeSideBlack .treeSelectableMenuContainer > ul > li:not(.treeTitle) > a:hover {background-color: transparent;}

.ar_board .mailListBtn .layoutSelect {display: flex; align-items: center; line-height: initial; min-height: 28px;}
.ar_board .mailListBtn .layoutSelect > div {display: flex; align-items: center; padding-left: 12px; padding-right: 0; position: relative; height: 100%;}
.ar_board .mailListBtn .layoutSelect > div::before {content: ''; display: block; position: absolute; top: 50%; left: 6px; transform: translateY(-50%); width: 1px; height: 100%; background-color: #EEEEEE;}
.ar_board .mailListBtn .layoutSelect > div:first-child {padding-left: 0;}
.ar_board .mailListBtn .layoutSelect > div:first-child::before {display: none;}
.ar_board .mailListBtn .layoutSelect > div > button {box-sizing: border-box; width: 30px; height: 28px; min-width: 30px; display: inline-flex; align-items: center; justify-content: center;}
.ar_board .mailListBtn .layoutSelect > div > button:disabled {pointer-events: none;}
.ar_board .mailListBtn .layoutSelect > div > button:nth-child(2) {margin-left: 6px;}
.ar_board .mailListBtn .layoutSelect > div > button.listBtn {width: auto; padding: 0 10px;}
.ar_board .mailListBtn .layoutSelect > div > button > p {font-size: 15px; color: #000; font-weight: 500; position: relative;}
.ar_board .mailListBtn .layoutSelect > div > button > span {display: inline-block; width: 16px; height: 16px;}
.ar_board .mailListBtn .layoutSelect > div > button:disabled > span {opacity: 0.4;}
.ar_board .mailListBtn .layoutSelect > div > button.listPreviewBtn > span {background: url(../img/ar_main.svg) no-repeat -525px -2256px;}
.ar_board .mailListBtn .layoutSelect > div > button.listPreviewBtn.on > span {background-position: -547px -2256px;}
.ar_board .mailListBtn .layoutSelect > div > button.listViewBtn > span {background: url(../img/ar_main.svg) no-repeat -481px -2256px;}
.ar_board .mailListBtn .layoutSelect > div > button.listViewBtn.on > span {background-position: -503px -2256px;}
.ar_board .mailListBtn .layoutSelect > div > button.prevBtn > span {background: url(../img/ar_main.svg) no-repeat -95px -620px;}
.ar_board .mailListBtn .layoutSelect > div > button.nextBtn {margin-left: 6px;}
.ar_board .mailListBtn .layoutSelect > div > button.nextBtn > span {background: url(../img/ar_main.svg) no-repeat -116px -620px;}
.ar_board .mailListBtn .layoutSelect > div > button.printBtn > span {background: url(../img/ar_main.svg) no-repeat -29px -554px;}
.ar_board .mailListBtn .layoutSelect > div > button.temporaryStorageBtn {width: auto; padding: 0 14px;}
.ar_board .mailListBtn .layoutSelect > div > button.temporaryStorageBtn > p {font-size: 15px; color: #000;}
.ar_board .mailListBtn .layoutSelect > div > button.temporaryStorageBtn > span {width: auto; height: 28px; font-size: 15px; color: var(--main-color); margin-left: 10px;}
.ar_board .mailListBtn .layoutSelect > div > button.foldBtn > span {background: url(../img/ar_main.svg) no-repeat -51px -664px;}
.ar_board .mailListBtn .layoutSelect > div > button.foldBtn.on > span {background: url(../img/ar_main.svg) no-repeat -73px -664px;}
.ar_board .mailListBtn .layoutSelect > div > button.resizeBtn > span {background: url(../img/ar_main.svg) no-repeat -117px -663px;}
.ar_board .mailListBtn .layoutSelect > div > button.newWindowBtn > span {background: url(../img/ar_main.svg) no-repeat -139px -664px;}
.ar_board .mailListBtn .layoutSelect > div > label {display: flex; align-items: center; border: 1px solid #ABABAB; background-color: #fff; height: 100%; padding: 0 12px; box-sizing: border-box;}
.ar_board .mailListBtn .layoutSelect > div > label > p {font-size: 14px; color: #0f0f0f; padding-left: 8px; white-space: nowrap; font-weight: 500;}
.ar_board .mailListBtn .layoutSelect > div > select {border: 1px solid #ababab; height: 100%; width: 75px; text-align: center; -webkit-appearance: none; appearance: none; padding: 0 25px 0 12px; outline: none; background: url(../img/arrow.gif) no-repeat calc(100% + 5px) center; cursor: pointer; border-radius: 0;}

.boardContentWrap {display: flex; flex-wrap: nowrap; height: calc(100% - 66px); overflow: auto;}
.boardListContainer {display: flex; flex-direction: column; flex: 1; overflow: hidden;}
.boardViewContainer {display: flex; flex-direction: column; flex: 1; overflow: hidden;}

.dashboardContainer {display: flex; flex-direction: column; width: 440px; min-width: 440px; border-left: 1px solid #E5E5E5; padding: 0 26px 26px; box-sizing: border-box; overflow-y: auto;}
.dashboardWrap {display: flex; flex-direction: column; border: 1px solid #E5E6E8; border-radius: 15px; padding: 24px 25px;}
.dashboardWrap:nth-child(2) {margin-top: 25px;}
.dashboardWrap > div {display: flex; flex-direction: column;}
.dashboardTitle {display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; padding-bottom: 18px;}
.dashboardTitle > h1 {display: flex; align-items: center; overflow: hidden;}
.dashboardTitle > h1 > span {display: inline-block; width: 18px; height: 18px; min-width: 18px; margin-right: 6px;}
.dashboardTitle > h1 > p {font-size: 16px; color: #000; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.dashboardTitle > button {all: unset; display: inline-flex; align-items: center; color: #666666; font-size: 15px; cursor: pointer; white-space: nowrap; margin-left: 20px;}
.dashboardTitle > button > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -357px -402px; margin-left: 4px;}
.dashboardWrap.recent .dashboardTitle > h1 > span {background: url(../img/ar_main.svg) no-repeat -616px -2254px;}
.dashboardWrap.custom .dashboardTitle > h1 > span {background: url(../img/ar_main.svg) no-repeat -640px -2254px;}

.dashboardList {display: flex; flex-direction: column; min-height: 270px;}
.dashboardItem {display: flex; height: 54px; box-sizing: border-box; flex-direction: column; justify-content: center;}
.dashboardItem > div:nth-child(1) {display: flex; align-items: center; justify-content: space-between; padding-bottom: 5px;}
.dashboardItem > div:nth-child(1) > a {font-size: 15px; color: #000; font-weight: 500; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-right: 20px; position: relative; top: 1px;}
.dashboardItem > div:nth-child(1) > a:hover {text-decoration: underline;}
.dashboardItem > div:nth-child(1) > button {font-size: 13px; color: #898989; font-weight: 400; display: inline-flex; height: 20px; align-items: center; padding: 0 8px; border: 1px solid #E7E7E7; border-radius: 4px; max-width: 110px; box-sizing: border-box; line-height: 20px;}
.dashboardItem > div:nth-child(1) > button > span {white-space: nowrap; text-overflow: ellipsis; overflow: hidden; display: block; height: 100%;}
.dashboardItem > div:nth-child(1) > p {color: #898989; font-size: 14px; font-weight: 400; white-space: nowrap;}

.dashboardItem > div:nth-child(2) {display: flex; align-items: center; overflow: hidden;}
.dashboardItem > div:nth-child(2) > a {display: inline-flex; align-items: center; font-size: 14px; color: #ABABAB; position: relative; margin-left: 20px; white-space: nowrap; pointer-events: none;}
.dashboardItem > div:nth-child(2) > a.name {color: #666; overflow: hidden; text-overflow: ellipsis; display: inline-block;}
.dashboardItem > div:nth-child(2) > a:first-child {margin-left: 0;}
.dashboardItem > div:nth-child(2) > a::before {display: block; content: ''; position: absolute; left: -10px; top: 50%; transform: translateY(-50%); width: 1px; height: 12px; background-color: #ddd; pointer-events: none;}
.dashboardItem > div:nth-child(2) > a:first-child::before {display: none;}
.dashboardItem > div:nth-child(2) > a > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -715px -2256px; margin-right: 2px;}
.dashboardItem > div:nth-child(2) > a > span {color: #555; margin-left: 6px;}

.dashboardBottom {display: flex; align-items: center; justify-content: flex-end; padding-top: 16px;}
.dashboardPaginate {display: inline-flex; align-items: center;}
.dashboardPaginate > button {all: unset; display: inline-block; width: 15px; height: 15px; cursor: pointer; }
.dashboardPaginate > button.prevBtn {background: url(../img/ar_main.svg) no-repeat -314px -402px;}
.dashboardPaginate > button.nextBtn {background: url(../img/ar_main.svg) no-repeat -357px -402px;}
.dashboardPaginate > button:disabled {pointer-events: none; opacity: 0.3;}
.dashboardPaginate > div {display: inline-flex; align-items: center; padding: 0 6px; font-size: 15px; color: #898989;}
.dashboardPaginate > div > span {font-size: 15px; color: #898989; padding: 0 6px;}
.dashboardPaginate > div > span.currentNum {color: #000;}

.boardListWrap {display: flex; height: calc(100% - 41px);}

.boardListView {display: flex; flex-direction: column; width: 100%; overflow-y: auto; padding-top: 10px; box-sizing: border-box;}
.boardListView > div {display: flex; flex-direction: column;}
.boardListView > div > div {display: flex; flex-direction: column;}
.boardListView.list .boardListItem {display: flex; flex-wrap: nowrap; align-items: center; padding: 0 28px 0 14px; border-bottom: 1px solid #F4F4F4; box-sizing: border-box; height: 66px; min-height: 66px;}
.boardListView.list .boardListItem:hover {background-color: #FBFCFF;}
.boardListView.list .boardListItem.selected {background-color: #F7F9FF;}
.boardListView.list .boardListItem > div {display: flex; align-items: center; height: 100%; box-sizing: border-box;}
.boardListView.list .boardListCheck {padding-left: 8px;}
.boardListView.list .boardListCheck > div {display: flex; height: 100%; align-items: flex-start; padding-top: 15px; box-sizing: border-box;}
.boardListView.list .boardListReply {padding-left: 16px;}
.boardListView.list .boardListReply > div {display: flex; height: 100%; align-items: flex-start; padding-top: 15px; box-sizing: border-box;}
.boardListView.list .boardListReply > div > p {display: inline-block; width: 28px; height: 12px; min-width: 28px; background: url(../img/ar_main.svg) no-repeat -246px -2333px;}
.boardListView.list .boardListReply + .boardListTitle {padding-left: 6px;}
.boardListView.list .boardListTitle {flex-direction: column; align-items: flex-start !important; padding-left: 16px; justify-content: center; flex: 1; min-width: 0; overflow: hidden;}
.boardListView.list .boardListTitle > div:nth-child(1) {display: flex; align-items: center; padding-bottom: 5px; width: 100%;}
.boardListView.list .boardListTitle > div:nth-child(1) > a {display: inline-block; font-size: 15px; color: #000; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.boardListView.list .boardListTitle > div:nth-child(1) > a:hover {text-decoration: underline;}
.boardListView.list .boardListTitle > div:nth-child(1) > span {color: #ABABAB; white-space: nowrap; padding-right: 6px; display: inline-block; font-size: 14px; font-weight: bold;}
.boardListView.list .boardListItem.read .boardListTitle > div:nth-child(1) > a {color: #595959; font-weight: 500;}
.boardListView.list .boardListItem.notify .boardListTitle > div:nth-child(1) > a {color: var(--main-color); font-weight: bold;}

.boardListView.list .boardListTitle > div:nth-child(1) > .boardListNotifyWrap {display: inline-flex; align-items: center; margin-right: 8px; flex: 0 1 auto;}
.boardListView.list .boardListTitle > div:nth-child(1) > .boardListNotifyWrap > span.notifyIcon {display: inline-block; width: 20px; height: 20px; min-width: 20px; background: url(../img/ar_main.svg) no-repeat -573px -2252px;}
.boardListView.list .boardListTitle > div:nth-child(1) > .boardListNotifyWrap > span.mustRead {display: inline-flex; height: 18px; min-height: 18px; box-sizing: border-box; color: #fff; background-color: var(--error-color); border-radius: 4px; align-items: center; padding: 0 7px; font-size: 12px; margin-left: 8px; white-space: nowrap;}

.boardListView.list .boardListTitle > div:nth-child(1) > .boardListInfoWrap {display: inline-flex; align-items: center; margin-left: 6px; flex: 0 1 auto;}
.boardListView.list .boardListTitle > div:nth-child(1) > .boardListInfoWrap > span {display: inline-block; width: 16px; height: 16px; min-width: 16px;}
.boardListView.list .boardListTitle > div:nth-child(1) > .boardListInfoWrap > span.attachIcon {background: url(../img/ar_main.svg) no-repeat -52px -379px;}
.boardListView.list .boardListTitle > div:nth-child(1) > .boardListInfoWrap > span.newIcon {background: url(../img/ar_main.svg) no-repeat -665px -2255px;}

.boardListView.list .boardListTitle > div:nth-child(2) {display: flex; align-items: center; width: 100%;}
.boardListView.list .boardListTitle > div:nth-child(2) > a {display: inline-flex; align-items: center; font-size: 14px; color: #ABABAB; position: relative; margin-left: 20px; white-space: nowrap; pointer-events: none;}
.boardListView.list .boardListTitle > div:nth-child(2) > a.name {color: #666; overflow: hidden; text-overflow: ellipsis; display: inline-block;}
.boardListView.list .boardListTitle > div:nth-child(2) > a:first-child {margin-left: 0;}
.boardListView.list .boardListTitle > div:nth-child(2) > a::before {display: block; content: ''; position: absolute; left: -10px; top: 50%; transform: translateY(-50%); width: 1px; height: 12px; background-color: #ddd; pointer-events: none;}
.boardListView.list .boardListTitle > div:nth-child(2) > a:first-child::before {display: none;}
.boardListView.list .boardListTitle > div:nth-child(2) > a > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; margin-right: 2px;}
.boardListView.list .boardListTitle > div:nth-child(2) > a.comment > i {background: url(../img/ar_main.svg) no-repeat -715px -2256px;}
.boardListView.list .boardListTitle > div:nth-child(2) > a.reaction > i {background: url(../img/ar_main.svg) no-repeat -737px -2256px;}
.boardListView.list .boardListTitle > div:nth-child(2) > a > span {color: #555; margin-left: 6px;}

.boardListView.list .boardListSort {justify-content: flex-end; padding-left: 30px; max-width: 170px;}
.boardListView.list .boardListSort > button {all: unset; cursor: pointer; display: inline-flex; align-items: center; padding: 0 10px; box-sizing: border-box; border: 1px solid #E7E7E7; border-radius: 4px; height: 27px; max-width: 150px; overflow: hidden; background-color: #fff;}
.boardListView.list .boardListSort > button > span {font-size: 14px; color: #898989; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

.boardListView.list .boardListTime {width: 160px; min-width: 160px; justify-content: flex-end;}
.boardListView.list .boardListTime > p {font-size: 14px; color: #898989; white-space: nowrap;}

.boardListView.list .boardListBookmark {padding-left: 16px;}
.boardListView.list .boardListBookmark > a {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -757px -2257px;}
.boardListView.list .boardListBookmark > a.on {background-position: -779px -2257px;}

.boardListView.preview .boardListItem {display: flex; align-items: center; padding: 36px 36px 40px 14px; border-bottom: 1px solid #F4F4F4; box-sizing: border-box; flex-wrap: nowrap;}
.boardListView.preview .boardListItem:hover {background-color: #FBFCFF;}
.boardListView.preview .boardListItem.selected {background-color: #F7F9FF;}
.boardListView.preview .boardListItem > div:not(.boardListCheck, .boardListReply) {display: flex; flex-direction: column; padding-left: 16px; flex: 1; overflow: hidden;}

.boardListView.preview .boardPreviewTitleWrap {padding-bottom: 14px; display: flex;}
.boardListView.preview .boardPreviewTitleWrap > div {display: flex; align-items: flex-start;}
.boardListView.preview .boardPreviewTitleWrap > div:nth-child(1) {flex: 1; overflow: hidden; line-height: 27px;}
.boardListView.preview .boardPreviewNameWrap {min-height: 30px;}
.boardListView.preview .boardPreviewNameWrap > div {display: flex; align-items: center;}
.boardListView.preview .boardListCheck {padding-left: 8px; height: 100%; display: flex; align-items: center; box-sizing: border-box;}
.boardListView.preview .boardListCheck > div {display: flex; height: 100%; align-items: flex-start; padding-top: 8px; box-sizing: border-box;}
.boardListView.preview .boardListReply {padding-left: 16px; height: 100%; display: flex; align-items: center; box-sizing: border-box;}
.boardListView.preview .boardListReply > div {display: flex; height: 100%; align-items: flex-start; padding-top: 8px; box-sizing: border-box;}
.boardListView.preview .boardListReply > div > p {display: inline-block; width: 28px; height: 12px; min-width: 28px; background: url(../img/ar_main.svg) no-repeat -246px -2333px;}
.boardListView.preview .boardListReply + div {padding-left: 8px !important;}

.boardListView.preview .boardListTitle {justify-content: center; flex: 1; min-width: 0; overflow: hidden; align-items: center; display: flex; height: 100%;}
.boardListView.preview .boardListTitle > div:nth-child(1) {width: 100%;}
.boardListView.preview .boardListTitle > div:nth-child(1) > a {font-size: 18px; color: #000; font-weight: bold; position: relative; top: 1px;}
.boardListView.preview .boardListTitle > div:nth-child(1) > a:hover {text-decoration: underline;}
.boardListView.preview .boardListItem.read .boardListTitle > div:nth-child(1) > a {color: #595959; font-weight: 500;}
.boardListView.preview .boardListItem.notify .boardListTitle > div:nth-child(1) > a {color: var(--main-color); font-weight: bold;}

.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListNotifyWrap { margin-right: 8px; display: inline-flex; align-items: center; position: relative; top: 5px;}
.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListNotifyWrap > span.notifyIcon {display: inline-block; width: 20px; height: 20px; min-width: 20px; background: url(../img/ar_main.svg) no-repeat -573px -2253px;}
.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListNotifyWrap > span.mustRead {display: inline-flex; height: 18px; min-height: 18px; box-sizing: border-box; color: #fff; background-color: var(--error-color); border-radius: 4px; align-items: center; padding: 0 7px; font-size: 12px; margin-left: 8px; white-space: nowrap;}

.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListInfoWrap {margin-left: 6px; display: inline-flex; align-items: center; position: relative; top: 2px;}
.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListInfoWrap > span {display: inline-block; width: 16px; height: 16px; min-width: 16px;}
.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListInfoWrap > span.newIcon {background: url(../img/ar_main.svg) no-repeat -665px -2255px;}

.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListCommentInfoWrap {margin-left: 18px; display: inline-flex; align-items: center;}
.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListCommentInfoWrap > p {font-size: 16px; font-weight: bold; color: var(--main-color); display: inline-block; white-space: nowrap;}
.boardListView.preview .boardListTitle > div:nth-child(1) > .boardListCommentInfoWrap > span {font-size: 16px; font-weight: bold; color: var(--main-color); display: inline-block; padding-left: 6px; white-space: nowrap;}

.boardListView.preview .boardListSort {justify-content: flex-end; padding-left: 30px;}
.boardListView.preview .boardListSort > button {all: unset; cursor: pointer; display: inline-flex; align-items: center; padding: 0 10px; box-sizing: border-box; border: 1px solid #E7E7E7; border-radius: 4px; height: 32px; overflow: hidden; background-color: #fff; max-width: 170px;}
.boardListView.preview .boardListSort > button > span {font-size: 14px; color: #898989; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

.boardListView.preview .boardListSort > div {padding-left: 16px; display: inline-flex; align-items: center; position: relative;}
.boardListView.preview .boardListSort > div::before {content: ''; display: block; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); width: 1px; height: 28px; background-color: #eee;}
.boardListView.preview .boardListSort > div > a {margin-left: 8px;}
.boardListView.preview .boardListSort > div > a:first-child {margin-left: 0px;}
.boardListView.preview .boardListSort > div > a:hover {background-color: #F2F3F3;}
.boardListView.preview .boardPreviewBookmark {display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; min-width: 32px; box-sizing: border-box; border: 1px solid #ddd; background-color: #fff; border-radius: 5px;}
.boardListView.preview .boardPreviewBookmark > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -355px -2256px;}
.boardListView.preview .boardPreviewBookmark.on > span {background-position: -377px -2256px;}
.boardListView.preview .boardPreviewOption {display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; min-width: 32px; box-sizing: border-box; border: 1px solid #ddd; background-color: #fff; border-radius: 5px;}
.boardListView.preview .boardPreviewOption > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -390px -420px;}

.boardListView.preview .boardListProfile {display: flex; align-items: center; margin-right: 8px; overflow: hidden; pointer-events: none;}
.boardListView.preview .boardListProfile > span {display: inline-block; width: 26px; height: 26px; min-width: 26px; background-repeat: no-repeat; border-radius: 10px; margin-right: 8px;}
.boardListView.preview .boardListProfile > span.default {background-image: url(../img/ar_main.svg); background-position: -408px -2245px;}
.boardListView.preview .boardListProfile > p {font-size: 16px; color: #000; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}

.boardListView.preview .boardListDepart {display: inline-flex; align-items: center; padding: 0 6px; border: 1px solid #e7e7e7; height: 20px; box-sizing: border-box; margin-right: 12px; border-radius: 4px;}
.boardListView.preview .boardListDepart > span {font-size: 12px; color: #898989; display: inline-block; width: 100%; white-space: nowrap;}

.boardListView.preview .boardListTime {display: inline-flex; align-items: center; padding-left: 20px; position: relative;}
.boardListView.preview .boardListTime::before {display: block; width: 4px; height: 4px; background-color: #B0B0B0; border-radius: 50%; content: ''; left: 6px; top: 50%; transform: translateY(-50%); position: absolute;}
.boardListView.preview .boardListTime > p {font-size: 14px; color: #595959; font-weight: 500; white-space: nowrap;}

.boardListView.preview .boardPreviewContentWrap {padding: 14px 0 18px;}
.boardListView.preview .boardPreviewContentWrap > p {font-size: 16px; color: #595959; line-height: 28px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; cursor: pointer;}
.boardListView.preview .boardPreviewContentWrap * {max-width: 100%;}
.boardListView.preview .boardPreviewContentWrap > * + .boardPreviewImageWrap {padding-top: 16px;}
.boardListView.preview .boardPreviewImageWrap {display: flex; align-items: center;}
.boardListView.preview .boardPreviewImageItem {display: inline-flex; width: 86px; height: 86px; min-width: 86px; box-sizing: border-box; border: 1px solid #E5E8EB; margin-right: 10px; background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url(../img/BG_summer01.png);}
.boardListView.preview .boardPreviewImageCount {display: inline-flex; width: 86px; height: 86px; min-width: 86px; box-sizing: border-box; border: 1px solid #E5E8EB; font-size: 14px; color: #000; font-weight: 500; align-items: center; justify-content: center;}

.boardListView.preview .boardPreviewAttachWrap {display: flex; align-items: center; padding: 8px 0;}
.boardListView.preview .boardPreviewAttachItem {display: inline-flex; align-items: center; padding: 0 15px; height: 38px; min-height: 38px; box-sizing: border-box; border: 1px solid #DDDDDD; border-radius: 6px; margin-right: 6px; background-color: #fff; overflow: hidden;}
.boardListView.preview .boardPreviewAttachItem:hover {background-color: #F2F3F3;}
.boardListView.preview .boardPreviewAttachItem > i {display: inline-block; width: 15px; height: 15px; min-width: 15px; margin-right: 8px;}
.boardListView.preview .boardPreviewAttachItem > p {font-size: 14px; color: #555555; white-space: nowrap; font-weight: 500; overflow: hidden; text-overflow: ellipsis;}
.boardListView.preview .boardPreviewAttachItem > p > span {font-size: 14px; color: #B0B0B0; margin-left: 6px; white-space: nowrap;}

.ar_board .boardContentWrap i.folder{background: url("../img/file/svg/file_folder.svg");}/* 폴더 */
.ar_board .boardContentWrap i.ai{background-image: url("../img/file/svg/file_ext_ai.svg");}/* 일러스트 */
.ar_board .boardContentWrap i.doc{background-image: url("../img/file/svg/file_ext_doc.svg");}/* 문서 */
.ar_board .boardContentWrap i.etc{background-image: url("../img/file/svg/file_ext_etc.svg");}/* 기타 */
.ar_board .boardContentWrap i.exe{background-image: url("../img/file/svg/file_ext_exe.svg");}/* 설치파일 */
.ar_board .boardContentWrap i.fla{background-image: url("../img/file/svg/file_ext_fla.svg");}/* 플래시 */
.ar_board .boardContentWrap i.gul{background-image: url("../img/file/svg/file_ext_gul.svg");}/* gul? */
.ar_board .boardContentWrap i.htm{background-image: url("../img/file/svg/file_ext_htm.svg");}/* html */
.ar_board .boardContentWrap i.hwp{background-image: url("../img/file/svg/file_ext_hwp.svg");}/* 한글파일 */
.ar_board .boardContentWrap i.image{background-image: url("../img/file/svg/file_ext_img.svg");}/* 이미지 */
.ar_board .boardContentWrap i.mp3{background-image: url("../img/file/svg/file_ext_mp3.svg");}/* mp3 */
.ar_board .boardContentWrap i.mp4{background-image: url("../img/file/svg/file_ext_mp4.svg");}/* mp4 */
.ar_board .boardContentWrap i.pdf{background-image: url("../img/file/svg/file_ext_pdf.svg");}/* pdf */
.ar_board .boardContentWrap i.ppt{background-image: url("../img/file/svg/file_ext_ppt.svg");}/* ppt */
.ar_board .boardContentWrap i.psd{background-image: url("../img/file/svg/file_ext_psd.svg");}/* 포토샵 */
.ar_board .boardContentWrap i.txt{background-image: url("../img/file/svg/file_ext_txt.svg");}/* 텍스트 */
.ar_board .boardContentWrap i.xls{background-image: url("../img/file/svg/file_ext_xls.svg");}/* 엑셀 */
.ar_board .boardContentWrap i.zip{background-image: url("../img/file/svg/file_ext_zip.svg");}/* 압축파일 */

.ar_board .boardContentWrap i.big.ai{background-image: url("../img/file/svg/big/file_ext_ai.svg");}/* 일러스트 */
.ar_board .boardContentWrap i.big.doc{background-image: url("../img/file/svg/big/file_ext_doc.svg");}/* 문서 */
.ar_board .boardContentWrap i.big.etc{background-image: url("../img/file/svg/big/file_ext_etc.svg");}/* 기타 */
.ar_board .boardContentWrap i.big.exe{background-image: url("../img/file/svg/big/file_ext_exe.svg");}/* 설치파일 */
.ar_board .boardContentWrap i.big.fla{background-image: url("../img/file/svg/big/file_ext_fla.svg");}/* 플래시 */
.ar_board .boardContentWrap i.big.gul{background-image: url("../img/file/svg/big/file_ext_gul.svg");}/* gul? */
.ar_board .boardContentWrap i.big.htm{background-image: url("../img/file/svg/big/file_ext_htm.svg");}/* html */
.ar_board .boardContentWrap i.big.hwp{background-image: url("../img/file/svg/big/file_ext_hwp.svg");}/* 한글파일 */
.ar_board .boardContentWrap i.big.image{background-image: url("../img/file/svg/big/file_ext_img.svg");}/* 이미지 */
.ar_board .boardContentWrap i.big.mp3{background-image: url("../img/file/svg/big/file_ext_mp3.svg");}/* mp3 */
.ar_board .boardContentWrap i.big.mp4{background-image: url("../img/file/svg/big/file_ext_mp4.svg");}/* mp4 */
.ar_board .boardContentWrap i.big.pdf{background-image: url("../img/file/svg/big/file_ext_pdf.svg");}/* pdf */
.ar_board .boardContentWrap i.big.ppt{background-image: url("../img/file/svg/big/file_ext_ppt.svg");}/* ppt */
.ar_board .boardContentWrap i.big.psd{background-image: url("../img/file/svg/big/file_ext_psd.svg");}/* 포토샵 */
.ar_board .boardContentWrap i.big.txt{background-image: url("../img/file/svg/big/file_ext_txt.svg");}/* 텍스트 */
.ar_board .boardContentWrap i.big.xls{background-image: url("../img/file/svg/big/file_ext_xls.svg");}/* 엑셀 */
.ar_board .boardContentWrap i.big.zip{background-image: url("../img/file/svg/big/file_ext_zip.svg");}/* 압축파일 */

.boardListView.preview .boardPreviewCount {display: inline-flex; align-items: center; padding: 0 12px; height: 38px; min-height: 38px; box-sizing: border-box; border: 1px solid #DDDDDD; border-radius: 6px; background-color: #fff; white-space: nowrap; color: #000; font-size: 14px; font-weight: 500;}
.boardListView.preview .boardPreviewCount:hover {background-color: #F2F3F3;}
.boardListView.preview .boardPreviewCount.selected {background-color: #F2F3F3;}

.boardListView.preview .boardPreviewEmojiWrap {display: flex; align-items: center; padding: 8px 0; justify-content: space-between;}
.boardListView.preview .boardPreviewEmojiWrap > div {display: inline-flex; align-items: center;}
.boardListView.preview .boardPreviewEmojiWrap > div:nth-child(1) {overflow: hidden;}
.boardListView.preview .boardPreviewEmojiItem {display: inline-flex; align-items: center; height: 32px; min-height: 32px; box-sizing: border-box; border: 1px solid #DDDDDD; border-radius: 5px; background-color: #fff; margin-right: 10px; padding: 0 5px 0 10px;}
.boardListView.preview .boardPreviewEmojiItem:hover {background-color: #F2F3F3;}
.boardListView.preview .boardPreviewEmojiItem.selected {border-color: #B7C5FF; background-color: #ECF0FE;}
.boardListView.preview .boardPreviewEmojiItem > span {display: inline-block; width: 22px; height: 22px; min-width: 22px; margin-right: 10px; position: relative;}
.boardListView.preview .boardPreviewEmojiItem > span::after {position: absolute; content: ''; display: block; right: -10px; top: 50%; transform: translateY(-50%); width: 1px; height: 15px; background-color: #DDD;}
.ar_board .boardContentWrap span.love {background: url(../img/ar_main.svg) no-repeat -429px -2282px;}
.ar_board .boardContentWrap span.happy {background: url(../img/ar_main.svg) no-repeat -461px -2282px;}
.ar_board .boardContentWrap span.sad {background: url(../img/ar_main.svg) no-repeat -493px -2282px;}
.ar_board .boardContentWrap span.dismay {background: url(../img/ar_main.svg) no-repeat -525px -2282px;}
.ar_board .boardContentWrap span.good {background: url(../img/ar_main.svg) no-repeat -557px -2282px;}
.ar_board .boardContentWrap span.ok {background: url(../img/ar_main.svg) no-repeat -589px -2282px;}
.ar_board .boardContentWrap span.bad {background: url(../img/ar_main.svg) no-repeat -621px -2282px;}
.ar_board .boardContentWrap span.clap {background: url(../img/ar_main.svg) no-repeat -652px -2282px;}
.ar_board .boardContentWrap span.heart {background: url(../img/ar_main.svg) no-repeat -685px -2282px;}
.ar_board .boardContentWrap span.check {background: url(../img/ar_main.svg) no-repeat -718px -2282px;}
.ar_board .boardContentWrap span.sense {background: url(../img/ar_main.svg) no-repeat -749px -2282px;}
.ar_board .boardContentWrap span.loud {background: url(../img/ar_main.svg) no-repeat -781px -2282px;}
.ar_board .boardContentWrap span.one {background: url(../img/ar_main.svg) no-repeat -429px -2314px;}
.ar_board .boardContentWrap span.two {background: url(../img/ar_main.svg) no-repeat -461px -2314px;}
.ar_board .boardContentWrap span.three {background: url(../img/ar_main.svg) no-repeat -493px -2314px;}
.ar_board .boardContentWrap span.four {background: url(../img/ar_main.svg) no-repeat -525px -2314px;}
.boardListView.preview .boardPreviewEmojiItem > button {all: unset; font-size: 14px; color: #000; font-weight: bold; padding: 0 8px; cursor: pointer; margin-left: 3px; display: inline-flex; align-items: center; height: 22px; min-height: 22px; border-radius: 4px;}
.boardListView.preview .boardPreviewEmojiItem > button:hover {background-color: #DCE3FF;}
.boardListView.preview .boardPreviewEmojiItem > button.selected {background-color: #DCE3FF;}

.boardListView.preview .boardPreviewReactionWrap {display: flex; align-items: center; padding: 8px 0;}
.boardListView.preview .boardPreviewReactionWrap > div {display: flex; align-items: center; margin-right: 16px; padding-left: 20px; position: relative;}
.boardListView.preview .boardPreviewReactionWrap > div:first-child {padding-left: 0;}
.boardListView.preview .boardPreviewReactionWrap > div:last-child {margin-right: 0;}
.boardListView.preview .boardPreviewReactionWrap > div::before {content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; background-color: #B0B0B0; border-radius: 50%;}
.boardListView.preview .boardPreviewReactionWrap > div:first-child::before {display: none;}
.boardListView.preview .boardPreviewReactionWrap > div > a {display: inline-flex; align-items: center; font-size: 16px; color: #B0B0B0; white-space: nowrap; overflow: hidden; position: relative; top: 1px; pointer-events: none;}
.boardListView.preview .boardPreviewReactionWrap > div > a > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; margin-right: 3px;}
.boardListView.preview .boardPreviewReactionWrap > div > a.comment > i {background: url(../img/ar_main.svg) no-repeat -715px -2256px;}
.boardListView.preview .boardPreviewReactionWrap > div > a > span {color: #000; margin-left: 4px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

/* 관리자 공지 해제 */
.boardListView.admin .boardListTitle > div:nth-child(1) > .boardListNotifyWrap > span.notifyIcon {cursor: pointer;}
.boardListView.list.admin .boardListTitle > div:nth-child(1) > .boardListNotifyWrap > span.notifyIcon:hover {background-position: -802px -2252px;}
.boardListView.preview.admin .boardListTitle > div:nth-child(1) > .boardListNotifyWrap > span.notifyIcon:hover {background-position: -802px -2253px;}

/* 빈화면 */
.boardListView.empty {align-items: center; justify-content: center; padding-top: 0;}
.boardListView.empty > div {display: flex; flex-direction: column; align-items: center; transform: translateY(-100px);}
.boardListView.empty > div > span {display: inline-block; width: 136px; height: 136px; background: url(../img/ar_main.svg) no-repeat;}
.boardListView.empty > div > span.empty {background-position: -694px -1225px;}
.boardListView.empty > div > span.result {background-position: -297px -1370px;}
.boardListView.empty > div > p {color: #000; font-size: 16px; font-weight: bold; padding-top: 10px; white-space: nowrap;}

.boardTab {display: flex; align-items: center;}
.boardTab > a {display: inline-flex; margin-right: 20px; position: relative; height: 100%; align-items: center;}
.boardTab > a::before {display: none; content: ''; position: absolute; bottom: -13px; left: 0; width: 100%; height: 2px; background-color: var(--main-color); pointer-events: none;}
.boardTab > a > p {font-size: 16px; color: #000; font-weight: 400; display: inline-block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; max-width: 215px;}
.boardTab > a.on::before {display: block;}
.boardTab > a.on > p {font-weight: bold;}

/* 게시판 - 쓰기 */
.boardWriteSelect {display: flex; align-items: center; width: 100%; -webkit-appearance: none; appearance: none; outline: none; border: none; border-bottom: 1px solid #ddd; height: 26px; padding: 2px 30px 2px 3px; position: relative; cursor: pointer; z-index: 1; background-color: transparent; overflow: hidden; box-sizing: border-box;}
.boardWriteSelect > p {font-size: 15px; color: #000; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.boardWriteSelect > p.placeholder {color: #999;}
.boardWriteWrap .select_bullet {background: url(../img/ar_main.svg) no-repeat -485px -132px; width: 25px; height: 25px; position: absolute; right: 2px; top: 50%; transform: translateY(-50%);}
.boardWriteTitleOption {display: flex; align-items: center; min-height: 30px; margin-top: 6px;}
.boardWriteTitleOption > label {display: inline-flex; align-items: center; font-size: 15px; color: #000;}
.boardWriteTitleOption > label > input {margin-right: 6px;}
.boardWriteWrap .mailWriteItem .txtTlt, table.mailWriteItem th {line-height: 26px;}

/* 게시판 - 읽기 */
.boardViewWrap {display: flex; height: calc(100% - 41px);}
.boardViewWrap > div {display: flex; flex-direction: column; width: 100%; overflow-y: auto;}
.boardViewTop {display: flex; flex-direction: column; padding: 0 26px;}

.boardViewTitleWrap {display: flex; flex-direction: column; padding: 20px 0 18px; border-bottom: 1px solid #EBEBEB;}
.boardViewTitleWrap > div {display: flex; align-items: center; justify-content: space-between;}
.boardViewTitleWrap > div:nth-child(1) {padding-bottom: 16px;}

.boardViewTitle {justify-content: center; flex: 1; min-width: 0; overflow: hidden; align-items: center; display: flex;}
.boardViewTitle > div {width: 100%; line-height: 26px;}
.boardViewTitle > div > span {font-size: 20px; color: #ABABAB; font-weight: bold; position: relative; top: 2px; display: inline; padding-right: 6px;}
.boardViewTitle > div > h1 {font-size: 20px; color: #000; font-weight: bold; position: relative; top: 2px; display: inline;}
.boardViewTitle > div > .boardViewNotifyWrap { margin-right: 8px; display: inline-flex; align-items: center; position: relative; top: 5px;}
.boardViewTitle > div > .boardViewNotifyWrap > span.notifyIcon {display: inline-block; width: 20px; height: 20px; min-width: 20px; background: url(../img/ar_main.svg) no-repeat -573px -2252px;}
.boardViewTitle > div > .boardViewNotifyWrap > span.mustRead {display: inline-flex; height: 18px; min-height: 18px; box-sizing: border-box; color: #fff; background-color: var(--error-color); border-radius: 4px; align-items: center; padding: 0 7px; font-size: 12px; margin-left: 8px; white-space: nowrap;}
.boardViewTitle > div > .boardViewInfoWrap {margin-left: 6px; display: inline-flex; align-items: center; position: relative; top: 2px;}
.boardViewTitle > div > .boardViewInfoWrap > span {display: inline-block; width: 16px; height: 16px; min-width: 16px;}
.boardViewTitle > div > .boardViewInfoWrap > span.newIcon {background: url(../img/ar_main.svg) no-repeat -665px -2255px;}

.boardViewOption {display: flex; align-items: flex-start; padding-left: 40px; height: 100%;}
.boardViewOption > button {all: unset; cursor: pointer; display: inline-flex; align-items: center; padding: 0 10px; box-sizing: border-box; border: 1px solid #E7E7E7; border-radius: 4px; height: 32px; max-width: 180px; overflow: hidden;}
.boardViewOption > button > span {font-size: 15px; color: #898989; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.boardViewOption > .boardViewBookmark {display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; min-width: 32px; box-sizing: border-box; border: 1px solid #ddd; background-color: #fff; border-radius: 5px; margin-left: 12px;}
.boardViewOption > .boardViewBookmark:hover {background-color: #F2F3F3;}
.boardViewOption > .boardViewBookmark > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -355px -2256px;}
.boardViewOption > .boardViewBookmark.on > span {background-position: -377px -2256px;}
.boardViewOption > .boardViewMore {display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; min-width: 28px; box-sizing: border-box; border: 1px solid #ddd; background-color: #fff; border-radius: 5px; margin-left: 12px;}
.boardViewOption > .boardViewMore:hover {background-color: #F2F3F3;}
.boardViewOption > .boardViewMore > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -390px -420px;}

.boardViewName {display: flex; align-items: center; flex: 1; min-width: 0; overflow: hidden; min-height: 28px;}
.boardViewName > div {display: flex; align-items: center; width: 100%;}
.boardViewName .boardViewProfile {display: flex; align-items: center; margin-right: 8px; overflow: hidden; pointer-events: none;}
.boardViewName .boardViewProfile > span {display: inline-block; width: 26px; height: 26px; min-width: 26px; background-repeat: no-repeat; border-radius: 10px; margin-right: 8px;}
.boardViewName .boardViewProfile > span.default {background-image: url(../img/ar_main.svg); background-position: -408px -2245px;}
.boardViewName .boardViewProfile > p {font-size: 16px; color: #000; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}

.boardViewName .boardViewDepart {display: inline-flex; align-items: center; padding: 0 6px; border: 1px solid #e7e7e7; height: 20px; box-sizing: border-box; margin-right: 12px; border-radius: 4px;}
.boardViewName .boardViewDepart > span {font-size: 13px; color: #898989; display: inline-block; width: 100%; white-space: nowrap;}

.boardViewName .boardViewTime {display: inline-flex; align-items: center; padding-left: 20px; position: relative;}
.boardViewName .boardViewTime::before {display: block; width: 4px; height: 4px; background-color: #B0B0B0; border-radius: 50%; content: ''; left: 6px; top: 50%; transform: translateY(-50%); position: absolute;}
.boardViewName .boardViewTime > p {font-size: 15px; color: #595959; font-weight: 500; white-space: nowrap;}
.boardViewName .boardViewTime + .boardViewWriter {padding-left: 8px;}

.boardViewName .boardViewWriter {display: inline-flex; align-items: center; padding-left: 0;}
.boardViewName .boardViewWriter > span {display: inline-flex; align-items: center; border: 1px solid #B2C2FF; border-radius: 10px; padding: 0 6px; height: 17px; font-size: 12px; color: var(--main-color); font-weight: 500; box-sizing: border-box; white-space: nowrap;}

.boardViewReaction {display: flex; align-items: center; padding: 8px 0 8px 40px;}
.boardViewContentWrap .boardViewReaction {padding: 15px 0 8px;}
.boardViewReaction > div {display: flex; align-items: center; margin-right: 16px; padding-left: 20px; position: relative;}
.boardViewReaction > div:first-child {padding-left: 0;}
.boardViewReaction > div:last-child {margin-right: 0;}
.boardViewReaction > div::before {content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; background-color: #B0B0B0; border-radius: 50%;}
.boardViewReaction > div:first-child::before {display: none;}
.boardViewReaction > div > a {display: inline-flex; align-items: center; font-size: 15px; color: #B0B0B0; white-space: nowrap; overflow: hidden; position: relative; top: 1px; pointer-events: none;}
.boardViewReaction > div > a > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; margin-right: 3px;}
.boardViewReaction > div > a.comment > i {background: url(../img/ar_main.svg) no-repeat -715px -2256px;}
.boardViewReaction > div > a > span {color: #000; margin-left: 4px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

.boardViewContentWrap {display: flex; flex-direction: column; padding: 36px 0; border-bottom: 1px solid #EBEBEB;}
.boardViewContentWrap > div:not(.boardViewContent) {display: flex; flex-direction: column; padding-top: 32px;}

.boardViewContent * {max-width: 100%;}
.boardViewContent > p {font-size: 14px; line-height: 22px;}

.boardViewEmoji {display: inline-flex; align-items: center; padding-bottom: 8px; flex-wrap: wrap;}
.boardViewEmojiItem {display: inline-flex; align-items: center; height: 32px; min-height: 32px; box-sizing: border-box; border: 1px solid #DDDDDD; border-radius: 5px; background-color: #fff; padding: 0 5px 0 10px; margin: 8px 10px 0 0;}
.boardViewEmojiItem:hover {background-color: #F2F3F3;}
.boardViewEmojiItem.selected {border-color: #B7C5FF; background-color: #ECF0FE;}
.boardViewEmojiItem > span {display: inline-block; width: 22px; height: 22px; min-width: 22px; margin-right: 10px; position: relative;}
.boardViewEmojiItem > span::after {position: absolute; content: ''; display: block; right: -10px; top: 50%; transform: translateY(-50%); width: 1px; height: 15px; background-color: #DDD;}
.boardViewEmojiItem > button {all: unset; font-size: 14px; color: #000; font-weight: bold; padding: 0 8px; cursor: pointer; margin-left: 3px; display: inline-flex; align-items: center; height: 22px; min-height: 22px; border-radius: 4px;}
.boardViewEmojiItem > button:hover {background-color: #DCE3FF;}
.boardViewEmojiItem > button.selected {background-color: #DCE3FF;}

.boardViewCommentWrap {display: flex; flex-direction: column;}
.boardViewCommentWrap > div {display: flex; flex-direction: column; max-width: 1000px;}

.boardViewCommentTitle {display: flex; padding: 28px 0 12px; align-items: center; justify-content: space-between;}
.boardViewCommentTitle > h1 {font-size: 17px; color: #000; font-weight: bold; white-space: nowrap; position: relative; top: 1px;}
.boardViewCommentTitle > div {display: inline-flex; align-items: center; padding-right: 10px;}
.boardViewCommentTitle > div > button {all: unset; display: inline-flex; align-items: center; cursor: pointer; margin-left: 8px;}
.boardViewCommentTitle > div > button > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -50px -246px; margin-right: 4px; opacity: 0;}
.boardViewCommentTitle > div > button > p {font-size: 16px; color: #B0B0B0; font-weight: 500; position: relative; top: 2px; white-space: nowrap;}
.boardViewCommentTitle > div > button.on > span {opacity: 1;}
.boardViewCommentTitle > div > button.on > p {color: #000;}

.boardViewCommentList {display: flex; flex-direction: column;}
.boardViewCommentList > ul {display: flex; flex-direction: column;}

.boardViewCommentItem {display: flex; box-sizing: border-box; border-bottom: 1px solid #F4F4F4; padding: 16px 0; position: relative;}
.boardViewCommentItem > div {display: flex; flex-direction: column; box-sizing: border-box;}
.boardViewCommentItem > div.boardViewCommentReplyIconWrap {padding: 6px 9px 6px 16px;}
.boardViewCommentItem > div.boardViewCommentReplyIconWrap > span {display: inline-block; width: 13px; height: 13px; min-width: 13px; background: url(../img/ar_main.svg) no-repeat -201px -2331px;}
.boardViewCommentItem > div.boardViewCommentItemWrap {flex: 1; overflow: hidden;}

.boardViewCommentItemHead {display: flex; align-items: center; justify-content: space-between;}
.boardViewCommentItemHead .boardViewName .boardViewProfile > span {display: inline-block; width: 20px; height: 20px; min-width: 20px; background-repeat: no-repeat; margin-right: 10px; border-radius: 6px;}
.boardViewCommentItemHead .boardViewName .boardViewProfile > span.default {background-image: url(../img/ar_main.svg); background-position: -441px -2252px;}
.boardViewCommentItemHead .boardViewName .boardViewProfile > p {font-size: 15px;}
.boardViewCommentItemHead .boardViewName .boardViewDepart {margin-right: 8px;}
.boardViewCommentItemHead .boardViewName .boardViewTime > p {font-size: 14px;}

.boardViewCommentItemContent {display: flex; padding: 12px 0 14px 30px;}
.boardViewCommentItemContent > p {font-size: 14px; color: #000; line-height: 22px;}
.boardViewCommentItemContent > p > span {font-weight: bold; margin-right: 8px; color: #b0b0b0;}
.boardViewCommentItemContent .boardViewCommentInput {flex: 1; padding: 0;}
.boardViewCommentItemContent .boardViewCommentInput > div {border-color: var(--main-color);}
.boardViewCommentItemContent .boardViewCommentInputWrap {display: flex;}

.boardViewCommentItemBottom {display: flex; padding-left: 30px;}
.boardViewCommentItemBottom .replyBtn {all: unset; font-size: 14px; color: #000; font-weight: 500; cursor: pointer; border: 1px solid #CBCBCB; box-sizing: border-box; display: inline-flex; align-items: center; padding: 0 8px; height: 22px; min-height: 22px; line-height: 22px;}

.boardViewCommentInput {display: flex; flex-direction: column; padding: 22px 0 70px;}
.boardViewCommentInput > div {display: flex; flex-direction: column; box-sizing: border-box; border: 1px solid #C7C8CB; border-radius: 6px;}
.boardViewCommentInput.on > div {border-color: var(--main-color);}
.boardViewCommentInput.on .boardViewCommentInputPlaceholder {display: none;}
.boardViewCommentInput.on .boardViewCommentInputWrap {display: flex;}

.boardViewCommentInputPlaceholder {display: flex; align-items: center; min-height: 58px; padding: 0 24px; cursor: pointer;}
.boardViewCommentInputPlaceholder > p {font-size: 15px; color: #BFBFBF; font-weight: 500; white-space: nowrap;}

.boardViewCommentInputWrap {display: none; flex-direction: column; padding: 15px 20px; overflow: hidden;}
.boardViewCommentInputWrap > div {display: flex;}
.boardViewCommentInputWrap > div > textarea {width: 100%; -webkit-appearance: none; appearance: none; border: none; resize: none; box-sizing: border-box; padding: 5px 4px 0; font-size: 15px; line-height: 24px; color: #000; min-height: 87px; font-weight: 500;}
.boardViewCommentInputWrap > div > textarea::placeholder {font-size: 15px; color: #BFBFBF;}
.boardViewCommentInputWrap > div:nth-child(2) {align-items: center; justify-content: flex-end; padding-top: 15px;}
.boardViewCommentInputWrap > div > div {display: inline-flex;}
.boardViewCommentInputWrap > div > div > button {all: unset; box-sizing: border-box; cursor: pointer; font-size: 15px; color: #333; padding: 0 27px; display: inline-flex; align-items: center; height: 28px; min-height: 28px; white-space: nowrap;}
.boardViewCommentInputWrap > div > div > button.registBtn {border: 1px solid #666666; font-weight: bold;}
.boardViewCommentInputWrap > div > div > button.cancelBtn {border: 1px solid #CBCBCB; margin-left: 8px;}

.boardViewBottom {display: flex; flex-direction: column; box-sizing: border-box; border-top: 1px solid #E5E5E5; padding-bottom: 40px;}
.boardViewBottom > ul {display: flex; flex-direction: column;}

.boardViewPagingItem {display: flex; align-items: center; height: 40px; min-height: 40px; box-sizing: border-box; border-bottom: 1px solid #F4F4F4; padding: 0 40px 0 20px;}
.boardViewPagingItem:hover {background-color: #FBFCFF;}
.boardViewPagingItem > div {display: flex; align-items: center; height: 100%;}
.boardViewPagingDirection > a {box-sizing: border-box; display: inline-flex; align-items: center;}
.boardViewPagingDirection > a > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; position: relative; top: -1px;}
.boardViewPagingItem.prev .boardViewPagingDirection > a > span {background: url(../img/ar_main.svg) no-repeat -116px -554px;}
.boardViewPagingItem.next .boardViewPagingDirection > a > span {background: url(../img/ar_main.svg) no-repeat -159px -554px;}
.boardViewPagingDirection > a > p {font-size: 15px; color: #000; font-weight: 500; white-space: nowrap; padding-left: 22px;}

.boardViewPagingTitle {padding: 0 50px; flex: 1; overflow: hidden;}
.boardViewPagingTitle > a {display: inline-block; font-size: 15px; color: #000; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.boardViewPagingTitle > a:hover {text-decoration: underline;}

.boardViewPagingSort > button {all: unset; cursor: pointer; box-sizing: border-box; display: inline-block; padding: 0 7px; height: 20px; border: 1px solid #E7E7E7; max-width: 150px; border-radius: 4px; background-color: #fff; color: #898989; font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.boardViewPagingName {justify-content: flex-end; min-width: 95px; width: 95px;}
.boardViewPagingName > p {font-size: 15px; color: #000; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 70px;}

.boardViewPagingTime {justify-content: flex-end; min-width: 140px; width: 140px;}
.boardViewPagingTime > p {font-size: 13px; color: #555555; font-weight: 500; white-space: nowrap;}

/* 게시판 쓰기 */
.boardWriteContainer {display: flex; flex-direction: column; flex: 1; overflow: hidden;}
.boardWriteWrap {display: flex; height: calc(100% - 41px); flex-direction: column;}

.boardWriteOptionWrap {display: flex; align-items: center; box-sizing: border-box; min-height: 60px; border-top: 1px solid #E5E5E5; background-color: #fff;}
.boardWriteOptionWrap > div:nth-child(1) {display: flex; align-items: center; height: 100%; width: 125px; min-width: 125px;}
.boardWriteOptionWrap > div:nth-child(1) > p {padding-left: 18px; height: 100%; white-space: nowrap; display: flex; align-items: center; font-size: 14px; color: #0f0f0f; font-weight: bold;}

.boardWriteOptionWrap > div:nth-child(2) {display: inline-flex; align-items: center; height: 100%;}
.boardWriteEmoji {display: inline-flex; align-items: center; padding-bottom: 8px; flex-wrap: wrap;}
.boardWriteEmojiItem {display: inline-flex; align-items: center; height: 32px; min-height: 32px; box-sizing: border-box; border: 1px solid #DDDDDD; border-radius: 5px; background-color: #fff; padding: 0 5px 0 10px; margin: 8px 10px 0 0;}
.boardWriteEmojiItem:hover {background-color: #F2F3F3;}
.boardWriteEmojiItem.selected {border-color: #B7C5FF; background-color: #ECF0FE;}
.boardWriteEmojiItem > span {display: inline-block; width: 22px; height: 22px; min-width: 22px; margin-right: 10px; position: relative;}
.boardWriteEmojiItem > span::after {position: absolute; content: ''; display: block; right: -10px; top: 50%; transform: translateY(-50%); width: 1px; height: 15px; background-color: #DDD;}
.boardWriteEmojiItem > button {all: unset; font-size: 14px; color: #000; font-weight: bold; padding: 0 2px; cursor: pointer; margin-left: 3px; display: inline-flex; align-items: center; height: 22px; min-height: 22px; border-radius: 4px;}
.boardWriteEmojiItem > button > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -115px -620px;}
.boardWriteEmojiItem.selected > button > span {background-position: -94px -620px;}

.boardWriteEmojiAdd {display: inline-flex; align-items: center; position: relative; padding-left: 10px;}
.boardWriteEmojiAdd::before {position: absolute; left: 0; top: calc(50% + 4px); transform: translateY(-50%); width: 1px; height: 28px; background-color: #DDDDDD; display: block; content: '';}
.boardWriteEmojiAddItem {display: inline-flex; align-items: center; min-width: 32px; height: 32px; min-height: 32px; box-sizing: border-box; border: 1px solid #DDDDDD; border-radius: 5px; background-color: #fff; margin: 8px 10px 0 0; justify-content: center;}
.boardWriteEmojiAddItem:hover {background-color: #F2F3F3;}
.boardWriteEmojiAddItem.selected {border-color: #B7C5FF; background-color: #ECF0FE;}
.boardWriteEmojiAddItem > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -379px -400px;}

/* 게시판 상세검색 레이어 */
.boardDetailSearch.detailSearch {width: 430px;}
.boardDetailSearch.detailSearch .detailSearch_cont > div > label {white-space: nowrap;}
.boardDetailSearch.detailSearch .detailSearch_cont > div:nth-child(1) > select {width: 100%; background-position: right 50%; margin-right: 0;}
.boardDetailSearch.detailSearch .detailSearch_cont > div:nth-child(2) > select {width: 115px; background-position: right 50%;}
.boardDetailSearch.detailSearch .detailSearch_cont > div:nth-of-type(2) > input[type=text] {flex: 1;}
.boardDetailSearch.detailSearch .detailSearch_cont > div:nth-child(3) > select {width: 115px; background-position: right 50%; margin-right: 6px !important; min-width: 115px;}
.boardDetailSearch.detailSearch .detailSearch_cont > div > label:first-of-type {min-width: 60px; width: 60px;}
.boardDetailSearch.detailSearch #ipt_start_date {flex: 1; min-width: 0;}
.boardDetailSearch.detailSearch #ipt_end_date {flex: 1; min-width: 0;}
.boardDetailSearch.detailSearch .detailSearch_cont > div:last-of-type {padding-left: 70px;}
.boardDetailSearch.detailSearch .detailSearch_cont > div:last-of-type > div {display: flex; align-items: center; margin-right: 26px;}
.boardDetailSearch.detailSearch .detailSearch_cont > div:last-of-type > div > label {font-size: 14px; color: #0f0f0f; margin-left: 6px;}

/* 게시판 레이어 공통 */
.boardLayer {box-sizing: border-box; background-color: #fff; border: 1px solid #DDDDDD; border-radius: 8px; box-shadow: 0 3px 6px #00000029; z-index: 1000; position: absolute;}
.boardLayer.angle {border-color: #B3B3B3; border-radius: 0;}

.boardLayer span.folder{background: url("../img/file/svg/file_folder.svg");}/* 폴더 */
.boardLayer span.ai{background-image: url("../img/file/svg/file_ext_ai.svg");}/* 일러스트 */
.boardLayer span.doc{background-image: url("../img/file/svg/file_ext_doc.svg");}/* 문서 */
.boardLayer span.etc{background-image: url("../img/file/svg/file_ext_etc.svg");}/* 기타 */
.boardLayer span.exe{background-image: url("../img/file/svg/file_ext_exe.svg");}/* 설치파일 */
.boardLayer span.fla{background-image: url("../img/file/svg/file_ext_fla.svg");}/* 플래시 */
.boardLayer span.gul{background-image: url("../img/file/svg/file_ext_gul.svg");}/* gul? */
.boardLayer span.htm{background-image: url("../img/file/svg/file_ext_htm.svg");}/* html */
.boardLayer span.hwp{background-image: url("../img/file/svg/file_ext_hwp.svg");}/* 한글파일 */
.boardLayer span.image{background-image: url("../img/file/svg/file_ext_img.svg");}/* 이미지 */
.boardLayer span.mp3{background-image: url("../img/file/svg/file_ext_mp3.svg");}/* mp3 */
.boardLayer span.mp4{background-image: url("../img/file/svg/file_ext_mp4.svg");}/* mp4 */
.boardLayer span.pdf{background-image: url("../img/file/svg/file_ext_pdf.svg");}/* pdf */
.boardLayer span.ppt{background-image: url("../img/file/svg/file_ext_ppt.svg");}/* ppt */
.boardLayer span.psd{background-image: url("../img/file/svg/file_ext_psd.svg");}/* 포토샵 */
.boardLayer span.txt{background-image: url("../img/file/svg/file_ext_txt.svg");}/* 텍스트 */
.boardLayer span.xls{background-image: url("../img/file/svg/file_ext_xls.svg");}/* 엑셀 */
.boardLayer span.zip{background-image: url("../img/file/svg/file_ext_zip.svg");}/* 압축파일 */

/* 게시판 - 프로필 레이어 */
.boardLayer.boardProfile {display: flex; flex-direction: column; min-width: 300px; max-width: 500px; top: 265px; left: 333px; padding: 22px 24px;}
.boardLayer.boardProfile .boardProfileInfo {display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 12px;}
.boardLayer.boardProfile .boardProfileInfo > div:nth-child(1) {display: flex; align-items: center; flex-wrap: wrap; overflow: hidden;}
.boardLayer.boardProfile .boardProfileInfo > div:nth-child(1) > p {color: #000; font-size: 16px; font-weight: bold; margin-right: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; top: 2px;}
.boardLayer.boardProfile .boardProfileInfo > div:nth-child(1) > span {color: #555555; font-size: 14px; font-weight: 400; display: inline-block; margin-right: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; top: 2px;}
.boardLayer.boardProfile .boardProfileInfo > div:nth-child(2) {display: flex; align-items: flex-start; padding-left: 10px;}
.boardLayer.boardProfile .boardProfileInfo > div:nth-child(2) > button {all: unset; display: inline-flex; align-items: center; cursor: pointer; box-sizing: border-box; height: 22px; border: 1px solid #ddd; border-radius: 4px; font-size: #555555; font-size: 12px; padding: 0 7px; white-space: nowrap;}
.boardLayer.boardProfile .boardProfilePosition {display: flex; align-items: center; padding-bottom: 12px; overflow: hidden;}
.boardLayer.boardProfile .boardProfilePosition > span {font-size: 14px; display: inline-block; color: #555555; padding-left: 20px; position: relative; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.boardLayer.boardProfile .boardProfilePosition > span:first-child {padding-left: 0;}
.boardLayer.boardProfile .boardProfilePosition > span::before {content: ''; display: block; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; border-radius: 50%; background-color: #B0B0B0;}
.boardLayer.boardProfile .boardProfilePosition > span:first-child::before {display: none;}
.boardLayer.boardProfile .boardProfileBtn {display: flex; padding-top: 8px;}
.boardLayer.boardProfile .boardProfileBtn > button {all: unset; box-sizing: border-box; cursor: pointer; height: 38px; width: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; border-radius: 5px; color: #000; font-size: 16px; font-weight: 400;}

/* 게시판 - 첨부파일 미리보기 레이어 */
.boardLayer.boardPreviewAttachList {display: flex; flex-direction: column; min-width: 340px; max-width: 340px; padding: 16px; top: 598px; left: 573px;}
.boardLayer.boardPreviewAttachList > ul {display: flex; flex-direction: column; overflow-y: auto; max-height: 172px;}
.boardLayer.boardPreviewAttachList > ul > li {margin-bottom: 8px;}
.boardLayer.boardPreviewAttachList > ul > li:last-child {margin-bottom: 0;}
.boardLayer.boardPreviewAttachList > ul > li > a {display: flex; align-items: center; height: 28px; padding: 0 8px; overflow: hidden;}
.boardLayer.boardPreviewAttachList > ul > li > a > span {display: inline-block; width: 15px; height: 15px; min-width: 15px; margin-right: 8px;}
.boardLayer.boardPreviewAttachList > ul > li > a > p {display: block; position: relative; top: 0.5px; white-space: nowrap; color: #555555; font-size: 14px; overflow: hidden; text-overflow: ellipsis;}
.boardLayer.boardPreviewAttachList > ul > li > a > p > span {display: inline-block; white-space: nowrap; color: #B0B0B0; padding-left: 6px;}

/* 게시판 - 반응멤버 보기 레이어 */
.boardLayer.boardReactionMemberList {display: flex; flex-direction: column; min-width: 230px; max-width: 350px; padding: 17px 0 20px; top: 644px; left: 302px;}
.boardLayer.boardReactionMemberList > h6 {font-size: 16px; color: #000; padding: 0 20px 8px; font-weight: 500;}
.boardLayer.boardReactionMemberList > ul {display: flex; flex-direction: column; padding-top: 18px; border-top: 1px solid #E9EBEE; overflow-y: auto; max-height: 84px;}
.boardLayer.boardReactionMemberList > ul > li {display: flex; align-items: center; padding: 0 20px; height: 20px; min-height: 20px; margin-bottom: 12px; overflow: hidden;}
.boardLayer.boardReactionMemberList > ul > li:last-child {margin-bottom: 0;}
.boardLayer.boardReactionMemberList > ul > li > .profile {display: inline-block; width: 20px; height: 20px; min-width: 20px; margin-right: 10px; background-repeat: no-repeat; border-radius: 6px;}
.boardLayer.boardReactionMemberList > ul > li > .profile.default {background-image: url(../img/ar_main.svg); background-position: -441px -2252px;}
.boardLayer.boardReactionMemberList > ul > li > .name {font-size: 15px; color: #000; white-space: nowrap; margin-right: 8px; overflow: hidden; text-overflow: ellipsis;}
.boardLayer.boardReactionMemberList > ul > li > .depart {font-size: 12px; color: #898989; border: 1px solid #e7e7e7; display: inline-flex; align-items: center; padding: 0 6px; height: 20px; box-sizing: border-box; white-space: nowrap; border-radius: 4px;}

/* 게시판 - 임시저장 레이어 */
.boardLayer.temporaryStorage {display: flex; flex-direction: column; min-width: 670px; max-width: 670px;}
.boardLayer.temporaryStorage > div {display: flex; flex-direction: column; padding: 24px 24px 10px;}
.boardLayer.temporaryStorage > div > div:nth-child(1) {display: flex; align-items: center; justify-content: space-between; padding-bottom: 17px;}
.boardLayer.temporaryStorage > div > div:nth-child(1) > h1 {font-size: 18px; font-weight: bold; color: #333;}
.boardLayer.temporaryStorage > div > div:nth-child(1) > .closeBtn {all: unset; display: block; width: 16px; height: 16px; min-width: 16px; cursor: pointer; background: url(../img/ar_main.svg) no-repeat -7px -555px; position: relative; top: -4px;}
.boardLayer.temporaryStorage > div > div:nth-child(2) {display: flex; align-items: flex-end; justify-content: space-between;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(1) {display: flex; align-items: center;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(1) > p {display: inline-block; font-size: 15px; color: #000; font-weight: 500; white-space: nowrap;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(1) > p > span {display: inline-block; margin-left: 4px; font-weight: bold; color: var(--main-color); white-space: nowrap;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(1) > span {display: inline-block; font-size: 15px; color: #898989; font-weight: 500; margin-left: 10px; white-space: nowrap;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) {display: flex; align-items: center;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) > div {display: flex; align-items: center; padding: 0 8px; position: relative;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) > div::before {display: block; content: ''; position: absolute; left: -1px; top: 50%; transform: translateY(-50%); width: 1px; height: 100%; background-color: #EEEEEE;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) > div:first-child {padding-left: 0;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) > div:first-child::before {display: none;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) > div:last-child {padding-right: 0;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) > div > button {all: unset; display: inline-flex; align-items: center; box-sizing: border-box; border: 1px solid #ABABAB; height: 28px; padding: 0 14px; cursor: pointer; font-size: 15px; color: #0f0f0f; font-weight: 400; margin-left: 8px; white-space: nowrap;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) > div > button.b {font-weight: bold;}
.boardLayer.temporaryStorage > div > div:nth-child(2) > div:nth-child(2) > div > button:first-child {margin-left: 0;}

.boardLayer.temporaryStorage .boardTemporaryList {display: flex; flex-direction: column; padding: 10px 0; border-top: 1px solid #E5E5E5; box-sizing: border-box; max-height: 538px; min-height: 406px; overflow-y: auto;}
.boardLayer.temporaryStorage .boardTemporaryItem > a {display: flex; align-items: center; height: 66px; min-height: 66px; box-sizing: border-box; border-bottom: 1px solid #F4F4F4; padding: 0 24px;}
.boardLayer.temporaryStorage .boardTemporaryItem > a:hover {background-color: #FBFCFF;}
.boardLayer.temporaryStorage .boardTemporaryItem.selected > a {background-color: #F7F9FF;}
.boardLayer.temporaryStorage .boardTemporaryItem:last-child > a {border-bottom: none;}
.boardLayer.temporaryStorage .boardTemporaryItem > a > div {flex-direction: column; height: 100%; justify-content: center; box-sizing: border-box;}
.boardLayer.temporaryStorage .boardTemporaryCheck {justify-content: flex-start !important; padding: 14px 12px 0 0; display: none;}
.boardLayer.temporaryStorage .boardTemporaryTitle {flex: 1; overflow: hidden; display: flex;}
.boardLayer.temporaryStorage .boardTemporaryTitle > p {color: #000; font-size: 15px; font-weight: bold; white-space: nowrap; padding-bottom: 7px; overflow: hidden; text-overflow: ellipsis;}
.boardLayer.temporaryStorage .boardTemporaryTitle > span {color: #898989; font-size: 14px; font-weight: 500; white-space: nowrap;}
.boardLayer.temporaryStorage .boardTemporaryOption {padding-left: 20px; display: none;}
.boardLayer.temporaryStorage .boardTemporaryOption > button {all: unset; display: inline-block; width: 16px; height: 16px; min-width: 16px; box-sizing: border-box; cursor: pointer;}
.boardLayer.temporaryStorage .boardTemporaryOption > button.boardTemporaryTrash {background: url(../img/ar_main.svg) no-repeat -161px -378px;}

.boardLayer.temporaryStorage .boardTemporaryItem > a:hover .boardTemporaryOption {display: flex;}
.boardLayer.temporaryStorage .boardTemporaryList.edit .boardTemporaryCheck {display: flex;}
.boardLayer.temporaryStorage .boardTemporaryList.edit .boardTemporaryItem > a:hover .boardTemporaryOption {display: none;}

/* 게시판 - 이모지 레이어 */
.boardLayer.emojiList {display: flex;}
.boardLayer.emojiList > ul {display: grid; grid-template-rows: repeat(4, 1fr); grid-template-columns: repeat(4, 1fr); gap: 7px; padding: 10px;}
.boardLayer.emojiList > ul > li > a {display: inline-flex; justify-content: center; align-items: center; padding: 3px; border-radius: 4px;}
.boardLayer.emojiList > ul > li > a:hover {background-color: #DCE3FF;}
.boardLayer.emojiList > ul > li > a > span {display: inline-block; width: 22px; height: 22px; min-width: 22px; position: relative;}
.boardLayer span.love {background: url(../img/ar_main.svg) no-repeat -429px -2282px;}
.boardLayer span.happy {background: url(../img/ar_main.svg) no-repeat -461px -2282px;}
.boardLayer span.sad {background: url(../img/ar_main.svg) no-repeat -493px -2282px;}
.boardLayer span.dismay {background: url(../img/ar_main.svg) no-repeat -525px -2282px;}
.boardLayer span.good {background: url(../img/ar_main.svg) no-repeat -557px -2282px;}
.boardLayer span.ok {background: url(../img/ar_main.svg) no-repeat -589px -2282px;}
.boardLayer span.bad {background: url(../img/ar_main.svg) no-repeat -621px -2282px;}
.boardLayer span.clap {background: url(../img/ar_main.svg) no-repeat -652px -2282px;}
.boardLayer span.heart {background: url(../img/ar_main.svg) no-repeat -685px -2282px;}
.boardLayer span.check {background: url(../img/ar_main.svg) no-repeat -718px -2282px;}
.boardLayer span.sense {background: url(../img/ar_main.svg) no-repeat -749px -2282px;}
.boardLayer span.loud {background: url(../img/ar_main.svg) no-repeat -781px -2282px;}
.boardLayer span.one {background: url(../img/ar_main.svg) no-repeat -429px -2314px;}
.boardLayer span.two {background: url(../img/ar_main.svg) no-repeat -461px -2314px;}
.boardLayer span.three {background: url(../img/ar_main.svg) no-repeat -493px -2314px;}
.boardLayer span.four {background: url(../img/ar_main.svg) no-repeat -525px -2314px;}

/* 게시판 - 게시글 이동 레이어 */
.boardLayer.boardItemMove {display: flex; flex-direction: column; min-width: 290px; max-width: 290px; padding: 14px 0 15px;}
.boardLayer.boardItemMove > ul {display: flex; flex-direction: column; max-height: 256px; overflow-y: auto; box-sizing: border-box; padding-bottom: 14px;}
.boardLayer.boardItemMove > ul > li > a {display: flex; align-items: center; height: 30px; min-height: 30px; padding: 6px 15px 6px 38px; position: relative; overflow: hidden; box-sizing: border-box;}
.boardLayer.boardItemMove > ul > li > a::before {content: ''; display: none; position: absolute; left: 17px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -8px -400px;}
.boardLayer.boardItemMove > ul > li > a > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; margin-right: 4px; background: url(../img/ar_main.svg) -11px -2255px;}
.boardLayer.boardItemMove > ul > li > a > p {font-size: 15px; color: #0f0f0f; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.boardLayer.boardItemMove > ul > li.selected > a::before {display: block;}
.boardLayer.boardItemMove > ul > li.selected > a > span {background-position: -11px -2277px;}
.boardLayer.boardItemMove > ul > li.selected > a > p {color: var(--main-color);}

.boardLayer.boardItemMove > div {display: flex; align-items: center; justify-content: center; border-top: 1px solid #E5E5E5; padding-top: 15px;}
.boardLayer.boardItemMove > div > button {all: unset; cursor: pointer; box-sizing: border-box; font-size: 13px; color: #fff; background-color: #525763; padding: 0 34px; height: 30px;}

/* 게시판 - 공지 기간 설정 레이어 */
.boardLayer.periodSetting {display: flex; flex-direction: column; min-width: 340px; max-width: 340px;}
.boardLayer.periodSetting > div {display: flex; flex-direction: column; padding: 20px 20px 20px;}
.boardLayer.periodSetting > div > div:nth-child(1) {display: flex; align-items: center; justify-content: space-between; padding: 0 0 30px 8px;}
.boardLayer.periodSetting > div > div:nth-child(1) > h1 {font-size: 20px; font-weight: bold; color: #000;}
.boardLayer.periodSetting > div > div:nth-child(1) > .closeBtn {all: unset; display: block; width: 16px; height: 16px; min-width: 16px; cursor: pointer; background: url(../img/ar_main.svg) no-repeat -7px -555px; position: relative; top: -4px;}

.boardLayer.periodSetting > div > ul {display: flex; flex-direction: column; padding-left: 8px;}
.boardLayer.periodSetting > div > ul > li {margin-bottom: 12px; display: flex; flex-direction: column;}
.boardLayer.periodSetting > div > ul > li:last-child {margin-bottom: 0;}
.boardLayer.periodSetting > div > ul > li > label {display: flex; align-items: center;}
.boardLayer.periodSetting > div > ul > li > label > p {margin-left: 6px; font-size: 15px; color: #333333; white-space: nowrap;}

.boardLayer.periodSetting .customPeriod {padding: 12px 0 0;}
.boardLayer.periodSetting .customPeriod > div {display: flex; align-items: center; padding-left: 19px;}
.boardLayer.periodSetting .customPeriod > div > input {width: 110px; height: 28px; border: 1px solid #CBCBCB; box-sizing: border-box; -webkit-appearance: none; appearance: none; padding: 0 9px; font-size: 14px; color: #0f0f0f;}
.boardLayer.periodSetting .customPeriod > div > p {font-size: 14px; color: #0f0f0f; padding-left: 12px;}

.boardLayer.periodSetting > div > div:nth-child(3) {display: flex; align-items: center; justify-content: center; padding: 36px 0 10px;}
.boardLayer.periodSetting > div > div:nth-child(3) > div {display: flex; align-items: center; justify-content: center;}
.boardLayer.periodSetting > div > div:nth-child(3) > div >button {all: unset; display: inline-flex; align-items: center; justify-content: center; width: 80px; height: 32px; box-sizing: border-box; font-size: 15px; cursor: pointer;}
.boardLayer.periodSetting > div > div:nth-child(3) > div >button:nth-child(1) {border: 1px solid #525763; background-color: #525763; color: #fff;}
.boardLayer.periodSetting > div > div:nth-child(3) > div >button:nth-child(2) {border: 1px solid #CBCBCB; color: #333333; margin-left: 8px;}

/* 게시판 답글 context menu */
.boardReplyContextMenu {border-color: #ddd; right: 0; top: 48px; z-index: 2022;}

/* 게시판 목록설정 레이어 */
.balloonPopup.dashBoardSetting {min-width: 296px; max-width: 296px;}
.balloonPopup.dashBoardSetting .balloonSection:last-child > div {flex-direction: column; flex-wrap: wrap; align-items: flex-start;}
.balloonPopup.dashBoardSetting .balloonSection:last-child > div > div {min-width: 100%; padding-bottom: 10px; display: flex; flex-direction: column;}
.balloonPopup.dashBoardSetting .balloonSection:last-child > div > div:last-child {padding-bottom: 0;}
.balloonPopup.dashBoardSetting .balloonSection:last-child > div > div > label {align-items: center;}
.balloonPopup.dashBoardSetting .balloonSection:last-child > div > div > label > input {margin-right: 6px;}
.balloonPopup.dashBoardSetting .balloonSection:last-child > div > div > div {display: flex; padding-top: 10px;}
.balloonPopup.dashBoardSetting .balloonSection:last-child > div > div > div > select {width: 220px; height: 28px; border: 1px solid #cbcbcb; -webkit-appearance: none; appearance: none; outline: none; background: url(../img/arrow.gif) no-repeat calc(100% + 4px) center; padding: 0 25px 0 12px; cursor: pointer;}

/* 캘린더 */

/* 캘린더 커스텀 select */
.ar_calendar button.customSelect {all: unset; cursor: pointer; box-sizing: border-box; display: inline-flex; align-items: center; height: 28px; border: 1px solid #CBCBCB; width: 194px; background: url(../img/arrow.gif) no-repeat right center; padding: 0 34px 0 10px; overflow: hidden;}
.ar_calendar button.customSelect > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; margin-right: 8px; border-radius: 2px; box-sizing: border-box;}
.ar_calendar button.customSelect > p {font-size: 14px; color: #000; font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.calendarLayer button.customSelect {all: unset; cursor: pointer; box-sizing: border-box; display: inline-flex; align-items: center; height: 28px; border: 1px solid #CBCBCB; width: 194px; background: url(../img/arrow.gif) no-repeat right center; padding: 0 34px 0 10px; overflow: hidden;}
.calendarLayer button.customSelect > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; margin-right: 8px; border-radius: 2px; box-sizing: border-box;}
.calendarLayer button.customSelect > p {font-size: 15px; color: #000; font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

/* 캘린더 - 사이드 datepicker 커스텀 */
.sideDatePickerWrap {padding: 17px 16px 15px; border-bottom: 1px solid #e5e5e5;}
.sideDatePicker {width: 100%;}
.sideDatePicker .ui-datepicker {width: 100%; padding: 0; box-sizing: border-box; border: none !important; background: transparent;}
.sideDatePicker .ui-widget-header {border: none; background: none;}
.sideDatePicker .ui-datepicker .ui-datepicker-title {text-align: left; margin: 0; font-size: 18px; font-weight: 500; padding-left:0;}
.sideDatePicker .ui-datepicker .ui-datepicker-title select {width: auto; border: none; outline: none; -webkit-appearance: none; appearance: none; padding: 0 6px 0 22px; background: url(../img/sidedatepicker_arrow.svg) no-repeat left center; font-size: 18px; font-weight: 500; cursor: pointer;}
.sideDatePicker .ui-datepicker .ui-datepicker-prev, .sideDatePicker .ui-datepicker .ui-datepicker-next {width: 16px; height: 16px; top: 50%; transform: translateY(-50%); cursor: pointer;}
.sideDatePicker .ui-datepicker .ui-datepicker-prev {left: initial; right: 26px;}
.sideDatePicker .ui-datepicker .ui-datepicker-next {right: 0;}
.sideDatePicker .ui-state-hover, .sideDatePicker .ui-widget-content .ui-state-hover, .sideDatePicker .ui-widget-header .ui-state-hover, .sideDatePicker .ui-state-focus, .sideDatePicker .ui-widget-content .ui-state-focus, .sideDatePicker .ui-widget-header .ui-state-focus, .sideDatePicker .ui-button:hover, .sideDatePicker .ui-button:focus {border: none; background: none;}
.sideDatePicker .ui-state-default, .sideDatePicker .ui-widget-content .ui-state-default, .sideDatePicker .ui-widget-header .ui-state-default, .sideDatePicker .ui-button, .sideDatePicker .ui-button.ui-state-disabled:hover, .sideDatePicker .ui-button.ui-state-disabled:active {border: none; background: none;}
.sideDatePicker .ui-state-active, .sideDatePicker .ui-widget-content .ui-state-active, .sideDatePicker .ui-widget-header .ui-state-active, .sideDatePicker a.ui-button:active, .sideDatePicker .ui-button:active, .sideDatePicker .ui-button.ui-state-active:hover {border: 1px solid var(--main-color); background: var(--main-color); color: #fff;}
.sideDatePicker .ui-icon-circle-triangle-w {background: url(../img/datepicker_prev.svg) no-repeat center;}
.sideDatePicker .ui-icon-circle-triangle-e {background: url(../img/datepicker_next.svg) no-repeat center;}
.sideDatePicker .ui-datepicker tr {display: flex;}
.sideDatePicker .ui-datepicker thead tr {padding: 6px 0;}
.sideDatePicker .ui-datepicker th {color: #595959; font-size: 13px; font-weight: 400; padding: 0; display: inline-flex; flex: 1; align-items: center; justify-content: center;}
.sideDatePicker .ui-datepicker th.ui-datepicker-week-end:first-child {color: var(--error-color);}
.sideDatePicker .ui-datepicker th span {width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;}
.sideDatePicker .ui-datepicker td {padding: 0; display: inline-flex; justify-content: center; flex: 1; align-items: center; font-size: 13px; font-weight: 400; color: #595959; margin: 1.5px 0; cursor: pointer;}
.sideDatePicker .ui-datepicker td.ui-datepicker-week-end:first-child {color: var(--error-color);}
.sideDatePicker .ui-datepicker td.ui-datepicker-week-end:first-child a {color: var(--error-color);}
.sideDatePicker .ui-datepicker td span, .sideDatePicker .ui-datepicker td a {text-align: center; padding: 0; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;}
.sideDatePicker .ui-datepicker .ui-datepicker-header {position: relative; padding: .2em 0}

.themeSideBlack .sideDatePickerWrap {border-bottom-color: #41454f;}
.themeSideBlack .sideDatePicker .ui-datepicker .ui-datepicker-title select {background-image: url(../img/sidedatepicker_arrow_white.svg); background-size: 24%; color: #fff;}
.themeSideBlack .sideDatePicker .ui-datepicker .ui-datepicker-title select option {color: #000;}
.themeSideBlack .sideDatePicker .ui-datepicker .ui-datepicker-title {color: #fff;}
.themeSideBlack .ui-datepicker .ui-datepicker-prev span, .themeSideBlack .ui-datepicker .ui-datepicker-next span {filter: brightness(10);}
.themeSideBlack .sideDatePicker .ui-datepicker th {color: #fff;}
.themeSideBlack .sideDatePicker .ui-state-active, .themeSideBlack .sideDatePicker .ui-widget-content .ui-state-active, .themeSideBlack .sideDatePicker .ui-widget-header .ui-state-active, .themeSideBlack .sideDatePicker a.ui-button:active, .themeSideBlack .sideDatePicker .ui-button:active, .themeSideBlack .sideDatePicker .ui-button.ui-state-active:hover {color: #fff !important;}
.themeSideBlack .sideDatePicker .ui-datepicker td.ui-datepicker-week-end:first-child a {color: var(--error-color) !important;}

/* 캘린더 - 사이드바 */
.ar_calendar #nav_snb {display: flex; flex-direction: column;}

.ar_calendar .menu_scroll_area {position: relative; top: initial; left: initial; bottom: initial; right: initial; height: 100%;}
.ar_calendar .treeTopWrap {border-bottom: none; height: 100%;}

.ar_calendar .treeTopWrap > ul.treeFixMenuWrap {border-bottom: 1px solid #F2F2F2;}
.ar_calendar .treeTopWrap > ul.treeFixMenuWrap > li > a:hover {background-color: transparent;}
.ar_calendar .treeSelectableMenuContainer {padding-top: 0;}
.ar_calendar .treeSelectableMenuContainer + .treeSelectableMenuContainer {border-top: 1px solid #F2F2F2;}
.ar_calendar .treeSelectableMenuContainer > div {display: flex; flex-direction: column;}
.ar_calendar .treeSelectableMenuContainer > div > ul {padding: 10px 0; border-bottom: 1px solid #F2F2F2;}
.ar_calendar .treeSelectableMenuContainer > div > ul:last-child {border-bottom: none;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a {display: flex; width: calc(100% - 38px); justify-content: space-between; align-items: center; padding: 6px 16px 6px 22px; color: #000; border-radius: 4px; font-size: 15px;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li:not(.treeTitle) > a:hover {background-color: transparent;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div {display: flex; flex-wrap: nowrap; align-items: center;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > p {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -0.5px;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i {display: inline-flex; width: 16px; height: 16px; background-repeat: no-repeat; cursor: pointer; margin-left: -16px; min-width: 16px; margin-right: 2px;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -136px;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -136px;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span {display: inline-flex; width: 16px; height: 16px; min-width: 16px; margin-right: 6px;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button {display: flex; width: 16px; height: 16px; border: none; background-repeat: no-repeat; transition: opacity 0.3s; min-width: 16px; opacity: 0;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button.treeIcon_setting {background: url(../img/ar_main.svg) -601px -136px; }
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button.treeIcon_setting:hover {background: url(../img/ar_main.svg) -623px -136px; }
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -136px;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -136px;}
.ar_calendar .treeSelectableMenuContainer > div > ul > li > a:hover > div:nth-child(2) > button {opacity: 1;}

.ar_calendar .treeChild li {padding: 0 4px; width: initial;}
.ar_calendar .treeChild > li > a {padding: 5px 12px 5px 20px;}
.ar_calendar .treeChild > li > a > div:nth-child(1) > span {position: relative; width: 16px; height: 16px; min-width: 16px; box-sizing: border-box;}
.ar_calendar .treeChild > li > a > div:nth-child(1) > span + span {margin-right: 4px;}
.ar_calendar .treeChild > li > a > div:nth-child(1) > span.treeIcon_label::before {display: none; content: ''; position: absolute; top: 0; left: 0; background: url(../img/ar_main.svg) no-repeat -28px -248px; width: 100%; height: 100%;}
.ar_calendar .treeChild > li.on > a > div:nth-child(1) > span.treeIcon_label::before {display: block;}

.ar_calendar #wrap.themeSideGray .treeTopWrap > ul.treeFixMenuWrap {border-bottom-color: #e5e5e5;}
.ar_calendar #wrap.themeSideGray .treeSelectableMenuContainer > div > ul {border-bottom-color: #e5e5e5;}
.ar_calendar #wrap.themeSideGray .treeSelectableMenuContainer + .treeSelectableMenuContainer {border-top-color: #e5e5e5;}

.ar_calendar #wrap.themeSideBlack .treeTopWrap {border-bottom: none;}
.ar_calendar #wrap.themeSideBlack .treeTopWrap > ul.treeFixMenuWrap {border-bottom-color: #41454f;}
.ar_calendar #wrap.themeSideBlack .treeTopWrap > ul > li:not(.treeTitle) > a:hover {background-color: transparent;}
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul {border-bottom-color: #41454f;}
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer + .treeSelectableMenuContainer {border-top-color: #41454f;}
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer > ul > li:not(.treeTitle) > a:hover {background-color: transparent;}
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow {background: url(../img/ar_main.svg) -587px -180px;}
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > i.treeIcon_arrow.foldDown {background: url(../img/ar_main.svg) -571px -180px;}
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button.treeIcon_setting {background: url(../img/ar_main.svg) -601px -181px; }
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button.treeIcon_setting:hover {background: url(../img/ar_main.svg) -623px -181px; }
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button.treeIcon_plus {background: url(../img/ar_main.svg) -645px -181px;}
.ar_calendar #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(2) > button.treeIcon_plus:hover {background: url(../img/ar_main.svg) -667px -181px;}

/* 캘린더 - 컨텐츠 영역 */
.calendarContentWrap {display: flex; height: calc(100% - 66px); overflow: auto;}
.calendarContainer {display: flex; flex-direction: column; flex: 1; overflow: auto;}

/* 캘린더 - full calendar 커스텀 */
.ar_calendar .fc .fc-scrollgrid {border-left-width: 0; border-color: #E5E5E5;}
.ar_calendar .fc-toolbar-chunk {display: flex; align-items: center;}
.ar_calendar .fc-toolbar-chunk > div {display: flex; align-items: center;}
.ar_calendar .fc-direction-ltr .fc-toolbar > * > :not(:first-child) {margin-left: 18px;}
.ar_calendar .fc .fc-toolbar.fc-header-toolbar {margin-bottom: 12px; padding: 0 14px;}
.ar_calendar .fc-theme-standard td, .ar_calendar .fc-theme-standard th {border-color: #E5E5E5;}
.ar_calendar .fc-theme-standard th {height: 32px; border-left: 0; border-right: 0;}
.ar_calendar .fc-theme-standard th > div {height: 100%;}
.ar_calendar .fc-theme-standard th.fc-day-today .fc-col-header-cell-cushion {color: var(--main-color);}
.ar_calendar .fc .fc-daygrid-day-number {color: #0f0f0f; font-weight: 500;}
.ar_calendar .fc .fc-col-header-cell-cushion {display: flex; align-items: center; justify-content: center; height: 100%; color: #0f0f0f; font-weight: 500;}
.ar_calendar .fc .fc-daygrid-day-top {flex-direction: row;}
.ar_calendar .fc-day-other {background-color: #F8F8F8;}
.ar_calendar .fc .fc-daygrid-day.fc-day-today {background-color: #e7ecff;}
.ar_calendar .fc .fc-dayGridMonth-view .fc-daygrid-day.fc-day-today {outline: 1px solid var(--main-color); outline-offset: -1px;}
.ar_calendar .fc-day-sun .fc-col-header-cell-cushion, .ar_calendar .fc-day-sun .fc-daygrid-day-number {color: var(--error-color);}
.ar_calendar .fc-daygrid-day-events {margin-bottom: 0.5px; margin-top: 0.5px;}
.ar_calendar .fc-daygrid-event {border-radius: 0; min-height: 22px; font-size: 13px; position: relative; display: flex; align-items: center; padding: 0 15px; height: 22px; cursor: pointer;}
.ar_calendar .fc-daygrid-event::before {content: ''; display: block; width: 14px; height: 14px; min-width: 14px; background: url(../img/ar_main.svg) no-repeat -101px -1537.5px; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.ar_calendar .fc-daygrid-event::after {content: ''; display: block; width: 14px; height: 14px; min-width: 14px; background: url(../img/ar_main.svg) no-repeat -115px -1537.5px; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.ar_calendar .fc-event .fc-event-main {width: 100%;}
.ar_calendar .fc-direction-ltr .fc-daygrid-event.fc-event-start, .ar_calendar .fc-direction-rtl .fc-daygrid-event.fc-event-end {margin-left: 2px;}
.ar_calendar .fc-direction-ltr .fc-daygrid-event.fc-event-end, .ar_calendar .fc-direction-rtl .fc-daygrid-event.fc-event-start {margin-right: 2px;}
.ar_calendar .fc-h-event .fc-event-time {line-height: 20px; font-weight: normal;}
.ar_calendar .fc-h-event .fc-event-title {line-height: 20px; overflow: hidden; text-overflow: ellipsis;}
.ar_calendar .fc-h-event .fc-event-title > strong {font-weight: normal;}
.ar_calendar .fc-event .fc-event-title .todoCheckbox {position: relative; top: 2px; margin-right: 4px;}
.ar_calendar .fc .fc-button-primary {background: none; color: #000; border: none; padding: 0; margin: 0 8px;}
.ar_calendar .fc .fc-button-primary.fc-today-button {color: var(--main-color); font-size: 16px; font-weight: 600; opacity: 1; margin-left: 6px; line-height: 30px; white-space: nowrap;}
.ar_calendar .fc .fc-toolbar-title {margin: 0 8px; font-size: 16px; font-weight: 500; white-space: nowrap;}
.ar_calendar .fc .fc-button-primary:not(:disabled, .fc-addEventButton-button).fc-button-active, .ar_calendar .fc .fc-button-primary:not(:disabled, .fc-addEventButton-button):active {background: none; border-color: var(--main-color); color: #000;}
.ar_calendar .fc .fc-button-primary:not(:disabled).fc-button-active:focus, .ar_calendar .fc .fc-button-primary:not(:disabled):active:focus {box-shadow: none;}
.ar_calendar .fc .fc-button-primary:focus {box-shadow: none;}
.ar_calendar .fc .fc-button-primary.fc-addEventButton-button {width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -52px -685px; position: relative; margin-right: 16px;}
.ar_calendar .fc .fc-button-primary.fc-addEventButton-button::after {pointer-events: none; content: ''; display: block; position: absolute; right: -16px; top: 50%; transform: translateY(-50%); width: 1px; height: 16px; background-color: #ddd;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button {padding: 0 13px; margin: 0; border: 1px solid #CBCBCB; background-color: #fff; border-radius: 0; font-weight: 600; white-space: nowrap;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button:active {border: 1px solid #CBCBCB;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button.fc-button-active {background-color: var(--main-color); color: #fff;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button:not(:first-child) {margin-left: -1px;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button:not(:first-child, :last-child):active {margin-left: -1px;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button.fc-refresh-button,
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button.fc-print-button {padding: 0; width: 30px; min-width: 30px; display: inline-flex; align-items: center; justify-content: center; font-weight: normal;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button.fc-refresh-button {margin-left: 7px;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button.fc-refresh-button > span,
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button.fc-print-button > span {width: 16px; height: 16px; min-width: 16px;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button.fc-refresh-button > span {background: url(../img/ar_main.svg) no-repeat -137px -400px;}
.ar_calendar .fc-direction-ltr .fc-button-group > .fc-button.fc-print-button > span {background: url(../img/ar_main.svg) no-repeat -29px -554px;}
.ar_calendar .fc-timegrid-event, .ar_calendar .fc-timegrid-more-link {border-radius: 0;}
.ar_calendar .fc .fc-timegrid-col.fc-day-today {background-color: #e7ecff;}
.ar_calendar .fc-list-day.fc-day-sun {color: var(--error-color);}
.ar_calendar .fc-list-day.fc-day-today {color: var(--main-color);}
.ar_calendar .fc-list-day.fc-day-today .fc-list-day-cushion {background-color: #e7ecff;}
.ar_calendar .fc-theme-standard .fc-list-day-cushion {background-color: #fff;}
.ar_calendar .fc-list-day.fc-day-today + .fc-list-event  {background-color: #e7ecff;}
.ar_calendar .fc .fc-list-event:hover td {background-color: #FBFCFF;}
.ar_calendar .fc .fc-list-empty {background-color: #fff;}
.ar_calendar .fc .fc-list-sticky .fc-list-day > * {font-weight: 600;}
.ar_calendar .fc .fc-list-event-dot {border-radius: 2px; border-width: 8px; vertical-align: -3px;}
.ar_calendar .fc .fc-list-event-graphic :not(.fc-list-event-dot) {vertical-align: top;}
.ar_calendar .fc .fc-list-event-graphic * + * {margin-left: 6px;}
.ar_calendar .fc-list-event-title .todoCheckbox {position: relative; top: 2px; margin-right: 4px;}
.ar_calendar .fc-direction-ltr .fc-list-day-side-text {float: left; margin-left: 6px;}
.ar_calendar .fc-dayGridMonth-view .fc-daygrid-day-bottom {margin: 0 2px 20px;}
.ar_calendar .fc-daygrid-dot-event .fc-event-title {text-overflow: ellipsis;}

/* 캘린더 쓰기 */
.calendarWriteWrap {display: flex; flex-direction: column; height: 100%; overflow: hidden;}

.calendarWriteWrap .mailListBtn .buttonSet > button {display: inline-flex; align-items: center; min-width: 68px; justify-content: center;}
.calendarWriteWrap .mailListBtn .buttonSet > button > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -6px -814px; margin-right: 4px;}
.calendarWriteWrap .mailListBtn .buttonSet > button:nth-child(1) {border-color: #525763; background-color: #525763 !important; color: #fff; padding-right: 14px;}
.calendarWriteWrap .mailListBtn .buttonSet > button:nth-child(2) {border-color: #ABABAB;}

.calendarWriteWrap select {cursor: pointer; box-sizing: border-box; display: inline-flex; align-items: center; height: 28px; border: 1px solid #CBCBCB; background: url(../img/arrow.gif) no-repeat right center; padding: 0 34px 0 10px; overflow: hidden; -webkit-appearance: none; appearance: none; outline: none;}
.calendarWriteWrap input[type=text] {box-sizing: border-box; height: 28px; border: 1px solid #CBCBCB; flex: 1; padding: 0 10px;}
.calendarWriteWrap input[type=text]:focus {border-color: var(--main-color);}

.calendarWriteView {display: flex; flex: 1; height: calc(100% - 41px); overflow-y: auto;}
.calendarWriteView > div {display: flex; padding: 6px 22px; box-sizing: border-box; flex-direction: column; width: 100%;}
.calendarWriteView > div > ul {display: flex; flex-direction: column; width: 100%; border-bottom: 1px solid #F4F4F4; padding: 8px 0;}
.calendarWriteView > div > ul:last-child {border-bottom: none;}
.calendarWriteView > div > ul > li {display: flex; padding: 8px 0; width: 660px;}
.calendarWriteView > div > ul > li > div {display: flex; flex-direction: column; height: 100%;}
.calendarWriteView > div > ul > li > div:nth-child(2) {flex: 1;}
.calendarWriteView > div > ul > li > div > i {display: inline-block; width: 18px; height: 18px; min-width: 18px; background-image: url(../img/ar_main.svg); background-repeat: no-repeat; margin-right: 20px; position: relative; top: 5px;}
.calendarWriteView > div > ul > li > div > i.icon01 {background-position: -229px -1586px;} /* 캘린더 선택 */
.calendarWriteView > div > ul > li > div > i.icon02 {background-position: -204px -1586px;} /* 제목 */
.calendarWriteView > div > ul > li > div > i.icon03 {background-position: -253px -1586px;} /* 일시 */
.calendarWriteView > div > ul > li > div > i.icon04 {background-position: -325px -1586px;} /* 참여자 */
.calendarWriteView > div > ul > li > div > i.icon05 {background-position: -362px -444px;} /* 장소 */
.calendarWriteView > div > ul > li > div > i.icon06 {background-position: -408px -444px;} /* 메모 */
.calendarWriteView > div > ul > li > div > i.icon07 {background-position: -277px -1586px;} /* 알림 */
.calendarWriteView > div > ul > li > div > i.icon08 {background-position: -565px -1586px;} /* 완료일 */
.calendarWriteView > div > ul > li > div > i.icon09 {background-position: -300px -1586px;} /* 반복 */
.calendarWriteView > div > ul > li > div > div {display: flex; align-items: center; min-height: 28px;}
.calendarWriteView > div > ul > li > div > div:nth-child(2) {padding-top: 5px;}
.calendarWriteView > div > ul > li > div > div > label {display: flex; align-items: center; font-size: 14px; color: #000;}
.calendarWriteView > div > ul > li > div > div > label > input {margin-right: 5px;}
.calendarWriteView > div > ul > li > div > div > p {margin: 0 12px 0 14px; font-size: 14px; color: #000;}
.calendarWriteView > div > ul > li > div > div > p.sharerText {color: var(--main-color); margin-left: 20px; font-weight: 500;}
.calendarWriteView > div > ul > li > div > div > p.repeatText {color: var(--main-color); font-weight: 500;}
.calendarWriteView > div > ul > li > div > div > textarea {flex: 1; box-sizing: border-box; border: 1px solid #CBCBCB; padding: 10px; min-height: 180px; resize: vertical;}
.calendarWriteView .calendarWriteTitleSelect {width: 102px; margin-right: 10px;}
.calendarWriteView .calendarWriteAlarmSelect {width: 102px; margin-right: 10px;}

.calendarWriteView.schedule .customSelect + label {margin-left: 14px;}
.calendarWriteView.schedule > div > ul > li > div > div:nth-child(2) label + label {margin-left: 24px;}
.calendarWriteView.schedule input[type=text] + select {margin-left: 10px;}
.calendarWriteView.schedule > div > ul > li > div > div > div {display: flex; align-items: center; padding: 0 12px; position: relative;}
.calendarWriteView.schedule > div > ul > li > div > div > div > label {display: flex; align-items: center;}
.calendarWriteView.schedule > div > ul > li > div > div > div > label + label {margin-left: 10px;}
.calendarWriteView.schedule > div > ul > li > div > div > div > label > input {margin-right: 5px;}
.calendarWriteView.schedule > div > ul > li > div > div > div > button.deleteBtn {all: unset; cursor: pointer; display: inline-flex; align-items: center; font-size: 14px; color: #000;}
.calendarWriteView.schedule > div > ul > li > div > div > div > button.deleteBtn > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -368px -1537px; margin-right: 4px;}
.calendarWriteView.schedule > div > ul > li > div > div > div + div::before {content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 16px; background-color: #ddd;}
.calendarWriteView.schedule .addAlarmBtn {all: unset; cursor: pointer; color: #333; font-size: 14px; text-decoration: underline; margin-top: 10px;}

.calendarWriteView.todo > div > ul > li.progressStatus > div {justify-content: center;}
.calendarWriteView.todo > div > ul > li.progressStatus > div > p {margin-right: 30px; font-weight: bold; color: #0f0f0f;}
.calendarWriteView.todo > div > ul > li.progressStatus > div > div > label {margin-right: 16px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > p {margin: 0 22px 0 0;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div {display: flex; align-items: center;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div + div {margin-left: 12px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div:nth-child(2) {flex: 1;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > input[type=checkbox] {margin-right: 10px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button {all: unset; box-sizing: border-box; border: 1px solid #CBCBCB; font-size: 14px; font-weight: 500; padding: 0 14px 0 10px; height: 28px; display: inline-flex; align-items: center; cursor: pointer;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button:not(:first-child) {border-left: 0;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button > i {display: inline-block; width: 18px; height: 18px; min-width: 18px; background-image: url(../img/ar_main.svg); background-repeat: no-repeat; margin-right: 4px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button.todayBtn > i {background-position: -203px -1612px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button.tomorrowBtn > i {background-position: -251px -1612px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button.nextWeekBtn > i {background-position: -300px -1612px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button.on {background-color: var(--main-color); border-color: var(--main-color); color: #fff;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button.on.todayBtn > i {background-position: -227px -1612px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button.on.tomorrowBtn > i {background-position: -275px -1612px;}
.calendarWriteView.todo > div > ul > li.dueDate > div > div > div > button.on.nextWeekBtn > i {background-position: -326px -1612px;}

.calendarWriteView.todo > div > ul > li.todoAlarm > div > div:nth-child(2) label + label {margin-left: 24px;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div > div input[type=text] + select {margin-left: 10px;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div > div > div {display: flex; align-items: center; padding: 0 12px; position: relative;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div > div > div > label {display: flex; align-items: center;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div > div > div > label + label {margin-left: 10px;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div > div > div > label > input {margin-right: 5px;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div > div > div > button.deleteBtn {all: unset; cursor: pointer; display: inline-flex; align-items: center; font-size: 14px; color: #000;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div > div > div > button.deleteBtn > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -368px -1537px; margin-right: 4px;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div > div > div + div::before {content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 16px; background-color: #ddd;}
.calendarWriteView.todo > div > ul > li.todoAlarm > div .addAlarmBtn {all: unset; cursor: pointer; color: #333; font-size: 14px; text-decoration: underline; margin-top: 10px;}

/* 캘린더 - 빈화면 */
.calendarWriteView.empty {transform: translateY(-90px);}
.calendarWriteView.empty > div {display: flex; flex-direction: column; align-items: center; padding: 0;}
.calendarWriteView.empty > div > span {display: inline-block; width: 136px; height: 136px; background: url(../img/ar_main.svg) no-repeat;}
.calendarWriteView.empty > div > span.empty {background-position: -730px -1369px;}
.calendarWriteView.empty > div > span.result {background-position: -297px -1370px;}
.calendarWriteView.empty > div > p {color: #000; font-size: 16px; font-weight: bold; padding-top: 10px; white-space: nowrap;}

/* 캘린더 레이어 공통 */
.calendarLayer {box-sizing: border-box; background-color: #fff; border: 1px solid #DDDDDD; border-radius: 8px; box-shadow: 0 3px 6px #00000029;position: absolute;}
.calendarLayer.angle {border-color: #B3B3B3; border-radius: 0;}

.calendarLayer .labelCollection {display: grid;grid-template-columns: repeat(7, 15px); grid-template-rows: repeat(5, 15px); gap: 7px; padding-top: 14px; width: 100%;}
.calendarLayer .labelCollection > a {display: inline-block; position: relative;}
.calendarLayer .labelCollection > a.clicked > span {position: absolute; top: 0; left: 0; display: block; background: url(../img/ar_main.svg) no-repeat -28px -248px; width: 15px; height: 15px;}

/* 캘린더 추가 레이어 */
.calendarLayer.addCalendar {display: flex; width: 196px; padding: 22px;}
.calendarLayer.addCalendar > div {display: flex; flex-direction: column; width: 100%;}
.calendarLayer.addCalendar > div > div:nth-child(1) {display: flex; align-items: center; justify-content: space-between;}
.calendarLayer.addCalendar > div > div:nth-child(1) > h1 {font-size: 18px; color: #000; font-weight: bold;}
.calendarLayer.addCalendar > div > div:nth-child(1) > button.closeBtn {all: unset; display: block; width: 16px; height: 16px; min-width: 16px; cursor: pointer; background: url(../img/ar_main.svg) no-repeat -7px -555px; position: relative; top: -4px;}
.calendarLayer.addCalendar > div > div:nth-child(2) {display: flex; align-items: center; padding: 20px 0;}
.calendarLayer.addCalendar > div > div:nth-child(2) > input {height: 28px; border: 1px solid #ddd; padding: 0 10px; font-size: 14px; width: 100%;}
.calendarLayer.addCalendar > div > div:nth-child(2) > input:focus {border-color: var(--main-color);}
.calendarLayer.addCalendar > div > div:nth-child(3) {display: flex; flex-direction: column;}
.calendarLayer.addCalendar > div > div:nth-child(3) > h6 {display: flex; align-items: center; color: #0f0f0f; font-size: 14px; font-weight: 500;}
.calendarLayer.addCalendar > div > div:nth-child(3) > h6 > i {display: inline-block; width: 18px; height: 18px; min-width: 18px; background: url(../img/ar_main.svg) no-repeat -397px -1586px; margin-right: 5px;}
.calendarLayer.addCalendar > div > div:nth-child(4) {display: flex; align-items: center; padding-top: 22px;}
.calendarLayer.addCalendar > div > div:nth-child(4) > button {all: unset; font-size: 15px; height: 32px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; flex: 1; cursor: pointer;}
.calendarLayer.addCalendar > div > div:nth-child(4) > button:nth-child(1) {color: #fff; background-color: #525763; border: 1px solid #525763;}
.calendarLayer.addCalendar > div > div:nth-child(4) > button:nth-child(2) {color: #333; background-color: #fff; border: 1px solid #CBCBCB; margin-left: 8px;}

/* 캘린더 context menu */
.calendarLayer.contextMenu {display: flex; min-width: 190px; padding: 7px 0;}
.calendarLayer.contextMenu > ul {display: flex; flex-direction: column; width: 100%;}
.calendarLayer.contextMenu > ul > li {border-bottom: 1px solid #F2F2F2;}
.calendarLayer.contextMenu > ul > li:last-child {border-bottom: none;}
.calendarLayer.contextMenu > ul > li > a {display: flex; align-items: center; min-height: 40px; padding: 0 16px;}
.calendarLayer.contextMenu > ul > li > a:hover {background-color: #F3F5F6;}
.calendarLayer.contextMenu > ul > li > a > i {display: inline-block; width: 18px; height: 18px; min-width: 18px; background-image: url(../img/ar_main.svg); background-repeat: no-repeat; margin-right: 5px;}
.calendarLayer.contextMenu > ul > li > a > i.icon01 {background-position: -229px -1586px;} /* 이 캘린더만 표시 */
.calendarLayer.contextMenu > ul > li > a > i.icon02 {background-position: -373px -1586px;} /* 이 캘린더에 일정추가 */
.calendarLayer.contextMenu > ul > li > a > i.icon03 {background-position: -540px -1586px;} /* 이 캘린더 알림 차단 */
.calendarLayer.contextMenu > ul > li > a > i.icon04 {background-position: -203px -1586px;} /* 편집 */
.calendarLayer.contextMenu > ul > li > a > i.icon05 {background-position: -421px -1586px;} /* 이 캘린더 숨김 */
.calendarLayer.contextMenu > ul > li > a > i.icon06 {background-position: -468px -1586px;} /* 공유 설정 */
.calendarLayer.contextMenu > ul > li > a > i.icon07 {background-position: -492px -1586px;} /* 공유 해제 */
.calendarLayer.contextMenu > ul > li > a > i.icon08 {background-position: -444px -1586px;} /* 삭제 */
.calendarLayer.contextMenu > ul > li > a > i.icon09 {background-position: -614px -1586px;} /* 할 일 목록 전체보기 */
.calendarLayer.contextMenu > ul > li > a > p {font-size: 14px; color: #0f0f0f; font-weight: 500; white-space: nowrap;}
.calendarLayer.contextMenu > ul > li:not(.shareStatus) > div {display: flex; flex-direction: column; padding: 12px 16px;}
.calendarLayer.contextMenu > ul > li > div > h6 {display: flex; align-items: center; color: #0f0f0f; font-size: 14px; font-weight: 500;}
.calendarLayer.contextMenu > ul > li > div > h6 > i {display: inline-block; width: 18px; height: 18px; min-width: 18px; background: url(../img/ar_main.svg) no-repeat -397px -1586px; margin-right: 5px;}
.calendarLayer.contextMenu > ul > li.shareStatus {border-bottom: none;}
.calendarLayer.contextMenu > ul > li.shareStatus > div {display: flex; align-items: flex-end; min-height: 26px; padding: 0 16px 10px;}
.calendarLayer.contextMenu > ul > li.shareStatus > div > p {color: #898989; font-size: 11px; font-weight: 400; white-space: nowrap;}
.calendarLayer.contextMenu > ul > li.shareStatus > div > i {display: inline-block; width: 15px; height: 15px; min-width: 15px; background: url(../img/ar_main.svg) no-repeat -597px -1047px; margin-right: 1px;}

/* 캘린더 일정읽기 레이어 (개인, 그룹 공통) */
.calendarLayer.readSchedule {display: flex; min-width: 512px; max-width: 512px; max-height: 90vh;}
.calendarLayer.readSchedule > div {display: flex; flex-direction: column; padding: 20px 30px 25px; width: 100%; box-sizing: border-box;}
.calendarLayer.readSchedule .readScheduleTitle {display: flex; align-items: center; padding: 10px 0 18px; justify-content: space-between;}
.calendarLayer.readSchedule .readScheduleTitle > div {display: flex; align-items: flex-start; height: 100%;}
.calendarLayer.readSchedule .readScheduleTitle > div > div {display: flex; align-items: flex-start; height: 100%;}
.calendarLayer.readSchedule .readScheduleTitle > div:nth-child(1) > div:nth-child(1) > input[type=checkbox] {width: 20px; height: 20px; min-width: 20px; margin-right: 14px; position: relative; top: 5px;}
.calendarLayer.readSchedule .readScheduleTitle > div:nth-child(1) > div:nth-child(1) > span {display: inline-block; width: 18px; height: 18px; min-width: 18px; border-radius: 3px; margin-right: 14px; position: relative; top: 5px;}
.calendarLayer.readSchedule .readScheduleTitle > div:nth-child(1) > div:nth-child(2) > h1 {color: #000; font-weight: 600; font-size: 17px; line-height: 26px; word-break: break-all;}
.calendarLayer.readSchedule .readScheduleTitle > div:nth-child(1) > div:nth-child(2) > h1 > strong {font-weight: 600;}
.calendarLayer.readSchedule .readScheduleTitle > div:nth-child(2) > button.closeBtn {all: unset; cursor: pointer; width: 16px; height: 16px; min-width: 16px; box-sizing: border-box; margin-left: 15px; background: url(../img/ar_main.svg) no-repeat -7px -555px;}

.calendarLayer.readSchedule .readScheduleList {display: flex; flex-direction: column; overflow-y: auto;}
.calendarLayer.readSchedule .readScheduleList > li {padding: 12px 0; display: flex;}
.calendarLayer.readSchedule .readScheduleList > li > div {display: flex; align-items: flex-start; height: 100%;}
.calendarLayer.readSchedule .readScheduleList > li > div > i {display: inline-block; width: 18px; height: 18px; min-width: 18px; background-image: url(../img/ar_main.svg); background-repeat: no-repeat; margin-right: 18px;}
.calendarLayer.readSchedule .readScheduleList > li > div > i.icon01 {background-position: -349px -1586px;} /* 작성자 */
.calendarLayer.readSchedule .readScheduleList > li > div > i.icon02 {background-position: -253px -1586px;} /* 일시 */
.calendarLayer.readSchedule .readScheduleList > li > div > i.icon03 {background-position: -325px -1586px;} /* 참여자 */
.calendarLayer.readSchedule .readScheduleList > li > div > i.icon04 {background-position: -362px -444px;} /* 위치 */
.calendarLayer.readSchedule .readScheduleList > li > div > i.icon05 {background-position: -408px -444px;} /* 메모 */
.calendarLayer.readSchedule .readScheduleList > li > div > i.icon06 {background-position: -277px -1586px;} /* 알림 */
.calendarLayer.readSchedule .readScheduleList > li > div > i.icon07 {background-position: -301px -1586px;} /* 일정 반복 */
.calendarLayer.readSchedule .readScheduleList > li > div > p {color: #000; font-size: 15px; font-weight: 400; line-height: 20px; word-break: keep-all;}
.calendarLayer.readSchedule .readScheduleList > li > div > p.pre {white-space: pre-wrap; word-break: break-all;}
.calendarLayer.readSchedule .readScheduleList > li > div > p > b {font-weight: 600;}
.calendarLayer.readSchedule .readScheduleList > li > div > p > span {color: #898989; font-weight: 500;}
.calendarLayer.readSchedule .readScheduleList > li > div > p > span > b {color: var(--main-color); font-weight: 500;}

.calendarLayer.readSchedule .readScheduleBtn {display: flex; align-items: center; padding-top: 20px; justify-content: center;}
.calendarLayer.readSchedule .readScheduleBtn > button {all: unset; font-size: 15px; height: 32px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 104px; cursor: pointer;}
.calendarLayer.readSchedule .readScheduleBtn > button:nth-child(1) {color: #fff; background-color: #525763; border: 1px solid #525763;}
.calendarLayer.readSchedule .readScheduleBtn > button:nth-child(2) {color: #333; background-color: #fff; border: 1px solid #CBCBCB; margin-left: 8px;}

/* 캘린더 간편일정 추가 레이어 */
.calendarLayer.addEasy {display: flex; min-width: 416px; max-width: 416px;}
.calendarLayer.addEasy::before {content: ''; display: block; position: absolute; width: 7px; height: 7px; border-top: 1px solid #b3b3b3; border-right: 1px solid #b3b3b3; background-color: #fff; transform: rotate(-45deg); left: 20px; top: -5px;}
.calendarLayer.addEasy > div {display: flex; flex-direction: column; padding: 15px 20px 22px; width: 100%;}
.calendarLayer.addEasy > div > div {display: flex; align-items: center; justify-content: space-between;}
.calendarLayer.addEasy > div > div:nth-child(1) > h1 {font-size: 16px; font-weight: bold; color: #000;}
.calendarLayer.addEasy > div > div:nth-child(1) > button.closeBtn {all: unset; cursor: pointer; width: 16px; height: 16px; min-width: 16px; box-sizing: border-box; background: url(../img/ar_main.svg) no-repeat -7px -555px;}
.calendarLayer.addEasy > div > div:nth-child(2) {padding: 14px 0 20px; flex-direction: column;}
.calendarLayer.addEasy > div > div:nth-child(2) > input {height: 28px; border: 1px solid #ddd; box-sizing: border-box; width: 100%; padding: 0 12px;}
.calendarLayer.addEasy > div > div:nth-child(2) > input:focus {border-color: var(--main-color);}
.calendarLayer.addEasy > div > div:nth-child(2) > textarea {resize: none; width: 100%; height: 96px; border: 1px solid #ddd; padding: 10px 12px; font-size: 14px; box-sizing: border-box; margin-top: 6px;}
.calendarLayer.addEasy > div > div:nth-child(3) > button.addBtn {all: unset; cursor: pointer; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 80px; height: 28px; border: 1px solid #525763; background-color: #525763; color: #fff; font-size: 15px;}

/* 캘린더 간편일정 추가 내 커스텀 옵션 레이어 */
.calendarLayer.addEasyOption {display: flex; min-width: 194px; max-width: 194px;}
.calendarLayer.addEasyOption > div {display: flex; flex-direction: column; width: 100%; padding: 7px 0;}
.calendarLayer.addEasyOption > div > div {display: flex; align-items: center; padding: 5px 12px 14px;}
.calendarLayer.addEasyOption > div > div > input {width: 100%; height: 26px; border: none; border-bottom: 1px solid #ddd; box-sizing: border-box; font-size: 13px;}
.calendarLayer.addEasyOption > div > div > input:focus {border-bottom-color: var(--main-color);}
.calendarLayer.addEasyOption > div > ul {display: flex; flex-direction: column;}
.calendarLayer.addEasyOption > div > ul > li > a {display: flex; align-items: center; min-height: 30px; padding: 0 12px 0 32px; position: relative; overflow: hidden;}
.calendarLayer.addEasyOption > div > ul > li > a:hover {background-color: #F3F5F6;}
.calendarLayer.addEasyOption > div > ul > li > a::before {content: ''; display: none; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; background: url(../img/ar_main.svg) no-repeat -8px -400px;}
.calendarLayer.addEasyOption > div > ul > li.on > a {background-color: #F3F5F6;}
.calendarLayer.addEasyOption > div > ul > li.on > a::before {display: block;}
.calendarLayer.addEasyOption > div > ul > li > a > span {display: inline-block; width: 16px; height: 16px; min-width: 16px; margin-right: 8px; border-radius: 2px; box-sizing: border-box;}
.calendarLayer.addEasyOption > div > ul > li > a > p {font-size: 14px; color: #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.calendarLayer.addEasyOption > div > ul > li.on > a > p {color: var(--main-color);}

/* 캘린더 - 라벨 선택 레이어 */
.calendarLayer.labelSelect {min-width: 194px; display: flex; flex-direction: column; max-width: 217px; padding: 10px 0; font-size: 14px;}
.calendarLayer.labelSelect > ul {width: 100%; min-height: 62px; max-height: 156px; overflow-x: hidden; overflow-y: auto;}
.calendarLayer.labelSelect > ul > li > a {color: #0f0f0f; padding: 6px 0; display: inline-flex; width: 100%; align-items: center; position: relative;}
.calendarLayer.labelSelect > ul > li > a > p {text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding-right: 10px;}
.calendarLayer.labelSelect > ul > li > a::before {content: ''; display: none; position: absolute; background: url(../img/ar_main.svg) no-repeat -8px -401px; width: 16px; height: 14px; top: 50%; left: 14px; transform: translateY(-50%);}
.calendarLayer.labelSelect > ul > li > a:hover {background-color: #F3F5F6;}
.calendarLayer.labelSelect > ul > li > a.clicked {background-color: #F3F5F6; color: var(--main-color);}
.calendarLayer.labelSelect > ul > li > a.clicked::before {display: block;}
.calendarLayer.labelSelect > ul > li > a > .labelColor {display: inline-block; width: 16px; height: 16px; border-radius: 2px; margin: 1px 6px 0 36px; min-width: 16px;}
.calendarLayer.labelSelect > ul > li > a > .shared {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -359px -137px; margin-right: 3px;}
.calendarLayer.labelSelect > ul > li > a > .share {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -337px -137px; margin-right: 3px;}

.calendarLayer.labelSelect > .newLabel {border-top: 1px solid #E5E5E5;}
.calendarLayer.labelSelect > .newLabel.clicked > button {display: none;}
.calendarLayer.labelSelect > .newLabel.clicked > .addNewLabel {display: flex;}
.calendarLayer.labelSelect > .newLabel > button {all: unset; padding: 16px 0 8px; display: flex; align-items: center; cursor: pointer; color: #0f0f0f; width: 100%; text-indent: 36px;}
.calendarLayer.labelSelect > .newLabel > button > span {background: url(../img/ar_main.svg) no-repeat -227px -402px; display: inline-block; width: 12px; height: 13px; margin-left: 4px;}
.calendarLayer.labelSelect > .newLabel > .addNewLabel {display: none; flex-wrap: wrap; padding: 12px 18px;}
.calendarLayer.labelSelect > .newLabel > .addNewLabel > input {height: 28px; border: 1px solid #ddd; box-sizing: border-box; width: calc(100% - 54px); padding: 0 8px;}
.calendarLayer.labelSelect > .newLabel > .addNewLabel > input:focus {border-color: var(--main-color);}
.calendarLayer.labelSelect > .newLabel > .addNewLabel > button {height: 28px; border-color: #525763; background-color: #525763; color: #fff; width: 48px; margin-left: 6px;}
.calendarLayer.labelSelect > .newLabel > .addNewLabel > .labelCollection {display: grid;grid-template-columns: repeat(7, 16px); grid-template-rows: repeat(5, 16px); gap: 8px; padding-top: 16px;}
.calendarLayer.labelSelect > .newLabel > .addNewLabel > .labelCollection > a {display: inline-block; position: relative;}
.calendarLayer.labelSelect > .newLabel > .addNewLabel > .labelCollection > a.clicked > span {position: absolute; top: 0; left: 0; display: block; background: url(../img/ar_main.svg) no-repeat -28px -248px; width: 16px; height: 16px;}

/* 캘린더 - 일정쓰기 레이어 */
.calendarLayer.writeSchedule {display: flex; min-width: 678px; max-width: 678px; max-height: 90vh;}
.calendarLayer.writeSchedule > div {display: flex; flex-direction: column; padding: 24px 0 30px; width: 100%; box-sizing: border-box;}

.calendarLayer.writeSchedule > div > div:nth-child(1) {display: flex; align-items: center; justify-content: space-between; padding: 0 30px 14px;}
.calendarLayer.writeSchedule > div > div:nth-child(1) > h1 {font-size: 20px; color: #000; font-weight: 500;}
.calendarLayer.writeSchedule > div > div:nth-child(1) > button.closeBtn {all: unset; display: block; width: 16px; height: 16px; min-width: 16px; cursor: pointer; background: url(../img/ar_main.svg) no-repeat -7px -555px; position: relative; top: -4px; right: -10px;}

.calendarWriteLayerView select {cursor: pointer; box-sizing: border-box; display: inline-flex; align-items: center; height: 28px; border: 1px solid #CBCBCB; background: url(../img/arrow.gif) no-repeat right center; padding: 0 34px 0 10px; overflow: hidden; -webkit-appearance: none; appearance: none; outline: none;}
.calendarWriteLayerView input[type=text] {box-sizing: border-box; height: 28px; border: 1px solid #CBCBCB; flex: 1; padding: 0 10px;}
.calendarWriteLayerView input[type=text]:focus {border-color: var(--main-color);}
.calendarWriteLayerView input.calendarWriteDate {min-width: 100px;}

.calendarWriteLayerView {display: flex; flex: 1; padding: 0 30px; overflow: hidden auto;}
.calendarWriteLayerView > div {display: flex; padding: 0 0 6px; box-sizing: border-box; flex-direction: column; width: 100%;}
.calendarWriteLayerView > div > ul {display: flex; flex-direction: column; width: 100%;}
.calendarWriteLayerView > div > ul > li {display: flex; padding: 8px 0; width: 100%;}
.calendarWriteLayerView > div > ul > div {display: flex; align-items: center; justify-content: flex-end; padding: 2px 0;}
.calendarWriteLayerView > div > ul > div > a {display: inline-block; font-size: 15px; color: #333; text-decoration: underline;}
.calendarWriteLayerView > div > ul > li > div {display: flex; flex-direction: column; height: 100%;}
.calendarWriteLayerView > div > ul > li > div:nth-child(2) {flex: 1; width: calc(100% - 38px);}
.calendarWriteLayerView > div > ul > li > div > i {display: inline-block; width: 18px; height: 18px; min-width: 18px; background-image: url(../img/ar_main.svg); background-repeat: no-repeat; margin-right: 20px; position: relative; top: 5px;}
.calendarWriteLayerView > div > ul > li > div > i.icon01 {background-position: -229px -1586px;} /* 캘린더 선택 */
.calendarWriteLayerView > div > ul > li > div > i.icon02 {background-position: -204px -1586px;} /* 제목 */
.calendarWriteLayerView > div > ul > li > div > i.icon03 {background-position: -253px -1586px;} /* 일시 */
.calendarWriteLayerView > div > ul > li > div > i.icon04 {background-position: -325px -1586px;} /* 참여자 */
.calendarWriteLayerView > div > ul > li > div > i.icon05 {background-position: -362px -444px;} /* 장소 */
.calendarWriteLayerView > div > ul > li > div > i.icon06 {background-position: -408px -444px;} /* 메모 */
.calendarWriteLayerView > div > ul > li > div > i.icon07 {background-position: -277px -1586px;} /* 알림 */
.calendarWriteLayerView > div > ul > li > div > i.icon08 {background-position: -565px -1586px;} /* 완료일 */
.calendarWriteLayerView > div > ul > li > div > div {display: flex; align-items: center; min-height: 28px;}
.calendarWriteLayerView > div > ul > li > div > div:nth-child(2) {padding-top: 5px;}
.calendarWriteLayerView > div > ul > li > div > div > label {display: flex; align-items: center; font-size: 15px; color: #000;}
.calendarWriteLayerView > div > ul > li > div > div > label > input {margin-right: 5px;}
.calendarWriteLayerView > div > ul > li > div > div > p {margin: 0 12px 0 14px; font-size: 14px; color: #000;}
.calendarWriteLayerView > div > ul > li > div > div > p.sharerText {color: var(--main-color); margin-left: 20px; font-weight: 500;}
.calendarWriteLayerView > div > ul > li > div > div > .textWrap {flex: 1; box-sizing: border-box; border: 1px solid #CBCBCB; padding: 10px; display: flex; flex-direction: column; align-items: flex-end;}
.calendarWriteLayerView > div > ul > li > div > div > .textWrap.inFocus {border-color: var(--main-color);}
.calendarWriteLayerView > div > ul > li > div > div > .textWrap > textarea {min-height: 200px; resize: none; width: 100%; border: none;}
.calendarWriteLayerView > div > ul > li > div > div > .textWrap > p {font-size: 15px; color: #CBCBCB;}
.calendarWriteLayerView > div > ul > li > div > div > .textWrap > p > span#textLength {color: #333;}
.calendarWriteLayerView .calendarWriteTitleSelect {width: 102px; margin-right: 10px;}
.calendarWriteLayerView .calendarWriteAlarmSelect {width: 130px; margin-right: 10px;}

/* 참석자 자동완성 */
.ar_calendar ul.ui-autocomplete {max-height: 236px; overflow-y: auto; overflow-x: hidden; border-radius: 4px; -webkit-box-shadow: 0px 3px 6px #00000029; -moz-box-shadow: 0px 3px 6px #00000029; box-shadow: 0px 3px 6px #00000029; background-color:#fff; border: 1px solid #b3b3b3;}
.ar_calendar ul.ui-autocomplete li.ui-menu-item div.ui-menu-item-wrapper{line-height: 32px; font-size:14px; white-space: nowrap; vertical-align: center; padding: 0 7px;}
.ar_calendar ul.ui-autocomplete li.ui-menu-item div.ui-menu-item-wrapper.ui-state-active{background: #F3F5F6; color: #333333; margin: 0}
.ar_calendar ul.ui-autocomplete li.ui-menu-item div.ui-menu-item-wrapper strong{text-decoration: underline; color: var(--main-color);}

.calendarWriteLayerView .addressBtn {margin-left: 10px; font-size: 14px; color: #0f0f0f; font-weight: 500; width: 72px; border-color: #ababab;}
.calendarWriteLayerView .calendarParticipant {display: flex; flex-direction: column;}
.calendarWriteLayerView .calendarParticipantList {display: flex; flex-direction: column; border: 1px solid #E5E5E5; margin-top: 7px; padding: 12px 0; max-height: 115px; overflow-y: auto; width: 100%;}
.calendarWriteLayerView .calendarParticipantItem {display: flex; align-items: center; padding: 0 12px; margin-top: 6px;}
.calendarWriteLayerView .calendarParticipantItem:first-child {margin-top: 0;}
.calendarWriteLayerView .calendarParticipantItem > div {display: flex; align-items: center;}
.calendarWriteLayerView .participantStatus {margin-right: 8px;}
.calendarWriteLayerView .participantStatus > span {display: inline-flex; align-items: center; padding: 0 4px; height: 16px; min-height: 16px; font-size: 11px; border-radius: 2px; border: 1px solid #0000001A; white-space: nowrap; font-weight: 500;}
.calendarWriteLayerView .participantStatus > span.master {color: #000; background-color: #fff;} /* 마스터 */
.calendarWriteLayerView .participantStatus > span.allow {color: #fff; background-color: #96F27A;} /* 수락 */
.calendarWriteLayerView .participantStatus > span.undefined {color: #fff; background-color: #CBCBCB;} /* 미정 */
.calendarWriteLayerView .participantStatus > span.wait {color: #fff; background-color: #C6D2FF;} /* 대기 */
.calendarWriteLayerView .participantStatus > span.refuse {color: #fff; background-color: #FCB2C3;} /* 거절 */
.calendarWriteLayerView .participantInfo {overflow: hidden;}
.calendarWriteLayerView .participantInfo > p {font-size: 14px; color: #0f0f0f; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.calendarWriteLayerView .participantOption {margin-left: 10px;}
.calendarWriteLayerView .participantOption > .removeBtn {all: unset; cursor: pointer; display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -6px -685px;}
.calendarWriteLayerView .calendarParticipantOption {justify-content: space-between; width: 100%; padding: 12px 0 0 0 !important;}
.calendarWriteLayerView .calendarParticipantOption > div {display: flex; align-items: center; position: relative;}
.calendarWriteLayerView .calendarParticipantOption > div:nth-child(1) {overflow: hidden; padding-right: 12px;}
.calendarWriteLayerView .calendarParticipantOption > div:nth-child(2) {padding-left: 12px;}
.calendarWriteLayerView .calendarParticipantOption > div > p {font-size: 14px; color: #000; font-weight: 500; white-space: nowrap;}
.calendarWriteLayerView .calendarParticipantOption > div > p > b {color: var(--main-color); font-weight: 500;}
.calendarWriteLayerView .calendarParticipantOption > div > span {font-size: 14px; color: #898989; font-weight: 500; margin-left: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.calendarWriteLayerView .calendarParticipantOption > div > span > b {color: var(--main-color); font-weight: 500;}
.calendarWriteLayerView .calendarParticipantOption > div > .deleteBtn {all: unset; cursor: pointer; display: inline-flex; align-items: center; font-size: 14px; color: #000; font-weight: 500; white-space: nowrap;}
.calendarWriteLayerView .calendarParticipantOption > div > .deleteBtn > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -368px -1538px; margin-right: 4px;}
.calendarWriteLayerView .calendarParticipantOption > div + div::before {content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 16px; background-color: #ddd;}

.calendarWriteLayerView.schedule .customSelect + label {margin-left: 14px;}
.calendarWriteLayerView.schedule > div > ul > li > div > div:nth-child(2) label + label {margin-left: 24px;}
.calendarWriteLayerView.schedule input[type=text] + select {margin-left: 10px;}
.calendarWriteLayerView.schedule > div > ul > li > div > div > div:not(.textWrap) {display: flex; align-items: center; padding: 0 12px; position: relative;}
.calendarWriteLayerView.schedule > div > ul > li > div > div > div:not(.textWrap) > label {display: flex; align-items: center;}
.calendarWriteLayerView.schedule > div > ul > li > div > div > div:not(.textWrap) > label + label {margin-left: 10px;}
.calendarWriteLayerView.schedule > div > ul > li > div > div > div:not(.textWrap) > label > input {margin-right: 5px;}
.calendarWriteLayerView.schedule > div > ul > li > div > div > div:not(.textWrap) > button.deleteBtn {all: unset; cursor: pointer; display: inline-flex; align-items: center; font-size: 14px; color: #000;}
.calendarWriteLayerView.schedule > div > ul > li > div > div > div:not(.textWrap) > button.deleteBtn > i {display: inline-block; width: 16px; height: 16px; min-width: 16px; background: url(../img/ar_main.svg) no-repeat -368px -1537px; margin-right: 4px;}
.calendarWriteLayerView.schedule > div > ul > li > div > div > div:not(.textWrap) + div::before {content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 16px; background-color: #ddd;}
.calendarWriteLayerView.schedule .addAlarmBtn {all: unset; cursor: pointer; color: #333; font-size: 14px; text-decoration: underline; margin-top: 10px;}

.calendarLayer.writeSchedule > div > div:nth-child(3) {display: flex; align-items: center; padding-top: 14px; justify-content: center; padding: 20px 30px 0;}
.calendarLayer.writeSchedule > div > div:nth-child(3) > button {all: unset; font-size: 15px; height: 32px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 104px; cursor: pointer;}
.calendarLayer.writeSchedule > div > div:nth-child(3) > button:nth-child(1) {color: #fff; background-color: #525763; border: 1px solid #525763;}
.calendarLayer.writeSchedule > div > div:nth-child(3) > button:nth-child(2) {color: #333; background-color: #fff; border: 1px solid #CBCBCB; margin-left: 8px;}

/* 캘린더 - 일정 반복 레이어 */
.calendarLayer.repeatSchedule {display: flex; min-width: 406px; max-width: 406px;}
.calendarLayer.repeatSchedule > div {display: flex; flex-direction: column; padding: 24px 30px 30px; width: 100%; box-sizing: border-box;}

.calendarLayer.repeatSchedule select {cursor: pointer; box-sizing: border-box; display: inline-flex; align-items: center; height: 28px; border: 1px solid #CBCBCB; background: url(../img/arrow.gif) no-repeat calc(100% + 5px) center; padding: 0 24px 0 10px; overflow: hidden; -webkit-appearance: none; appearance: none; outline: none;}
.calendarLayer.repeatSchedule select:disabled {border: 1px solid #E5E5E5 !important; color: #bfbfbf !important; background-color: #fafafa !important;}
.calendarLayer.repeatSchedule input[type=text] {box-sizing: border-box; height: 28px; border: 1px solid #CBCBCB; padding: 0 10px;}
.calendarLayer.repeatSchedule input[type=text]:focus {border-color: var(--main-color);}
.calendarLayer.repeatSchedule .selectWeek {display: flex; align-items: center; padding-top: 14px;}
.calendarLayer.repeatSchedule .selectWeek > li {margin-right: 6px;}
.calendarLayer.repeatSchedule .selectWeek > li:last-child {margin-right: 0;}
.calendarLayer.repeatSchedule .selectWeek > li > button {all: unset; cursor: pointer; box-sizing: border-box; width: 28px; height: 28px; min-width: 28px; border: 1px solid #E5E5E5; border-radius: 4px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; color: #000; background-color: #fff; font-weight: 500;}
.calendarLayer.repeatSchedule .selectWeek > li.on > button {border-color: var(--main-color); background-color: var(--main-color); color: #fff;}

.calendarLayer.repeatSchedule > div > div:nth-child(1) {display: flex; align-items: center; justify-content: space-between;}
.calendarLayer.repeatSchedule > div > div:nth-child(1) > h1 {font-size: 20px; color: #000; font-weight: 500;}
.calendarLayer.repeatSchedule > div > div:nth-child(1) > button.closeBtn {all: unset; display: block; width: 16px; height: 16px; min-width: 16px; cursor: pointer; background: url(../img/ar_main.svg) no-repeat -7px -555px; position: relative; top: -4px; right: -10px;}

.calendarLayer.repeatSchedule > div > div:nth-child(2) {display: flex; flex-direction: column;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div {display: flex; flex-direction: column; padding-top: 28px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) {display: flex; align-items: center;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > p {font-size: 14px; color: #000;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > select {width: 92px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > p + select {margin-left: 18px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul {display: none; align-items: center; margin-left: 10px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul.onDate,
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul.onCount {display: flex;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul > li {display: none; align-items: center; font-size: 14px; color: #000;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul.onDate > li.endDate,
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul.onCount > li.endCount {display: flex;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul > li > input {margin-right: 10px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul > li.endDate > input {width: 134px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(1) > ul > li.endCount > input {width: 56px;}

.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(2) {display: flex; align-items: center; padding-top: 24px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > div:nth-child(2) > p {display: flex; flex: 1; font-size: 14px; color: #000; padding: 10px 12px; background-color: #EEF1FF; border-radius: 4px; font-weight: 500;}

.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul {display: flex; flex-direction: column; padding-top: 28px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li {display: none; flex-direction: column;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul.repeatDay > li.perDay,
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul.repeatWeek > li.perWeek,
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul.repeatMonth > li.perMonth,
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul.repeatYear > li.perYear {display: flex;}

.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > label {display: flex; align-items: center; font-size: 14px; color: #000;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > label + label {padding-top: 16px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > label > input[type=radio] {margin-right: 5px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > label > input[type=text] {width: 56px; margin: 0 7px 0 18px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > label > select {width: 72px; margin-left: 18px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > label > select + select {margin-left: 8px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > p {display: flex; align-items: center; font-size: 14px; color: #000;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > p > input[type=text] {width: 56px; margin: 0 7px 0 18px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > p > select {margin-left: 18px; width: 62px;}
.calendarLayer.repeatSchedule > div > div:nth-child(2) > div > ul > li > p + label {padding-top: 12px;}

.calendarLayer.repeatSchedule > div > div:nth-child(3) {display: flex; align-items: center; padding-top: 50px; justify-content: center;}
.calendarLayer.repeatSchedule > div > div:nth-child(3) > button {all: unset; font-size: 15px; height: 32px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 104px; cursor: pointer;}
.calendarLayer.repeatSchedule > div > div:nth-child(3) > button:nth-child(1) {color: #fff; background-color: #525763; border: 1px solid #525763;}
.calendarLayer.repeatSchedule > div > div:nth-child(3) > button:nth-child(2) {color: #333; background-color: #fff; border: 1px solid #CBCBCB; margin-left: 8px;}

/* custom select 옵션 레이어 */
.calendarLayer.customSelectOption {display: flex; flex-direction: column; min-width: 194px; max-width: 194px; padding: 10px 0;}
.calendarLayer.customSelectOption > a {display: flex; align-items: center; padding: 0 20px; font-size: 14px; color: #000; font-weight: 500; min-height: 32px;}
.calendarLayer.customSelectOption > a:hover {background-color: #F3F5F6;}
.calendarLayer.customSelectOption > a:last-child {color: var(--error-color);}

/* 캘린더 - 반복 간격 레이어 */
.calendarLayer.repeatInterval {display: flex; min-width: 220px; max-width: 220px;}
.calendarLayer.repeatInterval > div {display: flex; flex-direction: column; width: 100%; box-sizing: border-box;}
.calendarLayer.repeatInterval > div > div:nth-child(1) {display: flex; align-items: center; padding: 20px 14px 2px;}
.calendarLayer.repeatInterval > div > div:nth-child(1) > h1 {font-size: 14px; color: #000; font-weight: 500;}
.calendarLayer.repeatInterval > div > div:nth-child(2) {display: flex; flex-direction: column; padding: 14px;}
.calendarLayer.repeatInterval > div > div:nth-child(2) > div {display: flex; align-items: center;}
.calendarLayer.repeatInterval > div > div:nth-child(2) > div > input {height: 28px; border-radius: 0; border: 1px solid #CBCBCB; padding: 0 10px; min-width: 46px; max-width: 46px; box-sizing: border-box;}
.calendarLayer.repeatInterval > div > div:nth-child(2) > div > select {cursor: pointer; box-sizing: border-box; display: inline-flex; align-items: center; height: 28px; border: 1px solid #CBCBCB; background: url(../img/arrow.gif) no-repeat calc(100% + 5px) center; padding: 0 24px 0 10px; overflow: hidden; -webkit-appearance: none; appearance: none; outline: none; flex: 1; margin-left: 10px;}
.calendarLayer.repeatInterval > div > div:nth-child(2) > ul {display: flex; flex-wrap: wrap; padding-top: 8px;}
.calendarLayer.repeatInterval > div > div:nth-child(2) > ul > li {margin: 6px 6px 0 0;}
.calendarLayer.repeatInterval > div > div:nth-child(2) > ul > li > button {all: unset; cursor: pointer; box-sizing: border-box; width: 28px; height: 28px; min-width: 28px; border-radius: 4px; border: 1px solid #E5E5E5; background-color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; color: #000; font-weight: 500;}
.calendarLayer.repeatInterval > div > div:nth-child(2) > ul > li.on > button {border-color: var(--main-color); background-color: var(--main-color); color: #fff;}
.calendarLayer.repeatInterval > div > div:nth-child(3) {display: flex; align-items: center; justify-content: center; padding: 14px; border-top: 1px solid #F4F4F4;}
.calendarLayer.repeatInterval > div > div:nth-child(3) > button {all: unset; font-size: 15px; height: 32px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex: 1;}
.calendarLayer.repeatInterval > div > div:nth-child(3) > button:nth-child(1) {color: #fff; background-color: #525763; border: 1px solid #525763;}
.calendarLayer.repeatInterval > div > div:nth-child(3) > button:nth-child(2) {color: #333; background-color: #fff; border: 1px solid #CBCBCB; margin-left: 8px;}

/* 캘린더 - 참석자 마우스 오버 레이어 */
.calendarLayer.participantList {display: flex; min-width: 378px; max-width: 378px; padding: 14px 0 !important; max-height: 300px; overflow-y: auto; align-items: flex-start !important;}
.calendarLayer.participantList::before {display: none !important;}
.calendarLayer.participantList > div {display: flex; flex-direction: column; width: 100%; box-sizing: border-box; padding: 0 26px; overflow-y: auto;}
.calendarLayer.participantList > div > div {display: flex; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid #F2F2F2;}
.calendarLayer.participantList > div > div:last-child {border-bottom: none;}
.calendarLayer.participantList > div > div > div {display: flex; width: 80px; min-width: 80px; height: 100%; align-items: flex-start; overflow: hidden; padding-right: 5px; box-sizing: border-box;}
.calendarLayer.participantList > div > div > div > p {font-size: 15px; font-weight: 600; color: #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.calendarLayer.participantList > div > div > div > p > span {color: var(--main-color); margin-left: 4px;}
.calendarLayer.participantList > div > div > ul {display: flex; flex-direction: column; min-height: 16.5px; overflow: hidden;}
.calendarLayer.participantList > div > div > ul > li {margin-top: 6px; font-size: 15px; color: #000; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.calendarLayer.participantList > div > div > ul > li:first-child {margin-top: 0;}

/* 캘린더 - 메일 본문 약속 초대 */
.calendarInvitationWrap {display: flex; flex-direction: column; padding: 30px 14px 0 38px;}
.calendarInvitationWrap > p {padding: 20px 0 0; font-size: 14px; color: #333333; font-weight: 400; display: flex; align-items: flex-start;}
.calendarInvitationWrap > p > i {display: inline-block; width: 15px; height: 15px; min-width: 15px; background: url(../img/ar_main.svg) no-repeat -140px -247px; margin-right: 8px; position: relative; top: -0.5px;}
.calendarInvitation {display: flex; border: 1px solid #DDDDDD; padding: 28px;}
.calendarInvitation > div {display: flex; flex-direction: column;}
.calendarInvitation > div:nth-child(1) {width: 120px; min-width: 120px;}
.calendarInvitation > div:nth-child(2) {flex: 1;}
.calendarInvitation > div:nth-child(2) > h1 {font-size: 22px; color: #000; font-weight: bold;}
.calendarInvitation > div:nth-child(2) > .invitationView {padding-top: 12px;}
.calendarInvitation > div:nth-child(2) > .invitationView > ul {display: flex; flex-direction: column;}
.calendarInvitation > div:nth-child(2) > .invitationView > ul > li {display: flex; align-items: flex-start; margin-bottom: 12px;}
.calendarInvitation > div:nth-child(2) > .invitationView > ul > li > div {display: flex; align-items: flex-start; height: 100%;}
.calendarInvitation > div:nth-child(2) > .invitationView > ul > li > div:nth-child(1) {width: 62px; min-width: 62px;}
.calendarInvitation > div:nth-child(2) > .invitationView > ul > li > div > span {font-size: 16px; color: #B0B0B0; font-weight: 500;}
.calendarInvitation > div:nth-child(2) > .invitationView > ul > li > div > p {font-size: 16px; color: #000; font-weight: 500;}
.calendarInvitation > div:nth-child(2) > .invitationView > ul > li > div > p > span {white-space: nowrap;}
.calendarInvitation > div:nth-child(2) > .invitationView > div {display: flex; align-items: center; padding-top: 8px;}
.calendarInvitation > div:nth-child(2) > .invitationView > div > button {all: unset; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 94px; min-width: 94px; height: 32px; min-height: 32px; font-size: 15px; font-weight: 400; color: #333333; border: 1px solid #CBCBCB; background-color: #fff;}
.calendarInvitation > div:nth-child(2) > .invitationView > div > button.on {color: #fff; border-color: #525763; background-color: #525763;}
.calendarInvitation > div:nth-child(2) > .invitationView > div > button + button {margin-left: 10px;}
.calendarInvitation > div:nth-child(2) > .invitationView > div > button:disabled {border-color: #DCDCDC; background-color: #FBFBFC; color: #CBCBCB; pointer-events: none;}
.calendarInvitation > div:nth-child(2) > .invitationView > p {font-size: 16px; color: #000; font-weight: 500; padding-bottom: 18px;}
.calendarInvitation > div:nth-child(2) > .invitationView > span {font-size: 16px; color: #666666; font-weight: 500; display: block;}
.calendarInvitation > div:nth-child(2) > .invitationView > span > b {color: var(--main-color);}
.calendarInvitation > div:nth-child(2) > .invitationView > span.modified {color: #B0B0B0; text-decoration: line-through;}
.calendarInvitation > div:nth-child(2) > .invitationView > span + span {margin-top: 6px;}

.calendarInvitation .calendarImage {display: flex; flex-direction: column; width: 76px; border: 3px solid var(--main-color); border-radius: 8px; overflow: hidden; background-color: var(--main-color);}
.calendarInvitation .calendarImage > div {display: flex; align-items: center; justify-content: center;}
.calendarInvitation .calendarImage .calendarImageMonth {background-color: var(--main-color);}
.calendarInvitation .calendarImage .calendarImageMonth > p {font-size: 14px; color: #fff; font-weight: 500; padding: 2px 0;}
.calendarInvitation .calendarImage .calendarImageDate {background-color: #fff; position: relative;}
.calendarInvitation .calendarImage .calendarImageDate::after {content: ''; display: block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: calc(100% - 20px); height: 1px; background-color: #eaebee;}
.calendarInvitation .calendarImage .calendarImageDate > p {font-size: 24px; font-weight: 600; color: #000; padding: 10px 0 4px; width: 100%; text-align: center; box-sizing: border-box;}
.calendarInvitation .calendarImage .calendarImageDay {background-color: #fff;}
.calendarInvitation .calendarImage .calendarImageDay > p {font-size: 14px; color: #000; font-weight: 500; padding: 4px 0;}

/* Mac OS 전용 (body.forMac) */
body.forMac .mailListCancel > a.cancelDeliveryStatus::before {background: url(../img/ar_main.svg) no-repeat -147px -769px;}
body.forMac .mailListReception > span > i {background: url(../img/ar_main.svg) no-repeat -368px -1046px;}
body.forMac .mailListReception > span > a {background: url(../img/ar_main.svg) no-repeat -139px -248px;}
body.forMac .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -137px ;}
body.forMac .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -159px ;}
body.forMac #wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -181px ;}
body.forMac #wrap.themeSideBlack .treeTopWrap > .treeSelectableMenuContainer > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail13 {background: url(../img/ar_main.svg) -270px -159px ;}
body.forMac .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -16px -1587px ;}
body.forMac .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -16px -1608px ;}
body.forMac #wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -16px -1631px ;}
body.forMac #wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail27 {background: url(../img/ar_main.svg) -16px -1653px ;}
body.forMac .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail28 {background: url(../img/ar_main.svg) -38px -1587px ;}
body.forMac .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail29 {background: url(../img/ar_main.svg) -82px -1587px ;}
body.forMac #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail28 {background: url(../img/ar_main.svg) -38px -1631px ;}
body.forMac #wrap.themeSideBlack .treeSelectableMenuContainer > div > ul > li > a > div:nth-child(1) > span.treeIcon_mail29 {background: url(../img/ar_main.svg) -82px -1631px ;}
body.forMac .addressGroupPopup > .newGroupBox > button > span {background: url(../img/ar_main.svg) no-repeat -227px -402px;}
body.forMac .mailMovePopup > .newMailBox > button > span {background: url(../img/ar_main.svg) no-repeat -227px -402px;}
body.forMac .mailLabelPopup > .newLabel > button > span {background: url(../img/ar_main.svg) no-repeat -227px -402px;}
body.forMac .calendarLayer.labelSelect > .newLabel > button > span {background: url(../img/ar_main.svg) no-repeat -227px -402px;}
body.forMac .templateListPopup > ul:last-of-type > li > a > span {background: url(../img/ar_main.svg) no-repeat -51px -686px; }
body.forMac .profileBottom button span {background: url(../img/ar_main.svg) no-repeat -226px -403px;}
body.forMac .sharedMailboxContextMenu > div > p > i {background: url(../img/ar_main.svg) no-repeat -598px -1048px;}
body.forMac .addressListSharedContextMenu > div > p > i {background: url(../img/ar_main.svg) no-repeat -598px -1048px;}
body.forMac .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail26 {background: url(../img/ar_main.svg) -89px -2256px;}
body.forMac .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail26 {background: url(../img/ar_main.svg) -89px -2278px;}
body.forMac #wrap.themeSideBlack .treeTopWrap > ul > li > a > div:nth-child(1) > span.treeIcon_mail26 {background: url(../img/ar_main.svg) -89px -2300px ;}
body.forMac #wrap.themeSideBlack .treeTopWrap > ul > li.click > a > div:nth-child(1) > span.treeIcon_mail26 {background: url(../img/ar_main.svg) -89px -2322px ;}
body.forMac .boardViewCommentItemBottom .replyBtn {line-height: 28px;}

/* svg 덮어쓰는 영역 */
.gnb_list_box li a,
a.gnb_my .filter_mask,
.gnb_my_lyr .gnb_my_content .gnb_mask,
.gnb_lst > li .gnb_icon,
.btn_fold .spr, .lft_fd .btn_fold .spr,
.tab_static li .icon, .tab_more li .icon,
.smart_tab_cover .smart_tab li .icon,
.smart_tab_cover .smart_tab li .tab_close .close, .tab_list .tab_box li .tab_close .close,
.section_typemail a .icon,
.buttonSet .btn_txt .bu_exp,
.buttonSet .check_mail .down,
a.btn_change_type .spr, a.btn_change_layout .spr, a.btn_funtion .spr,
.buttonSet .buDel,
.buttonSet .bu_exp,
.buttonSet button.sendto .ic_send,
.adrs_add button .ico,
.mail_file .wrap_filelist .link_save, .mail_file .wrap_filelist .link_cloud,
.buChk, .buRej, .buWat, .buRec,
.buttonSet .buMail,
.list_type_detail .sort_option .star button.star_ico,
.list_type_thumb .sort_option .star button.star_ico,
.list_type_thumb .list_thumb li .cell.star button.star_ico,
.path_list .path_item::after,
.mailListWrap .infor_date .ic_fold,
ul.description li.des_img,
ul.description li.des_img .upto_data,
.ico_info,
.ico_set,
.snb_nav .ico_fold,
.setup_table .btn_add .ico,
.set_action .sub_tit button.btn_add .buAdd,
.inbox_action .search_form .ipt_wrap .btn_submit,
.paginate a .spr,
.add_form .ico_plus,
.set_action.proxy .inbox_action .ico_add,
.ico_del,
.mail_adrs .del, .choose_box dl dd ul li .del,
.ico_q,
.ico_p,
.choose_box .btn_area button .ico_move,
.viewTitle .spr,
.viewTitle dl dt .viewMoreOff, .viewTitle dl dt .viewMoreOn,
.ico_toggle,
.mailList .mTitle .forgery_cause,
.mailList .mTitle .spam_cause,
.icoFile,
.mailList .mInfo .spr,
.layoutSelectText .button_s2 .icon,
.buttonSet .change_write_mode .ico_change_write,
.buttonSet .buSend,
.mailWriteItem .sClose, .mailWriteItem .sOpen,
.mailWriteItem .fForm .file_funtion a .ico_big,
.mInput_holder .btn_recentaddr a img,
.mailWriteItem .mail_write_only .write_select_box .select_bullet,
.rep_contact_wrapper .ico,
.profile_wrapper .ico,
.dh_layer button.btn_close,
.profile_wrapper .profile_wrap .pf_l .pf_photo.readonly,
.group_setting_wrap .buttonSet .up_n_down button .ico,
.group_setting_wrap .add_group_wrap button.btn_add .ico.buAdd,
table.group_table td.box_btn button,
.lst_detail li.row .cell .ico,
.search_form .ipt_wrap .btn_submit,
.madrs .toitem h3 a .ico_trash,
.madrs .adrs_category li .ic,
.toitem .addr_list li .ic,
.toitem .addr_list li .del,
.adrs_org .btn_ctrl button .fc_input,
.madrs .group_mem button,
.layerHead > .btn_close,
.mailListWrap .infor_name li.inforName em,
.tab_list .tab_box li .icon,
.list_view .folder a, .list_view .folder strong,
.list_view .inpd_a.modify button,
.balloonTitle > a.closePopup,
.mailListWrap .nom .empty_img,
.mailListHead .tip_receipt_box .ico,
.set_forms .img,
.type_b.list_layer .msearch .search_btn,
.mail_preview .preview_area .pre_attach ul li .tit:before,
.mail_preview .btn_close,
.btn_round .ico_tback,
.wrap_movement .btn_move .spr,
.wrap_movement .btn_print .ico_print,
.wrap_movement .link_window .ico_window,
.btn_lstView .arrow,
.approval_viewHead h3 .app_type .ico,
.list_view .star a, .list_view .star strong,
.cphone_abs .del span,
.cphone_pad .cphone_btn a,
.aprv_wrap .title .tit_ico,
.empty_msg .ico,
.dh_layer .importantOff, .dh_layer .importantOn,
.dh_layer.add_address .tbl_address .combo_button .ico_arrow,
.set_action .buttonSet .ico,
.mailList .mTitle .newWindow .spr,
.buRec,
.scroller .driveListWrap .nom .empty_img,
.scroller .drive_list_wrap .nom .empty_img,
.scroller .driveListWrap .nom .result_img,
.scroller .drive_list_wrap .nom .result_img,
.choose_box dl dt button .ico_del,
.share_info dd .ico.arrow,
.share_info button,
a.gnb_my .arrow_more {background-image: url(../img/ar_main.svg) !important; background-size: 859px 3300px !important;}