@charset "UTF-8";
:root {
  --ImageVersion: WBK251027=01;
  --fs09: 0.5625rem;
  --fs10: 0.625rem;
  --fs11: 0.6875rem;
  --fs12: 0.75rem;
  --fs13: 0.8125rem;
  --fs14: 0.875rem;
  --fs15: 0.9375rem;
  --fs16: 1rem;
  --fs17: 1.0625rem;
  --fs18: 1.125rem;
  --fs19: 1.1875rem;
  --fs20: 1.25rem;
  --fs21: 1.3125rem;
  --fs22: 1.375rem;
  --fs23: 1.4375rem;
  --fs24: 1.5rem;
  --fs25: 1.5625rem;
  --fs26: 1.625rem;
  --fs27: 1.6875rem;
  --fs28: 1.75rem;
  --fs29: 1.8125rem;
  --fs30: 1.875rem;
  --fs31: 1.938rem;
  --fs32: 2rem;
  --fs33: 2.063rem;
  --fs40: 2.5rem;
  --fs50: 3.125rem;
  --MainBgColor: #fff;
  --MainBgColor-rgb: 255,255,255;
  --MainFontColor: #333;
  --MainFontColor-rgb: 51,51,51;
  --MainFontColorLighter: #999;
  --MainFontColorLighter-rgb: 153,153,153;
  --InvertBgColor: #333;
  --InvertBgColor-rgb: 51,51,51;
  --InvertFontColor: #fff;
  --InvertFontColor-rgb: 255,255,255;
  --ProgramBgColor: #EFEFEF;
  --ToolbarBgColor: #fff;
  --ToolbarFontColor: #fff;
  --PgmAreaBgColor: #F5F8FD;
  --BgColorGrey: #edeff5;
  --BgColorGrey1: #f9f9f9;
  --BgColorGrey2: #bfc3cd;
  --FontColorGrey: #999999;
  --FontColorGrey1: #666666;
  --BorderGrey: #cccccc;
  --BorderGreyLight: #e6e6e6;
  --BorderGreyDark: #999999;
  --BorderGreyDark1: #333;
  --MainColor: #0EB16D;
  --MainColor-rgb: 14,177,109;
  --PointColor: #fe8739;
  --AIColor: linear-gradient(144deg, #6C68EC 0%, #604AE9 40%, #A928E6 100%);
  --errorColor: #F05150;
  --errorColorHover: #ee3a39;
  --errorColorActive: #ec2221;
  --SubColor1: #434a4e;
  --SubColor2: #1266e6;
  --SubColor3: #6350F5;
  --SubColor4: #e669a2;
  --SubColor5: #e91768;
  --colorWhite: #fff;
  --colorGreen: #17D0BC;
  --colorGrey: #999999;
  --colorRed: #FF6262;
  --colorRed-rgb: 255,98,98;
  --colorYellow: #ffb602;
  --colorOrange: #fd9800;
  --colorBlue: #3D80F0;
  --colorViolet: #b622c9;
  --LinkFocusOutline: #474747;
  --ControlGroupboxBorder: #E8E8E8;
  --ControlFontColorNon: #ED6040;
  --ControlCaptionFontColor: #333;
  --ControlFontColor: #333;
  --ControlBgColor: #fff;
  --ControlBorderColor: #cbd6dd;
  --ControlCaptionFontColorCodehelp: #333;
  --ControlFontColorCodehelp: #333;
  --ControlBgColorCodehelp: #EEF8FF;
  --ControlBorderColorCodehelp: #87c4ec;
  --ControlBgColorMultiCodehelp: #22b9ed;
  --ControlFontColorMultiCodehelp: #fff;
  --ControlCaptionFontColorDis: #999;
  --ControlFontColorDis: #838383;
  --ControlBgColorDis: #e9e9e9;
  --ControlBorderColorDis: #ccc;
  --ControlCaptionFontColorFocus: #0EB16D;
  --ControlFontColorFocus: #0EB16D;
  --ControlBgColorFocus: #fff;
  --ControlBorderColorFocus: #0EB16D;
  --ControlBgColorSelected: #0EB16D;
  --ControlFontColorSelected: #fff;
  --ControlCaptionFontColorError: #F85962;
  --ControlFontColorError: #F85962;
  --ControlBgColorError: #fff;
  --ControlBorderColorError: #F85962;
  --ButtonFontColor: #fff;
  --ButtonBorderColor: #0EB16D;
  --ButtonBgColor: #0EB16D;
  --ButtonDefaultColorHover: #0c995e;
  --ButtonDefaultColorActive: #0b9059;
  --InputDateFontColorHover: #086a41;
  --InputDateBtnTodayColorHover: #acf8d9;
  --InputDateBtnDeleteColorHover: white;
  --FileUploadBg: #F2FAFF;
  --FileUploadFontColor: #333;
  --FileUploadBtnBg: #ABC1CF;
  --FileUploadBtnFontColor: #fff;
  --FileUploadListBorder: #e0e0e0;
  --FileUploadTypeFontColor: #fff;
  --FileUploadTypeImgBg: #f65177;
  --FileUploadTypeTextBg: #00b0ff;
  --FileUploadTypeEtcBg: #4a4f5c;
  --FileUploadMsgBg: #c9cddf;
  --FileUploadMsgBorder: #cad2e1;
  --ImgBg: #d7dee0;
  --ImgBorder: #bac4c7;
  --ImgBtnBg: #35383c;
  --TreeBorderColor: #e6e6e6;
  --TreeSelectedBg: #c7cfff;
  --CodehelpColumnMoveItemBg: #4a4f5c;
  --CodehelpColumnMoveItemFontColor: #fff;
  --modalessBtnHelpBgColor: #434a4f;
  --styleCheckToggleBgColor: #d5d5d5;
  --ControlSubColor: #3466FF;
  --ControlColorBlue: #3466FF;
  --ControlColorGreen: #15B065;
  --ControlColorYellow: #FBB024;
  --ControlColorRed: #F05150;
  --ControlColorGrey: #999999;
  --DimColor: rgba(0, 0, 0, 0.4);
  --verticalCaptionHeight: 20px;
  --PopupBgColor: #fff;
  --PopupBorderColor: #ebebeb;
  --FavCodeBgColor: #5DBDFC;
  --programActionBtnShowHideBgColorHover: #0EB16D;
  --programActionBtnAreaBgColor: #3f4246;
  --programActionBtnBgColor: #1e1f21;
  --programActionBtnBgColorHover: #0EB16D;
  --BarIndicatorBgColor: #686e71;
  --BarIndicatorHeight: 30px;
  --codehelpAreaListBgColor: #737e84;
  --ulCodeHelpListBgColorHover: #434a4e;
  --searchCodehelpAreaBorderColor: #0EB16D;
  --dlgBoxShadow: 0 0 0 1px rgba(0,0,0,.01),0 0 20px 0 rgba(0,0,0,.05),0 9px 24px 0 rgba(0,0,0,.07);
  --codehelpAreaListWidth: 300px;
  --btnAsColorHover: #0a8250;
  --btnRetryLoginColorHover: #0fba73;
  --ulToolbarColorHover: #12e08a;
  --ulCodeHelpListColorHover: #fafafa;
  --LeftAreaWidth: 280px;
  --BtnFlyoutBgColor: #0EB16D;
  --BtnFlyoutIconColor: #fff;
  --LeftModuleMenuAreaBgColor: #E5E9F0;
  --LeftModuleMenuAreaHoverBgColor: #3A454B;
  --LeftModuleMenuHoverBgColor: #ECEFF1;
  --LeftModuleMenuAreaFlyoutWidth: 240px;
  --moduleIconColor: #616161;
  --moduleIconInvertColor: #fff;
  --moduleIconColorSelected: #0EB16D;
  --moduleIconColorSelectedSub: #0EB16D;
  --moduleIconBgColorHover: #0EB16D;
  --moduleIconBgColorSelected: #0EB16D;
  --moduleNameColorSelected: #0EB16D;
  --btnASColor: #0EB16D;
  --expanderMenuBtnBgColor: rgba(5, 5, 5, 0.2);
  --expandBgColor: #2a3135;
  --expandMdSelectBgColor: #0EB16D;
  --bgPeopleBgColor: #2A2D2E;
  --moduleNoticeBgColor: #f1f4f6;
  --modulNoticeBtnAreaBgColor: #737e84;
  --LeftAreaBgColor: #f1f4f6;
  --LeftTileMenuAreaBgColor: #e3e6ec;
  --tileListBgColor: #e3e6ec;
  --tileListEditTopBgColor: #434A4E;
  --mdfolderPlusBgColor: #f1f4f6;
  --mdfolderPlusBgColorHover: rgba(0, 0, 0, 0.05);
  --tileMenuEditBtnSaveBgColor: #0EB16D;
  --tileMenuEditBtnCancelBgColor: #fff;
  --tileMenuEditBtnCancelBorderColor: #0EB16D;
  --tileMenuEditBtnCancelFontColor: #0EB16D;
  --favoriteAddBoxBtnNormalBgColor: #0EB16D;
  --homeModeTopBarBgColor: #fff;
  --homeModeLeftMenuBgColor: #fff;
  --CenterAreaBgColor: #E5E9F0;
  --CenterAreaBgColor-rgb: 229,233,240;
  --CenterHeaderAreaBgColor: #E5E9F0;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.08);
  --CenterHeaderAreaBtnRightBgColor: #fff;
  --CenterHeaderAreaBtnROn: #D5DBE7;
  --CenterHeaderAreaBtnRLinkBgColor: #E5EAED;
  --CenterHeaderAreaBtnRLinkBgColorHover: #666;
  --CenterHeaderAreaBtnNew: #ff4889;
  --quickListBorderColor: #d5dbe7;
  --quickListBgColor: #f5f7f9;
  --quickListTxtcolor: #0EB16D;
  --ulQuickMenuMoreBgColor: #edeff5;
  --ulTopOpenListLiSelectedBgColor: #434a4f;
  --pageProgramQueryAreaBgColor: #f1f4f6;
  --ulResultListTxtModuleBgColor: #dde6ea;
  --btnRadialBallBgColor: #9EACC1;
  --btnBgDevMode: #0EB16D;
  --leftMenuBtnArrowBorderColor: #CFD8DC;
  --icolbMoveArrowColor: #424242;
  --modeTopOpenListTabPgmTitleColor: #333;
  --modeTopOpenListTabPgmTitleColorHover: #666;
  --modeTopOpenListBtnCloseColor: #aaa;
  --modeTopOpenListBtnCloseColorHover: #424242;
  --btnKbotOnBorderColor: #C5BBFF;
  --btnKbotOnBgColor: linear-gradient(135deg, rgba(176, 163, 255, 0.4), rgba(216, 137, 253, 0.4));
  --leftMenuPrcsToggleBgColor: #CBD3E3;
  --leftMenuPrcsToggleCircleBgColor: #fff;
  --leftMenuPrcsToggleIconColor: #90A4AE;
  --leftMenuPrcsToggleOnBgColor: #0EB16D;
  --CenterHeaderHeight: 40px;
  --CenterAreaPadding: 4px;
  --PgmTopHeight: 40px;
  --PgmTabHeight: 40px;
  --rightPanelDefaultWidth: 360px;
  --rightPanelBoxShadow: -3px 3px 6px rgba(0, 0, 0, 0.16);
  --inputLoginTextBtnSearchBgColorHover: #0EB16D;
  --loginErrorTxtFontColor: #fe8739;
  --popupLoginPageInfoFontColor: #0f824a;
  --popupPrivateAgreeBtnNormalBgColor: #19a7ef;
  --btnIconHelpColor: #e6e6e6;
  --btnIconHelpColorHover: #d9d9d9;
  --sheetMainColor: #0EB16D;
  --gcgridlineColorBorderColor: red;
  --gcgroupBgColor: #d0d7e5;
  --gcgroupboxBgColor: #d7e6f7;
  --gctabStripBackgroundBgColor: #9ab5db;
  --gctabStripResizeBarOuterBgColor: #688caf;
  --gctabStripResizeBarInnerBgColor: #d7e6f7;
  --gcnavButtonhoverBgColor: #566ad9;
  --colHeaderBgColor: #F5F8FD;
  --colHeaderFontColor: #333;
  --btnSheetSettingBgColor: #F5F8FD;
  --gccolumnHeaderhoverBgColor: #DBE1EB;
  --gccolumnHeaderhighlightBgColor: #DBE1EB;
  --gcrowHeaderselectedBgColor: #DBE1EB;
  --gcrowHeaderhighlightBgColor: #DBE1EB;
  --gcfilterOKBgColor: #0EB16D;
  --multiSelectedAreaBgColor: #EDEFF5;
  --colHeaderBorderColor: #d7dee0;
  --colHeaderBorderColorHover: #666;
  --gcRowHeaderHoverBgColor: #edeff5;
  --btnSheetSettingBgColorHover: #e0e9f9;
  --boardPaddingH: 30px;
  --boardPaddingV: 24px;
  --boardListWidth: 320px;
  --ulPageLi: gray;
  --pgmLinkColorHover: #0fbf76;
  --processMenuEditTopBarHeight: 50px;
  --BorderDarkKUMS: #333;
  --KUMSBorderColor: #DBE1E6;
  --KUMSListBorderColor: #EDEDED;
  --kkoTempBg: #9fc0d8;
  --apprStatusColorBlue: #1DB0F6;
  --apprStatusColorBlue-rgb: 29,176,246;
  --apprStatusColorGreen: #15B065;
  --apprStatusColorGreen-rgb: 21,176,101;
  --apprStatusColorRed: #fd4040;
  --apprStatusColorRed-rgb: 253,64,64;
  --apprStatusColorYellow: #FF9E00;
  --apprStatusColorYellow-rgb: 255,158,0;
  --apprStatusColorGrey: #999999;
  --apprHomeWrapBorderColor: #DBE1E6;
  --apprTypeCpBgColor: #2677DC;
  --apprListItemSelectedBgColor: #F1F9F5;
  --apprDraftEmpListBgColorHover: #edeff5;
  --apprSideBarWidth: 200px;
  --apprListViewWidth: 42%;
  --apprDocViewAreaWidth: 58%;
  --cpGroupBgColor: #d5e8ff;
  --apprSearchResultMaxWidth: 700px;
  --apprSearchResultMinWidth: 380px;
  --apprPaginationBtnColorHover: whitesmoke;
  --EverViewGrey: #dedede;
  --PEMainColor: #4A3AFE;
  --PEMainColor-rgb: 74,58,254;
  --ARMainColor: #4A3AFE;
  --ARGrandient: linear-gradient(45deg, #4A3AFE, #7342FF);
  --ManagerColor: #3C6CFF;
  --UserColor: #0EB16D;
  --WidgetDevColor: #5D6477;
  --DashBgColor: #EDEFF5;
  --DashEditBgColor: #BCBCBC;
  --WidgetBgColor: #fff;
  --BgColorGrey: #edeff5;
  --BorderColor: #ddd;
  --dashRed: #FF6E6E;
  --dashBlue: #476BFB;
  --iconRed: #FF6767;
  --iconBlue: #476BFB;
  --iconYellow: #D6A100;
  --iconGreen: #15B065;
  --iconGrey: #999;
  --borderRadius: 5px;
  --shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 9px 24px;
}

.theme_Dark {
  --LeftModuleMenuAreaBgColor: #34373A;
  --moduleIconColor: #8E8E8E;
  --homeModeTopBarBgColor: #34373A;
  --homeModeLeftMenuBgColor: #34373A;
  --CenterAreaBgColor: #34373A;
  --CenterAreaBgColor-rgb: 52,55,58;
  --CenterHeaderAreaBgColor: #34373A;
  --CenterHeaderAreaBtnOn: #282a2d;
  --quickListBorderColor: #474b50;
  --quickListBgColor: #404447;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(255, 255, 255, 0.3);
  --btnKbotOnBgColor: none rgba(0, 0, 0, 0.3);
  --leftMenuPrcsToggleBgColor: #505f68;
  --leftMenuPrcsToggleCircleBgColor: #81939d;
  --leftMenuPrcsToggleIconColor: #444;
  --leftMenuPrcsToggleOnCircleBgColor: #81939d;
}
.theme_Dark .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Dark .btnMoreTabPrev > i,
.theme_Dark .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Dark .btnMoreTabNext > i, .theme_Dark .icoTopBar24, .theme_Dark .icoTopBar20, .theme_Dark .icoTopBar16, .theme_Dark .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.theme_Green {
  --MainColor: #188578;
  --MainColor-rgb: 24,133,120;
  --ControlCaptionFontColorFocus: #188578;
  --ControlFontColorFocus: #188578;
  --ControlBorderColorFocus: #188578;
  --ControlBgColorSelected: #188578;
  --ButtonBorderColor: #BC6852;
  --ButtonBgColor: #BC6852;
  --ButtonDefaultColorHover: #146f65;
  --ButtonDefaultColorActive: #13675d;
  --InputDateFontColorHover: #0c443e;
  --InputDateBtnTodayColorHover: #96ece2;
  --programActionBtnShowHideBgColorHover: #188578;
  --programActionBtnBgColorHover: #188578;
  --searchCodehelpAreaBorderColor: #188578;
  --btnAsColorHover: #105a51;
  --btnRetryLoginColorHover: #1a8e80;
  --ulToolbarColorHover: #20b09f;
  --BtnFlyoutBgColor: #188578;
  --LeftModuleMenuAreaBgColor: #BEDDDA;
  --moduleIconColorSelected: #188578;
  --moduleIconColorSelectedSub: #25DEC9;
  --moduleIconBgColorHover: #188578;
  --moduleIconBgColorSelected: #188578;
  --moduleNameColorSelected: #188578;
  --btnASColor: #188578;
  --expandMdSelectBgColor: #188578;
  --tileMenuEditBtnSaveBgColor: #188578;
  --tileMenuEditBtnCancelBorderColor: #188578;
  --tileMenuEditBtnCancelFontColor: #188578;
  --favoriteAddBoxBtnNormalBgColor: #188578;
  --homeModeTopBarBgColor: #BEDDDA;
  --homeModeLeftMenuBgColor: #BEDDDA;
  --CenterAreaBgColor: #BEDDDA;
  --CenterAreaBgColor-rgb: 190,221,218;
  --CenterHeaderAreaBgColor: #BEDDDA;
  --CenterHeaderAreaBtnOn: #add4d0;
  --quickListBorderColor: #add4d0;
  --quickListBgColor: #cfe6e4;
  --quickListTxtcolor: #188578;
  --btnBgDevMode: #188578;
  --leftMenuBtnArrowBorderColor: #AAA;
  --leftMenuPrcsToggleOnBgColor: #188578;
  --inputLoginTextBtnSearchBgColorHover: #188578;
  --sheetMainColor: #188578;
  --gcfilterOKBgColor: #188578;
  --pgmLinkColorHover: #1a9284;
  --btnAddAddressColorHover: #c37864;
  --UserColor: #188578;
}

.theme_Lilac {
  --MainColor: #704FA2;
  --MainColor-rgb: 112,79,162;
  --ControlCaptionFontColorFocus: #704FA2;
  --ControlFontColorFocus: #704FA2;
  --ControlBorderColorFocus: #704FA2;
  --ControlBgColorSelected: #704FA2;
  --ButtonBorderColor: #5A891B;
  --ButtonBgColor: #5A891B;
  --ButtonDefaultColorHover: #644791;
  --ButtonDefaultColorActive: #5f438a;
  --InputDateFontColorHover: #4c366f;
  --InputDateBtnTodayColorHover: #eae4f2;
  --programActionBtnShowHideBgColorHover: #704FA2;
  --programActionBtnBgColorHover: #704FA2;
  --searchCodehelpAreaBorderColor: #704FA2;
  --btnAsColorHover: #583e80;
  --btnRetryLoginColorHover: #7552a9;
  --ulToolbarColorHover: #8a6cb8;
  --BtnFlyoutBgColor: #704FA2;
  --LeftModuleMenuAreaBgColor: #E9E3F5;
  --moduleIconColorSelected: #704FA2;
  --moduleIconColorSelectedSub: #B47EFF;
  --moduleIconBgColorHover: #704FA2;
  --moduleIconBgColorSelected: #704FA2;
  --moduleNameColorSelected: #704FA2;
  --btnASColor: #704FA2;
  --expandMdSelectBgColor: #704FA2;
  --tileMenuEditBtnSaveBgColor: #704FA2;
  --tileMenuEditBtnCancelBorderColor: #704FA2;
  --tileMenuEditBtnCancelFontColor: #704FA2;
  --favoriteAddBoxBtnNormalBgColor: #704FA2;
  --homeModeTopBarBgColor: #E9E3F5;
  --homeModeLeftMenuBgColor: #E9E3F5;
  --CenterAreaBgColor: #E9E3F5;
  --CenterAreaBgColor-rgb: 233,227,245;
  --CenterHeaderAreaBgColor: #E9E3F5;
  --CenterHeaderAreaBtnOn: #dad0ee;
  --quickListBorderColor: #dad0ee;
  --quickListBgColor: #f8f6fc;
  --quickListTxtcolor: #704FA2;
  --btnBgDevMode: #704FA2;
  --leftMenuBtnArrowBorderColor: #AAA;
  --leftMenuPrcsToggleOnBgColor: #704FA2;
  --inputLoginTextBtnSearchBgColorHover: #704FA2;
  --sheetMainColor: #704FA2;
  --gcfilterOKBgColor: #704FA2;
  --pgmLinkColorHover: #7754ac;
  --btnAddAddressColorHover: #689e1f;
  --UserColor: #704FA2;
}

.theme_Oat {
  --MainColor: #7A763F;
  --MainColor-rgb: 122,118,63;
  --ControlCaptionFontColorFocus: #7A763F;
  --ControlFontColorFocus: #7A763F;
  --ControlBorderColorFocus: #7A763F;
  --ControlBgColorSelected: #7A763F;
  --ButtonBorderColor: #636080;
  --ButtonBgColor: #636080;
  --ButtonDefaultColorHover: #696636;
  --ButtonDefaultColorActive: #625f33;
  --InputDateFontColorHover: #484525;
  --InputDateBtnTodayColorHover: #dedcc0;
  --programActionBtnShowHideBgColorHover: #7A763F;
  --programActionBtnBgColorHover: #7A763F;
  --searchCodehelpAreaBorderColor: #7A763F;
  --btnAsColorHover: #58552e;
  --btnRetryLoginColorHover: #817d42;
  --ulToolbarColorHover: #9c9750;
  --BtnFlyoutBgColor: #7A763F;
  --LeftModuleMenuAreaBgColor: #E6E6D2;
  --moduleIconColorSelected: #7A763F;
  --moduleIconColorSelectedSub: #D7B728;
  --moduleIconBgColorHover: #7A763F;
  --moduleIconBgColorSelected: #7A763F;
  --moduleNameColorSelected: #7A763F;
  --btnASColor: #7A763F;
  --expandMdSelectBgColor: #7A763F;
  --tileMenuEditBtnSaveBgColor: #7A763F;
  --tileMenuEditBtnCancelBorderColor: #7A763F;
  --tileMenuEditBtnCancelFontColor: #7A763F;
  --favoriteAddBoxBtnNormalBgColor: #7A763F;
  --homeModeTopBarBgColor: #E6E6D2;
  --homeModeLeftMenuBgColor: #E6E6D2;
  --CenterAreaBgColor: #E6E6D2;
  --CenterAreaBgColor-rgb: 230,230,210;
  --CenterHeaderAreaBgColor: #E6E6D2;
  --CenterHeaderAreaBtnOn: #d9d9bb;
  --quickListBorderColor: #ddddc2;
  --quickListBgColor: #efefe2;
  --quickListTxtcolor: #7A763F;
  --btnBgDevMode: #7A763F;
  --leftMenuBtnArrowBorderColor: #AAA;
  --leftMenuPrcsToggleOnBgColor: #7A763F;
  --inputLoginTextBtnSearchBgColorHover: #7A763F;
  --sheetMainColor: #7A763F;
  --gcfilterOKBgColor: #7A763F;
  --pgmLinkColorHover: #848044;
  --btnAddAddressColorHover: #6e6b8f;
  --UserColor: #7A763F;
}

.theme_Rose {
  --MainColor: #C5446C;
  --MainColor-rgb: 197,68,108;
  --ControlCaptionFontColorFocus: #C5446C;
  --ControlFontColorFocus: #C5446C;
  --ControlBorderColorFocus: #C5446C;
  --ControlBgColorSelected: #C5446C;
  --ButtonBorderColor: #46B29E;
  --ButtonBgColor: #46B29E;
  --ButtonDefaultColorHover: #b73960;
  --ButtonDefaultColorActive: #af365c;
  --InputDateFontColorHover: #902d4b;
  --InputDateBtnTodayColorHover: #fbf3f6;
  --programActionBtnShowHideBgColorHover: #C5446C;
  --programActionBtnBgColorHover: #C5446C;
  --searchCodehelpAreaBorderColor: #C5446C;
  --btnAsColorHover: #a33356;
  --btnRetryLoginColorHover: #c74c72;
  --ulToolbarColorHover: #d16b8b;
  --BtnFlyoutBgColor: #C5446C;
  --LeftModuleMenuAreaBgColor: #F6DEE5;
  --moduleIconColorSelected: #C5446C;
  --moduleIconColorSelectedSub: #ED315F;
  --moduleIconBgColorHover: #C5446C;
  --moduleIconBgColorSelected: #C5446C;
  --moduleNameColorSelected: #C5446C;
  --btnASColor: #C5446C;
  --expandMdSelectBgColor: #C5446C;
  --tileMenuEditBtnSaveBgColor: #C5446C;
  --tileMenuEditBtnCancelBorderColor: #C5446C;
  --tileMenuEditBtnCancelFontColor: #C5446C;
  --favoriteAddBoxBtnNormalBgColor: #C5446C;
  --homeModeTopBarBgColor: #F6DEE5;
  --homeModeLeftMenuBgColor: #F6DEE5;
  --CenterAreaBgColor: #F6DEE5;
  --CenterAreaBgColor-rgb: 246,222,229;
  --CenterHeaderAreaBgColor: #F6DEE5;
  --CenterHeaderAreaBtnOn: #f1cad5;
  --quickListBorderColor: #f1cad5;
  --quickListBgColor: #fbf2f5;
  --quickListTxtcolor: #C5446C;
  --btnBgDevMode: #C5446C;
  --leftMenuBtnArrowBorderColor: #AAA;
  --leftMenuPrcsToggleOnBgColor: #C5446C;
  --inputLoginTextBtnSearchBgColorHover: #C5446C;
  --sheetMainColor: #C5446C;
  --gcfilterOKBgColor: #C5446C;
  --pgmLinkColorHover: #c95075;
  --btnAddAddressColorHover: #55bca9;
  --UserColor: #C5446C;
}

.theme_Skyblue {
  --MainColor: #136EB3;
  --MainColor-rgb: 19,110,179;
  --ControlCaptionFontColorFocus: #136EB3;
  --ControlFontColorFocus: #136EB3;
  --ControlBorderColorFocus: #136EB3;
  --ControlBgColorSelected: #136EB3;
  --ButtonBorderColor: #C97094;
  --ButtonBgColor: #C97094;
  --ButtonDefaultColorHover: #11609c;
  --ButtonDefaultColorActive: #105a93;
  --InputDateFontColorHover: #0c446e;
  --InputDateBtnTodayColorHover: #b4daf7;
  --programActionBtnShowHideBgColorHover: #136EB3;
  --programActionBtnBgColorHover: #136EB3;
  --searchCodehelpAreaBorderColor: #136EB3;
  --btnAsColorHover: #0e5285;
  --btnRetryLoginColorHover: #1474bc;
  --ulToolbarColorHover: #188ae1;
  --BtnFlyoutBgColor: #136EB3;
  --LeftModuleMenuAreaBgColor: #C9E3F1;
  --moduleIconColorSelected: #136EB3;
  --moduleIconColorSelectedSub: #34A7FF;
  --moduleIconBgColorHover: #136EB3;
  --moduleIconBgColorSelected: #136EB3;
  --moduleNameColorSelected: #136EB3;
  --btnASColor: #136EB3;
  --expandMdSelectBgColor: #136EB3;
  --tileMenuEditBtnSaveBgColor: #136EB3;
  --tileMenuEditBtnCancelBorderColor: #136EB3;
  --tileMenuEditBtnCancelFontColor: #136EB3;
  --favoriteAddBoxBtnNormalBgColor: #136EB3;
  --homeModeTopBarBgColor: #C9E3F1;
  --homeModeLeftMenuBgColor: #C9E3F1;
  --CenterAreaBgColor: #C9E3F1;
  --CenterAreaBgColor-rgb: 201,227,241;
  --CenterHeaderAreaBgColor: #C9E3F1;
  --CenterHeaderAreaBtnOn: #b5d9ec;
  --quickListBorderColor: #b5d9ec;
  --quickListBgColor: #ddeef6;
  --quickListTxtcolor: #136EB3;
  --btnBgDevMode: #136EB3;
  --leftMenuBtnArrowBorderColor: #AAA;
  --leftMenuPrcsToggleOnBgColor: #136EB3;
  --inputLoginTextBtnSearchBgColorHover: #136EB3;
  --sheetMainColor: #136EB3;
  --gcfilterOKBgColor: #136EB3;
  --pgmLinkColorHover: #1477c1;
  --btnAddAddressColorHover: #d083a2;
  --UserColor: #136EB3;
}

.themeCp_Blue {
  --MainColor: #1971C1;
  --MainColor-rgb: 25,113,193;
  --ControlCaptionFontColorFocus: #1971C1;
  --ControlFontColorFocus: #1971C1;
  --ControlBorderColorFocus: #1971C1;
  --ControlBgColorSelected: #1971C1;
  --ButtonBorderColor: #1971C1;
  --ButtonBgColor: #1971C1;
  --ButtonDefaultColorHover: #1664aa;
  --ButtonDefaultColorActive: #155ea1;
  --InputDateFontColorHover: #10497d;
  --InputDateBtnTodayColorHover: #c8e1f8;
  --programActionBtnShowHideBgColorHover: #1971C1;
  --programActionBtnBgColorHover: #1971C1;
  --searchCodehelpAreaBorderColor: #1971C1;
  --btnAsColorHover: #135794;
  --btnRetryLoginColorHover: #1a76ca;
  --ulToolbarColorHover: #2a8be3;
  --BtnFlyoutBgColor: #1971C1;
  --LeftModuleMenuAreaBgColor: #1971C1;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #3396F0;
  --moduleIconBgColorHover: #1971C1;
  --moduleIconBgColorSelected: #1971C1;
  --moduleNameColorSelected: #fff;
  --btnASColor: #3396F0;
  --expandMdSelectBgColor: #1971C1;
  --tileMenuEditBtnSaveBgColor: #1971C1;
  --tileMenuEditBtnCancelBorderColor: #1971C1;
  --tileMenuEditBtnCancelFontColor: #1971C1;
  --favoriteAddBoxBtnNormalBgColor: #1971C1;
  --homeModeTopBarBgColor: #1971C1;
  --homeModeLeftMenuBgColor: #1971C1;
  --CenterAreaBgColor: #1971C1;
  --CenterAreaBgColor-rgb: 25,113,193;
  --CenterHeaderAreaBgColor: #1971C1;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #2186e2;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #3396F0;
  --btnBgDevMode: #1971C1;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #3396F0;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #3396F0;
  --inputLoginTextBtnSearchBgColorHover: #1971C1;
  --sheetMainColor: #1971C1;
  --gcfilterOKBgColor: #1971C1;
  --pgmLinkColorHover: #1b79cf;
  --UserColor: #1971C1;
}
.themeCp_Blue .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Blue .btnMoreTabPrev > i,
.themeCp_Blue .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Blue .btnMoreTabNext > i, .themeCp_Blue .icoTopBar24, .themeCp_Blue .icoTopBar20, .themeCp_Blue .icoTopBar16, .themeCp_Blue .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.themeCp_Green {
  --MainColor: #228142;
  --MainColor-rgb: 34,129,66;
  --ControlCaptionFontColorFocus: #228142;
  --ControlFontColorFocus: #228142;
  --ControlBorderColorFocus: #228142;
  --ControlBgColorSelected: #228142;
  --ButtonBorderColor: #228142;
  --ButtonBgColor: #228142;
  --ButtonDefaultColorHover: #1d6d38;
  --ButtonDefaultColorActive: #1b6534;
  --InputDateFontColorHover: #124423;
  --InputDateBtnTodayColorHover: #a2e6b9;
  --programActionBtnShowHideBgColorHover: #228142;
  --programActionBtnBgColorHover: #228142;
  --searchCodehelpAreaBorderColor: #228142;
  --btnAsColorHover: #17592d;
  --btnRetryLoginColorHover: #248946;
  --ulToolbarColorHover: #2da957;
  --BtnFlyoutBgColor: #228142;
  --LeftModuleMenuAreaBgColor: #228142;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #46B56B;
  --moduleIconBgColorHover: #228142;
  --moduleIconBgColorSelected: #228142;
  --moduleNameColorSelected: #fff;
  --btnASColor: #46B56B;
  --expandMdSelectBgColor: #228142;
  --tileMenuEditBtnSaveBgColor: #228142;
  --tileMenuEditBtnCancelBorderColor: #228142;
  --tileMenuEditBtnCancelFontColor: #228142;
  --favoriteAddBoxBtnNormalBgColor: #228142;
  --homeModeTopBarBgColor: #228142;
  --homeModeLeftMenuBgColor: #228142;
  --CenterAreaBgColor: #228142;
  --CenterAreaBgColor-rgb: 34,129,66;
  --CenterHeaderAreaBgColor: #228142;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #2ba153;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #46B56B;
  --btnBgDevMode: #228142;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #46B56B;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #46B56B;
  --inputLoginTextBtnSearchBgColorHover: #228142;
  --sheetMainColor: #228142;
  --gcfilterOKBgColor: #228142;
  --pgmLinkColorHover: #258d48;
  --UserColor: #228142;
}
.themeCp_Green .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Green .btnMoreTabPrev > i,
.themeCp_Green .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Green .btnMoreTabNext > i, .themeCp_Green .icoTopBar24, .themeCp_Green .icoTopBar20, .themeCp_Green .icoTopBar16, .themeCp_Green .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.themeCp_Mint {
  --MainColor: #278883;
  --MainColor-rgb: 39,136,131;
  --ControlCaptionFontColorFocus: #278883;
  --ControlFontColorFocus: #278883;
  --ControlBorderColorFocus: #278883;
  --ControlBgColorSelected: #278883;
  --ButtonBorderColor: #278883;
  --ButtonBgColor: #278883;
  --ButtonDefaultColorHover: #217470;
  --ButtonDefaultColorActive: #1f6c68;
  --InputDateFontColorHover: #164d4a;
  --InputDateBtnTodayColorHover: #ade7e4;
  --programActionBtnShowHideBgColorHover: #278883;
  --programActionBtnBgColorHover: #278883;
  --searchCodehelpAreaBorderColor: #278883;
  --btnAsColorHover: #1c605d;
  --btnRetryLoginColorHover: #29908b;
  --ulToolbarColorHover: #32b0a9;
  --BtnFlyoutBgColor: #278883;
  --LeftModuleMenuAreaBgColor: #278883;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #2CB6A8;
  --moduleIconBgColorHover: #278883;
  --moduleIconBgColorSelected: #278883;
  --moduleNameColorSelected: #fff;
  --btnASColor: #2CB6A8;
  --expandMdSelectBgColor: #278883;
  --tileMenuEditBtnSaveBgColor: #278883;
  --tileMenuEditBtnCancelBorderColor: #278883;
  --tileMenuEditBtnCancelFontColor: #278883;
  --favoriteAddBoxBtnNormalBgColor: #278883;
  --homeModeTopBarBgColor: #278883;
  --homeModeLeftMenuBgColor: #278883;
  --CenterAreaBgColor: #278883;
  --CenterAreaBgColor-rgb: 39,136,131;
  --CenterHeaderAreaBgColor: #278883;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #30a8a2;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #2CB6A8;
  --btnBgDevMode: #278883;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #2CB6A8;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #2CB6A8;
  --inputLoginTextBtnSearchBgColorHover: #278883;
  --sheetMainColor: #278883;
  --gcfilterOKBgColor: #278883;
  --pgmLinkColorHover: #2a948e;
  --UserColor: #278883;
}
.themeCp_Mint .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Mint .btnMoreTabPrev > i,
.themeCp_Mint .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Mint .btnMoreTabNext > i, .themeCp_Mint .icoTopBar24, .themeCp_Mint .icoTopBar20, .themeCp_Mint .icoTopBar16, .themeCp_Mint .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.themeCp_Purple {
  --MainColor: #6544A7;
  --MainColor-rgb: 101,68,167;
  --ControlCaptionFontColorFocus: #6544A7;
  --ControlFontColorFocus: #6544A7;
  --ControlBorderColorFocus: #6544A7;
  --ControlBgColorSelected: #6544A7;
  --ButtonBorderColor: #6544A7;
  --ButtonBgColor: #6544A7;
  --ButtonDefaultColorHover: #5a3d95;
  --ButtonDefaultColorActive: #563a8e;
  --InputDateFontColorHover: #442e71;
  --InputDateBtnTodayColorHover: #e5dff2;
  --programActionBtnShowHideBgColorHover: #6544A7;
  --programActionBtnBgColorHover: #6544A7;
  --searchCodehelpAreaBorderColor: #6544A7;
  --btnAsColorHover: #4f3583;
  --btnRetryLoginColorHover: #6947ae;
  --ulToolbarColorHover: #7f60be;
  --BtnFlyoutBgColor: #6544A7;
  --LeftModuleMenuAreaBgColor: #6544A7;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #a987ff;
  --moduleIconBgColorHover: #6544A7;
  --moduleIconBgColorSelected: #6544A7;
  --moduleNameColorSelected: #fff;
  --btnASColor: #a987ff;
  --expandMdSelectBgColor: #6544A7;
  --tileMenuEditBtnSaveBgColor: #6544A7;
  --tileMenuEditBtnCancelBorderColor: #6544A7;
  --tileMenuEditBtnCancelFontColor: #6544A7;
  --favoriteAddBoxBtnNormalBgColor: #6544A7;
  --homeModeTopBarBgColor: #6544A7;
  --homeModeLeftMenuBgColor: #6544A7;
  --CenterAreaBgColor: #6544A7;
  --CenterAreaBgColor-rgb: 101,68,167;
  --CenterHeaderAreaBgColor: #6544A7;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #7959bb;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #a987ff;
  --btnBgDevMode: #6544A7;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #a987ff;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #a987ff;
  --inputLoginTextBtnSearchBgColorHover: #6544A7;
  --sheetMainColor: #6544A7;
  --gcfilterOKBgColor: #6544A7;
  --pgmLinkColorHover: #6c48b2;
  --UserColor: #6544A7;
}
.themeCp_Purple .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Purple .btnMoreTabPrev > i,
.themeCp_Purple .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Purple .btnMoreTabNext > i, .themeCp_Purple .icoTopBar24, .themeCp_Purple .icoTopBar20, .themeCp_Purple .icoTopBar16, .themeCp_Purple .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.themeCp_Red {
  --MainColor: #92272E;
  --MainColor-rgb: 146,39,46;
  --ControlCaptionFontColorFocus: #92272E;
  --ControlFontColorFocus: #92272E;
  --ControlBorderColorFocus: #92272E;
  --ControlBgColorSelected: #92272E;
  --ButtonBorderColor: #92272E;
  --ButtonBgColor: #92272E;
  --ButtonDefaultColorHover: #7e2228;
  --ButtonDefaultColorActive: #761f25;
  --InputDateFontColorHover: #56171b;
  --InputDateBtnTodayColorHover: #ebb4b7;
  --programActionBtnShowHideBgColorHover: #92272E;
  --programActionBtnBgColorHover: #92272E;
  --searchCodehelpAreaBorderColor: #92272E;
  --btnAsColorHover: #6a1c21;
  --btnRetryLoginColorHover: #9a2931;
  --ulToolbarColorHover: #ba323b;
  --BtnFlyoutBgColor: #92272E;
  --LeftModuleMenuAreaBgColor: #92272E;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #CD3952;
  --moduleIconBgColorHover: #92272E;
  --moduleIconBgColorSelected: #92272E;
  --moduleNameColorSelected: #fff;
  --btnASColor: #CD3952;
  --expandMdSelectBgColor: #92272E;
  --tileMenuEditBtnSaveBgColor: #92272E;
  --tileMenuEditBtnCancelBorderColor: #92272E;
  --tileMenuEditBtnCancelFontColor: #92272E;
  --favoriteAddBoxBtnNormalBgColor: #92272E;
  --homeModeTopBarBgColor: #92272E;
  --homeModeLeftMenuBgColor: #92272E;
  --CenterAreaBgColor: #92272E;
  --CenterAreaBgColor-rgb: 146,39,46;
  --CenterHeaderAreaBgColor: #92272E;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #b23038;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #CD3952;
  --btnBgDevMode: #92272E;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #CD3952;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #CD3952;
  --inputLoginTextBtnSearchBgColorHover: #92272E;
  --sheetMainColor: #92272E;
  --gcfilterOKBgColor: #92272E;
  --pgmLinkColorHover: #9e2a32;
  --UserColor: #92272E;
}
.themeCp_Red .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Red .btnMoreTabPrev > i,
.themeCp_Red .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Red .btnMoreTabNext > i, .themeCp_Red .icoTopBar24, .themeCp_Red .icoTopBar20, .themeCp_Red .icoTopBar16, .themeCp_Red .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.themeCp_Sand {
  --MainColor: #A9631D;
  --MainColor-rgb: 169,99,29;
  --ControlCaptionFontColorFocus: #A9631D;
  --ControlFontColorFocus: #A9631D;
  --ControlBorderColorFocus: #A9631D;
  --ControlBgColorSelected: #A9631D;
  --ButtonBorderColor: #A9631D;
  --ButtonBgColor: #A9631D;
  --ButtonDefaultColorHover: #935619;
  --ButtonDefaultColorActive: #8b5118;
  --InputDateFontColorHover: #683d12;
  --InputDateBtnTodayColorHover: #f3d6b9;
  --programActionBtnShowHideBgColorHover: #A9631D;
  --programActionBtnBgColorHover: #A9631D;
  --searchCodehelpAreaBorderColor: #A9631D;
  --btnAsColorHover: #7d4a16;
  --btnRetryLoginColorHover: #b2681e;
  --ulToolbarColorHover: #d57d24;
  --BtnFlyoutBgColor: #A9631D;
  --LeftModuleMenuAreaBgColor: #A9631D;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #CA831D;
  --moduleIconBgColorHover: #A9631D;
  --moduleIconBgColorSelected: #A9631D;
  --moduleNameColorSelected: #fff;
  --btnASColor: #CA831D;
  --expandMdSelectBgColor: #A9631D;
  --tileMenuEditBtnSaveBgColor: #A9631D;
  --tileMenuEditBtnCancelBorderColor: #A9631D;
  --tileMenuEditBtnCancelFontColor: #A9631D;
  --favoriteAddBoxBtnNormalBgColor: #A9631D;
  --homeModeTopBarBgColor: #A9631D;
  --homeModeLeftMenuBgColor: #A9631D;
  --CenterAreaBgColor: #A9631D;
  --CenterAreaBgColor-rgb: 169,99,29;
  --CenterHeaderAreaBgColor: #A9631D;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #cc7723;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #CA831D;
  --btnBgDevMode: #A9631D;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #CA831D;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #CA831D;
  --inputLoginTextBtnSearchBgColorHover: #A9631D;
  --sheetMainColor: #A9631D;
  --gcfilterOKBgColor: #A9631D;
  --pgmLinkColorHover: #b66b1f;
  --UserColor: #A9631D;
}
.themeCp_Sand .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Sand .btnMoreTabPrev > i,
.themeCp_Sand .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Sand .btnMoreTabNext > i, .themeCp_Sand .icoTopBar24, .themeCp_Sand .icoTopBar20, .themeCp_Sand .icoTopBar16, .themeCp_Sand .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.themeCp_Sand {
  --MainColor: #A9631D;
  --MainColor-rgb: 169,99,29;
  --ControlCaptionFontColorFocus: #A9631D;
  --ControlFontColorFocus: #A9631D;
  --ControlBorderColorFocus: #A9631D;
  --ControlBgColorSelected: #A9631D;
  --ButtonBorderColor: #A9631D;
  --ButtonBgColor: #A9631D;
  --ButtonDefaultColorHover: #935619;
  --ButtonDefaultColorActive: #8b5118;
  --InputDateFontColorHover: #683d12;
  --InputDateBtnTodayColorHover: #f3d6b9;
  --programActionBtnShowHideBgColorHover: #A9631D;
  --programActionBtnBgColorHover: #A9631D;
  --searchCodehelpAreaBorderColor: #A9631D;
  --btnAsColorHover: #7d4a16;
  --btnRetryLoginColorHover: #b2681e;
  --ulToolbarColorHover: #d57d24;
  --BtnFlyoutBgColor: #A9631D;
  --LeftModuleMenuAreaBgColor: #A9631D;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #CA831D;
  --moduleIconBgColorHover: #A9631D;
  --moduleIconBgColorSelected: #A9631D;
  --moduleNameColorSelected: #fff;
  --btnASColor: #CA831D;
  --expandMdSelectBgColor: #A9631D;
  --tileMenuEditBtnSaveBgColor: #A9631D;
  --tileMenuEditBtnCancelBorderColor: #A9631D;
  --tileMenuEditBtnCancelFontColor: #A9631D;
  --favoriteAddBoxBtnNormalBgColor: #A9631D;
  --homeModeTopBarBgColor: #A9631D;
  --homeModeLeftMenuBgColor: #A9631D;
  --CenterAreaBgColor: #A9631D;
  --CenterAreaBgColor-rgb: 169,99,29;
  --CenterHeaderAreaBgColor: #A9631D;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #cc7723;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #CA831D;
  --btnBgDevMode: #A9631D;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #CA831D;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #CA831D;
  --inputLoginTextBtnSearchBgColorHover: #A9631D;
  --sheetMainColor: #A9631D;
  --gcfilterOKBgColor: #A9631D;
  --pgmLinkColorHover: #b66b1f;
  --UserColor: #A9631D;
}
.themeCp_Sand .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Sand .btnMoreTabPrev > i,
.themeCp_Sand .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .themeCp_Sand .btnMoreTabNext > i, .themeCp_Sand .icoTopBar24, .themeCp_Sand .icoTopBar20, .themeCp_Sand .icoTopBar16, .themeCp_Sand .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.theme_Kotra {
  --MainColor: #008349;
  --MainColor-rgb: 0,131,73;
  --ControlCaptionFontColorFocus: #008349;
  --ControlFontColorFocus: #008349;
  --ControlBorderColorFocus: #008349;
  --ControlBgColorSelected: #008349;
  --ButtonBorderColor: #008349;
  --ButtonBgColor: #008349;
  --ButtonDefaultColorHover: #006a3b;
  --ButtonDefaultColorActive: #005f35;
  --InputDateFontColorHover: #00371e;
  --InputDateBtnTodayColorHover: #6affbd;
  --programActionBtnShowHideBgColorHover: #008349;
  --programActionBtnBgColorHover: #008349;
  --searchCodehelpAreaBorderColor: #008349;
  --btnAsColorHover: #00502d;
  --btnRetryLoginColorHover: #008d4f;
  --ulToolbarColorHover: #00b665;
  --BtnFlyoutBgColor: #008349;
  --LeftModuleMenuAreaBgColor: #02693C;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #00A90E;
  --moduleIconBgColorHover: #008349;
  --moduleIconBgColorSelected: #008349;
  --moduleNameColorSelected: #fff;
  --btnASColor: #00A90E;
  --expandMdSelectBgColor: #008349;
  --tileMenuEditBtnSaveBgColor: #008349;
  --tileMenuEditBtnCancelBorderColor: #008349;
  --tileMenuEditBtnCancelFontColor: #008349;
  --favoriteAddBoxBtnNormalBgColor: #008349;
  --homeModeTopBarBgColor: #02693C;
  --homeModeLeftMenuBgColor: #02693C;
  --CenterAreaBgColor: #02693C;
  --CenterAreaBgColor-rgb: 2,105,60;
  --CenterHeaderAreaBgColor: #02693C;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #039153;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #00A90E;
  --btnBgDevMode: #008349;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #00A90E;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #00A90E;
  --inputLoginTextBtnSearchBgColorHover: #008349;
  --sheetMainColor: #008349;
  --gcfilterOKBgColor: #008349;
  --pgmLinkColorHover: #009252;
  --UserColor: #008349;
}
.theme_Kotra .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Kotra .btnMoreTabPrev > i,
.theme_Kotra .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Kotra .btnMoreTabNext > i, .theme_Kotra .icoTopBar24, .theme_Kotra .icoTopBar20, .theme_Kotra .icoTopBar16, .theme_Kotra .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}
.theme_Kotra article.wrap {
  display: flex;
  flex-direction: column;
}
.theme_Kotra article.wrap .KotraTopMenu {
  display: flex;
}

.theme_Metatime {
  --MainColor: #6859F8;
  --MainColor-rgb: 104,89,248;
  --ControlCaptionFontColorFocus: #6859F8;
  --ControlFontColorFocus: #6859F8;
  --ControlBorderColorFocus: #6859F8;
  --ControlBgColorSelected: #6859F8;
  --ButtonBorderColor: #6859F8;
  --ButtonBgColor: #6859F8;
  --ButtonDefaultColorHover: #5241f7;
  --ButtonDefaultColorActive: #4937f7;
  --InputDateFontColorHover: #2510f5;
  --InputDateBtnTodayColorHover: white;
  --programActionBtnShowHideBgColorHover: #6859F8;
  --programActionBtnBgColorHover: #6859F8;
  --searchCodehelpAreaBorderColor: #6859F8;
  --btnAsColorHover: #3b28f6;
  --btnRetryLoginColorHover: #7163f8;
  --ulToolbarColorHover: #958afa;
  --BtnFlyoutBgColor: #6859F8;
  --LeftModuleMenuAreaBgColor: #6859F8;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #7E73ED;
  --moduleIconBgColorHover: #6859F8;
  --moduleIconBgColorSelected: #6859F8;
  --moduleNameColorSelected: #fff;
  --btnASColor: #7E73ED;
  --expandMdSelectBgColor: #6859F8;
  --tileMenuEditBtnSaveBgColor: #6859F8;
  --tileMenuEditBtnCancelBorderColor: #6859F8;
  --tileMenuEditBtnCancelFontColor: #6859F8;
  --favoriteAddBoxBtnNormalBgColor: #6859F8;
  --homeModeTopBarBgColor: #6859F8;
  --homeModeLeftMenuBgColor: #6859F8;
  --CenterAreaBgColor: #6859F8;
  --CenterAreaBgColor-rgb: 104,89,248;
  --CenterHeaderAreaBgColor: #6859F8;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #8c80fa;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #7E73ED;
  --btnBgDevMode: #6859F8;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #7E73ED;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #7E73ED;
  --inputLoginTextBtnSearchBgColorHover: #6859F8;
  --sheetMainColor: #6859F8;
  --gcfilterOKBgColor: #6859F8;
  --pgmLinkColorHover: #7568f9;
  --UserColor: #6859F8;
}
.theme_Metatime .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Metatime .btnMoreTabPrev > i,
.theme_Metatime .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Metatime .btnMoreTabNext > i, .theme_Metatime .icoTopBar24, .theme_Metatime .icoTopBar20, .theme_Metatime .icoTopBar16, .theme_Metatime .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.theme_Pratama {
  --MainColor: #DC5001;
  --MainColor-rgb: 220,80,1;
  --ControlGroupboxBorder: #000;
  --ControlBorderColor: #000;
  --ControlCaptionFontColorFocus: #DC5001;
  --ControlFontColorFocus: #DC5001;
  --ControlBorderColorFocus: #DC5001;
  --ControlBgColorSelected: #DC5001;
  --ButtonBorderColor: #DC5001;
  --ButtonBgColor: #DC5001;
  --ButtonDefaultColorHover: #c34701;
  --ButtonDefaultColorActive: #b84301;
  --InputDateFontColorHover: #903401;
  --InputDateBtnTodayColorHover: #ffd9c4;
  --TreeBorderColor: #000;
  --programActionBtnShowHideBgColorHover: #DC5001;
  --programActionBtnBgColorHover: #DC5001;
  --searchCodehelpAreaBorderColor: #DC5001;
  --btnAsColorHover: #a93e01;
  --btnRetryLoginColorHover: #e65401;
  --ulToolbarColorHover: #fe6712;
  --BtnFlyoutBgColor: #DC5001;
  --LeftModuleMenuAreaBgColor: #DC5001;
  --moduleIconColor: rgba(255, 255, 255, 0.5);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #FB9671;
  --moduleIconBgColorHover: #DC5001;
  --moduleIconBgColorSelected: #DC5001;
  --moduleNameColorSelected: #fff;
  --btnASColor: #FB9671;
  --expandMdSelectBgColor: #DC5001;
  --tileMenuEditBtnSaveBgColor: #DC5001;
  --tileMenuEditBtnCancelBorderColor: #DC5001;
  --tileMenuEditBtnCancelFontColor: #DC5001;
  --favoriteAddBoxBtnNormalBgColor: #DC5001;
  --homeModeTopBarBgColor: #DC5001;
  --homeModeLeftMenuBgColor: #DC5001;
  --CenterAreaBgColor: #DC5001;
  --CenterAreaBgColor-rgb: 220,80,1;
  --CenterHeaderAreaBgColor: #DC5001;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #fe6108;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #FB9671;
  --btnBgDevMode: #DC5001;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #FB9671;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #FB9671;
  --inputLoginTextBtnSearchBgColorHover: #DC5001;
  --sheetMainColor: #DC5001;
  --colHeaderBgColor: #DC5001;
  --colHeaderFontColor: #fff;
  --btnSheetSettingBgColor: #DC5001;
  --gccolumnHeaderhoverBgColor: #FF9155;
  --gccolumnHeaderhighlightBgColor: #FF9155;
  --gcrowHeaderselectedBgColor: #FF9155;
  --gcrowHeaderhighlightBgColor: #FF9155;
  --gcfilterOKBgColor: #DC5001;
  --colHeaderBorderColor: #fff;
  --colHeaderBorderColorHover: #fff;
  --gcRowHeaderHoverBgColor: #FF9155;
  --btnSheetSettingBgColorHover: #FF9155;
  --pgmLinkColorHover: #eb5601;
  --UserColor: #DC5001;
}
.theme_Pratama .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Pratama .btnMoreTabPrev > i,
.theme_Pratama .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Pratama .btnMoreTabNext > i, .theme_Pratama .icoTopBar24, .theme_Pratama .icoTopBar20, .theme_Pratama .icoTopBar16, .theme_Pratama .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}
.theme_Pratama .controlTab .tabHeader ul > li.on a {
  border-width: 1px;
  border-color: #000;
  border-bottom-color: #7582BF;
  background-color: #7582BF;
  color: #fff;
}
.theme_Pratama .controlTab .tabHeader ul > li + li > a {
  margin-left: 0;
}

.theme_ProAS {
  --MainColor: #1EC8D1;
  --MainColor-rgb: 30,200,209;
  --ControlCaptionFontColorFocus: #1EC8D1;
  --ControlFontColorFocus: #1EC8D1;
  --ControlBorderColorFocus: #1EC8D1;
  --ControlBgColorSelected: #1EC8D1;
  --ButtonBorderColor: #1EC8D1;
  --ButtonBgColor: #1EC8D1;
  --ButtonDefaultColorHover: #1bb3bb;
  --ButtonDefaultColorActive: #1aaab2;
  --InputDateFontColorHover: #14888e;
  --InputDateBtnTodayColorHover: #dbf8fa;
  --programActionBtnShowHideBgColorHover: #1EC8D1;
  --programActionBtnBgColorHover: #1EC8D1;
  --searchCodehelpAreaBorderColor: #1EC8D1;
  --btnAsColorHover: #189da4;
  --btnRetryLoginColorHover: #1fd1da;
  --ulToolbarColorHover: #3fdbe3;
  --BtnFlyoutBgColor: #1EC8D1;
  --LeftModuleMenuAreaBgColor: #1EC8D1;
  --moduleIconColor: rgba(255, 255, 255, 0.7);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #1EC8D1;
  --moduleIconBgColorHover: #1EC8D1;
  --moduleIconBgColorSelected: #1EC8D1;
  --moduleNameColorSelected: #fff;
  --btnASColor: #4e9ea2;
  --expandMdSelectBgColor: #1EC8D1;
  --tileMenuEditBtnSaveBgColor: #1EC8D1;
  --tileMenuEditBtnCancelBorderColor: #1EC8D1;
  --tileMenuEditBtnCancelFontColor: #1EC8D1;
  --favoriteAddBoxBtnNormalBgColor: #1EC8D1;
  --homeModeTopBarBgColor: #1EC8D1;
  --homeModeLeftMenuBgColor: #1EC8D1;
  --CenterAreaBgColor: #1EC8D1;
  --CenterAreaBgColor-rgb: 30,200,209;
  --CenterHeaderAreaBgColor: #1EC8D1;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #36d9e2;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #4e9ea2;
  --btnBgDevMode: #1EC8D1;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #4e9ea2;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #4e9ea2;
  --inputLoginTextBtnSearchBgColorHover: #1EC8D1;
  --sheetMainColor: #1EC8D1;
  --gcfilterOKBgColor: #1EC8D1;
  --pgmLinkColorHover: #20d5de;
  --UserColor: #1EC8D1;
}
.theme_ProAS .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeDate .controlContent, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeDate .theme_ProAS .controlContent, .theme_ProAS .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeDate .controlContent, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeDate .theme_ProAS .controlContent, .theme_ProAS .layoutControl.DateBox > input {
  background-image: url("../../Images/ThemeProAS/ThemeProAS_iconInputDate.svg?var(--imageVersion)");
  background-repeat: no-repeat;
  background-position: right center;
}
.theme_ProAS .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_ProAS .btnMoreTabPrev > i,
.theme_ProAS .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_ProAS .btnMoreTabNext > i, .theme_ProAS .icoTopBar24, .theme_ProAS .icoTopBar20, .theme_ProAS .icoTopBar16, .theme_ProAS .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}
.theme_ProAS .layoutControl.CodeHelp > .btnCodeHelp > i {
  background-color: var(--MainColor);
}

.theme_Samil {
  --MainColor: #9b1e1a;
  --MainColor-rgb: 155,30,26;
  --ControlCaptionFontColorFocus: #9b1e1a;
  --ControlFontColorFocus: #9b1e1a;
  --ControlBorderColorFocus: #9b1e1a;
  --ControlBgColorSelected: #9b1e1a;
  --ButtonBorderColor: #9b1e1a;
  --ButtonBgColor: #9b1e1a;
  --ButtonDefaultColorHover: #851a16;
  --ButtonDefaultColorActive: #7c1815;
  --InputDateFontColorHover: #59110f;
  --InputDateBtnTodayColorHover: #f1acaa;
  --programActionBtnShowHideBgColorHover: #9b1e1a;
  --programActionBtnBgColorHover: #9b1e1a;
  --searchCodehelpAreaBorderColor: #9b1e1a;
  --btnAsColorHover: #6f1613;
  --btnRetryLoginColorHover: #a4201b;
  --ulToolbarColorHover: #c72621;
  --BtnFlyoutBgColor: #9b1e1a;
  --LeftModuleMenuAreaBgColor: #9b1e1a;
  --moduleIconColor: rgba(255, 255, 255, 0.7);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #e58b01;
  --moduleIconBgColorHover: #9b1e1a;
  --moduleIconBgColorSelected: #9b1e1a;
  --moduleNameColorSelected: #fff;
  --btnASColor: #e58b01;
  --expandMdSelectBgColor: #9b1e1a;
  --tileMenuEditBtnSaveBgColor: #9b1e1a;
  --tileMenuEditBtnCancelBorderColor: #9b1e1a;
  --tileMenuEditBtnCancelFontColor: #9b1e1a;
  --favoriteAddBoxBtnNormalBgColor: #9b1e1a;
  --homeModeTopBarBgColor: #9b1e1a;
  --homeModeLeftMenuBgColor: #9b1e1a;
  --CenterAreaBgColor: #9b1e1a;
  --CenterAreaBgColor-rgb: 155,30,26;
  --CenterHeaderAreaBgColor: #9b1e1a;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #be2520;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #e58b01;
  --btnBgDevMode: #9b1e1a;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #e58b01;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #e58b01;
  --inputLoginTextBtnSearchBgColorHover: #9b1e1a;
  --sheetMainColor: #9b1e1a;
  --gcfilterOKBgColor: #9b1e1a;
  --pgmLinkColorHover: #a8211c;
  --UserColor: #9b1e1a;
}
.theme_Samil .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Samil .btnMoreTabPrev > i,
.theme_Samil .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_Samil .btnMoreTabNext > i, .theme_Samil .icoTopBar24, .theme_Samil .icoTopBar20, .theme_Samil .icoTopBar16, .theme_Samil .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.theme_SCF {
  --MainColor: #288BAE;
  --MainColor-rgb: 40,139,174;
  --ControlCaptionFontColorFocus: #288BAE;
  --ControlFontColorFocus: #288BAE;
  --ControlBorderColorFocus: #288BAE;
  --ControlBgColorSelected: #288BAE;
  --ButtonBorderColor: #19647E;
  --ButtonBgColor: #19647E;
  --ButtonDefaultColorHover: #237a99;
  --ButtonDefaultColorActive: #217491;
  --InputDateFontColorHover: #1a5970;
  --InputDateBtnTodayColorHover: #c9e8f3;
  --programActionBtnShowHideBgColorHover: #288BAE;
  --programActionBtnBgColorHover: #288BAE;
  --searchCodehelpAreaBorderColor: #288BAE;
  --btnAsColorHover: #1e6a85;
  --btnRetryLoginColorHover: #2a92b6;
  --ulToolbarColorHover: #38a9d1;
  --BtnFlyoutBgColor: #288BAE;
  --LeftModuleMenuAreaBgColor: #288BAE;
  --moduleIconColor: rgba(255, 255, 255, 0.7);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #36BAE3;
  --moduleIconBgColorHover: #288BAE;
  --moduleIconBgColorSelected: #288BAE;
  --moduleNameColorSelected: #fff;
  --btnASColor: #36BAE3;
  --expandMdSelectBgColor: #288BAE;
  --tileMenuEditBtnSaveBgColor: #288BAE;
  --tileMenuEditBtnCancelBorderColor: #288BAE;
  --tileMenuEditBtnCancelFontColor: #288BAE;
  --favoriteAddBoxBtnNormalBgColor: #288BAE;
  --homeModeTopBarBgColor: #288BAE;
  --homeModeLeftMenuBgColor: #288BAE;
  --CenterAreaBgColor: #288BAE;
  --CenterAreaBgColor-rgb: 40,139,174;
  --CenterHeaderAreaBgColor: #288BAE;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #30a6cf;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #36BAE3;
  --btnBgDevMode: #288BAE;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #36BAE3;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #36BAE3;
  --inputLoginTextBtnSearchBgColorHover: #288BAE;
  --sheetMainColor: #288BAE;
  --gcfilterOKBgColor: #288BAE;
  --pgmLinkColorHover: #2b95ba;
  --btnAddAddressColorHover: #1d7593;
  --UserColor: #288BAE;
}
.theme_SCF .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_SCF .btnMoreTabPrev > i,
.theme_SCF .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_SCF .btnMoreTabNext > i, .theme_SCF .icoTopBar24, .theme_SCF .icoTopBar20, .theme_SCF .icoTopBar16, .theme_SCF .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

.theme_SystemEver {
  --MainColor: #3F51B5;
  --MainColor-rgb: 63,81,181;
  --ControlCaptionFontColorFocus: #3F51B5;
  --ControlFontColorFocus: #3F51B5;
  --ControlBorderColorFocus: #3F51B5;
  --ControlBgColorSelected: #3F51B5;
  --ButtonBorderColor: #3C4A97;
  --ButtonBgColor: #3C4A97;
  --ButtonDefaultColorHover: #3849a2;
  --ButtonDefaultColorActive: #36459b;
  --InputDateFontColorHover: #2b387c;
  --InputDateBtnTodayColorHover: #e4e7f6;
  --programActionBtnShowHideBgColorHover: #3F51B5;
  --programActionBtnBgColorHover: #3F51B5;
  --searchCodehelpAreaBorderColor: #3F51B5;
  --btnAsColorHover: #32408f;
  --btnRetryLoginColorHover: #4254bd;
  --ulToolbarColorHover: #606fc7;
  --BtnFlyoutBgColor: #3F51B5;
  --LeftModuleMenuAreaBgColor: #3F51B5;
  --moduleIconColor: rgba(255, 255, 255, 0.7);
  --moduleIconColorSelected: #fff;
  --moduleIconColorSelectedSub: #6692F1;
  --moduleIconBgColorHover: #3F51B5;
  --moduleIconBgColorSelected: #3F51B5;
  --moduleNameColorSelected: #fff;
  --btnASColor: #6692F1;
  --expandMdSelectBgColor: #3F51B5;
  --tileMenuEditBtnSaveBgColor: #3F51B5;
  --tileMenuEditBtnCancelBorderColor: #3F51B5;
  --tileMenuEditBtnCancelFontColor: #3F51B5;
  --favoriteAddBoxBtnNormalBgColor: #3F51B5;
  --homeModeTopBarBgColor: #3F51B5;
  --homeModeLeftMenuBgColor: #3F51B5;
  --CenterAreaBgColor: #3F51B5;
  --CenterAreaBgColor-rgb: 63,81,181;
  --CenterHeaderAreaBgColor: #3F51B5;
  --CenterHeaderAreaBtnOn: rgba(0, 0, 0, 0.15);
  --quickListBorderColor: #5869c5;
  --quickListBgColor: rgba(0, 0, 0, 0.2);
  --quickListTxtcolor: #6692F1;
  --btnBgDevMode: #3F51B5;
  --leftMenuBtnArrowBorderColor: rgba(255, 255, 255, 0.25);
  --icolbMoveArrowColor: rgba(255, 255, 255, 0.6);
  --modeTopOpenListTabPgmTitleColor: rgba(255, 255, 255, 0.7);
  --modeTopOpenListTabPgmTitleColorHover: #fff;
  --modeTopOpenListBtnCloseColor: rgba(255, 255, 255, 0.5);
  --modeTopOpenListBtnCloseColorHover: #fff;
  --btnKbotOnBorderColor: rgba(216, 137, 253, 0.5);
  --btnKbotOnBgColor: linear-gradient(45deg, #D5DBE7, #C5BBFF);
  --leftMenuPrcsToggleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleCircleBgColor: rgba(0, 0, 0, 0.2);
  --leftMenuPrcsToggleIconColor: rgba(255, 255, 255, 0.3);
  --leftMenuPrcsToggleOnBgColor: #6692F1;
  --leftMenuPrcsToggleOnCircleBgColor: #fff;
  --leftMenuPrcsToggleOnIconColor: #6692F1;
  --inputLoginTextBtnSearchBgColorHover: #3F51B5;
  --sheetMainColor: #3F51B5;
  --gcfilterOKBgColor: #3F51B5;
  --pgmLinkColorHover: #4558be;
  --btnAddAddressColorHover: #4353a9;
  --UserColor: #3F51B5;
}
.theme_SystemEver .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_SystemEver .btnMoreTabPrev > i,
.theme_SystemEver .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .theme_SystemEver .btnMoreTabNext > i, .theme_SystemEver .icoTopBar24, .theme_SystemEver .icoTopBar20, .theme_SystemEver .icoTopBar16, .theme_SystemEver .icoTopBar12 {
  background-image: url("../../Images/icoTopBarWhite.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}

html.userFontPretendard, html.userFontPretendard *, body.userFontPretendard, body.userFontPretendard * {
  --fontSize: 16px;
  letter-spacing: 0;
}
html.userFontSystem, html.userFontSystem *, body.userFontSystem, body.userFontSystem * {
  --fontSize: 15px;
  font-family: "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
  letter-spacing: -0.5px;
}

html.userFontWeightBold, html.userFontWeightBold *, body.userFontWeightBold, body.userFontWeightBold * {
  font-weight: 600;
}
html.userFontWeightBold2, html.userFontWeightBold2 *, body.userFontWeightBold2, body.userFontWeightBold2 * {
  font-weight: 700;
}

@font-face {
  font-family: "Pretendard GOV";
  font-weight: 700;
  font-display: swap;
  src: url(fonts/PretendardGOV/PretendardGOV-Bold.subset.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard GOV";
  font-weight: 600;
  font-display: swap;
  src: url(fonts/PretendardGOV/PretendardGOV-SemiBold.subset.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard GOV";
  font-weight: 500;
  font-display: swap;
  src: url(fonts/PretendardGOV/PretendardGOV-Medium.subset.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard GOV";
  font-weight: 400;
  font-display: swap;
  src: url(fonts/PretendardGOV/PretendardGOV-Regular.subset.woff2) format("woff2");
}
.iconWidget {
  display: block;
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  background-position-y: -133px;
}
.iconWidget.banner {
  background-position-x: 0px;
}
.iconWidget.weather {
  background-position-x: -50px;
}
.iconWidget.currency {
  background-position-x: -100px;
}
.iconWidget.link {
  background-position-x: -150px;
}
.iconWidget.approval {
  background-position-x: -200px;
}
.iconWidget.screen {
  background-position-x: -250px;
}
.iconWidget.calendar {
  background-position-x: -300px;
}
.iconWidget.alarm {
  background-position-x: -350px;
}
.iconWidget.clock {
  background-position-x: -400px;
}
.iconWidget.notice {
  background-position-x: -450px;
}
.iconWidget.process {
  background-position-x: -500px;
}

.iconWidgetSmall {
  display: block;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  background-position-y: -83px;
}
.iconWidgetSmall.banner {
  background-position-x: 0px;
}
.iconWidgetSmall.weather {
  background-position-x: -30px;
}
.iconWidgetSmall.currency {
  background-position-x: -60px;
}
.iconWidgetSmall.link {
  background-position-x: -90px;
}
.iconWidgetSmall.approval {
  background-position-x: -120px;
}
.iconWidgetSmall.screen {
  background-position-x: -150px;
}
.iconWidgetSmall.calendar {
  background-position-x: -180px;
}
.iconWidgetSmall.alarm {
  background-position-x: -210px;
}
.iconWidgetSmall.clock {
  background-position-x: -240px;
}
.iconWidgetSmall.notice {
  background-position-x: -270px;
}
.iconWidgetSmall.process {
  background-position-x: -300px;
}

.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i, .icoTopBar24, .icoTopBar20, .icoTopBar16, .icoTopBar12.mask, .icoTopBar12 {
  background-image: url("../../Images/icoTopBar.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoLeftBarMask24, .icoLeftBarMask20, .icoLeftBarMask16, .icoLeftBarMask12 {
  mask-image: url("../../Images/icoLeftBarMask.svg?var(--ImageVersion)");
  mask-repeat: no-repeat;
  -webkit-mask-image: url("../../Images/icoLeftBarMask.svg?var(--ImageVersion)");
  -webkit-mask-repeat: no-repeat;
}

.icoLeftBar16 {
  background-image: url("../../Images/icoLeftBar.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoHome44, .icoHome36, .icoHome32, .icoHome24, .icoHome20, .icoHome16, .icoHome12 {
  background-image: url("../../Images/icoHome.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoPgmHome44, .icoPgmHome28, .icoPgmHome24, .icoPgmHome16 {
  background-image: url("../../Images/icoPgmHome.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoModule {
  mask-image: url("../../Images/icoModule.svg?var(--ImageVersion)");
  mask-repeat: no-repeat;
  -webkit-mask-image: url("../../Images/icoModule.svg?var(--ImageVersion)");
  -webkit-mask-repeat: no-repeat;
}

.icoSearch44, .icoSearch20, .icoSearch16, .icoSearch12.mask {
  background-image: url("../../Images/icoSearch.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoPgmTop24, .icoPgmTop20, .icoPgmTop16, .icoPgmTop12 {
  background-image: url("../../Images/icoPgmTop.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoMsg80, .icoMsg24, .icoMsg16, .icoMsg12 {
  background-image: url("../../Images/icoMsg.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoMsgMask12 {
  mask-image: url("../../Images/icoMsgMask.svg?var(--ImageVersion)");
  mask-repeat: no-repeat;
  -webkit-mask-image: url("../../Images/icoMsgMask.svg?var(--ImageVersion)");
  -webkit-mask-repeat: no-repeat;
}

.icoFavorite36, .icoFavorite16 {
  background-image: url("../../Images/icoFavorite.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.imgWorkingWithAI {
  background-image: url("../../Images/imgWorkingWithAI.png?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoNice124 {
  background-image: url("../../Images/icoNice.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.layoutControl[kui-button].AI > button::before, .icoKbotControl {
  background-image: url("../../Images/icoKbotControl.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoGroupbox12 {
  background-image: url("../../Images/icoGroupbox.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoToolbar24, .icoToolbar16, .icoToolbar12 {
  background-image: url("../../Images/icoToolbar.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeCodehelp .controlContent::before, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeCodehelp .controlContent::before, .icoCodehelp16 {
  background-image: url("../../Images/icoCodehelp.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoLogin16 {
  background-image: url("../../Images/icoLogin.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoDataScrap20, .icoDataScrap16, .icoDataScrap12 {
  background-image: url("../../Images/icoDataScrap.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoMyDefaultValue159, .icoMyDefaultValue20, .icoMyDefaultValue16 {
  background-image: url("../../Images/icoMyDefaultValue.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoEverDesign86, .icoEverDesign20, .icoEverDesign16, .icoEverDesign12 {
  background-image: url("../../Images/icoEverDesign.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoPE, .icoPE20, .icoPE16, .icoPE12 {
  background-image: url("../../Images/icoPE.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoAR {
  background-image: url("../../Images/icoAR.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoProcessMenu74, .icoProcessMenu44, .icoProcessMenu40, .icoProcessMenu36, .icoProcessMenu24, .icoProcessMenu20, .icoProcessMenu16, .icoProcessMenu12 {
  background-image: url("../../Images/icoProcessMenu.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoSetting52, .icoSetting24, .icoSetting20, .icoSetting16 {
  background-image: url("../../Images/icoSetting.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoSheet16 {
  background-image: url("../../Images/icoSheet.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoSheetMultiSort20, .icoSheetMultiSort16, .icoSheetMultiSort12, .icoSheetMultiSort8 {
  background-image: url("../../Images/icoSheetMultiSort.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoSheetSearch24, .icoSheetSearch16, .icoSheetSearch8 {
  background-image: url("../../Images/icoSheetSearch.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoSheetFeature16, .icoSheetFeature12, .icoSheetFeature8 {
  background-image: url("../../Images/icoSheetFeature.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoSheetColumnCondition40, .icoSheetColumnCondition24, .icoSheetColumnCondition20, .icoSheetColumnCondition16 {
  background-image: url("../../Images/icoSheetColumnCondition.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.btnSheetSetting > i, .icoSheetSetting {
  background-image: url("../../Images/icoSheetSetting.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.pageProgramQueryArea .resultListArea .ulResultList li > a .txtModule > i, .pageProgramQueryArea .resultListArea .inputQeuryArea .btnQuery, .CenterArea .CenterHeaderArea .openMenuMoreList .ulOpenMenuMore li.Fixed > a:after, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .newTab, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab .addFavorite, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab .tabPin, .CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .userLicense:before, .CenterArea .CenterHeaderArea .btnR.ProgramQuery .programQueryArea .btnProgramQuery, .CenterArea .CenterHeaderArea .btnR.TopSetting.UserLicenseAlert > .txtInfo:before, .ico_main, .RightArea .codehelpArea .titleArea .btnBack, .RightArea11 .codehelpArea .titleArea .btnBack, .BarIndicator .btnClose, .msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new .btnDelete > i, .Modaless .btnBackTab > i, .Modaless .btnHelp > i {
  background-image: url("../../Images/iconMain.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.passwordWrap .wrapper .passwordArea .iconPw {
  background-image: url("../../Images/iconPwdSet.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.sendCodeStepFrameWrap .msgBgArea .msgArea > .titleArea > .img {
  background-image: url("../../Images/iconSendCode.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon > input[type=radio] + label > .txtValue:before {
  background-image: url("../../Images/icon2stepSendCode.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.popupInspectionPage .inspectionHomeWrap .inspectionBox > .inspectionTitle > .inspectionTitleImg, .errorHomeWrap .errorBox .errorTitle .errorTitleImg, .error404Wrap .errorBox .errorTitle .errorTitleImg {
  background-image: url("../../Images/iconErrorAll.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoError200, .icoError124, .icoError20 {
  background-image: url("../../Images/icoError.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.msgWrap.sessionTimeOut .msgBox .msgContent .msgImg {
  background-image: url("../../Images/iconSessionTimeout.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.errorHomeWrap .errorBox .errorTitle .browserTitleImg, .error404Wrap .errorBox .errorTitle .browserTitleImg {
  background-image: url("../../Images/iconBrowser.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.errorHomeWrap.expired .errorBox .errorTitle .errorTitleImg, .error404Wrap.expired .errorBox .errorTitle .errorTitleImg {
  background-image: url("../../Images/iconExpired.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.errorHomeWrap .errorBox .errorTitle .error404Img, .error404Wrap .errorBox .errorTitle .error404Img {
  background-image: url("../../Images/error404.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li .icon > i, .programActionArea .actionBtnArea > .ulActionBtn > li .icon > i, .programActionArea .btnShowHide > i {
  background-image: url("../../Images/iconProgramLinkAction.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.modalReportDlg.onlineViewer button > .iconCheck, .modalReportDlg.onlineViewer .titleInfo > i, .modalReportDlg > .divTitleArea .txtInstall > i, .modalReportDlg > .divTitleArea .titleInfo .btnMoreReport > i, .modalReportDlg > .divTitleArea .titleInfo .btnReportID {
  background-image: url("../../Images/iconReport.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.newTabWrap .newTabHeader .btnWrap > button > i, .modalCommonDlg .modalDlgArea > .divTitleArea .btnMore > i, .modalCommonDlg .modalDlgArea > .divTitleArea .btn > i, .msgWrap .msgBox.fromtoCalendar .msgTitle .btnClose > i {
  background-image: url("../../Images/iconDlgToolbar.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.sendMessageArea.Multi.AllEditMode .divInformation .msgArea.icon_info_alt {
  background-image: url("../../Images/iconMsg.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBtnWrap .btn > i, .CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent > i, .CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn > i, .CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a > i, .editFavCode .msgBox .msgContent .editInput > i, .RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a > i, .RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .icon, .RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData .favName > i, .RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li > a.btnToolbar > i, .RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn > i, .RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox > .tbtnPercent > i, .RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a > i, .RightArea .codehelpAreaTest .titleArea .topBtnBox .btn > i, .RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li.toolbarClose > a > i, .RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li a.btnAction .icon, .RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li .btnToolbar > i, .RightArea .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li > a:first-child::before, .RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a > i, .RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .icon, .RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar > i, .RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn > i, .RightArea .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent > i, .CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn > i, .CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent > i, .CodeHelpSheet .popupCodehelp .topArea .btn > i, .RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li > a:first-child::before, .RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a > i, .RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .icon, .RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar > i, .RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn > i, .RightArea11 .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent > i, .modalCommonDlg .modalDlgArea > .divTitleArea .btnHelp > i, .codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordTitle > .btnCodeHelpSetting > i {
  background-image: url("../../Images/iconCodehelp.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a i, .RightArea .codehelpAreaTest .actionBtn ul li a i, .RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .iconFavCode > i, .RightArea .codehelpArea .titleArea .btnCustomCodehelp, .CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn li a span, .RightArea11 .codehelpArea .titleArea .btnCustomCodehelp {
  background-image: url("../../Images/iconCodeSheetBtn.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow span, .CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a.arrow span {
  background-image: url("../../Images/iconPaging.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 .btn-preview > i, .popupCalendarWrap .popupCalendar .txtTitleArea > .btnNext, .popupCalendarWrap .popupCalendar .txtTitleArea > .btnPrev, .divImg > .imgHover > span, .upload.notiFileUpload .notiFileInfo .iconLink, .upload .fileBtnWrap .fileBtnArea a::before, .upload > .scrollArea .uploadFileList > li .fileUploadToolbar .btn > i, .upload > .scrollArea .uploadFileList > li .btnPreview > i, .upload > .scrollArea .uploadFileList > li .icon, .layoutControl[kui-pmonth] .monthSelect .btnMonthQuery, .layoutControl[kui-pday] .monthSelect .btnMonthQuery, .layoutControl[kui-piday] .monthSelect .btnMonthQuery, .layoutControl.DateBox .btnDateControl .iconDateControl, .layoutControl .iconEncode, .controlTab .tabHeader .btnMoreTabLeft > i, .controlTab .tabHeader .btnMoreTabRight > i, .expander .btnPin > i, .expander > .title::before {
  background-image: url("../../Images/iconControl.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.splitter.Horizontal {
  background-image: url("../../Images/iconSplitterH.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: center;
}

.splitter.Vertical {
  background-image: url("../../Images/iconSplitterV.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: center;
}

.layoutControl > .comboBox .btnComboBox {
  background-image: url("../../Images/iconInputCombo.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: right center;
}

.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeDate .controlContent, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeDate .controlContent, .layoutControl.DateBox > input {
  background-image: url("../../Images/iconInputDate.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: right center;
}

.upload .uploadNoFile::before {
  background-image: url("../../Images/bgImgUpload.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: center;
}

.upload.Dis .uploadNoFile::before {
  background-image: url("../../Images/bgImgUploadDis.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: center;
}

.divImg.NoImg {
  background-image: url("../../Images/defaultImg.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: center;
}

.divTree .tree .ulTreeDepth li > .collapseIcon, .divTree .tree .ulTreeBtn li.treeBtn .treeCloseBtn, .divTree .tree .ulTreeBtn li.treeBtn .treeOpenBtn {
  background-image: url("../../Images/iconTreeAll.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li > a > i, .shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li.selected > a > i, .shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li > a i, .shee1tSortArea > .sheetSortListArea.sheetSearch .btnNextSearch > i, .shee1tSortArea > .sheetSortListArea.sheetSearch .inputSearch > .btnClear > i, .shee1tSortArea > .sheetSortListArea .btnArea > button > i, .shee1tSortArea > .sheetSortListArea > .ulSortList li > a .btnSortDel, .shee1tSortArea > .sheetSortListArea > .ulSortList li > a .icon, .btnSheetSettingClose, .sheetColumnMove .sheetDropPosition > .sheetDropArea, .autoSumLayerWrap .autoSumLayer .titleWrap .btnClose > i, .autoSumLayerWrap .autoSumLayer .titleWrap > i, .sheetContext .dlgContextUI .contextMenu > li.Checked {
  background-image: url("../../Images/iconSheetSetting.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.popupScheduleListWrap .popupScheduleList .topArea .btnClose > i {
  background-image: url("../../Images/iconScheduler.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.tooltipWrap .tooltipContent .btnClose {
  background-image: url("../../Images/Experience/iconCommon.png");
  background-repeat: no-repeat;
}

.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox a::before, .icoNoti44, .icoNoti24, .icoNoti20, .icoNoti16, .icoNoti12 {
  background-image: url("../../Images/icoNoti.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.controlShareMessge > .ulMedia > li > i, .controlShareMessge > .btnMessageShare, .bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Edit > a > i, .bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Del > a > i, .bgAddressArea .AddressArea > .addressListArea table td > a > i, .bgAddressArea .AddressArea > .btnClose, .sendMessageArea.Multi .divInformation .msgArea > i, .sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea .alarmTalkArea .logoKaKao, .sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea .alarmTalkArea > .txtTitle > i, .sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .btnWrap .btnRecentRecvList.Del > i, .sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .btnWrap .btnRecentRecvList > i, .sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .title::before, .sendMessageArea > .popupArea > .bodyArea > .leftArea .addrBottom .btnAddressEdit > i, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .noData .iconNoEmpData, .sendMessageArea > .popupArea > .bodyArea .searchArea > .btnQuery > i {
  background-image: url("../../Images/iconSendMsg.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.templateListWrap > .btnTemplate > i, .toolbarWrap .processToolbarArea > .btn, .processMenuArea .processMenuContentsArea .prcsContent > .btnEdit, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap > .noProcessMessage > .img, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .icon, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap > .btnEdit {
  background-image: url("../../Images/iconProcessMenu.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type12 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type11 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type10 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type09 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type08 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type07 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type06 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type05 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type04 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type03 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type02 > i, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type01 > i {
  flex-shrink: 0;
  background-image: url("../../Images/iconProcessMenuItem.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.zipcodeArea > .btnClose {
  background-image: url("../../Images/iconDialogPop.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.pgmGuideBottom .pgmGuideContent .btnClose .iconPgmGuideClose, .pgmGuideBottom .pgmGuideContent .guideTitle .iconPgmGuide {
  background-image: url("../../Images/iconPgmGuide.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .icon > i, .msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type .info .iconMultiArrow2, .msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type .info .iconMultiArrow, .msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type > .icon > i, .msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected > span, .msgWrap.EverView .msgBox .btnClose, .easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .helpIcon > i, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDelete > i, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal .btnDelete > i, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemToolbar .btnDelete > i, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnResize, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDuplicate > i, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Sheet .btnExpandArea > i, .easyFlowWrap .toolBarArea .btn > span, .easyFlowWrap header .titleArea > .logo > span {
  background-image: url("../../Images/iconEverView.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContentBg, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent {
  background-image: url("../../Images/bgEverView.svg?var(--ImageVersion)");
  background-repeat: repeat;
}

.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType01 .Master, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Master.Master01 {
  background-image: url("../../Images/bgEverViewControl.svg?var(--ImageVersion)");
  background-repeat: repeat;
}

.apprLineDragitem .deleteItem .iconDelete, .apprLineDragitem .iconFixed, .apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .btnDelete > i, .apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .preview > i, .apprWriteContents .approvalInfoArea .fileUpload .title .btn-preview > i, .apprWriteContents .approvalInfoArea .linkedDocs .titleWrap .btnAddFile > i, .apprWriteContents .approvalInfoArea .title .iconUnfold > i, .apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .typeTitle > .iconLock, .apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineList > li > .btnDeleteItem > i, .apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .noData .iconNoEmpData, .apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch .btnSearch .iconSearch, .apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch .btnBackTree > i, .apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap .btn .iconReset, .apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap .btn .iconAddLine, .apprWriteContents .approvalInfoArea .docTitle .tempTitleWrap > i, .apprWriteContents .docViewerArea .noData .iconNoApprData, .docShareListWrap .docShareList > li > button > i, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .title > .btnDelAll:before, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .noData > .iconNoData, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea > button.btnFilterReset > .iconReset, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .filterTitle.main > .btnReset > i, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .btnFilter .iconArrow, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .btnFilter .iconFilter, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .btnDelSearch, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .btnBack:before, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .iconSearch:before, .msgWrap.popupAppr.appDocShare .shareListWrap > section > .noData > .iconNoData, .msgWrap.popupAppr.appDocShare .msgBox > .contentArea .noData > i, .msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .title > .btnDelAll:before, .msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupTitle > p > .iconArrow, .msgWrap.popupAppr.appDocShare .msgBox > header > .btnShareList:before, .msgWrap.popupAppr.appDocShare .msgBox > header > .btnDelShareSearch, .msgWrap.popupAppr.appDocShare .msgBox > header > i, .msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea > .noData > .iconNoData, .msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo > i, .msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .infoWrap .adminInfo .iconAdmin, .msgWrap.popupAppr .msgBox > header .apprSearch .btnApprSearch > i, .msgWrap.popupAppr .msgBox > header .apprSearch .btnBackTree > i, .msgWrap.popupAppr .msgBox > header .btnClose > i, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .name .adminInfo .iconAdmin, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs header h4 .btnAddFile > i, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .btnDelete > i, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .preview > i, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 .btnAddFile > i, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .docViewerArea .docViewer .btnDocFull > i, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem::after, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo .adminInfo .iconAdmin, .iconCoop > i, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .apprStatus .iconApprStatusCurrent, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.groupCoo.lastCoo .apprLineItem::after, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.powerCoo.lastCoo .apprLineItem::after, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.groupCoo .apprLineItem::after, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.powerCoo .apprLineItem::after, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader > .btnShareArea > .btnShare > i, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .noData .iconNoApprData, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .noData .iconErrorData, .apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .apprStatus > i, .apprContents .noData .iconNoApprData, .apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword .btnDelete > i, .apprContents .apprListView.searchResult .listWrap .advancedSearch .btnSearchAdvanced > i, .apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .btnResetCondition .iconReset, .apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelect .iconArrow, .apprContents .apprListView.searchResult .listWrap .apprSearchHeader .btnAdvanced .iconArrow, .apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn > i, .apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea > button.btnFilterReset > .iconReset, .apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .periodSelect .iconArrow, .apprContents .apprListView .listWrap .apprListFilter .btnFilter .iconArrow, .apprContents .apprListView .listWrap .apprListFilter .btnFilter .iconFilterAlign, .apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelect .iconArrow, .apprContents .apprListView .listWrap .apprSearchHeader .apprSearch .btnApprSearch > i, .apprContents .apprListView .listWrap header .btnRefresh > i, .btnMenuCollapse > i, .apprHomeWrap.collapseSidebar .apprContents .apprListView .listWrap > header .btnShowSidebar:hover > i, .apprHomeWrap.collapseSidebar .apprContents .apprListView .listWrap > header .btnShowSidebar > i, .apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.setting .apprMenuList li > a .iconApprSetting, .apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuCtgr .iconWrap > i, .apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .iconArrow, .apprHomeWrap .apprSidebar > header .apprBriefing li > a .count .iconApprovedList, .apprHomeWrap .iconApprBtnReject,
.apprHomeWrap .iconApprBtnHold,
.apprHomeWrap .iconApprBtnApproval,
.apprHomeWrap .iconApprBtnDelete, .apprDocView .iconApprBtnReject,
.apprDocView .iconApprBtnHold,
.apprDocView .iconApprBtnApproval,
.apprDocView .iconApprBtnDelete, .apprWriteContents .iconApprBtnReject,
.apprWriteContents .iconApprBtnHold,
.apprWriteContents .iconApprBtnApproval,
.apprWriteContents .iconApprBtnDelete, .apprDocRef .iconApprBtnReject,
.apprDocRef .iconApprBtnHold,
.apprDocRef .iconApprBtnApproval,
.apprDocRef .iconApprBtnDelete {
  background-image: url("../../Images/iconApproval.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.msgWrap.popupInSettingWrap .msgBox .msgContent .infoWrap > i, .msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .showPw input[type=checkbox] + label > i, .msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .btnDelTxt > i, .settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .txtWrap .iconNewPage, .settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription .iconInfo, .settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople .topArea .mainAlarmTalkArea > a.iconFax:before {
  background-image: url("../../Images/iconSetting.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.programArea.selectMode .layoutControl.DateBox > input, .programArea.selectModeSubForm .layoutControl.DateBox > input {
  background-image: url("../../Images/iconInputDateSetting.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: right center;
}

.iconModule {
  display: block;
  width: 24px;
  height: 25px;
  background-image: url("../../Images/Module/icon_write.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
  background-position: center;
}
.iconModule.management {
  width: 26px;
  height: 26px;
  background-image: url("../../Images/Module/icon_management.svg?var(--ImageVersion)");
}
.iconModule.hr {
  width: 25px;
  height: 25px;
  background-image: url("../../Images/Module/icon_hr.svg?var(--ImageVersion)");
}
.iconModule.payment {
  width: 28px;
  height: 18px;
  background-image: url("../../Images/Module/icon_payment.svg?var(--ImageVersion)");
}
.iconModule.account {
  width: 26px;
  height: 26px;
  background-image: url("../../Images/Module/icon_account.svg?var(--ImageVersion)");
}
.iconModule.project {
  width: 23px;
  height: 24px;
  background-image: url("../../Images/Module/icon_project.svg?var(--ImageVersion)");
}
.iconModule.sales {
  width: 24px;
  height: 21px;
  background-image: url("../../Images/Module/icon_sales.svg?var(--ImageVersion)");
}
.iconModule.income {
  width: 27px;
  height: 27px;
  background-image: url("../../Images/Module/icon_income.svg?var(--ImageVersion)");
}
.iconModule.product {
  width: 21px;
  height: 23px;
  background-image: url("../../Images/Module/icon_product.svg?var(--ImageVersion)");
}
.iconModule.quality {
  width: 20px;
  height: 22px;
  background-image: url("../../Images/Module/icon_quality.svg?var(--ImageVersion)");
}
.iconModule.logistics {
  width: 25px;
  height: 23px;
  background-image: url("../../Images/Module/icon_logistics.svg?var(--ImageVersion)");
}
.iconModule.cost {
  width: 19px;
  height: 25px;
  background-image: url("../../Images/Module/icon_cost.svg?var(--ImageVersion)");
}
.iconModule.statistics {
  width: 23px;
  height: 23px;
  background-image: url("../../Images/Module/icon_statistics.svg?var(--ImageVersion)");
}
.iconModule.bizplan {
  width: 27px;
  height: 23px;
  background-image: url("../../Images/Module/icon_bizplan.svg?var(--ImageVersion)");
}
.iconModule.consolidation {
  width: 29px;
  height: 27px;
  background-image: url("../../Images/Module/icon_consolidation.svg?var(--ImageVersion)");
}
.iconModule.partnerOrder {
  width: 26px;
  height: 25px;
  background-image: url("../../Images/Module/icon_partnerOrder.svg?var(--ImageVersion)");
}
.iconModule.FTA {
  width: 35px;
  height: 24px;
  background-image: url("../../Images/Module/icon_FTA.svg?var(--ImageVersion)");
}
.iconModule.SCM {
  width: 28px;
  height: 27px;
  background-image: url("../../Images/Module/icon_SCM.svg?var(--ImageVersion)");
}
.iconModule.ESS {
  width: 24px;
  height: 25px;
  background-image: url("../../Images/Module/icon_ESS.svg?var(--ImageVersion)");
}
.iconModule.IAC {
  width: 29px;
  height: 25px;
  background-image: url("../../Images/Module/icon_IAC.svg?var(--ImageVersion)");
}
.iconModule.corpCard {
  width: 25px;
  height: 19px;
  background-image: url("../../Images/Module/icon_corpCard.svg?var(--ImageVersion)");
}
.iconModule.expenses {
  width: 25px;
  height: 25px;
  background-image: url("../../Images/Module/icon_expenses.svg?var(--ImageVersion)");
}
.iconModule.budget {
  width: 31px;
  height: 27px;
  background-image: url("../../Images/Module/icon_budget.svg?var(--ImageVersion)");
}
.iconModule.refund {
  width: 27px;
  height: 25px;
  background-image: url("../../Images/Module/icon_refund.svg?var(--ImageVersion)");
}
.iconModule.write {
  width: 24px;
  height: 25px;
  background-image: url("../../Images/Module/icon_write.svg?var(--ImageVersion)");
}
.iconModule.write1010 {
  width: 26px;
  height: 26px;
  background-image: url("../../Images/Module/icon_write1010.svg?var(--ImageVersion)");
}
.iconModule.write4010 {
  width: 24px;
  height: 25px;
  background-image: url("../../Images/Module/icon_write4010.svg?var(--ImageVersion)");
}
.iconModule.write6004 {
  width: 25px;
  height: 25px;
  background-image: url("../../Images/Module/icon_write6004.svg?var(--ImageVersion)");
}
.iconModule.write6005 {
  width: 26px;
  height: 26px;
  background-image: url("../../Images/Module/icon_write6005.svg?var(--ImageVersion)");
}
.iconModule.write6006 {
  width: 23px;
  height: 23px;
  background-image: url("../../Images/Module/icon_write6006.svg?var(--ImageVersion)");
}
.iconModule.write6007 {
  width: 19px;
  height: 25px;
  background-image: url("../../Images/Module/icon_write6007.svg?var(--ImageVersion)");
}
.iconModule.write6008 {
  width: 22px;
  height: 23px;
  background-image: url("../../Images/Module/icon_write6008.svg?var(--ImageVersion)");
}
.iconModule.write6009 {
  width: 24px;
  height: 21px;
  background-image: url("../../Images/Module/icon_write6009.svg?var(--ImageVersion)");
}
.iconModule.write6010 {
  width: 25px;
  height: 23px;
  background-image: url("../../Images/Module/icon_write6010.svg?var(--ImageVersion)");
}
.iconModule.write6011 {
  width: 23px;
  height: 24px;
  background-image: url("../../Images/Module/icon_write6011.svg?var(--ImageVersion)");
}
.iconModule.write6012 {
  width: 27px;
  height: 27px;
  background-image: url("../../Images/Module/icon_write6012.svg?var(--ImageVersion)");
}
.iconModule.write6015 {
  width: 24px;
  height: 25px;
  background-image: url("../../Images/Module/icon_write6015.svg?var(--ImageVersion)");
}
.iconModule.write6016 {
  width: 24px;
  height: 25px;
  background-image: url("../../Images/Module/icon_write6016.svg?var(--ImageVersion)");
}
.iconModule.write7010 {
  width: 24px;
  height: 24px;
  background-image: url("../../Images/Module/icon_write7010.svg?var(--ImageVersion)");
}
.iconModule.write7020 {
  width: 18px;
  height: 21px;
  background-image: url("../../Images/Module/icon_write7020.svg?var(--ImageVersion)");
}
.iconModule.write7030 {
  width: 18px;
  height: 23px;
  background-image: url("../../Images/Module/icon_write7030.svg?var(--ImageVersion)");
}
.iconModule.write7040 {
  width: 22px;
  height: 21px;
  background-image: url("../../Images/Module/icon_write7040.svg?var(--ImageVersion)");
}
.iconModule.write7050 {
  width: 26px;
  height: 17px;
  background-image: url("../../Images/Module/icon_write7050.svg?var(--ImageVersion)");
}
.iconModule.write7060 {
  width: 24px;
  height: 21px;
  background-image: url("../../Images/Module/icon_write.svg?var(--ImageVersion)");
}
.iconModule.write7070 {
  width: 24px;
  height: 21px;
  background-image: url("../../Images/Module/icon_write7070.svg?var(--ImageVersion)");
}
.iconModule.write7080 {
  width: 22px;
  height: 20px;
  background-image: url("../../Images/Module/icon_write7080.svg?var(--ImageVersion)");
}
.iconModule.write7090 {
  width: 25px;
  height: 24px;
  background-image: url("../../Images/Module/icon_write7090.svg?var(--ImageVersion)");
}
.iconModule.write7100 {
  width: 23px;
  height: 23px;
  background-image: url("../../Images/Module/icon_write7100.svg?var(--ImageVersion)");
}
.iconModule.write7110 {
  width: 24px;
  height: 21px;
  background-image: url("../../Images/Module/icon_write7110.svg?var(--ImageVersion)");
}
.iconModule.write7114 {
  width: 22px;
  height: 24px;
  background-image: url("../../Images/Module/icon_write7114.svg?var(--ImageVersion)");
}
.iconModule.write7115 {
  width: 21px;
  height: 21px;
  background-image: url("../../Images/Module/icon_write7115.svg?var(--ImageVersion)");
}
.iconModule.write7117 {
  width: 15px;
  height: 23px;
  background-image: url("../../Images/Module/icon_write7117.svg?var(--ImageVersion)");
}
.iconModule.write20000 {
  width: 23px;
  height: 23px;
  background-image: url("../../Images/Module/icon_write20000.svg?var(--ImageVersion)");
}
.iconModule.Process00 {
  width: 20px;
  height: 20px;
  background-image: url("../../Images/Module/iconProcess00.svg?var(--ImageVersion)");
}
.iconModule.Process01 {
  width: 24px;
  height: 25px;
  background-image: url("../../Images/Module/iconProcess01.svg?var(--ImageVersion)");
}
.iconModule.Process02 {
  width: 20px;
  height: 20px;
  background-image: url("../../Images/Module/iconProcess02.svg?var(--ImageVersion)");
}
.iconModule.Process03 {
  width: 26px;
  height: 22px;
  background-image: url("../../Images/Module/iconProcess03.svg?var(--ImageVersion)");
}
.iconModule.Process04 {
  width: 21px;
  height: 20px;
  background-image: url("../../Images/Module/iconProcess04.svg?var(--ImageVersion)");
}
.iconModule.Process05 {
  width: 21px;
  height: 19px;
  background-image: url("../../Images/Module/iconProcess05.svg?var(--ImageVersion)");
}

.iconToolbar {
  display: block;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-image: url("../../Images/Toolbar/T_None.svg?var(--ImageVersion)");
}
.iconToolbar.T_Space {
  display: none !important;
}
.iconToolbar.iconToolbarMore {
  background-image: url("../../Images/Toolbar/iconToolbarMore.svg?var(--ImageVersion)");
}
.iconToolbar.T {
  background-image: url("../../Images/Toolbar/T.svg?var(--ImageVersion)");
}
.iconToolbar.T_Cancel {
  background-image: url("../../Images/Toolbar/T_Cancel.svg?var(--ImageVersion)");
}
.iconToolbar.T_Cancel2 {
  background-image: url("../../Images/Toolbar/T_Cancel2.svg?var(--ImageVersion)");
}
.iconToolbar.T_Confirm {
  background-image: url("../../Images/Toolbar/T_Confirm.svg?var(--ImageVersion)");
}
.iconToolbar.T_Confirm2 {
  background-image: url("../../Images/Toolbar/T_Confirm2.svg?var(--ImageVersion)");
}
.iconToolbar.T_Confirm3 {
  background-image: url("../../Images/Toolbar/T_Confirm3.svg?var(--ImageVersion)");
}
.iconToolbar.T_Copy {
  background-image: url("../../Images/Toolbar/T_Copy.svg?var(--ImageVersion)");
}
.iconToolbar.T_Cut {
  background-image: url("../../Images/Toolbar/T_Cut.svg?var(--ImageVersion)");
}
.iconToolbar.T_Del {
  background-image: url("../../Images/Toolbar/T_Del.svg?var(--ImageVersion)");
}
.iconToolbar.T_Delete {
  background-image: url("../../Images/Toolbar/T_Delete.svg?var(--ImageVersion)");
}
.iconToolbar.T_Excel {
  background-image: url("../../Images/Toolbar/T_Excel.svg?var(--ImageVersion)");
}
.iconToolbar.T_InsertRow {
  background-image: url("../../Images/Toolbar/T_InsertRow.svg?var(--ImageVersion)");
}
.iconToolbar.T_JumpDlg {
  background-image: url("../../Images/Toolbar/T_JumpDlg.svg?var(--ImageVersion)");
}
.iconToolbar.T_JumpFrm {
  background-image: url("../../Images/Toolbar/T_JumpFrm.svg?var(--ImageVersion)");
}
.iconToolbar.T_JumpOut {
  background-image: url("../../Images/Toolbar/T_JumpOut.svg?var(--ImageVersion)");
}
.iconToolbar.T_Message {
  background-image: url("../../Images/Toolbar/T_Message.svg?var(--ImageVersion)");
}
.iconToolbar.T_New {
  background-image: url("../../Images/Toolbar/T_New.svg?var(--ImageVersion)");
}
.iconToolbar.T_NewQuery {
  background-image: url("../../Images/Toolbar/T_NewQuery.svg?var(--ImageVersion)");
}
.iconToolbar.T_None {
  background-image: url("../../Images/Toolbar/T_None.svg?var(--ImageVersion)");
}
.iconToolbar.T_Number {
  background-image: url("../../Images/Toolbar/T_Number.svg?var(--ImageVersion)");
}
.iconToolbar.T_Number_N {
  background-image: url("../../Images/Toolbar/T_Number_N.svg?var(--ImageVersion)");
}
.iconToolbar.T_Open {
  background-image: url("../../Images/Toolbar/T_Open.svg?var(--ImageVersion)");
}
.iconToolbar.T_Paste {
  background-image: url("../../Images/Toolbar/T_Paste.svg?var(--ImageVersion)");
}
.iconToolbar.T_Play {
  background-image: url("../../Images/Toolbar/T_Play.svg?var(--ImageVersion)");
}
.iconToolbar.T_Print {
  background-image: url("../../Images/Toolbar/T_Print.svg?var(--ImageVersion)");
}
.iconToolbar.T_Processing {
  background-image: url("../../Images/Toolbar/T_Processing.svg?var(--ImageVersion)");
}
.iconToolbar.T_QSaveAs {
  background-image: url("../../Images/Toolbar/T_QSaveAs.svg?var(--ImageVersion)");
}
.iconToolbar.T_Query {
  background-image: url("../../Images/Toolbar/T_Query.svg?var(--ImageVersion)");
}
.iconToolbar.T_QueryAddData {
  background-image: url("../../Images/Toolbar/T_QueryAddData.svg?var(--ImageVersion)");
}
.iconToolbar.T_QueryAddData {
  background-image: url("../../Images/Toolbar/T_QueryAddData.svg?var(--ImageVersion)");
}
.iconToolbar.T_Refresh {
  background-image: url("../../Images/Toolbar/T_Refresh.svg?var(--ImageVersion)");
}
.iconToolbar.T_Register {
  background-image: url("../../Images/Toolbar/T_Register.svg?var(--ImageVersion)");
}
.iconToolbar.T_Save {
  background-image: url("../../Images/Toolbar/T_Save.svg?var(--ImageVersion)");
}
.iconToolbar.T_SaveAs {
  background-image: url("../../Images/Toolbar/T_SaveAs.svg?var(--ImageVersion)");
}
.iconToolbar.T_SaveMain {
  background-image: url("../../Images/Toolbar/T_SaveMain.svg?var(--ImageVersion)");
}
.iconToolbar.T_ShareMsg {
  background-image: url("../../Images/Toolbar/T_ShareMsg.svg?var(--ImageVersion)");
}
.iconToolbar.T_SheetDelete {
  background-image: url("../../Images/Toolbar/T_SheetDelete.svg?var(--ImageVersion)");
}
.iconToolbar.T_Table {
  background-image: url("../../Images/Toolbar/T_Table.svg?var(--ImageVersion)");
}
.iconToolbar.T_Table_N {
  background-image: url("../../Images/Toolbar/T_Table_N.svg?var(--ImageVersion)");
}
.iconToolbar.T_Teams {
  background-image: url("../../Images/Toolbar/.T_Teams.svg?var(--ImageVersion)");
}

.iconWidget, .iconWidgetSmall {
  background-image: url("../../Images/iconDashboard.svg?var(--ImageVersion)");
  background-repeat: no-repeat;
}

.icoModule {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-color: #616161;
}
.icoModule.management {
  mask-position: 0px 0;
  -webkit-mask-position: 0px 0;
}
.icoModule.hr {
  mask-position: -24px 0;
  -webkit-mask-position: -24px 0;
}
.icoModule.payment {
  mask-position: -48px 0;
  -webkit-mask-position: -48px 0;
}
.icoModule.account {
  mask-position: -72px 0;
  -webkit-mask-position: -72px 0;
}
.icoModule.project {
  mask-position: -96px 0;
  -webkit-mask-position: -96px 0;
}
.icoModule.sales {
  mask-position: -120px 0;
  -webkit-mask-position: -120px 0;
}
.icoModule.income {
  mask-position: -144px 0;
  -webkit-mask-position: -144px 0;
}
.icoModule.product {
  mask-position: -168px 0;
  -webkit-mask-position: -168px 0;
}
.icoModule.quality {
  mask-position: -192px 0;
  -webkit-mask-position: -192px 0;
}
.icoModule.logistics {
  mask-position: -216px 0;
  -webkit-mask-position: -216px 0;
}
.icoModule.cost {
  mask-position: -240px 0;
  -webkit-mask-position: -240px 0;
}
.icoModule.statistics {
  mask-position: -264px 0;
  -webkit-mask-position: -264px 0;
}
.icoModule.bizplan {
  mask-position: -288px 0;
  -webkit-mask-position: -288px 0;
}
.icoModule.consolidation {
  mask-position: -312px 0;
  -webkit-mask-position: -312px 0;
}
.icoModule.partnerOrder {
  mask-position: -336px 0;
  -webkit-mask-position: -336px 0;
}
.icoModule.FTA {
  mask-position: -360px 0;
  -webkit-mask-position: -360px 0;
}
.icoModule.SCM {
  mask-position: -384px 0;
  -webkit-mask-position: -384px 0;
}
.icoModule.ESS {
  mask-position: -408px 0;
  -webkit-mask-position: -408px 0;
}
.icoModule.IAC {
  mask-position: -432px 0;
  -webkit-mask-position: -432px 0;
}
.icoModule.corpCard {
  mask-position: -456px 0;
  -webkit-mask-position: -456px 0;
}
.icoModule.expenses {
  mask-position: -480px 0;
  -webkit-mask-position: -480px 0;
}
.icoModule.budget {
  mask-position: -504px 0;
  -webkit-mask-position: -504px 0;
}
.icoModule.refund {
  mask-position: -528px 0;
  -webkit-mask-position: -528px 0;
}
.icoModule.write {
  mask-position: -552px 0;
  -webkit-mask-position: -552px 0;
}
.icoModule.write1010 {
  mask-position: -576px 0;
  -webkit-mask-position: -576px 0;
}
.icoModule.write4010 {
  mask-position: -600px 0;
  -webkit-mask-position: -600px 0;
}
.icoModule.write6004 {
  mask-position: -624px 0;
  -webkit-mask-position: -624px 0;
}
.icoModule.write6005 {
  mask-position: -648px 0;
  -webkit-mask-position: -648px 0;
}
.icoModule.write6006 {
  mask-position: -672px 0;
  -webkit-mask-position: -672px 0;
}
.icoModule.write6007 {
  mask-position: -696px 0;
  -webkit-mask-position: -696px 0;
}
.icoModule.write6008 {
  mask-position: -720px 0;
  -webkit-mask-position: -720px 0;
}
.icoModule.write6009 {
  mask-position: -744px 0;
  -webkit-mask-position: -744px 0;
}
.icoModule.write6010 {
  mask-position: -768px 0;
  -webkit-mask-position: -768px 0;
}
.icoModule.write6011 {
  mask-position: -792px 0;
  -webkit-mask-position: -792px 0;
}
.icoModule.write6012 {
  mask-position: -816px 0;
  -webkit-mask-position: -816px 0;
}
.icoModule.write6015 {
  mask-position: -840px 0;
  -webkit-mask-position: -840px 0;
}
.icoModule.write6016 {
  mask-position: -864px 0;
  -webkit-mask-position: -864px 0;
}
.icoModule.write7010 {
  mask-position: -888px 0;
  -webkit-mask-position: -888px 0;
}
.icoModule.write7020 {
  mask-position: -912px 0;
  -webkit-mask-position: -912px 0;
}
.icoModule.write7030 {
  mask-position: -936px 0;
  -webkit-mask-position: -936px 0;
}
.icoModule.write7040 {
  mask-position: -960px 0;
  -webkit-mask-position: -960px 0;
}
.icoModule.write7050 {
  mask-position: -984px 0;
  -webkit-mask-position: -984px 0;
}
.icoModule.write7060 {
  mask-position: -1008px 0;
  -webkit-mask-position: -1008px 0;
}
.icoModule.write7070 {
  mask-position: -1032px 0;
  -webkit-mask-position: -1032px 0;
}
.icoModule.write7080 {
  mask-position: -1056px 0;
  -webkit-mask-position: -1056px 0;
}
.icoModule.write7090 {
  mask-position: -1080px 0;
  -webkit-mask-position: -1080px 0;
}
.icoModule.write7100 {
  mask-position: -1104px 0;
  -webkit-mask-position: -1104px 0;
}
.icoModule.write7110 {
  mask-position: -1128px 0;
  -webkit-mask-position: -1128px 0;
}
.icoModule.write7114 {
  mask-position: -1152px 0;
  -webkit-mask-position: -1152px 0;
}
.icoModule.write7115 {
  mask-position: -1176px 0;
  -webkit-mask-position: -1176px 0;
}
.icoModule.write7117 {
  mask-position: -1200px 0;
  -webkit-mask-position: -1200px 0;
}
.icoModule.write20000 {
  mask-position: -1224px 0;
  -webkit-mask-position: -1224px 0;
}
.icoModule.Process00 {
  mask-position: -1248px 0;
  -webkit-mask-position: -1248px 0;
}
.icoModule.Process01 {
  mask-position: -1272px 0;
  -webkit-mask-position: -1272px 0;
}
.icoModule.Process02 {
  mask-position: -1296px 0;
  -webkit-mask-position: -1296px 0;
}
.icoModule.Process03 {
  mask-position: -1320px 0;
  -webkit-mask-position: -1320px 0;
}
.icoModule.Process04 {
  mask-position: -1344px 0;
  -webkit-mask-position: -1344px 0;
}
.icoModule.Process05 {
  mask-position: -1368px 0;
  -webkit-mask-position: -1368px 0;
}
.icoModule.distribution {
  mask-position: -1392px 0;
  -webkit-mask-position: -1392px 0;
}
.icoModule.fnb {
  mask-position: -1416px 0;
  -webkit-mask-position: -1416px 0;
}
.icoModule.chemical {
  mask-position: -1440px 0;
  -webkit-mask-position: -1440px 0;
}
.icoModule.medicine {
  mask-position: -1464px 0;
  -webkit-mask-position: -1464px 0;
}
.icoModule.fintech {
  mask-position: -1488px 0;
  -webkit-mask-position: -1488px 0;
}

.icoTopBar12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoTopBar12.tabMore {
  background-position-x: 0px;
}
.icoTopBar12.tabArrow {
  background-position-x: -12px;
}
.icoTopBar12.tabClose {
  background-position-x: -24px;
}
.icoTopBar12.cpCode {
  background-position-x: -36px;
}
.icoTopBar12.mask {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-color: #9e9e9e;
  mask-image: url("../../Images/icoTopBar.svg?var(--ImageVersion)");
  mask-repeat: no-repeat;
  -webkit-mask-image: url("../../Images/icoTopBar.svg?var(--ImageVersion)");
  -webkit-mask-repeat: no-repeat;
  background-color: #aaa;
  background-image: none;
}
.icoTopBar12.mask.tabMore {
  mask-position: 0px 0;
  -webkit-mask-position: 0px 0;
}
.icoTopBar12.mask.tabArrow {
  mask-position: -12px 0;
  -webkit-mask-position: -12px 0;
}
.icoTopBar12.mask.tabClose {
  mask-position: -24px 0;
  -webkit-mask-position: -24px 0;
}
.icoTopBar12.mask.cpCode {
  mask-position: -36px 0;
  -webkit-mask-position: -36px 0;
}

.icoTopBar16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -22px;
}
.icoTopBar16.uiUser {
  background-position-x: 0px;
}
.icoTopBar16.uiGroup {
  background-position-x: -16px;
}
.icoTopBar16.uiCompany {
  background-position-x: -32px;
}
.icoTopBar16.uiSetting {
  background-position-x: -48px;
}
.icoTopBar16.uiLogout {
  background-position-x: -64px;
}
.icoTopBar16.uiMobile {
  background-position-x: -80px;
}
.icoTopBar16.uiArrow {
  background-position-x: -96px;
}
.icoTopBar16.link {
  background-position-x: -112px;
}
.icoTopBar16.tbPin {
  background-position-x: -128px;
}
.icoTopBar16.tbPinOn {
  background-position-x: -144px;
}
.icoTopBar16.helpCenter {
  background-position-x: -160px;
}
.icoTopBar16.service {
  background-position-x: -176px;
}
.icoTopBar16.myService {
  background-position-x: -192px;
}

.icoTopBar20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -48px;
}
.icoTopBar20.tbHome {
  background-position-x: 0px;
}
.icoTopBar20.tbStartPgm {
  background-position-x: -20px;
}
.icoTopBar20.tbPrcs {
  background-position-x: -40px;
}
.icoTopBar20.tbPgm {
  background-position-x: -60px;
}
.icoTopBar20.tbFav {
  background-position-x: -80px;
}
.icoTopBar20.tbFavOn {
  background-position-x: -100px;
}
.icoTopBar20.tbSearch {
  background-position-x: -120px;
}
.icoTopBar20.tbAppr {
  background-position-x: -140px;
}
.icoTopBar20.tbLink {
  background-position-x: -160px;
}
.icoTopBar20.tbNoti {
  background-position-x: -180px;
}
.icoTopBar20.tbManual {
  background-position-x: -200px;
}
.icoTopBar20.tbUser {
  background-position-x: -220px;
}
.icoTopBar20.tbMore {
  background-position-x: -240px;
}
.icoTopBar20.tbBI {
  background-position-x: -260px;
}
.icoTopBar20.tbGnI {
  background-position-x: -280px;
}
.icoTopBar20.nwTask {
  background-position-x: -300px;
}
.icoTopBar20.nwContact {
  background-position-x: -320px;
}
.icoTopBar20.nwCalendar {
  background-position-x: -340px;
}
.icoTopBar20.nwForm {
  background-position-x: -360px;
}
.icoTopBar20.nwMail {
  background-position-x: -380px;
}
.icoTopBar20.nwMsg {
  background-position-x: -400px;
}
.icoTopBar20.nwBoard {
  background-position-x: -420px;
}
.icoTopBar20.nwApproval {
  background-position-x: -440px;
}
.icoTopBar20.nwClova {
  background-position-x: -460px;
}

.icoTopBar24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -78px;
}
.icoTopBar24.tbKbot {
  background-position-x: 0px;
}
.icoTopBar24.tbNworks {
  background-position-x: -24px;
}

.icoLeftBarMask12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-color: #90A4AE;
}
.icoLeftBarMask12.lbDelete {
  mask-position: 0px 0;
  -webkit-mask-position: 0px 0;
}
.icoLeftBarMask12.lbMoveArrow {
  mask-position: -12px 0;
  -webkit-mask-position: -12px 0;
}
.icoLeftBarMask12.lbPrcsToggle {
  mask-position: -24px 0;
  -webkit-mask-position: -24px 0;
}
.icoLeftBarMask12.lbRefresh {
  mask-position: -36px 0;
  -webkit-mask-position: -36px 0;
}
.icoLeftBarMask12.lbDelete {
  background-color: #FC5757;
}
.icoLeftBarMask12.lbMoveArrow {
  background-color: var(--icolbMoveArrowColor);
}
.icoLeftBarMask12.lbPrcsToggle {
  background-color: var(--leftMenuPrcsToggleIconColor);
}

.icoLeftBarMask16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-color: #929292;
}
.icoLeftBarMask16.lbPrcs {
  mask-position: 0px -22px;
  -webkit-mask-position: 0px -22px;
}
.icoLeftBarMask16.lbPgm {
  mask-position: -16px -22px;
  -webkit-mask-position: -16px -22px;
}
.icoLeftBarMask16.lbFolder {
  mask-position: -32px -22px;
  -webkit-mask-position: -32px -22px;
}
.icoLeftBarMask16.lbClock {
  mask-position: -48px -22px;
  -webkit-mask-position: -48px -22px;
}
.icoLeftBarMask16.lbOpen {
  mask-position: -64px -22px;
  -webkit-mask-position: -64px -22px;
}
.icoLeftBarMask16.lbArrow {
  mask-position: -80px -22px;
  -webkit-mask-position: -80px -22px;
}
.icoLeftBarMask16.lbPin {
  mask-position: -96px -22px;
  -webkit-mask-position: -96px -22px;
}
.icoLeftBarMask16.lbPinOn {
  mask-position: -112px -22px;
  -webkit-mask-position: -112px -22px;
}
.icoLeftBarMask16.lbArrow {
  background-color: #000;
}
.icoLeftBarMask16.lbPin, .icoLeftBarMask16.lbPinOn {
  background-color: #90A4AE;
}

.icoLeftBarMask20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-color: #fff;
}
.icoLeftBarMask20.lbMenu {
  mask-position: 0px -48px;
  -webkit-mask-position: 0px -48px;
}
.icoLeftBarMask20.lbFav {
  mask-position: -20px -48px;
  -webkit-mask-position: -20px -48px;
}
.icoLeftBarMask20.lbClock {
  mask-position: -40px -48px;
  -webkit-mask-position: -40px -48px;
}
.icoLeftBarMask20.lbNewFolder {
  mask-position: -60px -48px;
  -webkit-mask-position: -60px -48px;
}
.icoLeftBarMask20.asReq {
  mask-position: -80px -48px;
  -webkit-mask-position: -80px -48px;
}
.icoLeftBarMask20.asList {
  mask-position: -100px -48px;
  -webkit-mask-position: -100px -48px;
}
.icoLeftBarMask20.lbModule {
  mask-position: -120px -48px;
  -webkit-mask-position: -120px -48px;
}
.icoLeftBarMask20.lbMove {
  mask-position: -140px -48px;
  -webkit-mask-position: -140px -48px;
}
.icoLeftBarMask20.lbNewFolder, .icoLeftBarMask20.asReq, .icoLeftBarMask20.asList {
  background-color: var(--MainColor);
}
.icoLeftBarMask20.lbModule {
  background-color: var(--moduleIconColor);
}
.icoLeftBarMask20.lbMove {
  background-color: #616161;
}

.icoLeftBarMask24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-color: #fff;
}
.icoLeftBarMask24.as {
  mask-position: 0px -78px;
  -webkit-mask-position: 0px -78px;
}

.icoLeftBar16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: 0;
}
.icoLeftBar16.lbPgm {
  background-position-x: 0px;
}
.icoLeftBar16.lbPgmOn {
  background-position-x: -16px;
}
.icoLeftBar16.lbPrcs {
  background-position-x: -32px;
}
.icoLeftBar16.lbPrcsOn {
  background-position-x: -48px;
}
.icoLeftBar16.lbFav {
  background-position-x: -64px;
}
.icoLeftBar16.lbFavOn {
  background-position-x: -80px;
}

.icoHome12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoHome12.keyDelete {
  background-position-x: 0px;
}

.icoHome16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -22px;
}
.icoHome16.popPrcs {
  background-position-x: 0px;
}
.icoHome16.popPgm {
  background-position-x: -16px;
}
.icoHome16.aiBling {
  background-position-x: -32px;
}
.icoHome16.popCheck {
  background-position-x: -48px;
}
.icoHome16.popClose {
  background-position-x: -64px;
}

.icoHome20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -64px;
}
.icoHome20.popSearch {
  background-position-x: 0px;
}
.icoHome20.viewDefault {
  background-position-x: -20px;
}
.icoHome20.viewList {
  background-position-x: -40px;
}
.icoHome20.favHelp {
  background-position-x: -60px;
}

.icoHome24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -114px;
}
.icoHome24.aiTip {
  background-position-x: 0px;
}
.icoHome24.aiJump {
  background-position-x: -24px;
}
.icoHome24.favPrev {
  background-position-x: -48px;
}
.icoHome24.favNext {
  background-position-x: -72px;
}
.icoHome24.favAdd {
  background-position-x: -96px;
}

.icoHome32 {
  display: flex;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  background-position-y: -148px;
}
.icoHome32.kbot {
  background-position-x: 0px;
}

.icoHome36 {
  display: flex;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  background-position-y: -190px;
}
.icoHome36.favPrcs {
  background-position-x: 0px;
}
.icoHome36.favPgm {
  background-position-x: -36px;
}

.icoHome44 {
  display: flex;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  background-position-y: -236px;
}
.icoHome44.process {
  background-position-x: 0px;
}
.icoHome44.screen {
  background-position-x: -44px;
}

.icoPgmHome16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: 0;
}
.icoPgmHome16.open {
  background-position-x: 0px;
}
.icoPgmHome16.recent {
  background-position-x: -16px;
}
.icoPgmHome16.fav {
  background-position-x: -32px;
}
.icoPgmHome16.favOn {
  background-position-x: -48px;
}

.icoPgmHome24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -26px;
}
.icoPgmHome24.pgm {
  background-position-x: 0px;
}

.icoPgmHome28 {
  display: flex;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  background-position-y: -60px;
}
.icoPgmHome28.pgmThumb {
  background-position-x: 0px;
}

.icoPgmHome44 {
  display: flex;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  background-position-y: -98px;
}
.icoPgmHome44.pgmNone {
  background-position-x: 0px;
}

.icoSearch12.mask {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-color: #9e9e9e;
  mask-image: url("../../Images/icoSearch.svg?var(--ImageVersion)");
  mask-repeat: no-repeat;
  -webkit-mask-image: url("../../Images/icoSearch.svg?var(--ImageVersion)");
  -webkit-mask-repeat: no-repeat;
  background-color: #9e9e9e;
  background-image: none;
}
.icoSearch12.mask.delete {
  mask-position: 0px 0;
  -webkit-mask-position: 0px 0;
}
.icoSearch12.mask.miniPrcs {
  mask-position: -12px 0;
  -webkit-mask-position: -12px 0;
}
.icoSearch12.mask.check {
  mask-position: -24px 0;
  -webkit-mask-position: -24px 0;
}
.icoSearch12.mask.arrow {
  mask-position: -36px 0;
  -webkit-mask-position: -36px 0;
}

.icoSearch16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -22px;
}
.icoSearch16.pgm {
  background-position-x: 0px;
}
.icoSearch16.prcs {
  background-position-x: -16px;
}
.icoSearch16.dshbrd {
  background-position-x: -32px;
}

.icoSearch20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -48px;
}
.icoSearch20.search {
  background-position-x: 0px;
}
.icoSearch20.close {
  background-position-x: -20px;
}

.icoSearch44 {
  display: flex;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  background-position-y: -78px;
}
.icoSearch44.noneSearch {
  background-position-x: 0px;
}
.icoSearch44.nonePgm {
  background-position-x: -44px;
}
.icoSearch44.nonePrcs {
  background-position-x: -88px;
}

.icoPgmTop12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoPgmTop12.pgmArrow {
  background-position-x: 0px;
}
.icoPgmTop12.extensionArrow {
  background-position-x: -12px;
}
.icoPgmTop12.contextArrow {
  background-position-x: -24px;
}
.icoPgmTop12.moreArrow {
  background-position-x: -36px;
}

.icoPgmTop16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -36px;
}
.icoPgmTop16.pgmFav {
  background-position-x: 0px;
}
.icoPgmTop16.pgmFavOn {
  background-position-x: -16px;
}
.icoPgmTop16.pgmHelp {
  background-position-x: -32px;
}
.icoPgmTop16.pgmNewWindow {
  background-position-x: -48px;
}
.icoPgmTop16.pgmBackToTab {
  background-position-x: -64px;
}
.icoPgmTop16.pgmExit {
  background-position-x: -80px;
}
.icoPgmTop16.pgmExpand {
  background-position-x: -96px;
}
.icoPgmTop16.pgmShrink {
  background-position-x: -112px;
}
.icoPgmTop16.pgmMore {
  background-position-x: -128px;
}
.icoPgmTop16.pgmInfo {
  background-position-x: -144px;
}
.icoPgmTop16.pgmLang {
  background-position-x: -160px;
}
.icoPgmTop16.pgmClose {
  background-position-x: -176px;
}
.icoPgmTop16.popClose {
  background-position-x: -192px;
}
.icoPgmTop16.AIPgm {
  background-position-x: -208px;
}
.icoPgmTop16.pgmUrlCopy {
  background-position-x: -224px;
}

.icoPgmTop20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -76px;
}
.icoPgmTop20.kbot {
  background-position-x: 0px;
}
.icoPgmTop20.myDefVal {
  background-position-x: -20px;
}
.icoPgmTop20.everDesign {
  background-position-x: -40px;
}
.icoPgmTop20.everView {
  background-position-x: -60px;
}
.icoPgmTop20.pgmReload {
  background-position-x: -80px;
}
.icoPgmTop20.dataScrap {
  background-position-x: -100px;
}
.icoPgmTop20.promptEditor {
  background-position-x: -120px;
}
.icoPgmTop20.sheetSet {
  background-position-x: -140px;
}
.icoPgmTop20.everViewContext {
  background-position-x: -160px;
}

.icoPgmTop24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -120px;
}
.icoPgmTop24.pgm {
  background-position-x: 0px;
}
.icoPgmTop24.prcs {
  background-position-x: -24px;
}
.icoPgmTop24.wwAI {
  background-position-x: -48px;
}
.icoPgmTop24.titleSetting {
  background-position-x: -72px;
}
.icoPgmTop24.titleMail {
  background-position-x: -96px;
}
.icoPgmTop24.titleMsg {
  background-position-x: -120px;
}
.icoPgmTop24.titleKakao {
  background-position-x: -144px;
}
.icoPgmTop24.titleNoti {
  background-position-x: -168px;
}
.icoPgmTop24.titleTeams {
  background-position-x: -192px;
}
.icoPgmTop24.dev {
  background-position-x: -216px;
}

.icoMsg12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoMsg12.arrow {
  background-position-x: 0px;
}

.icoMsg16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -22px;
}
.icoMsg16.info {
  background-position-x: 0px;
}
.icoMsg16.close {
  background-position-x: -16px;
}
.icoMsg16.edit {
  background-position-x: -32px;
}
.icoMsg16.key {
  background-position-x: -48px;
}

.icoMsg24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -48px;
}
.icoMsg24.pgm {
  background-position-x: 0px;
}

.icoMsg80 {
  display: flex;
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  background-position-y: -82px;
}
.icoMsg80.chat {
  background-position-x: 0px;
}

.icoMsgMask12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-color: var(--MainColor);
}
.icoMsgMask12.bang {
  mask-position: 0px 0;
  -webkit-mask-position: 0px 0;
}

.icoFavorite16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: 0;
}
.icoFavorite16.star {
  background-position-x: 0px;
}
.icoFavorite16.folder {
  background-position-x: -16px;
}
.icoFavorite16.close {
  background-position-x: -32px;
}

.icoFavorite36 {
  display: flex;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  background-position-y: -26px;
}
.icoFavorite36.favPgm {
  background-position-x: 0px;
}
.icoFavorite36.favPrcs {
  background-position-x: -36px;
}

.imgWorkingWithAI {
  width: 112px;
  height: 93px;
  background-size: 100%;
}

.icoError20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: 0;
}
.icoError20.copyCode {
  background-position-x: 0px;
}

.icoError124 {
  display: flex;
  flex-shrink: 0;
  width: 124px;
  height: 124px;
  background-position-y: -30px;
}
.icoError124.errorDefault {
  background-position-x: 0px;
}
.icoError124.errorNoPerm {
  background-position-x: -124px;
}
.icoError124.errorSecu {
  background-position-x: -248px;
}

.icoError200 {
  display: flex;
  flex-shrink: 0;
  width: 200px;
  height: 200px;
  background-position-y: -164px;
}
.icoError200.logout {
  background-position-x: 0px;
}

.icoNice124 {
  display: flex;
  flex-shrink: 0;
  width: 124px;
  height: 124px;
  background-position-y: 0;
}
.icoNice124.certification {
  background-position-x: 0px;
}
.icoNice124.fail {
  background-position-x: -124px;
}

.icoKbotControl {
  width: 13px;
  height: 10px;
}

.icoGroupbox12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0px;
}
.icoGroupbox12.gbTitle {
  background-position-x: 0px;
}
.icoGroupbox12.gbSheetTitle {
  background-position-x: -12px;
}

.icoToolbar12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0px;
}
.icoToolbar12.moreArrow {
  background-position-x: 0px;
}

.icoToolbar16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -22px;
}
.icoToolbar16.addData {
  background-position-x: 0px;
}
.icoToolbar16.queryExcel {
  background-position-x: -16px;
}
.icoToolbar16.teams {
  background-position-x: -32px;
}

.icoToolbar24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -48px;
}
.icoToolbar24.AI {
  background-position-x: 0px;
}
.icoToolbar24.AI {
  height: 10px;
}

.icoCodehelp16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-color: #aaa;
  mask-image: url("../../Images/icoCodehelp.svg?var(--ImageVersion)");
  mask-repeat: no-repeat;
  -webkit-mask-image: url("../../Images/icoCodehelp.svg?var(--ImageVersion)");
  -webkit-mask-repeat: no-repeat;
  background-image: none;
}
.icoCodehelp16.codehelp {
  mask-position: 0px 0;
  -webkit-mask-position: 0px 0;
}
.icoCodehelp16.multiDel {
  mask-position: -16px 0;
  -webkit-mask-position: -16px 0;
}

.icoDataScrap12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoDataScrap12.sltArrow {
  background-position-x: 0px;
}

.icoDataScrap16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -36px;
}
.icoDataScrap16.close {
  background-position-x: 0px;
}
.icoDataScrap16.scrap {
  background-position-x: -16px;
}
.icoDataScrap16.dataScrap {
  background-position-x: -32px;
}
.icoDataScrap16.more {
  background-position-x: -48px;
}
.icoDataScrap16.edit {
  background-position-x: -64px;
}
.icoDataScrap16.delete {
  background-position-x: -80px;
}

.icoDataScrap20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -76px;
}
.icoDataScrap20.dataScrap {
  background-position-x: 0px;
}

.icoMyDefaultValue16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: 0;
}
.icoMyDefaultValue16.close {
  background-position-x: 0px;
}
.icoMyDefaultValue16.delete {
  background-position-x: -16px;
}
.icoMyDefaultValue16.help {
  background-position-x: -32px;
}
.icoMyDefaultValue16.setting {
  background-position-x: -48px;
}
.icoMyDefaultValue16.mask {
  mask-image: url("../../Images/icoMyDefaultValue.svg?var(--ImageVersion)");
  mask-repeat: no-repeat;
  -webkit-mask-image: url("../../Images/icoMyDefaultValue.svg?var(--ImageVersion)");
  -webkit-mask-repeat: no-repeat;
}

.icoMyDefaultValue20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -40px;
}
.icoMyDefaultValue20.myDefaultValue {
  background-position-x: 0px;
}

.icoMyDefaultValue159 {
  display: flex;
  flex-shrink: 0;
  width: 159px;
  height: 159px;
  background-position-y: -84px;
}
.icoMyDefaultValue159.intro {
  background-position-x: 0px;
}

.icoEverDesign12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoEverDesign12.arrow {
  background-position-x: 0px;
}
.icoEverDesign12.minus {
  background-position-x: -12px;
}
.icoEverDesign12.plus {
  background-position-x: -24px;
}

.icoEverDesign16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -36px;
}
.icoEverDesign16.close {
  background-position-x: 0px;
}
.icoEverDesign16.code {
  background-position-x: -16px;
}
.icoEverDesign16.dic {
  background-position-x: -32px;
}
.icoEverDesign16.more {
  background-position-x: -48px;
}
.icoEverDesign16.switch {
  background-position-x: -64px;
}

.icoEverDesign20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -76px;
}
.icoEverDesign20.everDesign {
  background-position-x: 0px;
}

.icoEverDesign86 {
  display: flex;
  flex-shrink: 0;
  width: 86px;
  height: 86px;
  background-position-y: -120px;
}
.icoEverDesign86.intro {
  background-position-x: 0px;
}

.icoPE12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoPE12.pathSlash {
  background-position-x: 0px;
}

.icoPE16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -36px;
}
.icoPE16.collapseArrow {
  background-position-x: 0px;
}
.icoPE16.prompt {
  background-position-x: -16px;
}
.icoPE16.setting {
  background-position-x: -32px;
}

.icoPE20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -76px;
}
.icoPE20.prompt {
  background-position-x: 0px;
}

.icoPE.logo {
  width: 144px;
  height: 21px;
  background-position: 0 -120px;
}

.icoAR.logo {
  width: 75px;
  height: 27px;
  background-position: 0 0;
}
.icoAR.empty {
  width: 54px;
  height: 44px;
  background-position: 0 -37px;
}

.icoSheet16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: 0;
}
.icoSheet16.errorMsg {
  background-position-x: 0px;
}
.icoSheet16.errorMsgDis {
  background-position-x: -16px;
}
.icoSheet16.search {
  background-position-x: -32px;
}
.icoSheet16.excel {
  background-position-x: -48px;
}
.icoSheet16.hancell {
  background-position-x: -64px;
}
.icoSheet16.addRow {
  background-position-x: -80px;
}
.icoSheet16.reset {
  background-position-x: -96px;
}
.icoSheet16.showCol {
  background-position-x: -112px;
}
.icoSheet16.hideCol {
  background-position-x: -128px;
}
.icoSheet16.filter {
  background-position-x: -144px;
}
.icoSheet16.noFilter {
  background-position-x: -160px;
}
.icoSheet16.multiAlign {
  background-position-x: -176px;
}
.icoSheet16.fixCol {
  background-position-x: -192px;
}
.icoSheet16.unfixCol {
  background-position-x: -208px;
}
.icoSheet16.fixRow {
  background-position-x: -224px;
}
.icoSheet16.unfixRow {
  background-position-x: -240px;
}
.icoSheet16.autoInc {
  background-position-x: -256px;
}
.icoSheet16.autoSum {
  background-position-x: -272px;
}
.icoSheet16.autoSumClose {
  background-position-x: -288px;
}
.icoSheet16.repeat {
  background-position-x: -304px;
}
.icoSheet16.repeatRow {
  background-position-x: -320px;
}
.icoSheet16.selAll {
  background-position-x: -336px;
}
.icoSheet16.unselAll {
  background-position-x: -352px;
}
.icoSheet16.mergeCol {
  background-position-x: -368px;
}
.icoSheet16.unmergeCol {
  background-position-x: -384px;
}
.icoSheet16.colCondition {
  background-position-x: -400px;
}
.icoSheet16.ai {
  background-position-x: -416px;
}
.icoSheet16.setting {
  background-position-x: -432px;
}
.icoSheet16.default {
  background-position-x: -448px;
}
.icoSheet16.moveData {
  background-position-x: -464px;
}
.icoSheet16.paste {
  background-position-x: -480px;
}
.icoSheet16.cancel {
  background-position-x: -496px;
}
.icoSheet16.copy {
  background-position-x: -512px;
}

.icoSheetFeature8 {
  display: flex;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  background-position-y: 0px;
}
.icoSheetFeature8.clear {
  background-position-x: 0px;
}

.icoSheetFeature12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: -18px;
}
.icoSheetFeature12.searchNext {
  background-position-x: 0px;
}
.icoSheetFeature12.searchRow {
  background-position-x: -12px;
}
.icoSheetFeature12.searchCol {
  background-position-x: -24px;
}
.icoSheetFeature12.sort {
  background-position-x: -36px;
}
.icoSheetFeature12.more {
  background-position-x: -48px;
}
.icoSheetFeature12.delItem {
  background-position-x: -60px;
}

.icoSheetFeature16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -40px;
}
.icoSheetFeature16.search {
  background-position-x: 0px;
}
.icoSheetFeature16.multisort {
  background-position-x: -16px;
}
.icoSheetFeature16.showCol {
  background-position-x: -32px;
}
.icoSheetFeature16.close {
  background-position-x: -48px;
}

.icoSheetMultiSort8 {
  display: flex;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  background-position-y: 0;
}
.icoSheetMultiSort8.ascending {
  background-position-x: 0px;
}
.icoSheetMultiSort8.descending {
  background-position-x: -8px;
}

.icoSheetMultiSort12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: -18px;
}
.icoSheetMultiSort12.delSort {
  background-position-x: 0px;
}

.icoSheetMultiSort16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -40px;
}
.icoSheetMultiSort16.ascending {
  background-position-x: 0px;
}
.icoSheetMultiSort16.descending {
  background-position-x: -16px;
}
.icoSheetMultiSort16.saveSort {
  background-position-x: -32px;
}
.icoSheetMultiSort16.resetSort {
  background-position-x: -48px;
}

.icoSheetMultiSort20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -66px;
}
.icoSheetMultiSort20.moveSort {
  background-position-x: 0px;
}
.icoSheetMultiSort20.closeSort {
  background-position-x: -20px;
}

.icoSheetSearch8 {
  display: flex;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  background-position-y: 0;
}
.icoSheetSearch8.delKeword {
  background-position-x: 0px;
}

.icoSheetSearch16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -18px;
}
.icoSheetSearch16.textCase {
  background-position-x: 0px;
}
.icoSheetSearch16.cellContents {
  background-position-x: -16px;
}
.icoSheetSearch16.row {
  background-position-x: -32px;
}
.icoSheetSearch16.column {
  background-position-x: -48px;
}
.icoSheetSearch16.fromFirst {
  background-position-x: -64px;
}
.icoSheetSearch16.current {
  background-position-x: -80px;
}

.icoSheetSearch24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -48px;
}
.icoSheetSearch24.searchNext {
  background-position-x: 0px;
}

.icoSheetColumnCondition16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: 0;
}
.icoSheetColumnCondition16.righArrow {
  background-position-x: 0px;
}
.icoSheetColumnCondition16.bottomArrow {
  background-position-x: -16px;
}
.icoSheetColumnCondition16.close {
  background-position-x: -32px;
}

.icoSheetColumnCondition20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -26px;
}
.icoSheetColumnCondition20.selCondition {
  background-position-x: 0px;
}
.icoSheetColumnCondition20.greater {
  background-position-x: -20px;
}
.icoSheetColumnCondition20.less {
  background-position-x: -40px;
}
.icoSheetColumnCondition20.same {
  background-position-x: -60px;
}
.icoSheetColumnCondition20.include {
  background-position-x: -80px;
}
.icoSheetColumnCondition20.between {
  background-position-x: -100px;
}
.icoSheetColumnCondition20.back {
  background-position-x: -120px;
}
.icoSheetColumnCondition20.more {
  background-position-x: -140px;
}
.icoSheetColumnCondition20.allCondition {
  background-position-x: -160px;
}
.icoSheetColumnCondition20.eyeShow {
  background-position-x: -180px;
}
.icoSheetColumnCondition20.eyeHide {
  background-position-x: -200px;
}
.icoSheetColumnCondition20.delete {
  background-position-x: -220px;
}

.icoSheetColumnCondition24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -56px;
}
.icoSheetColumnCondition24.colCondition {
  background-position-x: 0px;
}
.icoSheetColumnCondition24.fill {
  background-position-x: -24px;
}
.icoSheetColumnCondition24.stroke {
  background-position-x: -48px;
}
.icoSheetColumnCondition24.colorPick {
  background-position-x: -72px;
}

.icoSheetColumnCondition40 {
  display: flex;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background-position-y: -90px;
}
.icoSheetColumnCondition40.noneCondition {
  background-position-x: 0px;
}

.icoSheetSetting {
  width: 20px;
  height: 20px;
}

.icoLogin16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: 0;
}
.icoLogin16.admin {
  background-position-x: 0px;
}
.icoLogin16.language {
  background-position-x: -16px;
}

.icoProcessMenu12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoProcessMenu12.close {
  background-position-x: 0px;
}
.icoProcessMenu12.expand {
  background-position-x: -12px;
}
.icoProcessMenu12.popup {
  background-position-x: -24px;
}
.icoProcessMenu12.help {
  background-position-x: -36px;
}

.icoProcessMenu16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -22px;
}
.icoProcessMenu16.fav {
  background-position-x: 0px;
}
.icoProcessMenu16.favOn {
  background-position-x: -16px;
}
.icoProcessMenu16.help {
  background-position-x: -32px;
}
.icoProcessMenu16.menu {
  background-position-x: -48px;
}
.icoProcessMenu16.recent {
  background-position-x: -64px;
}
.icoProcessMenu16.collapse {
  background-position-x: -80px;
}
.icoProcessMenu16.chapter {
  background-position-x: -96px;
}
.icoProcessMenu16.close {
  background-position-x: -112px;
}
.icoProcessMenu16.info {
  background-position-x: -128px;
}
.icoProcessMenu16.go {
  background-position-x: -144px;
}
.icoProcessMenu16.stop {
  background-position-x: -160px;
}
.icoProcessMenu16.payment {
  background-position-x: -176px;
}
.icoProcessMenu16.statement {
  background-position-x: -192px;
}

.icoProcessMenu20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -48px;
}
.icoProcessMenu20.kbot {
  background-position-x: 0px;
}

.icoProcessMenu24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -78px;
}
.icoProcessMenu24.video {
  background-position-x: 0px;
}
.icoProcessMenu24.prcs {
  background-position-x: -24px;
}
.icoProcessMenu24.pgm {
  background-position-x: -48px;
}

.icoProcessMenu36 {
  display: flex;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  background-position-y: -112px;
}
.icoProcessMenu36.bnrPlay {
  background-position-x: 0px;
}

.icoProcessMenu40 {
  display: flex;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background-position-y: -158px;
}
.icoProcessMenu40.prcs {
  background-position-x: 0px;
}

.icoProcessMenu44 {
  display: flex;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  background-position-y: -208px;
}
.icoProcessMenu44.prcsDefault {
  background-position-x: 0px;
}

.icoProcessMenu74 {
  display: flex;
  flex-shrink: 0;
  width: 74px;
  height: 74px;
  background-position-y: -262px;
}
.icoProcessMenu74.bnrImg {
  background-position-x: 0px;
}

.icoSetting16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: 0;
}
.icoSetting16.info {
  background-position-x: 0px;
}

.icoSetting20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -26px;
}
.icoSetting20.kakaotalk {
  background-position-x: 0px;
}

.icoSetting24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -55px;
}
.icoSetting24.sms {
  background-position-x: 0px;
}
.icoSetting24.mail {
  background-position-x: -24px;
}
.icoSetting24.appNoti {
  background-position-x: -48px;
}
.icoSetting24.teams {
  background-position-x: -72px;
}

.icoSetting52 {
  display: flex;
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  background-position-y: -89px;
}
.icoSetting52.userDefault {
  background-position-x: 0px;
}

.icoNoti12 {
  display: flex;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position-y: 0;
}
.icoNoti12.prev {
  background-position-x: 0px;
}
.icoNoti12.next {
  background-position-x: -12px;
}
.icoNoti12.delete {
  background-position-x: -24px;
}

.icoNoti16 {
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-position-y: -22px;
}
.icoNoti16.toastClose {
  background-position-x: 0px;
}
.icoNoti16.setting {
  background-position-x: -16px;
}
.icoNoti16.info {
  background-position-x: -32px;
}
.icoNoti16.refresh {
  background-position-x: -48px;
}
.icoNoti16.link {
  background-position-x: -64px;
}
.icoNoti16.search {
  background-position-x: -80px;
}

.icoNoti20 {
  display: flex;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position-y: -48px;
}
.icoNoti20.notiToast {
  background-position-x: 0px;
}
.icoNoti20.noticeBlue {
  background-position-x: -20px;
}
.icoNoti20.msgGreen {
  background-position-x: -40px;
}
.icoNoti20.delete {
  background-position-x: -60px;
}
.icoNoti20.list {
  background-position-x: -80px;
}

.icoNoti24 {
  display: flex;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background-position-y: -78px;
}
.icoNoti24.pgm {
  background-position-x: 0px;
}
.icoNoti24.noData {
  background-position-x: -24px;
}

.icoNoti44 {
  display: flex;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  background-position-y: -112px;
}
.icoNoti44.noNotice {
  background-position-x: 0px;
}
.icoNoti44.noMsg {
  background-position-x: -44px;
}
.icoNoti44.noData {
  background-position-x: -88px;
}

:root {
  --fontSize: 16px;
  font-size: var(--fontSize);
}

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
html *, body * {
  font-family: "Pretendard GOV", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
  margin: 0;
  padding: 0;
  letter-spacing: 0;
  box-sizing: border-box;
  outline: none;
  -webkit-text-size-adjust: none;
}

ul, ol, li, dl, dt, dd {
  margin: 0;
  padding: 0;
  list-style: none;
}

p, h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0px;
  color: var(--MainFontColor);
}

img {
  margin: 0;
  border: 0px;
}

p {
  padding: 0px;
  margin: 0;
}

a {
  color: var(--MainFontColor);
  text-decoration: none;
}
a:hover {
  color: var(--MainFontColor);
}
a:focus-visible {
  outline: 1px solid var(--LinkFocusOutline);
}

input[type=checkbox] {
  vertical-align: middle;
  -webkit-appearance: checkbox;
}

input[type=radio] {
  vertical-align: middle;
  -webkit-appearance: radio;
}

button {
  border: 0;
  background-color: transparent;
}
button:focus-visible {
  outline: 1px solid var(--MainFontColor);
}

select {
  padding: 0px;
}

textarea {
  resize: none;
}

.title {
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.CenterArea > article {
  width: 100%;
  height: 100%;
  padding: var(--CenterAreaPadding);
  border-radius: 8px 8px 0 0;
}
.CenterArea > article > #iframeParentDiv {
  width: 100%;
  height: 100%;
}
.CenterArea > article > #iframeParentDiv > iframe {
  width: 100%;
  height: 100%;
}
.CenterArea.fullScreen {
  width: 100% !important;
  left: 0 !important;
}

.programArea {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--PgmAreaBgColor);
}
.programArea .DevLayout {
  position: absolute;
  margin: 0px;
  padding: 0px;
}
.programArea .DevLayout .contents {
  overflow: hidden;
}
.programArea .DevLayout .contents .GridItem {
  position: absolute;
  margin: 0px;
  padding: 0px;
}
.programArea .contentsArea {
  height: calc(100% - 40px);
  padding: 0 2px;
  background-color: var(--PgmAreaBgColor);
}
.programArea .contentsArea > form {
  height: 100%;
}
.programArea.officeMode .toolbarArea .ulToolbar {
  padding-left: 40px;
}
.programArea.fullScreen, .programArea.newWindow {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.programArea.fullScreen .pgmTopArea .pgmTop, .programArea.newWindow .pgmTopArea .pgmTop {
  padding-left: 4px;
}
.programArea.fullScreen .pgmTopArea .pgmTop .btnExit, .programArea.newWindow .pgmTopArea .pgmTop .btnExit {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  margin: 0 0 0 5px;
  border-radius: 4px;
  background-color: #263238;
  cursor: pointer;
}
.programArea.fullScreen .pgmTopArea .pgmTop [data-tooltip].ttBL:after, .programArea.newWindow .pgmTopArea .pgmTop [data-tooltip].ttBL:after {
  transform: translate(-8px, 7px);
}
.programArea.movingDataMode {
  overflow: hidden;
  z-index: 21;
}
.programArea.movingDataMode::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.25);
  z-index: 20;
}
.programArea.movingDataMode .iframProgram {
  position: absolute;
  z-index: 21;
}

.CanvasvVewer, .canvasviewer {
  box-sizing: border-box;
  border: 1px solid var(--ControlGroupboxBorder);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  overflow: scroll !important;
}

.toolbarArea {
  height: 44px;
  padding: 2px 4px 2px 4px;
  overflow: hidden;
}
.toolbarArea > div {
  display: flex;
  align-items: center;
  height: 100%;
  border-radius: 4px;
}
.toolbarArea .ulToolbar {
  display: flex;
  overflow: hidden;
}
.toolbarArea .ulToolbar > li {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 100%;
  margin-right: 5px;
}
.toolbarArea .ulToolbar > li:last-child {
  margin-right: 0;
}
.toolbarArea .ulToolbar > li > a {
  display: flex;
  align-items: center;
  height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 4px;
  background: linear-gradient(180deg, #fff, #F3F4F8);
  border: 1px solid #c8c8c8;
  gap: 4px;
  transition: all 0.3s;
}
.toolbarArea .ulToolbar > li > a:hover, .toolbarArea .ulToolbar > li > a:focus {
  border-color: #c9ccd0;
  background: #F1F3F6;
  cursor: pointer;
}
.toolbarArea .ulToolbar > li > a .txt {
  flex-shrink: 0;
  color: #333;
  font-size: var(--fs13);
  font-weight: 500;
}
.toolbarArea .ulToolbar > li img {
  width: 16px;
  height: 16px;
}
.toolbarArea .ulToolbar > li.Dis {
  opacity: 0.5;
  cursor: default;
}
.toolbarArea .ulToolbar > li.Dis:hover {
  background-color: transparent;
  cursor: not-allowed;
}
.toolbarArea .ulToolbar > li.Dis:hover > a {
  background-color: transparent;
  cursor: not-allowed;
}
.toolbarArea .ulToolbar > li.seperator {
  position: relative;
}
.toolbarArea .ulToolbar > li.AddData > a:first-child, .toolbarArea .ulToolbar > li.ExcelQuery > a:first-child {
  padding-right: 8px;
  border-right: 0;
  border-radius: 4px 0 0 4px;
}
.toolbarArea .ulToolbar > li.AddData .iconAdd.Dis, .toolbarArea .ulToolbar > li.AddData .iconExcel.Dis, .toolbarArea .ulToolbar > li.ExcelQuery .iconAdd.Dis, .toolbarArea .ulToolbar > li.ExcelQuery .iconExcel.Dis {
  opacity: 0.5;
  cursor: default;
  filter: grayscale(100%);
}
.toolbarArea .ulToolbar > li.AddData .iconAdd {
  display: flex;
}
.toolbarArea .ulToolbar > li.ExcelQuery .iconExcel {
  display: flex;
}
.toolbarArea .ulToolbar > li.AddData.ExcelQuery .iconAdd {
  border-right: 0;
  border-radius: 0;
}
.toolbarArea .ulToolbar > li .iconAdd, .toolbarArea .ulToolbar > li .iconExcel {
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
  width: 28px;
  padding: 0 5px;
  border-radius: 0 4px 4px 0;
  background: linear-gradient(180deg, #fff, #F3F4F8);
  cursor: pointer;
}
.toolbarArea .ulToolbar > li.fxAI > a {
  background: linear-gradient(161deg, #F8F7FF -20.62%, #E8E4FF 52.61%, #E7D2FF 125.83%);
}
.toolbarArea .ulToolbar > li.fxAI > a .txt {
  background: linear-gradient(133deg, #6C68EC 9.9%, #604AE9 47.85%, #A928E6 90.65%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: bold;
}
.toolbarArea .btnMore {
  display: flex;
  align-items: center;
  height: 30px;
  padding: 0 10px;
  border: 1px solid #D8D8E6;
  border-radius: 4px;
  background: linear-gradient(180deg, #fff, #F3F4F8);
  font-size: var(--fs14);
  letter-spacing: -1px;
  transition: all 0.3s;
}
.toolbarArea .btnMore i.moreTool {
  margin-right: 5px;
}
.toolbarArea .btnMore .txt {
  flex-shrink: 0;
  color: #333;
  font-size: var(--fs13);
  font-weight: 500;
}
.toolbarArea .btnMore i.moreArrow {
  margin-left: 3px;
}
.toolbarArea .btnMore:hover, .toolbarArea .btnMore:focus {
  border-color: #c9ccd0;
  background: #F1F3F6;
  cursor: pointer;
}
.toolbarArea .dlgToolbarMoreWrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 255, 0);
  z-index: 99999;
}
.toolbarArea .dlgToolbarMoreWrap .toolbarMore {
  top: 40px;
  min-width: 150px;
  max-height: 80%;
  overflow: auto;
}
.toolbarArea .dlgToolbarMoreWrap .toolbarMore ul li.fxAI .item > .txt::before {
  content: "AI";
  margin-right: 3px;
}

.splitter {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 20;
}
.splitter.Horizontal {
  width: 10px;
  height: 100%;
}
.splitter.Horizontal:hover {
  background-color: rgba(var(--MainColor-rgb), 0.2);
  cursor: col-resize;
}
.splitter.Vertical {
  width: 100%;
  height: 10px;
}
.splitter.Vertical:hover {
  background-color: rgba(var(--MainColor-rgb), 0.2);
  cursor: row-resize;
}

.groupBox {
  position: relative;
  height: 100%;
  border: 1px solid var(--ControlGroupboxBorder);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  overflow: hidden;
  box-sizing: border-box;
}
.groupBox > .title {
  display: flex;
  align-items: center;
  height: 16px;
  margin: 4px 0 4px 5px;
  padding: 0;
  background-color: var(--MainBgColor);
  font-size: var(--fs13);
  font-weight: bold;
  gap: 4px;
}
.groupBox > .contents {
  position: relative;
}
.groupBox > .CanvasvVewer {
  top: auto !important;
}
.groupBox.sheetGroupBox {
  overflow: visible;
}
.groupBox.TitleHidden > p.title {
  display: none;
}

.groupBoxSheet {
  width: 100%;
  height: 100%;
  border: 1px solid var(--ControlGroupboxBorder);
  background-color: var(--MainBgColor);
}
.groupBoxSheet > .title {
  display: flex;
  align-items: center;
  height: 16px;
  margin: 4px 0 4px 5px;
  background-color: var(--MainBgColor);
  font-size: var(--fs13);
  font-weight: bold;
  gap: 4px;
}
.groupBoxSheet > .contents {
  position: relative;
}
.groupBoxSheet.TitleHidden .title {
  display: none;
}

.expander {
  height: 100%;
  min-height: 25px;
  border: 1px solid var(--ControlGroupboxBorder);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  overflow: hidden;
  box-sizing: border-box;
  z-index: 2;
}
.expander > .title {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 80px;
  min-height: 24px;
  padding: 4px 10px 2px 10px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  font-weight: bold;
  word-break: keep-all;
  z-index: 1;
}
.expander > .title > i.gbTitle {
  display: none;
}
.expander > .title::before {
  content: "";
  flex-shrink: 0;
  width: 11px;
  height: 6px;
  margin-right: 4px;
  background-position: -59px -110px;
}
.expander > .title:hover {
  cursor: pointer;
}
.expander > .title:focus-visible {
  outline: none;
}
.expander.ContentsHidden > .title {
  height: 100%;
  padding: 4px 10px;
}
.expander.ContentsHidden .DevLayout {
  display: none;
}
.expander > .DevLayout {
  position: relative;
}
.expander.expanderDown.ContentsHidden .title::before {
  background-position: -59px -79px;
}
.expander.expanderDown.ContentsHidden .DevLayout {
  display: none;
}
.expander.expanderUp > .title {
  position: absolute;
  bottom: 0;
  left: 0;
}
.expander.expanderUp > .title::before {
  background-position: -59px -79px;
}
.expander.expanderUp > .DevLayout {
  margin-bottom: 25px;
}
.expander.expanderUp .btnPin {
  top: auto;
  bottom: 2px;
}
.expander.expanderUp.ContentsHidden .title::before {
  background-position: -59px -110px;
}
.expander.expanderLeft, .expander.expanderRight {
  display: flex;
}
.expander.expanderLeft > .title, .expander.expanderRight > .title {
  left: unset !important;
  width: unset !important;
  height: 100% !important;
  min-width: unset !important;
  padding: 10px 7px 5px 7px;
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  text-orientation: sideways;
  word-break: break-all;
  line-height: 14px;
}
.expander.expanderLeft > .title::before, .expander.expanderRight > .title::before {
  margin: 0 2px 7px 0;
  transform: rotate(90deg);
}
.expander.expanderLeft.ContentsHidden .title, .expander.expanderRight.ContentsHidden .title {
  left: unset !important;
  width: 100% !important;
  height: 100% !important;
  min-width: unset !important;
  padding: 10px 7px 5px 7px;
}
.expander.expanderLeft > .title::before {
  background-position: -59px -79px;
}
.expander.expanderLeft .btnPin {
  top: auto;
  bottom: 3px;
  left: 2px;
}
.expander.expanderLeft.ContentsHidden .title::before {
  background-position: -59px -110px;
}
.expander.expanderRight {
  flex-direction: row-reverse;
}
.expander.expanderRight > .title::before {
  background-position: -59px -110px;
}
.expander.expanderRight .btnPin {
  top: auto;
  bottom: 3px;
  right: 2px;
}
.expander.expanderRight.ContentsHidden .title::before {
  background-position: -59px -79px;
}
.expander .btnPin {
  position: absolute;
  top: 2px;
  right: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--BorderGreyLight);
  cursor: pointer;
}
.expander .btnPin > i {
  display: inline-block;
  width: 6px;
  height: 11px;
  background-position: -220px 0;
  transform: rotate(90deg);
}
.expander .btnPin.On > i {
  background-position: -236px 0;
  transform: rotate(0deg);
}
.expander .btnPin.On:hover > i {
  opacity: 0.5;
}

.controlTab {
  width: 100%;
  height: 100%;
}
.controlTab .tabHeader {
  display: flex;
  width: 100%;
  height: 29px;
  overflow: hidden;
}
.controlTab .tabHeader ul {
  display: flex;
  width: 100%;
  height: 38px;
  overflow-x: auto;
  overflow-y: hidden;
  z-index: 1;
}
.controlTab .tabHeader ul > li {
  flex-shrink: 0;
}
.controlTab .tabHeader ul > li a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  min-width: 80px;
  padding: 5px 16px;
  border: 1px solid var(--BorderGrey);
  border-radius: 4px 4px 0 0;
  background-color: #F9FAFC;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  text-align: center;
  box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.08);
}
.controlTab .tabHeader ul > li.on a {
  padding: 4px 16px;
  border-top: 3px solid var(--ControlBgColorSelected);
  border-bottom: 3px solid var(--MainBgColor);
  background-color: var(--MainBgColor);
  color: var(--ControlBgColorSelected);
  font-weight: bold;
}
.controlTab .tabHeader ul > li + li > a {
  margin-left: -1px;
}
.controlTab .tabHeader .btnMoreTabLeft, .controlTab .tabHeader .btnMoreTabRight {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  cursor: pointer;
}
.controlTab .tabHeader .btnMoreTabLeft > i, .controlTab .tabHeader .btnMoreTabRight > i {
  display: inline-block;
  width: 9px;
  height: 8px;
  background-position: -90px -33px;
}
.controlTab .tabHeader .btnMoreTabLeft:hover, .controlTab .tabHeader .btnMoreTabRight:hover {
  background-color: #e2e2e2;
  cursor: pointer;
}
.controlTab .tabHeader .btnMoreTabLeft > i {
  transform: rotate(180deg);
}
.controlTab > .contentsBox {
  top: 30px;
  width: 100%;
  height: calc(100% - 30px);
  margin-top: -1px;
  border: 1px solid var(--ControlGroupboxBorder);
  border-radius: 0px 5px 5px 5px;
  background-color: var(--MainBgColor);
  overflow: hidden;
}
.controlTab > .contentsBox > div {
  width: 100%;
  height: 100%;
}

.layoutControl {
  position: absolute;
  display: flex;
  align-items: center;
  padding: 2px 0;
  color: var(--MainFontColor);
  font-size: var(--fs13);
}
.layoutControl.DevLayout {
  padding: 2px 0;
}
.layoutControl > .labelCaption {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  height: 100%;
  padding: 0 0 0 0px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  text-align: right;
  line-height: 1em;
  letter-spacing: -0.3px;
  word-break: break-word;
}
.layoutControl > .labelCaption.labelNon {
  color: var(--ControlFontColorNon);
}
.layoutControl .iconEncode {
  flex-shrink: 0;
  width: 15px;
  height: 16px;
  margin-left: 5px;
  background-position: -111px 0;
  word-break: break-word;
  cursor: pointer;
}
.layoutControl .iconEncode.Decode {
  background-position: -88px 0;
}
.layoutControl > .lbNormal {
  display: inline-flex;
  align-items: center;
  width: inherit;
  height: 100%;
  padding: 0;
  color: currentColor;
  font-size: 1em;
  word-break: break-word;
}
.layoutControl[kui-textbox] > input:valid:focus {
  padding-right: 20px;
}
.layoutControl[kui-textbox] > input:valid:focus + .btnDelValue {
  display: flex;
  align-items: center;
  justify-content: center;
}
.layoutControl[kui-textbox] .btnDelValue {
  display: none;
  position: absolute;
  top: 2px;
  right: 0;
  flex-shrink: 0;
  width: 20px;
  height: calc(100% - 4px);
  cursor: pointer;
}
.layoutControl[kui-textbox] .btnDelValue > i {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background-color: rgba(var(--InvertBgColor-rgb), 0.3);
}
.layoutControl[kui-textbox] .btnDelValue > i::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 7px;
  background-color: var(--MainBgColor);
  transform: rotate(45deg);
}
.layoutControl[kui-textbox] .btnDelValue > i::after {
  content: "";
  position: absolute;
  width: 7px;
  height: 1px;
  background-color: var(--MainBgColor);
  transform: rotate(45deg);
}
.layoutControl[kui-textbox] .btnDelValue:hover > i {
  background-color: rgba(var(--InvertBgColor-rgb), 0.5);
}
.layoutControl[kui-textbox]:hover > input:valid {
  padding-right: 20px;
  border-color: var(--ControlBorderColorFocus);
}
.layoutControl[kui-textbox]:hover > input:valid + .btnDelValue {
  display: flex;
  align-items: center;
  justify-content: center;
}
.layoutControl[kui-textbox].PasswordEncode .btnDelValue {
  right: 20px;
}
.layoutControl[kui-label].labelNon > label {
  color: var(--ControlFontColorNon);
}
.layoutControl > input,
.layoutControl > .MultiCodehelpListArea {
  height: 100%;
  min-height: 24px;
  margin-left: 5px;
  padding: 0 1px;
  border-radius: 3px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: inherit;
  font-size: 1em;
  z-index: 0;
  -webkit-appearance: none;
}
.layoutControl > input[type=checkbox],
.layoutControl > .MultiCodehelpListArea[type=checkbox] {
  min-height: 0;
  border: 0;
  -webkit-appearance: checkbox;
}
.layoutControl > input[type=radio],
.layoutControl > .MultiCodehelpListArea[type=radio] {
  min-height: 0;
  border: 0;
  -webkit-appearance: radio;
}
.layoutControl > input:hover,
.layoutControl > .MultiCodehelpListArea:hover {
  border: 1px solid var(--ControlBorderColorFocus);
}
.layoutControl > input:focus,
.layoutControl > .MultiCodehelpListArea:focus {
  border: 1px solid var(--ControlBorderColorFocus);
  color: var(--ControlBorderColorFocus);
  font-weight: bold;
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px;
  transition: all 0.2s ease;
}
.layoutControl > input::-webkit-input-placeholder, .layoutControl > input -ms-input-placeholder, .layoutControl > input -moz-input-placeholder,
.layoutControl > .MultiCodehelpListArea::-webkit-input-placeholder,
.layoutControl > .MultiCodehelpListArea -ms-input-placeholder,
.layoutControl > .MultiCodehelpListArea -moz-input-placeholder {
  color: var(--MainFontColorLighter);
}
.layoutControl > textarea {
  height: 100%;
  min-height: 26px;
  margin: 3px 0 3px 5px;
  padding: 3px 2px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
  background-color: var(--ControlBgColor);
  font-size: 1em;
  color: inherit;
  z-index: 0;
  -webkit-appearance: none;
  vertical-align: middle;
  overflow: auto;
  resize: none;
}
.layoutControl > textarea:focus {
  border: 1px solid var(--ControlBorderColorFocus);
  color: var(--ControlFontColorFocus);
  font-weight: bold;
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px;
  transition: all 0.2s ease;
}
.layoutControl > .comboBox {
  display: inline-block;
  height: 100%;
  margin: 0px;
  margin-left: 5px;
  vertical-align: middle;
  z-index: 0;
}
.layoutControl > .comboBox > select {
  height: 100%;
  background-color: var(--ControlBgColor);
  border: 1px solid var(--ControlBorderColor);
  font-size: 1em;
  color: var(--MainFontColor);
  border-radius: 3px;
}
.layoutControl > .comboBox > select option {
  padding: 5px 0;
}
.layoutControl > .comboBox > select option.selected {
  background-color: var(--ControlBgColorSelected);
  color: var(--ControlFontColorSelected);
}
.layoutControl > .comboBox > select:focus {
  border: 1px solid var(--ControlBorderColorFocus);
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px;
}
.layoutControl > .comboBox .btnComboBox {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 24px;
  padding: 0px 0px 0 5px;
  color: var(--ControlFontColor);
  font-size: var(--fs13);
  border: 1px solid var(--ControlBorderColor);
  border-radius: 2px;
  background-color: var(--ControlBgColor);
  z-index: 0;
  -webkit-appearance: none;
  white-space: nowrap;
  word-break: break-all;
  overflow: hidden;
}
.layoutControl > .comboBox .btnComboBox:hover {
  border: 1px solid var(--ControlBorderColorFocus);
  cursor: pointer;
}
.layoutControl > .comboBox:focus .btnComboBox {
  border: 2px solid var(--ControlBorderColorFocus);
}
.layoutControl.CodeHelp > input {
  padding: 0px 20px 0px 2px;
  background-color: var(--ControlBgColorCodehelp);
}
.layoutControl.CodeHelp > input:valid:focus {
  padding-right: 40px;
}
.layoutControl.CodeHelp > input:valid:focus + .btnDelValue {
  right: 20px;
}
.layoutControl.CodeHelp > .btnCodeHelp {
  display: inline-flex;
  align-items: center;
  position: absolute;
  top: 2px;
  right: 0;
  width: 20px;
  height: calc(100% - 4px);
  cursor: pointer;
}
.layoutControl.CodeHelp:hover > input:valid {
  border-color: var(--ControlFontColorCodehelp);
  padding-right: 40px;
}
.layoutControl.CodeHelp:hover > input:valid + .btnDelValue {
  right: 20px;
}
.layoutControl.CodeHelp.Dis > .btnCodeHelp {
  display: none;
}
.layoutControl.MultiCodehelp > input {
  padding: 0px 20px 0px 2px;
  background-color: var(--ControlBgColorCodehelp);
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea {
  display: inline-flex;
  height: 100%;
  padding: 0px 40px 0px 2px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColorCodehelp);
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea::-webkit-scrollbar-track {
  background-color: transparent;
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea::-webkit-scrollbar-track:hover {
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.15);
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.25);
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea::-webkit-scrollbar-thumb:active {
  background-color: rgba(0, 0, 0, 0.4);
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea::-webkit-scrollbar-corner {
  background-color: transparent;
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  background-color: transparent;
}
.layoutControl.MultiCodehelp > .MultiCodehelpListArea > .itemListArea {
  scrollbar-face-color: transparent;
  scrollbar-track-color: transparent;
  scrollbar-3dlight-color: transparent;
  scrollbar-highlight-color: transparent;
  scrollbar-darkshadow-color: transparent;
  scrollbar-shadow-color: transparent;
  scrollbar-arrow-color: transparent;
}
.layoutControl.MultiCodehelp > .btnCodeHelp {
  position: absolute;
  top: 4px;
  right: 1px;
  display: inline-flex;
  align-items: center;
  width: 20px;
  height: calc(100% - 8px);
  border-radius: 2px;
  cursor: pointer;
}
.layoutControl.MultiCodehelp > .btnCodeHelpAllDel {
  position: absolute;
  top: calc(50% - 7px);
  right: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 13px;
  height: 13px;
  color: #fff;
  border-radius: 50%;
  background-color: #bebebe;
  cursor: pointer;
}
.layoutControl.MultiCodehelp > .btnCodeHelpAllDel::before, .layoutControl.MultiCodehelp > .btnCodeHelpAllDel::after {
  content: "";
  position: absolute;
  top: calc(50% - 4px);
  left: 6px;
  width: 1px;
  height: 8px;
  background-color: currentColor;
}
.layoutControl.MultiCodehelp > .btnCodeHelpAllDel::before {
  transform: rotate(45deg);
}
.layoutControl.MultiCodehelp > .btnCodeHelpAllDel::after {
  transform: rotate(-45deg);
}
.layoutControl.MultiCodehelp > .btnCodeHelpAllDel:hover {
  background-color: #aaa;
}
.layoutControl.MultiCodehelp.Dis > .btnCodeHelp {
  display: none;
}
.layoutControl.MultiCodehelp.vertical .MultiCodehelpListArea {
  width: 100% !important;
}
.multiCodeItem {
  position: relative;
  display: inline-flex;
  margin: 2px 4px 2px 0;
  color: var(--ControlFontColorMultiCodehelp);
}
.multiCodeItem:hover input[type=checkbox] + label {
  background-color: #a6a6a6;
  cursor: pointer;
}
.multiCodeItem:hover input[type=checkbox]:checked + label {
  background-color: #0f8ab4;
  cursor: pointer;
}
.multiCodeItem > input[type=checkbox] {
  display: none;
}
.multiCodeItem > input[type=checkbox] + label {
  display: inline-flex;
  align-items: center;
  height: 100%;
  min-height: 20px;
  padding: 0 20px 0 8px;
  border-radius: 4px;
  background-color: var(--ControlBorderColorDis);
  color: currentColor;
  font-size: var(--fs13);
  user-select: none;
}
.multiCodeItem > input[type=checkbox]:checked + label {
  opacity: 1;
  background-color: var(--ControlBgColorMultiCodehelp);
}
.multiCodeItem > input[type=checkbox]:checked + label + .btnDel {
  color: #ebf7ff;
}
.multiCodeItem > .btnDel {
  position: absolute;
  top: 2px;
  right: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  color: currentColor;
}
.multiCodeItem > .btnDel::before, .multiCodeItem > .btnDel::after {
  content: "";
  position: absolute;
  top: calc(50% - 4px);
  left: 6px;
  width: 1px;
  height: 10px;
  background-color: currentColor;
  opacity: 0.7;
}
.multiCodeItem > .btnDel::before {
  transform: rotate(45deg);
}
.multiCodeItem > .btnDel::after {
  transform: rotate(-45deg);
}

.layoutControl.FloatBox input {
  text-align: right;
  letter-spacing: 0px;
}
.layoutControl.MaskBox input {
  letter-spacing: 0px;
}
.layoutControl.MaskBox.Error > input {
  border-color: var(--errorColor);
  color: var(--errorColor);
}
.layoutControl.DateBox > input {
  padding: 0 2px;
  letter-spacing: -0.57px;
}
.layoutControl.DateBox > input.typeHyphen {
  letter-spacing: -1.15px;
}
.layoutControl.DateBox.Value > input {
  background-image: none;
}
.layoutControl.DateBox .btnDateControl {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 21px;
  height: 100%;
  background-color: var(--BgColorGrey);
  cursor: pointer;
}
.layoutControl.DateBox .btnDateControl .iconDateControl {
  width: 5px;
  height: 9px;
  background-position: -139px -3px;
}
.layoutControl.DateBox .btnDateControl.Next {
  margin-left: 4px;
}
.layoutControl.DateBox .btnDateControl.Next .iconDateControl {
  background-position: -160px -3px;
}
.layoutControl.DateBox .btnDateControl:hover {
  background-color: #d1d1d1;
  cursor: pointer;
}
.layoutControl.DateBox.Error > input {
  border-color: var(--errorColor);
  color: var(--errorColor);
}
.layoutControl[kui-pmonth] .monthSelect, .layoutControl[kui-pday] .monthSelect, .layoutControl[kui-piday] .monthSelect {
  position: relative;
  border-radius: 3px;
}
.layoutControl[kui-pmonth] .monthSelect ul, .layoutControl[kui-pday] .monthSelect ul, .layoutControl[kui-piday] .monthSelect ul {
  display: inline-flex;
  flex-wrap: wrap;
  width: 337px;
  min-height: 29px;
  box-shadow: 1px 0 0 inset var(--BorderGrey), -1px 0 0 inset var(--BorderGrey), 0px -1px 0 inset var(--BorderGrey), 0px 1px 0 inset var(--BorderGrey);
  border-radius: 3px 0 0 3px;
  background-color: var(--MainBgColor);
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow: hidden;
}
.layoutControl[kui-pmonth] .monthSelect ul li, .layoutControl[kui-pday] .monthSelect ul li, .layoutControl[kui-piday] .monthSelect ul li {
  display: flex;
  align-items: center;
  flex-direction: column;
  flex-shrink: 0;
  width: 28px;
  height: 100%;
  min-height: 29px;
  font-size: var(--fs14);
  line-height: 14px;
  box-shadow: 0 -1px 0 0px inset var(--BorderGrey), -1px 0px 0 0px var(--BorderGrey);
  cursor: pointer;
}
.layoutControl[kui-pmonth] .monthSelect ul li > .month, .layoutControl[kui-pday] .monthSelect ul li > .month, .layoutControl[kui-piday] .monthSelect ul li > .month {
  display: block;
  width: 100%;
  height: 13px;
  text-align: center;
  font-size: var(--fs14);
  font-weight: normal;
  transform: scale(0.75);
  color: rgba(var(--MainFontColor-rgb), 0.6);
  letter-spacing: 1px !important;
}
.layoutControl[kui-pmonth] .monthSelect ul li > .month + .number, .layoutControl[kui-pday] .monthSelect ul li > .month + .number, .layoutControl[kui-piday] .monthSelect ul li > .month + .number {
  height: 11px;
}
.layoutControl[kui-pmonth] .monthSelect ul li > .number, .layoutControl[kui-pday] .monthSelect ul li > .number, .layoutControl[kui-piday] .monthSelect ul li > .number {
  display: flex;
  align-items: center;
  height: 100%;
}
.layoutControl[kui-pmonth] .monthSelect ul li:last-child, .layoutControl[kui-pday] .monthSelect ul li:last-child, .layoutControl[kui-piday] .monthSelect ul li:last-child {
  box-shadow: 0 -1px 0 0px inset var(--BorderGrey), -1px 0px 0 0px var(--BorderGrey), -1px 0px 0 inset var(--BorderGrey);
}
.layoutControl[kui-pmonth] .monthSelect ul li.selected, .layoutControl[kui-pday] .monthSelect ul li.selected, .layoutControl[kui-piday] .monthSelect ul li.selected {
  background-color: rgba(var(--SubColor1), 0.2);
  color: var(--SubColor1);
  font-weight: bolder;
}
.layoutControl[kui-pmonth] .monthSelect ul li.selected > .month, .layoutControl[kui-pday] .monthSelect ul li.selected > .month, .layoutControl[kui-piday] .monthSelect ul li.selected > .month {
  color: currentColor;
}
.layoutControl[kui-pmonth] .monthSelect .pointer, .layoutControl[kui-pday] .monthSelect .pointer, .layoutControl[kui-piday] .monthSelect .pointer {
  position: absolute;
  top: 0px !important;
  width: 28px;
  height: 29px;
  border: 2px solid var(--SubColor1);
  cursor: pointer;
}
.layoutControl[kui-pmonth] .monthSelect .pointer[id*=dragdown], .layoutControl[kui-pday] .monthSelect .pointer[id*=dragdown], .layoutControl[kui-piday] .monthSelect .pointer[id*=dragdown] {
  top: 29px !important;
}
.layoutControl[kui-pmonth] .monthSelect .pointer .dragPointLeft, .layoutControl[kui-pmonth] .monthSelect .pointer .dragPointRight, .layoutControl[kui-pday] .monthSelect .pointer .dragPointLeft, .layoutControl[kui-pday] .monthSelect .pointer .dragPointRight, .layoutControl[kui-piday] .monthSelect .pointer .dragPointLeft, .layoutControl[kui-piday] .monthSelect .pointer .dragPointRight {
  position: absolute;
  top: 6px;
  width: 5px;
  height: 10px;
  border: 1px solid var(--SubColor1);
  border-radius: 1px;
  background-color: var(--MainBgColor);
  cursor: e-resize;
}
.layoutControl[kui-pmonth] .monthSelect .pointer .dragPointLeft, .layoutControl[kui-pday] .monthSelect .pointer .dragPointLeft, .layoutControl[kui-piday] .monthSelect .pointer .dragPointLeft {
  left: -4px;
}
.layoutControl[kui-pmonth] .monthSelect .pointer .dragPointRight, .layoutControl[kui-pday] .monthSelect .pointer .dragPointRight, .layoutControl[kui-piday] .monthSelect .pointer .dragPointRight {
  right: -4px;
}
.layoutControl[kui-pmonth] .monthSelect .btnMonthQuery, .layoutControl[kui-pday] .monthSelect .btnMonthQuery, .layoutControl[kui-piday] .monthSelect .btnMonthQuery {
  position: absolute;
  right: -27px;
  bottom: 0;
  display: inline-block;
  width: 28px;
  height: 29px;
  border-radius: 0;
  background-color: var(--ButtonBgColor);
  background-position: -165px 8px;
  z-index: 10;
  cursor: pointer;
}
.layoutControl[kui-pmonth] .monthSelect .btnMonthQuery:hover, .layoutControl[kui-pday] .monthSelect .btnMonthQuery:hover, .layoutControl[kui-piday] .monthSelect .btnMonthQuery:hover {
  filter: contrast(130%);
}
.layoutControl[kui-pmonth] .daySelect, .layoutControl[kui-pday] .daySelect, .layoutControl[kui-piday] .daySelect {
  position: relative;
}
.layoutControl[kui-pmonth] .daySelect ul, .layoutControl[kui-pday] .daySelect ul, .layoutControl[kui-piday] .daySelect ul {
  width: 448px;
  height: 58px;
  border-radius: 3px;
}
.layoutControl[kui-pmonth] .daySelect ul li, .layoutControl[kui-pday] .daySelect ul li, .layoutControl[kui-piday] .daySelect ul li {
  height: 29px;
  box-shadow: 0 -1px 0 0px inset var(--BorderGrey), 1px 0px 0 0px inset var(--BorderGrey);
}
.layoutControl[kui-pday] .btnMonthQuery {
  right: 0 !important;
}

.layoutControl[kui-checkbox] .selectArea, .layoutControl[kui-optionlist] .selectArea {
  display: none;
}
.layoutControl[kui-checkbox] .check, .layoutControl[kui-optionlist] .check {
  position: relative;
  width: 100%;
  text-align: left;
}
.layoutControl[kui-checkbox] .check > input[type=checkbox] + label, .layoutControl[kui-optionlist] .check > input[type=checkbox] + label {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: fit-content;
  font-size: 1em;
  line-height: 1.167em;
  white-space: nowrap;
}
.layoutControl[kui-checkbox] .check > input[type=checkbox] + label::before, .layoutControl[kui-optionlist] .check > input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  width: 1.25em;
  height: 1.25em;
  margin-right: 5px;
  border-radius: 3px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
}
.layoutControl[kui-checkbox] .check > input[type=checkbox]:focus + label, .layoutControl[kui-optionlist] .check > input[type=checkbox]:focus + label {
  outline: 1px solid var(--ControlBorderColorFocus);
}
.layoutControl[kui-checkbox] .check > input[type=checkbox]:checked + label::after, .layoutControl[kui-optionlist] .check > input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: 0.333em;
  left: 0.333em;
  width: 0.6em;
  height: 0.333em;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
}
.layoutControl[kui-checkbox] .check > input[type=checkbox]:checked + label::before, .layoutControl[kui-optionlist] .check > input[type=checkbox]:checked + label::before {
  border: 1px solid var(--MainColor);
  background-color: var(--MainColor);
}
.layoutControl[kui-checkbox] .check:focus > input[type=checkbox] + label, .layoutControl[kui-optionlist] .check:focus > input[type=checkbox] + label {
  outline: 1px solid var(--ControlBgColorSelected);
}
.layoutControl[kui-checkbox] .check.labelNon > input[type=checkbox] + label, .layoutControl[kui-optionlist] .check.labelNon > input[type=checkbox] + label {
  color: var(--ControlFontColorNon);
}
.layoutControl[kui-checkbox].Dis .check, .layoutControl[kui-optionlist].Dis .check {
  pointer-events: none;
}
.layoutControl[kui-checkbox].Dis .check > input[type=checkbox] + label, .layoutControl[kui-optionlist].Dis .check > input[type=checkbox] + label {
  cursor: not-allowed !important;
  color: var(--ControlFontColorDis);
}
.layoutControl[kui-checkbox].Dis .check > input[type=checkbox] + label::before, .layoutControl[kui-optionlist].Dis .check > input[type=checkbox] + label::before {
  background-color: var(--ControlBgColorDis);
  border: 1px solid var(--ControlBorderColorDis);
}
.layoutControl[kui-checkbox].Dis .check > input[type=checkbox]:checked + label::after, .layoutControl[kui-optionlist].Dis .check > input[type=checkbox]:checked + label::after {
  border-color: #999;
}
.layoutControl[kui-checkbox] {
  align-items: center;
}
.layoutControl[kui-optionlist] {
  align-items: flex-start;
}
.layoutControl[kui-optionlist] .controlOption {
  position: relative;
  height: 100%;
  padding-top: 10px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
  padding: 8px 5px;
}
.layoutControl[kui-optionlist] .controlOption .title {
  font-size: var(--fs13);
  line-height: 1em;
  min-height: 10px;
  color: var(--MainFontColor);
}
.layoutControl[kui-optionlist] .controlOption .controlOptionList {
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 100%;
  margin-top: 2px;
}
.layoutControl[kui-optionlist] .controlOption .controlOptionList .check {
  margin-right: 10px;
}
.layoutControl[kui-optionlist] .controlOption .controlOptionList.Vertical, .layoutControl[kui-optionlist] .controlOption .controlOptionList.vertical {
  flex-direction: column;
  align-items: flex-start;
  margin-top: 5px;
}
.layoutControl[kui-optionlist] .controlOption .controlOptionList.Vertical .radio, .layoutControl[kui-optionlist] .controlOption .controlOptionList.Vertical .check, .layoutControl[kui-optionlist] .controlOption .controlOptionList.vertical .radio, .layoutControl[kui-optionlist] .controlOption .controlOptionList.vertical .check {
  margin-bottom: 3px;
}
.layoutControl[kui-optionlist] .controlOption .controlOptionList.Vertical .radio label, .layoutControl[kui-optionlist] .controlOption .controlOptionList.Vertical .check label, .layoutControl[kui-optionlist] .controlOption .controlOptionList.vertical .radio label, .layoutControl[kui-optionlist] .controlOption .controlOptionList.vertical .check label {
  margin: 0;
}
.layoutControl[kui-optionlist] .controlOption.TitleHidden {
  padding-top: 3px;
}
.layoutControl[kui-optionlist] .controlOption.TitleHidden .title {
  display: none;
}
.layoutControl[kui-optionlist] .controlOption.TitleHidden .Vertical, .layoutControl[kui-optionlist] .controlOption.TitleHidden.vertical {
  margin-top: 0;
}
.layoutControl[kui-optionlist] .controlOption.NotBorderLine {
  padding: 0 !important;
  border: 0;
}
.layoutControl[kui-optionlist] .radio {
  position: relative;
  display: flex;
  align-items: center;
  text-align: left;
  margin-right: 5px;
}
.layoutControl[kui-optionlist] .radio input[type=radio] {
  margin-right: 3px;
}
.layoutControl[kui-optionlist] .radio input[type=radio] + label {
  display: flex;
  align-items: center;
  position: relative;
  margin: 1px 0 0 0px;
  font-size: 1em;
  white-space: nowrap;
}
.layoutControl[kui-optionlist] .radio input[type=radio] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  width: 1.167em;
  height: 1.167em;
  margin-right: 0.167em;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 50%;
  background-color: var(--ControlFontColorSelected);
  box-sizing: border-box;
}
.layoutControl[kui-optionlist] .radio input[type=radio]:focus + label {
  outline: 1px auto var(--ControlBgColorSelected);
}
.layoutControl[kui-optionlist] .radio input[type=radio]:checked + label::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.333em);
  left: 0.25em;
  width: 0.667em;
  height: 0.667em;
  border-radius: 50%;
  background-color: var(--ControlBgColorSelected);
  transform: rotate(-45deg);
  box-sizing: border-box;
}
.layoutControl[kui-optionlist] .multiRadio {
  display: flex;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  padding-left: 1px;
  color: var(--MainFontColor);
  line-height: 0.5em;
}
.layoutControl[kui-optionlist] .multiRadio .controlOption {
  display: flex;
  flex-wrap: wrap;
  flex: 1;
  height: calc(100% - 4px);
}
.layoutControl[kui-optionlist] .multiRadio .controlOption .title {
  flex-shrink: 0;
  width: fit-content;
  max-width: unset !important;
  min-height: 12px;
  margin-top: -13px;
  padding: 0 2px;
  background-color: var(--MainBgColor);
}
.layoutControl[kui-optionlist] .multiRadio .controlOption.TitleHidden {
  height: 100%;
}
.layoutControl[kui-optionlist] .multiRadio .controlOption.TitleHidden .title {
  display: none;
}
.layoutControl[kui-optionlist].Dis .radio {
  pointer-events: none;
}
.layoutControl[kui-optionlist].Dis .radio input[type=radio] + label {
  color: var(--ControlFontColorDis);
  cursor: not-allowed !important;
}
.layoutControl[kui-optionlist].Dis .radio input[type=radio] + label::before {
  background-color: var(--ControlBgColorDis);
}
.layoutControl[kui-optionlist].Dis .radio input[type=radio] + label::after {
  border-color: var(--ControlBorderColorDis);
}
.layoutControl[kui-optionlist].labelNon .controlOption .title {
  color: var(--ControlFontColorNon);
}
.layoutControl[kui-optionlist].labelNon .controlOption .controlOptionList:first-child input + label {
  color: var(--ControlFontColorNon);
}
.layoutControl[kui-optionlist].labelNon .controlOption:not(:has(.title)) .controlOptionList input + label {
  color: var(--ControlFontColorNon);
}
.layoutControl[kui-optionlist].labelNon .controlOption.TitleHidden .controlOptionList input + label {
  color: var(--ControlFontColorNon);
}
.layoutControl[kui-button] {
  background-position: -1000px;
}
.layoutControl[kui-button] button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 14px;
  margin-left: 0;
  padding: 0 3px;
  border-radius: 3px;
  background-color: var(--ButtonBgColor);
  color: var(--ButtonFontColor);
  font-size: 1em;
  font-weight: 600;
  -webkit-appearance: none;
  z-index: 0;
  cursor: pointer;
}
.layoutControl[kui-button] button:hover, .layoutControl[kui-button] button:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.layoutControl[kui-button] button:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.layoutControl[kui-button].ButtonGreen button {
  background-color: var(--colorGreen);
}
.layoutControl[kui-button].ButtonOrange button {
  background-color: var(--colorOrange);
}
.layoutControl[kui-button].ButtonGrey button {
  background-color: var(--colorGrey);
}
.layoutControl[kui-button].Error button {
  border: 2px solid var(--ControlBorderColor) Error;
  background-color: var(--ControlBgColor) Error;
  color: var(--ControlCaptionFontColorError);
  font-weight: bold;
  cursor: not-allowed;
}
.layoutControl[kui-button].Dis {
  cursor: not-allowed !important;
}
.layoutControl[kui-button].Dis button {
  border: 1px solid var(--ControlBorderColorDis) !important;
  background-color: #e8e8e8 !important;
  color: var(--ControlFontColorDis) !important;
  cursor: not-allowed !important;
}
.layoutControl[kui-button].Dis button:hover {
  background-color: #e8e8e8 !important;
  box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px !important;
  cursor: not-allowed !important;
}
.layoutControl.Dis > input {
  border: 1px solid var(--ControlBorderColorDis) !important;
  background-color: var(--ControlBgColorDis) !important;
  background-image: none !important;
  color: var(--ControlFontColorDis);
  cursor: not-allowed;
}
.layoutControl.Dis > input:hover, .layoutControl.Dis > input:focus {
  border: 1px solid var(--ControlBorderColorDis) !important;
  background-color: var(--ControlBgColorDis) !important;
  color: var(--ControlFontColorDis);
  box-shadow: none;
  cursor: not-allowed !important;
}
.layoutControl.Dis > textarea {
  border: 1px solid var(--ControlBorderColorDis) !important;
  background-color: var(--ControlBgColorDis) !important;
  color: var(--ControlFontColorDis);
}
.layoutControl.Dis > textarea:hover, .layoutControl.Dis > textarea:focus {
  border: 1px solid var(--ControlBorderColorDis) !important;
  background-color: var(--ControlBgColorDis) !important;
  color: var(--ControlFontColorDis);
  font-weight: normal;
  box-shadow: none;
  cursor: default !important;
}
.layoutControl.Dis > .comboBox > select {
  border: 1px solid var(--ControlBorderColorDis) !important;
  background-color: var(--ControlBgColorDis) !important;
  color: var(--ControlFontColorDis);
}
.layoutControl.Dis > .btnDelValue {
  display: none;
}

.btnKbotControl {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-right: 5px;
  border-radius: 4px;
  background: linear-gradient(90deg, #9b2fe7, #695feb);
  cursor: pointer;
}

.layoutControl[kui-button].kbot .btnKbotControl {
  margin-left: 5px;
}
.layoutControl[kui-button].AI > button {
  background: linear-gradient(122deg, #6C68EC 6.2%, #604AE9 50.88%, #A928E6 101.26%);
}
.layoutControl[kui-button].AI > button::before {
  content: "";
  width: 12px;
  height: 12px;
  margin-right: 5px;
}
.layoutControl[kui-button].AI.Dis > button {
  background: unset;
}
.layoutControl[kui-optionlist].kbot .controlOption .title {
  display: flex;
  align-items: center;
}
.layoutControl[kui-pmonth].kbot .btnKbotControl {
  position: absolute;
  top: 7px;
  right: -20px;
}

.upload {
  position: absolute;
  width: 100%;
  height: 100%;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
  background-color: var(--MainBgColor);
  box-sizing: border-box;
}
.upload > .scrollArea {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
.upload > .scrollArea .uploadFileList {
  width: 100%;
  height: 100% !important;
}
.upload > .scrollArea .uploadFileList.btn3 > li .left {
  max-width: calc(100% - 90px);
}
.upload > .scrollArea .uploadFileList > li {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 0px 4px 30px;
  background-color: transparent;
  overflow: hidden;
  cursor: pointer;
}
.upload > .scrollArea .uploadFileList > li:last-child {
  border-bottom: 0;
}
.upload > .scrollArea .uploadFileList > li > .itemArea {
  width: 100%;
}
.upload > .scrollArea .uploadFileList > li .icon {
  position: absolute;
  left: 5px;
  top: calc(50% - 10px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-right: 5px;
  color: var(--FileUploadTypeFontColor);
  cursor: pointer;
}
.upload > .scrollArea .uploadFileList > li .icon.Pdf {
  background-position: -192px -74px;
}
.upload > .scrollArea .uploadFileList > li .icon.Hwp {
  background-position: -192px -102px;
}
.upload > .scrollArea .uploadFileList > li .icon.Excel {
  background-position: -192px -130px;
}
.upload > .scrollArea .uploadFileList > li .icon.Ppt {
  background-position: -192px -158px;
}
.upload > .scrollArea .uploadFileList > li .icon.Word {
  background-position: -192px -186px;
}
.upload > .scrollArea .uploadFileList > li .icon.Img {
  background-position: -192px -214px;
}
.upload > .scrollArea .uploadFileList > li .icon.Etc {
  background-position: -192px -242px;
}
.upload > .scrollArea .uploadFileList > li .left {
  display: flex;
  align-items: center;
  max-width: calc(100% - 60px);
  overflow: hidden;
}
.upload > .scrollArea .uploadFileList > li .left .txtName {
  display: block;
  width: 100%;
  color: var(--FileUploadFontColor);
  font-size: var(--fs13);
  line-height: 16px;
  word-break: break-all;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upload > .scrollArea .uploadFileList > li .left .txtName:hover {
  cursor: pointer;
  color: #323232;
  font-weight: bold;
}
.upload > .scrollArea .uploadFileList > li .left .txtName:focus-visible {
  text-decoration: underline;
}
.upload > .scrollArea .uploadFileList > li .btnPreview {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 0;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-left: 5px;
  border-radius: 5px;
  background-color: #f3f3f3;
}
.upload > .scrollArea .uploadFileList > li .btnPreview > i {
  width: 10px;
  height: 11px;
  background-position: -194px -54px;
}
.upload > .scrollArea .uploadFileList > li .btnPreview:hover {
  background-color: #e1e1e1;
}
.upload > .scrollArea .uploadFileList > li .btnPreview:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.upload > .scrollArea .uploadFileList > li .txtRemark {
  margin-left: 5px;
  color: #343434;
  font-size: 11px;
  max-width: calc(100% - 300px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upload > .scrollArea .uploadFileList > li .right {
  display: flex;
  justify-content: flex-end;
  flex-shrink: 0;
  margin-left: auto;
  padding-left: 10px;
  overflow: hidden;
}
.upload > .scrollArea .uploadFileList > li .right .txtSize > span, .upload > .scrollArea .uploadFileList > li .right .txtDate > span {
  display: inline-block;
  margin-right: 5px;
  font-size: 11px;
  color: #343434;
  letter-spacing: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upload > .scrollArea .uploadFileList > li .right .txtDate {
  position: relative;
}
.upload > .scrollArea .uploadFileList > li .right .txtDate::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  width: 1px;
  height: 10px;
  background-color: #ccc;
}
.upload > .scrollArea .uploadFileList > li .right .txtDate > span {
  padding-left: 6px;
}
.upload > .scrollArea .uploadFileList > li .fileUploadToolbar {
  display: flex;
  flex-shrink: 0;
}
.upload > .scrollArea .uploadFileList > li .fileUploadToolbar .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 0;
  flex-shrink: 0;
  width: 23px;
  height: 20px;
  border-radius: 5px;
}
.upload > .scrollArea .uploadFileList > li .fileUploadToolbar .btn:hover {
  background-color: #e1e1e1;
  cursor: pointer;
  opacity: 1;
}
.upload > .scrollArea .uploadFileList > li .fileUploadToolbar .btn:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.upload > .scrollArea .uploadFileList > li .fileUploadToolbar .btn.Del > i {
  width: 14px;
  height: 13px;
  background-position: -194px 0;
}
.upload > .scrollArea .uploadFileList > li .fileUploadToolbar .btn.Edit > i {
  width: 12px;
  height: 12px;
  background-position: -194px -18px;
}
.upload > .scrollArea .uploadFileList > li .fileUploadToolbar .btn.Link > i {
  width: 13px;
  height: 13px;
  background-position: -194px -35px;
}
.upload > .scrollArea .uploadFileList > li:hover {
  background-color: #f9f9f9;
}
.upload > .scrollArea .uploadFileList > li:hover .fileUploadToolbar {
  visibility: visible;
}
.upload > .scrollArea .uploadFileList > li.Error .icon {
  background-color: var(--ControlFontColorError) !important;
}
.upload > .scrollArea .uploadFileList > li.Error .txtName {
  color: var(--ControlFontColorError) !important;
}
.upload > .scrollArea .uploadFileList > li.includeFile {
  padding-left: 5px;
  cursor: default;
}
.upload > .scrollArea .uploadFileList > li.includeFile .check > input[type=checkbox] {
  display: none;
}
.upload > .scrollArea .uploadFileList > li.includeFile .check > input[type=checkbox] + label {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  font-size: var(--fs13);
}
.upload > .scrollArea .uploadFileList > li.includeFile .check > input[type=checkbox] + label > i {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
}
.upload > .scrollArea .uploadFileList > li.includeFile .check > input[type=checkbox]:checked + label > i {
  border-color: var(--MainColor);
}
.upload > .scrollArea .uploadFileList > li.includeFile .check > input[type=checkbox]:checked + label > i::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 3px;
  width: 8px;
  height: 4px;
  border-left: 2px solid var(--MainColor);
  border-bottom: 2px solid var(--MainColor);
  transform: rotate(-45deg);
}
.upload .uploadNoFile {
  position: absolute;
  top: -1px;
  left: -1px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border: 1px dashed var(--ControlBorderColor);
  border-radius: 3px;
  background-color: var(--FileUploadBg);
  overflow: hidden;
}
.upload .uploadNoFile::before {
  content: "";
  width: 95%;
  height: 95%;
  min-width: 100px;
  min-height: 26px;
  max-width: 180px;
  max-height: 58px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.upload.Dis .uploadNoFile {
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColorDis);
}
.upload.Dis .uploadNoFile::before {
  content: "";
  width: 95%;
  height: 95%;
  min-width: 25px;
  min-height: 20px;
  max-width: 57px;
  max-height: 52px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.upload.Dis .fileBtnWrap {
  left: calc(50% - 12.5px);
  width: 25px;
}
.upload.Dis .fileBtnWrap .fileBtnArea .btnMore {
  display: none;
}
.upload.Dis .fileBtnWrap .fileBtnArea .btnGroup {
  display: flex;
}
.upload.Dis .fileBtnWrap .fileBtnArea .btnGroup > a {
  display: none;
}
.upload.Dis .fileBtnWrap .fileBtnArea .btnGroup > a.btnDownloadAll {
  display: flex;
  border-bottom-right-radius: 5px;
}
.upload .fileBtnWrap {
  position: absolute;
  top: -2px;
  left: calc(50% - 37.5px);
  display: flex;
  justify-content: center;
  width: 75px;
  height: 25px;
}
.upload .fileBtnWrap .fileBtnArea {
  display: flex;
}
.upload .fileBtnWrap .fileBtnArea .btnGroup {
  display: none;
  border-radius: 0 0 5px 5px;
  box-shadow: rgba(0, 0, 0, 0.15) 3px 3px 4px;
}
.upload .fileBtnWrap .fileBtnArea a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  padding: 0;
  background-color: var(--FileUploadBtnBg);
  color: var(--FileUploadBtnFontColor);
  font-size: var(--fs13);
}
.upload .fileBtnWrap .fileBtnArea a::before {
  content: "";
}
.upload .fileBtnWrap .fileBtnArea a:hover {
  background-color: #abc1cf;
  cursor: pointer;
}
.upload .fileBtnWrap .fileBtnArea a.btnMore {
  border-radius: 0 0 5px 5px;
  box-shadow: rgba(0, 0, 0, 0.15) 3px 3px 4px;
}
.upload .fileBtnWrap .fileBtnArea a.btnMore::before {
  width: 13px;
  height: 3px;
  background-position: -171px -87px;
}
.upload .fileBtnWrap .fileBtnArea a.btnDownloadAll {
  border-radius: 0 0 0 5px;
}
.upload .fileBtnWrap .fileBtnArea a.btnDownloadAll::before {
  width: 11px;
  height: 12px;
  background-position: -172px -23px;
}
.upload .fileBtnWrap .fileBtnArea a.btnAddFile::before {
  width: 11px;
  height: 11px;
  background-position: -172px -44px;
}
.upload .fileBtnWrap .fileBtnArea a.btnDeleteAll {
  border-radius: 0 0 5px 0;
}
.upload .fileBtnWrap .fileBtnArea a.btnDeleteAll::before {
  width: 13px;
  height: 14px;
  background-position: -171px -64px;
}
.upload .fileBtnWrap .fileBtnArea:hover .btnMore {
  display: none;
}
.upload .fileBtnWrap .fileBtnArea:hover .btnGroup {
  display: flex;
}
.upload .fileBtnWrap.noneFile {
  left: calc(50% - 12.5px);
  width: 25px;
}
.upload .fileBtnWrap.noneFile .fileBtnArea .btnMore::before {
  width: 11px;
  height: 11px;
  background-position: -172px -44px;
}
.upload .fileBtnWrap.noneFile .btnDownloadAll, .upload .fileBtnWrap.noneFile .btnDeleteAll {
  display: none;
}
.upload .fileBtnWrap.noneFile .btnAddFile {
  border-radius: 0 0 5px 5px;
}
.upload .fileUploadLoading {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.7);
}
.upload .fileUploadLoading > .barArea {
  display: inline-block;
  width: 80px;
  border-radius: 10px;
  background-color: #d6ebdf;
}
.upload .fileUploadLoading .bar {
  width: 15px;
  height: 6px;
  border-radius: 3px;
  background-color: var(--MainColor);
  animation: loadingFileUpload 2s cubic-bezier(0.17, 0.37, 0.43, 0.67) infinite;
}
@keyframes loadingFileUpload {
  0%, 100% {
    transform: translate(0, 0);
  }
  50% {
    width: 30px;
    background-color: var(--ControlBorderColorFocus);
    transform: translate(50px, 0);
  }
}
.upload .uploadFileTooltip {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 400px;
  max-width: 400px;
  padding: 10px;
  border: 1px solid var(--BorderGreyLight);
  background-color: var(--MainBgColor);
  box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 20px;
  z-index: 1;
}
.upload .uploadFileTooltip .uploadContentBox {
  position: relative;
  height: 100%;
}
.upload .uploadFileTooltip .uploadContentBox > .txtName {
  margin-bottom: 10px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  font-weight: bold;
  letter-spacing: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upload .uploadFileTooltip .uploadContentBox > .txtName .filename {
  font-weight: normal;
}
.upload .uploadFileTooltip .uploadContentBox .fileComment {
  display: flex;
  height: 30px;
}
.upload .uploadFileTooltip .uploadContentBox .inputText {
  width: 100%;
  height: 100%;
  padding: 5px 10px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 3px;
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  font-size: var(--fs13);
  transition: all 0.3s;
}
.upload .uploadFileTooltip .uploadContentBox .inputText:hover {
  border-color: var(--MainColor);
}
.upload .uploadFileTooltip .uploadContentBox .btnArea {
  display: flex;
  align-items: center;
}
.upload .uploadFileTooltip .uploadContentBox .btnArea input[type=button], .upload .uploadFileTooltip .uploadContentBox .btnArea button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-width: 65px;
  margin-left: 5px;
  padding: 0 10px;
  border: 0;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  font-size: var(--fs13);
  transition: all 0.3s;
}
.upload .uploadFileTooltip .uploadContentBox .btnArea input[type=button].btnDefault, .upload .uploadFileTooltip .uploadContentBox .btnArea button.btnDefault {
  background-color: var(--MainColor);
  color: #fff;
}
.upload .uploadFileTooltip .uploadContentBox .btnArea input[type=button].btnDefault:hover, .upload .uploadFileTooltip .uploadContentBox .btnArea button.btnDefault:hover {
  background-color: var(--ButtonDefaultColorHover);
  cursor: pointer;
}
.upload .uploadFileTooltip .uploadContentBox .btnArea input[type=button].btnDefault:active, .upload .uploadFileTooltip .uploadContentBox .btnArea button.btnDefault:active {
  background-color: var(--ButtonDefaultColorActive);
  cursor: pointer;
}
.upload .uploadFileTooltip .uploadContentBox .btnArea input[type=button].btnLine, .upload .uploadFileTooltip .uploadContentBox .btnArea button.btnLine {
  border: 1px solid var(--BorderGreyLight);
  background-color: transparent;
  color: var(--MainColor);
}
.upload .uploadFileTooltip .uploadContentBox .btnArea input[type=button].btnLine:hover, .upload .uploadFileTooltip .uploadContentBox .btnArea button.btnLine:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.upload .uploadFileTooltip .uploadContentBox .btnArea input[type=button].btnLine:active, .upload .uploadFileTooltip .uploadContentBox .btnArea button.btnLine:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  border-color: rgba(var(--MainColor-rgb), 0.15);
  cursor: pointer;
}
.upload .uploadNotice {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(var(--MainFontColor-rgb), 0.4);
}
.upload .uploadNotice > p {
  width: 100%;
  font-weight: bold;
  font-size: var(--fs17);
  text-align: center;
  color: var(--ControlFontColorFocus);
}
.upload .fileUploadError {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.upload .fileUploadError > .txtMsg {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 11px;
  border-radius: 13px;
  background-color: rgba(var(--colorRed-rgb), 0.8);
  color: var(--ControlBgColor);
  font-size: var(--fs11);
  font-weight: bold;
}
.upload .fileUploadError > .txtMsg::before {
  content: "!";
  margin: 0 3px 0 0;
  font-weight: bold;
}
.upload .boxInfo {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  margin: 0 auto 20px auto;
  padding: 10px 30px;
  border: 1px dashed var(--BorderGrey);
  border-radius: 5px;
  background-color: rgba(242, 250, 255, 0.7);
  font-size: var(--fs14);
  z-index: 999;
  cursor: pointer;
}
.upload .boxInfo p {
  padding: 10px;
  border-radius: 5px;
  background-color: rgba(51, 51, 51, 0.8);
  color: var(--InvertFontColor);
  text-align: center;
}
.upload.notiFileUpload {
  display: flex;
  flex-direction: column;
}
.upload.notiFileUpload .notiFileInfo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 35px;
  padding: 0 5px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  font-weight: bold;
}
.upload.notiFileUpload .notiFileInfo .iconLink {
  width: 17px;
  height: 15px;
  margin-right: 5px;
  background-position: -190px -33px;
}

.divTree {
  width: 100%;
  height: 100%;
}
.divTree .tree {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 5px;
  border: 1px solid var(--TreeBorderColor);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  box-sizing: border-box;
  overflow: auto;
}
.divTree .tree .ulTreeBtn {
  height: 20px;
}
.divTree .tree .ulTreeBtn li.treeBtn {
  text-align: right;
}
.divTree .tree .ulTreeBtn li.treeBtn .treeOpenBtn {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: 0 0;
}
.divTree .tree .ulTreeBtn li.treeBtn .treeOpenBtn:hover, .divTree .tree .ulTreeBtn li.treeBtn .treeOpenBtn:focus {
  background-position: 0 -24px;
  cursor: pointer;
}
.divTree .tree .ulTreeBtn li.treeBtn .treeCloseBtn {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: 0px -49px;
}
.divTree .tree .ulTreeBtn li.treeBtn .treeCloseBtn:hover, .divTree .tree .ulTreeBtn li.treeBtn .treeCloseBtn:focus {
  background-position: 0px -75px;
  cursor: pointer;
}
.divTree .tree .ulTreeDepth {
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow-x: hidden;
}
.divTree .tree .ulTreeDepth li {
  display: flex;
  flex-wrap: wrap;
  padding-left: 17px;
}
.divTree .tree .ulTreeDepth li > a {
  display: inline-flex;
  align-items: center;
}
.divTree .tree .ulTreeDepth li > .collapseIcon {
  display: inline-flex;
  width: 20px;
  height: 20px;
}
.divTree .tree .ulTreeDepth li .treeItem {
  width: calc(100% - 20px);
  white-space: nowrap;
}
.divTree .tree .ulTreeDepth li .treeItem .txtName {
  color: var(--ControlFontColor);
  font-size: var(--fs13);
  letter-spacing: 0px;
}
.divTree .tree .ulTreeDepth li .treeItem .txtName .icon {
  margin-bottom: -5px;
}
.divTree .tree .ulTreeDepth li .treeItem span {
  color: var(--ControlFontColor);
  font-size: var(--fs13);
  letter-spacing: 0px;
}
.divTree .tree .ulTreeDepth li .treeItem:hover, .divTree .tree .ulTreeDepth li .treeItem:focus {
  background-color: #d1d1d1;
  cursor: pointer;
}
.divTree .tree .ulTreeDepth li .treeItem.selected {
  background-color: var(--TreeSelectedBg);
  color: var(--ControlBgColorSelected);
  cursor: pointer;
}
.divTree .tree .ulTreeDepth li > ul {
  width: 100%;
}
.divTree .tree .ulTreeDepth li.treeOpen > .collapseIcon {
  background-position: -20px -1px;
}
.divTree .tree .ulTreeDepth li.treeClose > .collapseIcon {
  background-position: -20px -29px;
}
.divTree .tree .ulTreeDepth > li {
  padding-left: 0;
}
.divTree .tree .ulTreeDepth.treeCheckbox li > .treeItem {
  width: calc(100% - 40px);
}

.divImg {
  position: relative;
  width: 100%;
  height: 100%;
  border: 1px solid var(--ImgBorder);
  border-radius: 5px;
  background-color: var(--ImgBg);
  text-align: center;
  overflow: hidden;
}
.divImg > img {
  width: 100%;
  height: 100%;
  border: 0px;
}
.divImg > .imgHover {
  visibility: collapse;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 56px;
  height: 56px;
  transform: translate(-50%, -50%);
}
.divImg > .imgHover > span {
  display: inline-block;
  width: 25px;
  height: 25px;
  margin: 0 3px 3px 0;
  border-radius: 50%;
  background-color: var(--ImgBtnBg);
}
.divImg > .imgHover > span:hover {
  background-color: #111213;
  cursor: pointer;
}
.divImg > .imgHover > span.Add {
  background-position: 6px -119px;
}
.divImg > .imgHover > span.Del {
  background-position: 7px -151px;
}
.divImg > .imgHover > span.Down {
  background-position: 6px -183px;
}
.divImg > .imgHover > span.Expander {
  background-position: 7px -213px;
}
.divImg:hover .imgHover {
  cursor: pointer;
  visibility: visible;
}
.divImg.NoImg > img {
  visibility: collapse;
}

.popupCalendarWrap {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-top: 50px;
  text-align: center;
  z-index: 60;
}
.popupCalendarWrap .popupCalendar {
  position: absolute;
  width: 230px;
  border: 1px solid var(--MainColor);
  border-radius: 3px;
  background-color: var(--MainBgColor);
}
.popupCalendarWrap .popupCalendar .txtTitleArea {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  background-color: var(--ControlFontColorFocus);
  color: var(--ControlBgColorFocus);
  text-align: center;
}
.popupCalendarWrap .popupCalendar .txtTitleArea .txtDate {
  display: inline-block;
  height: 24px;
  padding: 3px 10px;
  border-radius: 3px;
  color: currentColor;
  font-size: var(--fs14);
  text-align: center;
}
.popupCalendarWrap .popupCalendar .txtTitleArea .txtDate:hover {
  background-color: var(--InputDateFontColorHover);
  cursor: pointer;
}
.popupCalendarWrap .popupCalendar .txtTitleArea > .btnPrev {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 30px;
  height: 30px;
  background-position: -50px -130px;
  border-radius: 15px;
}
.popupCalendarWrap .popupCalendar .txtTitleArea > .btnPrev:hover, .popupCalendarWrap .popupCalendar .txtTitleArea > .btnPrev:focus {
  background-color: var(--InputDateFontColorHover);
  cursor: pointer;
}
.popupCalendarWrap .popupCalendar .txtTitleArea > .btnNext {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-block;
  width: 30px;
  height: 30px;
  background-position: -50px -161px;
  border-radius: 15px;
}
.popupCalendarWrap .popupCalendar .txtTitleArea > .btnNext:hover, .popupCalendarWrap .popupCalendar .txtTitleArea > .btnNext:focus {
  background-color: var(--InputDateFontColorHover);
  cursor: pointer;
}
.popupCalendarWrap .popupCalendar .btnWrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border-top: 1px solid var(--MainColor);
}
.popupCalendarWrap .popupCalendar .btnWrap > button {
  display: inline-block;
  padding: 4px 12px;
  border: 1px solid var(--MainColor);
  border-radius: 4px;
  color: var(--MainColor);
  font-size: var(--fs14);
}
.popupCalendarWrap .popupCalendar .btnWrap > button.btnToday:hover, .popupCalendarWrap .popupCalendar .btnWrap > button.btnToday:focus {
  background-color: var(--InputDateBtnTodayColorHover);
  cursor: pointer;
}
.popupCalendarWrap .popupCalendar .btnWrap > button.btnDeleteData {
  border-color: var(--ControlBorderColor);
  color: var(--MainFontColorLighter);
}
.popupCalendarWrap .popupCalendar .btnWrap > button.btnDeleteData:hover, .popupCalendarWrap .popupCalendar .btnWrap > button.btnDeleteData:focus {
  background-color: var(--InputDateBtnDeleteColorHover);
  cursor: pointer;
}
.popupCalendarWrap .popupCalendar .ulDay {
  display: flex;
  flex-wrap: wrap;
  padding: 5px;
}
.popupCalendarWrap .popupCalendar .ulDay li {
  display: inline-flex;
  width: 14%;
}
.popupCalendarWrap .popupCalendar .ulDay li > span, .popupCalendarWrap .popupCalendar .ulDay li > a {
  width: 26px;
  height: 26px;
  margin: 1px;
  border-radius: 14px;
  color: var(--ControlFontColor);
  font-size: var(--fs13);
  text-align: center;
  line-height: 24px;
}
.popupCalendarWrap .popupCalendar .ulDay li > span:hover, .popupCalendarWrap .popupCalendar .ulDay li > span:focus, .popupCalendarWrap .popupCalendar .ulDay li > a:hover, .popupCalendarWrap .popupCalendar .ulDay li > a:focus {
  color: var(--MainColor);
  background-color: var(--InputDateBtnTodayColorHover);
}
.popupCalendarWrap .popupCalendar .ulDay li > span.sun, .popupCalendarWrap .popupCalendar .ulDay li > a.sun {
  color: var(--colorRed);
}
.popupCalendarWrap .popupCalendar .ulDay li > span.sat, .popupCalendarWrap .popupCalendar .ulDay li > a.sat {
  color: var(--colorBlue);
}
.popupCalendarWrap .popupCalendar .ulDay li > span.dis, .popupCalendarWrap .popupCalendar .ulDay li > a.dis {
  color: var(--colorGrey);
}
.popupCalendarWrap .popupCalendar .ulDay li > span.selected, .popupCalendarWrap .popupCalendar .ulDay li > a.selected {
  border: 1px solid var(--ControlBgColorSelected);
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--ControlBgColorSelected);
  font-weight: bold;
}
.popupCalendarWrap .popupCalendar .ulDay li.week {
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.popupCalendarWrap .popupCalendar .ulDay li.week > span:hover, .popupCalendarWrap .popupCalendar .ulDay li.week > span:focus, .popupCalendarWrap .popupCalendar .ulDay li.week > a:hover, .popupCalendarWrap .popupCalendar .ulDay li.week > a:focus {
  background-color: transparent;
  color: rgba(var(--MainFontColor-rgb), 0.5);
  cursor: default;
}
.popupCalendarWrap .popupCalendar .ulMonth {
  padding: 5px;
}
.popupCalendarWrap .popupCalendar .ulMonth li {
  display: inline-flex;
}
.popupCalendarWrap .popupCalendar .ulMonth li > a {
  width: 50px;
  height: 50px;
  margin: 2px;
  border-radius: 25px;
  color: var(--ControlFontColor);
  font-size: var(--fs13);
  text-align: center;
  line-height: 50px;
}
.popupCalendarWrap .popupCalendar .ulMonth li > a:hover, .popupCalendarWrap .popupCalendar .ulMonth li > a:focus {
  background-color: var(--InputDateBtnTodayColorHover);
  color: var(--ControlFontColorFocus);
  cursor: pointer;
}
.popupCalendarWrap .popupCalendar .ulMonth li > a.selected {
  background-color: var(--ControlBgColorSelected);
  color: var(--ControlFontColorSelected);
}
.popupCalendarWrap .popupCalendar .ulYear {
  padding: 5px;
}
.popupCalendarWrap .popupCalendar .ulYear li {
  display: inline-flex;
}
.popupCalendarWrap .popupCalendar .ulYear li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  margin: 2px;
  border-radius: 25px;
  color: var(--ControlFontColor);
  font-size: var(--fs13);
  text-align: center;
  line-height: 12px;
  vertical-align: middle;
}
.popupCalendarWrap .popupCalendar .ulYear li > a.dis {
  color: var(--ControlCaptionFontColorDis);
}
.popupCalendarWrap .popupCalendar .ulYear li > a:hover, .popupCalendarWrap .popupCalendar .ulYear li > a:focus {
  background-color: var(--InputDateBtnTodayColorHover);
  color: var(--ControlFontColorFocus);
  cursor: pointer;
}
.popupCalendarWrap .popupCalendar .ulYear li > a.selected {
  background-color: var(--ControlBgColorSelected);
  color: var(--ControlFontColorSelected);
}
.popupCalendarWrap .popupNewCalendar {
  position: absolute;
  display: flex;
  align-content: center;
  flex-direction: column;
  width: 230px;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
}
.popupCalendarWrap .popupNewCalendar .txtTopTitle {
  width: 100%;
  padding: 5px 0;
  background-color: rgba(var(--InvertBgColor-rgb), 0.1);
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs13);
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px 12px;
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .leftSelectBox {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .leftSelectBox > button {
  display: flex;
  align-items: center;
  padding: 4px;
  border: 1px solid transparent;
  border-radius: 3px;
  color: var(--ControlFontColor);
  font-size: var(--fs14);
  font-weight: bold;
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .leftSelectBox > button::after {
  content: "";
  display: flex;
  width: 6px;
  height: 6px;
  margin-left: 5px;
  border-left: 1px solid #929292;
  border-bottom: 1px solid #929292;
  transform: rotate(-45deg);
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .leftSelectBox > button:hover, .popupCalendarWrap .popupNewCalendar .txtTitleArea .leftSelectBox > button:focus {
  background-color: #F0F0F0;
  cursor: pointer;
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .leftSelectBox > button.selected {
  border-color: var(--MainColor);
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--MainColor);
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .leftSelectBox > button.selected::after {
  border-color: var(--MainColor);
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .btnBox {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .btnBox > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .btnBox > a > i {
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .btnBox > a.btnPrev > i {
  border-right: 6px solid var(--MainFontColor);
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .btnBox > a.btnNext > i {
  border-left: 6px solid var(--MainFontColor);
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .btnBox > a:hover, .popupCalendarWrap .popupNewCalendar .txtTitleArea .btnBox > a:focus {
  background-color: #F0F0F0;
}
.popupCalendarWrap .popupNewCalendar .txtTitleArea .txtRange {
  width: 100%;
  font-size: var(--fs14);
  font-weight: bold;
  text-align: center;
}
.popupCalendarWrap .popupNewCalendar .btnWrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px 12px;
  border-top: 1px solid var(--BorderGrey);
}
.popupCalendarWrap .popupNewCalendar .btnWrap > button {
  display: inline-block;
  padding: 4px 12px;
  border: 1px solid var(--MainColor);
  border-radius: 3px;
  color: var(--MainColor);
  font-size: var(--fs14);
}
.popupCalendarWrap .popupNewCalendar .btnWrap > button.btnToday:hover, .popupCalendarWrap .popupNewCalendar .btnWrap > button.btnToday:focus {
  background-color: var(--InputDateBtnTodayColorHover);
  cursor: pointer;
}
.popupCalendarWrap .popupNewCalendar .btnWrap > button.btnDeleteData {
  border-color: var(--ControlBorderColor);
  color: var(--MainFontColorLighter);
}
.popupCalendarWrap .popupNewCalendar .btnWrap > button.btnDeleteData:hover, .popupCalendarWrap .popupNewCalendar .btnWrap > button.btnDeleteData:focus {
  background-color: var(--InputDateBtnDeleteColorHover);
  cursor: pointer;
}
.popupCalendarWrap .popupNewCalendar .ulDay {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  padding: 5px;
}
.popupCalendarWrap .popupNewCalendar .ulDay li {
  display: inline-flex;
  justify-content: center;
  width: 14%;
}
.popupCalendarWrap .popupNewCalendar .ulDay li > span, .popupCalendarWrap .popupNewCalendar .ulDay li > a {
  width: 26px;
  height: 26px;
  margin: 1px;
  border-radius: 14px;
  color: var(--ControlFontColor);
  font-size: var(--fs13);
  line-height: 24px;
  text-align: center;
}
.popupCalendarWrap .popupNewCalendar .ulDay li > span:hover, .popupCalendarWrap .popupNewCalendar .ulDay li > span:focus, .popupCalendarWrap .popupNewCalendar .ulDay li > a:hover, .popupCalendarWrap .popupNewCalendar .ulDay li > a:focus {
  background-color: #F0F0F0;
}
.popupCalendarWrap .popupNewCalendar .ulDay li > span.dis, .popupCalendarWrap .popupNewCalendar .ulDay li > a.dis {
  color: var(--colorGrey);
}
.popupCalendarWrap .popupNewCalendar .ulDay li > span.selected, .popupCalendarWrap .popupNewCalendar .ulDay li > a.selected {
  border: 1px solid var(--ControlBgColorSelected);
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--ControlBgColorSelected);
  font-weight: bold;
}
.popupCalendarWrap .popupNewCalendar .ulDay li:nth-child(7n+14) > a {
  color: var(--colorBlue);
}
.popupCalendarWrap .popupNewCalendar .ulDay li:nth-child(7n+14) > a.dis {
  color: var(--colorGrey);
}
.popupCalendarWrap .popupNewCalendar .ulDay li:nth-child(7n+8) > a {
  color: var(--colorRed);
}
.popupCalendarWrap .popupNewCalendar .ulDay li:nth-child(7n+8) > a.dis {
  color: var(--colorGrey);
}
.popupCalendarWrap .popupNewCalendar .ulDay li.week > span, .popupCalendarWrap .popupNewCalendar .ulDay li.week > a {
  color: rgba(var(--MainFontColor-rgb), 0.7);
}
.popupCalendarWrap .popupNewCalendar .ulDay li.week > span:hover, .popupCalendarWrap .popupNewCalendar .ulDay li.week > span:focus, .popupCalendarWrap .popupNewCalendar .ulDay li.week > a:hover, .popupCalendarWrap .popupNewCalendar .ulDay li.week > a:focus {
  background-color: transparent;
  color: rgba(var(--MainFontColor-rgb), 0.7);
  cursor: default;
}
.popupCalendarWrap .popupNewCalendar .ulMonth {
  display: flex;
  flex-wrap: wrap;
  padding: 5px;
}
.popupCalendarWrap .popupNewCalendar .ulMonth li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 33%;
  height: 40px;
}
.popupCalendarWrap .popupNewCalendar .ulMonth li > a {
  width: 40px;
  height: 30px;
  border-radius: 3px;
  color: var(--ControlFontColor);
  font-size: var(--fs13);
  line-height: 30px;
  text-align: center;
}
.popupCalendarWrap .popupNewCalendar .ulMonth li > a:hover, .popupCalendarWrap .popupNewCalendar .ulMonth li > a:focus {
  background-color: #F0F0F0;
}
.popupCalendarWrap .popupNewCalendar .ulMonth li > a.selected {
  border: 1px solid var(--ControlBgColorSelected);
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--ControlBgColorSelected);
  font-weight: bold;
}
.popupCalendarWrap .popupNewCalendar .ulYear {
  display: flex;
  flex-direction: column;
}
.popupCalendarWrap .popupNewCalendar .ulYear > ul {
  display: flex;
  flex-wrap: wrap;
  padding: 5px;
}
.popupCalendarWrap .popupNewCalendar .ulYear > ul li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 33%;
  height: 40px;
}
.popupCalendarWrap .popupNewCalendar .ulYear > ul li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 90%;
  min-height: 30px;
  border-radius: 3px;
  color: var(--ControlFontColor);
  font-size: var(--fs13);
}
.popupCalendarWrap .popupNewCalendar .ulYear > ul li > a:hover, .popupCalendarWrap .popupNewCalendar .ulYear > ul li > a:focus {
  background-color: #F0F0F0;
}
.popupCalendarWrap .popupNewCalendar .ulYear > ul li > a.selected {
  border: 1px solid var(--ControlBgColorSelected);
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--ControlBgColorSelected);
  font-weight: bold;
}
.popupCalendarWrap .popupNewCalendar .ulYear .btnYearArea {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.popupCalendarWrap .popupNewCalendar .ulYear .btnYearArea > a {
  padding: 10px;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.popupCalendarWrap .popupNewCalendar .ulYear .btnYearArea > a > i {
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}
.popupCalendarWrap .popupNewCalendar .ulYear .btnYearArea > a.btnPrev > i {
  margin-right: 5px;
  border-right: 6px solid currentColor;
}
.popupCalendarWrap .popupNewCalendar .ulYear .btnYearArea > a.btnNext > i {
  margin-left: 5px;
  border-left: 6px solid currentColor;
}
.popupCalendarWrap .popupNewCalendar .ulYear .btnYearArea > a:hover, .popupCalendarWrap .popupNewCalendar .ulYear .btnYearArea > a:focus {
  color: var(--MainFontColor);
}
.popupCalendarWrap .popupNewCalendar.fromTo {
  position: relative;
  border: none;
  box-shadow: none;
}

.fromtoCalendar .rangeListArea {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
}
.fromtoCalendar .rangeListArea .rangeList {
  display: flex;
  flex-wrap: wrap;
  width: 232px;
  border-radius: 2px;
}
.fromtoCalendar .rangeListArea .rangeList > li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 59px;
  height: 25px;
  margin-left: -1px;
  border: 1px solid var(--BorderGreyLight);
}
.fromtoCalendar .rangeListArea .rangeList > li > button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  letter-spacing: -0.06em;
}
.fromtoCalendar .rangeListArea .rangeList > li > button:hover, .fromtoCalendar .rangeListArea .rangeList > li > button:focus {
  background-color: rgba(var(--InvertBgColor-rgb), 0.1);
  cursor: pointer;
}
.fromtoCalendar .rangeListArea .rangeList > li.borderTopNone {
  margin-top: -1px;
}
.fromtoCalendar .rangeListArea .rangeList > li.selected {
  position: relative;
  border: 1px solid var(--MainColor) !important;
}
.fromtoCalendar .rangeListArea .rangeList > li.selected > button {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--MainColor);
}
.fromtoCalendar .rangeListArea .rangeList:nth-child(2n) {
  margin-left: 5px;
}
.fromtoCalendar .rangeListArea .rangeList:nth-child(3), .fromtoCalendar .rangeListArea .rangeList:nth-child(4) {
  margin-top: 5px;
}
.fromtoCalendar .rangeListArea .rangeList:nth-child(3) li, .fromtoCalendar .rangeListArea .rangeList:nth-child(4) li {
  border-bottom: 1px solid var(--BorderGreyLight);
}
.fromtoCalendar .rangeListArea .rangeList:nth-child(4) li {
  width: 40px;
}
.fromtoCalendar .rangeListArea .rangeList:nth-child(4) li:nth-child(3n) {
  width: 39px;
}
.fromtoCalendar .calendarArea {
  width: 100%;
}
.fromtoCalendar .calendarArea.popupCalendarWrap {
  position: relative;
  top: unset;
  left: unset;
  display: flex;
  justify-content: space-between;
  height: auto;
  padding-top: 20px;
  z-index: unset;
}
.fromtoCalendar .calendarArea.popupCalendarWrap .popupNewCalendar {
  position: relative;
  border: none;
  box-shadow: none;
}
.fromtoCalendar .calendarArea.popupCalendarWrap .calendarBar {
  align-self: flex-end;
  width: 1px;
  height: 200px;
  background-color: var(--BorderGreyLight);
}

.Modaless .btnHelp {
  position: absolute;
  top: 10px;
  right: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px 0 0 10px;
  background-color: var(--modalessBtnHelpBgColor);
  transition: background-color 0.3s;
  z-index: 1;
}
.Modaless .btnHelp > i {
  width: 11px;
  height: 20px;
  background-position: -440px -1px;
}
.Modaless .btnHelp:hover {
  background-color: var(--MainColor);
  cursor: pointer;
}
.Modaless .btnBackTab {
  position: absolute;
  top: 10px;
  right: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px 0 0 10px;
  background-color: var(--modalessBtnHelpBgColor);
  transition: background-color 0.3s;
  z-index: 1;
}
.Modaless .btnBackTab > i {
  width: 18px;
  height: 16px;
  background-position: -312px -56px;
}
.Modaless .btnBackTab:hover {
  background-color: var(--MainColor);
  cursor: pointer;
}
.Modaless .programActionArea {
  top: 10px;
  z-index: 3;
}
.Modaless.toolbarArea .btnHelp {
  top: 0;
  border-radius: 0;
}
.Modaless.toolbarArea .btnBackTab {
  top: 0;
  border-radius: 0;
}
.Modaless.toolbarArea .programActionArea {
  top: 0;
}
.Modaless.toolbarArea .programActionArea > .btnShowHide {
  top: 0;
}
.Modaless.toolbarArea .ulToolbar {
  width: calc(100% - 120px);
}
.Modaless.toolbarArea .btnMore {
  right: 80px;
}

.layoutControl.selectedControl:before {
  content: "";
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  border: 1px dashed var(--MainFontColor);
  border-radius: 3px;
  background-color: rgba(var(--MainColor-rgb), 0.3);
  z-index: 9;
}

.groupBox.selectedControl:before {
  content: "";
  position: absolute;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  border: 1px dashed var(--MainFontColor);
  border-radius: 3px;
  background-color: rgba(var(--MainColor-rgb), 0.3);
}

.groupBox.selectedControl .layoutControl[kui-optionlist] .multiRadio .controlOption .title {
  background-color: rgba(21, 176, 101, 0.03);
}

.SCHDashBoard {
  display: inline-flex;
  height: 100%;
  padding: 10px;
  font-size: var(--fs14);
}
.SCHDashBoard * {
  flex-shrink: 0;
}
.SCHDashBoard .itemGroup {
  display: inline-flex;
  align-items: center;
  height: 100%;
}
.SCHDashBoard .itemGroup .item {
  height: 100%;
}
.SCHDashBoard .itemGroup .item.totalTime {
  min-width: 320px;
  margin-right: 30px;
}
.SCHDashBoard .itemGroup .item.totalTime .txtInfo {
  display: inline-flex;
  align-items: center;
  margin-bottom: 8px;
  font-size: var(--fs14);
  font-weight: bold;
}
.SCHDashBoard .itemGroup .item.totalTime .txtInfo .highlight {
  margin: 0 10px;
  line-height: 28px;
  font-size: var(--fs29);
  font-weight: bold;
}
.SCHDashBoard .itemGroup .item.totalTime .progressBar {
  position: relative;
  width: 100%;
  height: 35px;
}
.SCHDashBoard .itemGroup .item.totalTime .progressBar .bg {
  position: relative;
  width: 100%;
  height: 18px;
  border-radius: 30px;
  background-color: var(--BgColorGrey1);
  overflow: hidden;
}
.SCHDashBoard .itemGroup .item.totalTime .progressBar .fill {
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  border-radius: 30px;
  background-color: var(--colorYellow);
  transition: width 1s;
  width: 0;
}
.SCHDashBoard .itemGroup .item.totalTime .progressBar .fill.zero {
  width: 0 !important;
}
.SCHDashBoard .itemGroup .item.totalTime .progressBar .count {
  position: absolute;
  top: 21px;
  left: 0;
  font-size: var(--fs11);
  color: rgba(0, 0, 0, 0.5);
}
.SCHDashBoard .itemGroup .item.totalTime .progressBar .count.start {
  left: 0;
}
.SCHDashBoard .itemGroup .item.totalTime .progressBar .count.end {
  right: 0;
}
.SCHDashBoard .itemGroup .item.SCHInfo {
  display: flex;
  align-items: center;
}
.SCHDashBoard .itemGroup .item.SCHInfo dl {
  display: inline-block;
  margin-right: 40px;
}
.SCHDashBoard .itemGroup .item.SCHInfo dl dt {
  margin-bottom: 5px;
  color: rgba(0, 0, 0, 0.5);
  font-size: var(--fs13);
}
.SCHDashBoard .itemGroup .item.SCHInfo dl dd {
  font-size: var(--fs14);
}
.SCHDashBoard .itemGroup .item.SCHInfo dl:last-child {
  margin-right: 0;
}
.SCHDashBoard .itemGroup .currentInfo {
  margin-right: 20px;
}
.SCHDashBoard .itemGroup .currentInfo .txtDepartment {
  font-weight: bold;
}
.SCHDashBoard .itemGroup .currentInfo .txtDate {
  color: rgba(0, 0, 0, 0.5);
  font-size: var(--fs13);
}
.SCHDashBoard .itemGroup .chartWrap {
  display: flex;
  align-items: center;
  margin-right: 20px;
}
.SCHDashBoard .itemGroup .chartWrap .txtTitle {
  margin-right: 10px;
  font-size: var(--fs13);
}
.SCHDashBoard .itemGroup .chartWrap .percentChart {
  position: relative;
  flex-shrink: 0;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background-color: var(--BgColorGrey1);
}
.SCHDashBoard .itemGroup .chartWrap .percentChart .percentBg {
  content: "";
  position: absolute;
  top: calc(50% - 38px);
  left: calc(50% - 38px);
  width: 76px;
  height: 76px;
  border-radius: 50%;
  clip: rect(0, 76px, 76px, 38px);
}
.SCHDashBoard .itemGroup .chartWrap .percentChart .percentBg .percentFill {
  content: "";
  position: absolute;
  top: calc(50% - 38.5px);
  left: calc(50% - 38.5px);
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background-color: var(--colorGreen);
  transform: rotate(60deg);
  clip: rect(0, 38px, 76px, 0);
}
.SCHDashBoard .itemGroup .chartWrap .percentChart .labelWrap {
  content: "";
  position: absolute;
  top: calc(50% - 34px);
  left: calc(50% - 34px);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background-color: var(--ControlBgColor);
  text-align: center;
}
.SCHDashBoard .itemGroup .chartWrap .percentChart .labelWrap .txtLabel .value {
  font-size: var(--fs21);
  font-weight: bold;
}
.SCHDashBoard .itemGroup .chartWrap .percentChart .labelWrap .txtLabel .unit {
  margin-left: 2px;
  font-size: 11px;
}
.SCHDashBoard .itemGroup .chartWrap .percentChart.gt50 {
  background-color: var(--colorGreen);
}
.SCHDashBoard .itemGroup .chartWrap .percentChart.gt50 .percentBg .percentFill {
  background: var(--BgColorGrey1);
  transition: transform 0.7s;
  clip: rect(0, 76px, 76px, 38px);
}
.SCHDashBoard .itemGroup .chartWrap.total {
  margin-right: 0;
}
.SCHDashBoard .itemGroup .chartWrap.total .percentChart .percentBg .percentFill {
  background-color: var(--colorBlue);
}
.SCHDashBoard .itemGroup .chartWrap.total .percentChart.gt50 {
  background-color: var(--colorBlue);
}
.SCHDashBoard .itemGroup.left {
  margin-right: 20px;
}
.SCHDashBoard .itemGroup.right {
  padding: 0 20px;
  border-left: 1px solid var(--BorderGreyLight);
}

.popupCalendar.SCHCalendar {
  border: 1px solid var(--BorderGreyLight);
}

.SCHcolumnHeader {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  flex-direction: column;
}
.SCHcolumnHeader .dateWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
}
.SCHcolumnHeader .dateWrap .date {
  display: inline-block;
  color: var(--ControlFontColor);
  font-size: var(--fs21);
  font-weight: bold;
}
.SCHcolumnHeader .dateWrap .date .day {
  margin-left: 5px;
  color: var(--InputDateBtnTodayColorHover);
  font-size: var(--fs15);
  font-weight: normal;
}
.SCHcolumnHeader .dateWrap .schCount {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 17px;
  margin-left: 10px;
  border-radius: 5px;
  background-color: var(--BorderGreyLight);
  font-size: var(--fs14);
}
.SCHcolumnHeader .timeWrap .totalTime {
  margin-right: 5px;
  color: rgba(51, 51, 51, 0.5);
  font-size: var(--fs13);
  letter-spacing: -0.5px;
}
.SCHcolumnHeader .timeWrap .overTime {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 20px;
  padding: 0 5px;
  background-color: #FFEEE9;
  color: var(--colorRed);
  font-size: 11px;
  border-radius: 5px;
}

.popupScheduleListWrap {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: transparent;
  z-index: 70;
}
.popupScheduleListWrap .popupScheduleList {
  display: inline-flex;
  flex-direction: column;
  width: 550px;
  min-height: 310px;
  max-height: 570px;
  border: 1px solid #C9C9C9;
  background-color: #fff;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.17);
}
.popupScheduleListWrap .popupScheduleList .topArea {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 100%;
  height: 40px;
  padding-left: 15px;
}
.popupScheduleListWrap .popupScheduleList .topArea .date {
  font-size: var(--fs15);
  font-weight: bold;
}
.popupScheduleListWrap .popupScheduleList .topArea .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-left: auto;
  margin-right: 5px;
  border-radius: 50%;
}
.popupScheduleListWrap .popupScheduleList .topArea .btnClose > i {
  display: inline-block;
  width: 9px;
  height: 9px;
  background-position: 0 -81px;
}
.popupScheduleListWrap .popupScheduleList .topArea .btnClose:hover {
  background-color: #d1d1d1;
  cursor: pointer;
}
.popupScheduleListWrap .popupScheduleList .ulScheduleList {
  padding: 0 15px;
  overflow-y: auto;
}
.popupScheduleListWrap .popupScheduleList .ulScheduleList > li {
  margin-bottom: 7px;
}
.popupScheduleListWrap .popupScheduleList .ulScheduleList > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 19px;
  padding: 3px 10px;
  background-color: #FFABC2;
  word-break: break-all;
  white-space: inherit;
  line-height: 17px;
}
.popupScheduleListWrap .popupScheduleList .ulScheduleList > li > a:hover {
  color: #333;
  box-shadow: inset 0 0 0 20px rgba(0, 0, 0, 0.05);
}
.popupScheduleListWrap.newSchedule .popupScheduleList {
  width: 360px;
  border-radius: 5px;
}
.popupScheduleListWrap.newSchedule .popupScheduleList .ulScheduleList {
  max-height: 280px;
}
.popupScheduleListWrap.newSchedule .popupScheduleList .ulScheduleList > li > a {
  border-radius: 2px;
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  font-weight: 700;
  cursor: pointer;
}

.tooltipArea:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 90%;
  border: 2px solid #3c68d9;
  z-index: 9;
}

.tooltipWrap {
  position: absolute;
  display: inline-block;
  max-width: 400px;
}
.tooltipWrap::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 50px;
  border-top: 0px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 10px solid #3c68d9;
  border-left: 8px solid transparent;
}
.tooltipWrap .tooltipContent {
  position: relative;
  padding: 20px;
  background-color: rgba(60, 104, 217, 0.9);
  color: #fff;
  box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.22);
}
.tooltipWrap .tooltipContent .txtTitle {
  margin-bottom: 10px;
  font-size: var(--fs17);
  font-weight: bold;
}
.tooltipWrap .tooltipContent .btnClose {
  position: absolute;
  top: 15px;
  left: 15px;
  width: 15px;
  height: 15px;
  background-position: -46px -415px;
  cursor: pointer;
}
.tooltipWrap .tooltipContent .btnClose:hover {
  opacity: 0.8;
}
.tooltipWrap.onRight {
  min-width: 250px;
}
.tooltipWrap.onRight::before {
  content: "";
  left: auto;
  right: 30px;
}

.codeHelpKeywordWrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 60;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
  box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.2);
  overflow: hidden;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordTitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 30px;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordTitle > .title {
  padding-left: 10px;
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs11);
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordTitle > .btnCodeHelpSetting {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordTitle > .btnCodeHelpSetting > i {
  display: block;
  width: 12px;
  height: 13px;
  background-position: -41px -292px;
  opacity: 0.5;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordTitle > .btnCodeHelpSetting:hover > i, .codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordTitle > .btnCodeHelpSetting:focus-visible > i {
  opacity: 1;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordList {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  min-width: 165px;
  max-width: 300px;
  max-height: 150px;
  overflow-y: auto;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordList > .keywordBox {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-height: 30px;
  padding: 5px 10px;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordList > .keywordBox > .txtKeywordArea {
  width: 100%;
  font-size: var(--fs13);
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordList > .keywordBox > .txtKeywordArea .txtKeyword {
  max-width: 85%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordList > .keywordBox > .txtKeywordArea .txtSubInfo {
  margin-left: 5px;
  font-size: var(--fs11);
  color: var(--MainFontColorLighter);
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .codeHelpKeywordList > .keywordBox:hover {
  background-color: var(--ControlBgColorCodehelp);
  cursor: pointer;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .btnMoreCodeHelpHistory {
  padding: 10px;
  color: rgba(var(--MainFontColor-rgb), 0.7);
  font-size: var(--fs13);
  text-align: right;
}
.codeHelpKeywordWrap > .codeHelpKeywordArea .btnMoreCodeHelpHistory:hover {
  color: var(--MainColor);
}

.k-editor {
  font-size: var(--fs13) !important;
}
.k-editor .k-icon {
  font-family: WebComponentsIcons;
}

.k-button.k-state-active, .k-button.k-state-selected, .k-button:active {
  border-color: var(--MainColor) !important;
  background-color: var(--MainColor) !important;
}
.k-button.k-state-active:hover, .k-button.k-state-active:focus, .k-button.k-state-selected:hover, .k-button.k-state-selected:focus, .k-button:active:hover, .k-button:active:focus {
  background-color: var(--ButtonDefaultColorHover) !important;
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.12) !important;
}

.k-window-titlebar {
  padding: 4px 12px !important;
}

.k-window-title {
  font-size: var(--fs13) !important;
}

.k-widget.k-window > div.k-popup-edit-form {
  font-size: var(--fs13) !important;
}

.k-editor-dialog.k-editor-table-wizard-dialog .k-edit-buttons {
  padding: 0.5em 0.8em !important;
}

.k-popup {
  font-size: var(--fs13) !important;
}

.k-state-selected {
  border-color: var(--MainColor) !important;
  background-color: var(--MainColor) !important;
}

.k-state-focused.k-state-selected {
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.12) !important;
}

.k-primary {
  border-color: var(--MainColor) !important;
  background-color: var(--MainColor) !important;
}
.k-primary:hover, .k-primary:focus {
  background-color: var(--ButtonDefaultColorHover) !important;
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.12) !important;
}

.k-checkbox:checked {
  color: #fff !important;
}
.k-checkbox:focus {
  box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.12) !important;
  border-color: transparent !important;
}

.k-textarea .k-input::selection, .k-textarea::selection {
  background-color: #333 !important;
}

.k-scheduler {
  top: 0 !important;
  left: 0 !important;
  border: 1px solid var(--ControlGroupboxBorder) !important;
  border-radius: 5px;
}
.k-scheduler .k-scheduler-toolbar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background-color: transparent;
}
.k-scheduler .k-scheduler-toolbar .k-spacer {
  display: none;
}
.k-scheduler .k-scheduler-toolbar .k-scheduler-views-wrapper {
  margin-left: unset;
}
.k-scheduler .k-scheduler-toolbar .k-scheduler-views-wrapper .k-button {
  min-width: 60px;
  background-color: var(--MainBgColor);
  font-size: var(--fs13);
}
.k-scheduler .k-scheduler-toolbar .k-scheduler-views-wrapper .k-button:hover {
  background-color: #f2f2f2;
}
.k-scheduler .k-scheduler-toolbar .k-scheduler-views-wrapper .k-button.k-state-selected:hover, .k-scheduler .k-scheduler-toolbar .k-scheduler-views-wrapper .k-button.k-state-selected:focus {
  background-color: var(--MainColor) !important;
  box-shadow: none !important;
}
.k-scheduler .k-scheduler-toolbar .k-button-solid-base.k-selected {
  border-color: var(--MainColor);
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
}
.k-scheduler .k-scheduler-toolbar .k-button-solid-base.k-active {
  color: var(--InvertFontColor);
}
.k-scheduler .k-scheduler-toolbar .btnTabArea {
  display: flex;
  align-items: center;
  justify-content: center;
}
.k-scheduler .k-scheduler-toolbar .btnTabArea .btn {
  min-width: 60px;
  padding: 4px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--ControlBorderColor);
  font-size: var(--fs13);
}
.k-scheduler .k-scheduler-toolbar .btnTabArea .btn:first-child {
  border-radius: 4px 0 0 4px;
}
.k-scheduler .k-scheduler-toolbar .btnTabArea .btn:last-child {
  border-radius: 0 4px 4px 0;
}
.k-scheduler .k-scheduler-toolbar .btnTabArea .btn:hover {
  background-color: #f2f2f2;
  cursor: pointer;
}
.k-scheduler .k-scheduler-toolbar .btnTabArea .btn.Selected {
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
}
.k-scheduler .k-scheduler-toolbar .btnTabArea .btn + .btn {
  margin-left: -1px;
}
.k-scheduler .k-scheduler-toolbar .btnTabArea.btnOne .btn {
  border: none;
  background-color: unset;
  color: var(--MainFontColor);
  cursor: default;
}
.k-scheduler .k-scheduler-toolbar .btnTabArea.btnOne .btn.Selected {
  color: var(--MainFontColor);
  font-size: var(--fs16);
}
.k-scheduler .k-scheduler-toolbar .k-views-dropdown {
  padding: 2px 4px;
  border-color: var(--ControlBorderColor);
  border-radius: 3px;
  color: var(--MainFontColor);
  font-size: var(--fs13) !important;
}
.k-scheduler .k-scheduler-toolbar .timeToggle {
  position: absolute;
  right: 20px;
}
.k-scheduler .k-scheduler-toolbar .timeToggle > input[type=checkbox] {
  display: none;
}
.k-scheduler .k-scheduler-toolbar .timeToggle > input[type=checkbox] + label {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs13);
  cursor: pointer;
}
.k-scheduler .k-scheduler-toolbar .timeToggle > input[type=checkbox] + label > span {
  color: var(--MainFontColor);
  word-break: break-word;
  white-space: normal;
  transition: color 0.2s;
}
.k-scheduler .k-scheduler-toolbar .timeToggle > input[type=checkbox] + label > i {
  content: "";
  position: relative;
  flex-shrink: 1;
  width: 32px;
  height: 18px;
  margin-left: 5px;
  border-radius: 20px;
  background-color: var(--styleCheckToggleBgColor);
  transition: background-color 0.2s;
}
.k-scheduler .k-scheduler-toolbar .timeToggle > input[type=checkbox] + label > i::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 11.5px;
  height: 11.5px;
  border-radius: 50%;
  background-color: #fff;
  transition: left 0.2s;
}
.k-scheduler .k-scheduler-toolbar .timeToggle > input[type=checkbox]:checked + label > span {
  color: currentColor;
}
.k-scheduler .k-scheduler-toolbar .timeToggle > input[type=checkbox]:checked + label > i {
  background-color: var(--ControlBgColorSelected);
}
.k-scheduler .k-scheduler-toolbar .timeToggle > input[type=checkbox]:checked + label > i::before {
  left: 18.5px;
}
.k-scheduler .k-scheduler-monthview {
  background-color: var(--MainBgColor);
}
.k-scheduler .k-scheduler-monthview .k-scheduler-table .k-scheduler-cell {
  text-align: left !important;
}
.k-scheduler .k-scheduler-monthview .k-scheduler-table .k-scheduler-cell.k-today {
  border: 1px solid #666C7F;
}
.k-scheduler .k-scheduler-monthview .k-scheduler-table .k-scheduler-cell:has(.btnMoreCnt) .k-nav-day {
  background-color: #E4ECF7;
}
.k-scheduler .k-scheduler-monthview .k-more-events.k-button {
  display: none;
}
.k-scheduler .k-scheduler-weekview .k-scheduler-table th, .k-scheduler .k-scheduler-weekview .k-scheduler-table td,
.k-scheduler .k-scheduler-dayview .k-scheduler-table th,
.k-scheduler .k-scheduler-dayview .k-scheduler-table td {
  height: 22px;
}
.k-scheduler .k-scheduler-table th {
  border-color: var(--BorderColor);
  background-color: #F6F6F6;
  color: rgba(var(--MainFontColor-rgb), 0.7);
  font-size: var(--fs13);
  font-weight: 700;
}
.k-scheduler .k-scheduler-table td {
  position: relative;
  padding-block: 2px;
  padding-inline: 2px;
  border-color: var(--BorderColor);
  color: var(--MainFontColor);
  font-size: var(--fs12);
}
.k-scheduler .k-scheduler-table td .k-nav-day {
  display: flex;
  align-items: center;
  width: 100%;
  height: 24px;
  padding: 0 4px;
  font-weight: 500;
  cursor: default;
}
.k-scheduler .k-scheduler-table td .btnMoreCnt {
  position: absolute;
  top: 2px;
  right: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: 24px;
  color: var(--MainFontColor);
  font-weight: 700;
}
.k-scheduler .k-scheduler-table .k-other-month .k-nav-day {
  width: 100%;
  opacity: 0.4;
}
.k-scheduler .k-scheduler-table .k-scheduler-date-group th:nth-child(7) {
  color: #f33;
}
.k-scheduler .k-scheduler-header th,
.k-scheduler .k-scheduler-times-all-day {
  border-color: var(--BorderColor);
  background-color: var(--MainBgColor);
  color: rgba(var(--MainFontColor-rgb), 0.7);
  font-size: var(--fs13);
  font-weight: 700;
}
.k-scheduler .k-event {
  border-radius: 0;
}
.k-scheduler .k-event > div {
  padding: 0 12px !important;
  line-height: 25px;
}
.k-scheduler .k-event.k-event-inverse {
  cursor: pointer;
}
.k-scheduler .k-event.k-event-inverse strong {
  font-size: var(--fs13);
  font-weight: 700;
}
.k-scheduler .k-event .k-resize-w, .k-scheduler .k-event .k-resize-e {
  width: 10px;
  background-color: rgba(0, 0, 0, 0.7);
}
.k-scheduler .k-event .k-resize-w::before, .k-scheduler .k-event .k-resize-e::before {
  display: none;
}
.k-scheduler .k-scrollbar-v .k-scheduler-header-wrap {
  border-right: none;
}

.k-tooltip, .k-tooltip.k-popup {
  border-color: rgba(0, 0, 0, 0.8) !important;
  background-color: rgba(0, 0, 0, 0.8) !important;
  color: var(--InvertFontColor) !important;
  font-size: var(--fs13) !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

.k-callout {
  display: none;
}

.k-chart-tooltip {
  z-index: 3;
}

input {
  -webkit-appearance: none;
}

.layoutControl.txtLabelPoint14 > input, .layoutControl.txtLabeltitlePoint14 > input, .layoutControl.txtLabelPoint12 > input, .layoutControl.txtLabeltitlePoint12 > input, .layoutControl.txtLabelHighlight14 > input, .layoutControl.txtLabeltitleHighlight14 > input, .layoutControl.txtLabelHighlight12 > input, .layoutControl.txtLabelBasic12 > input, .layoutControl.txtLabelGray14 > input, .layoutControl.txtLabelTitleGray14 > input, .layoutControl.txtLabelGray11 > input, .layoutControl.txtLabelGray10 > input {
  border: 0px !important;
  background-color: transparent !important;
  text-align: left;
}
.layoutControl.txtLabelPoint14 > input:hover, .layoutControl.txtLabeltitlePoint14 > input:hover, .layoutControl.txtLabelPoint12 > input:hover, .layoutControl.txtLabeltitlePoint12 > input:hover, .layoutControl.txtLabelHighlight14 > input:hover, .layoutControl.txtLabeltitleHighlight14 > input:hover, .layoutControl.txtLabelHighlight12 > input:hover, .layoutControl.txtLabelBasic12 > input:hover, .layoutControl.txtLabelGray14 > input:hover, .layoutControl.txtLabelTitleGray14 > input:hover, .layoutControl.txtLabelGray11 > input:hover, .layoutControl.txtLabelGray10 > input:hover, .layoutControl.txtLabelPoint14 > input:focus, .layoutControl.txtLabeltitlePoint14 > input:focus, .layoutControl.txtLabelPoint12 > input:focus, .layoutControl.txtLabeltitlePoint12 > input:focus, .layoutControl.txtLabelHighlight14 > input:focus, .layoutControl.txtLabeltitleHighlight14 > input:focus, .layoutControl.txtLabelHighlight12 > input:focus, .layoutControl.txtLabelBasic12 > input:focus, .layoutControl.txtLabelGray14 > input:focus, .layoutControl.txtLabelTitleGray14 > input:focus, .layoutControl.txtLabelGray11 > input:focus, .layoutControl.txtLabelGray10 > input:focus {
  transform: unset;
}
.layoutControl.txtLabelGray14 > input, .layoutControl.txtLabelTitleGray14 > input, .layoutControl.txtLabelGray11 > input, .layoutControl.txtLabelGray10 > input {
  color: var(--FontColorGrey) !important;
}
.layoutControl.txtPoint14 > input:focus, .layoutControl.txtPoint12 > input:focus, .layoutControl.txtHighlight14 > input:focus, .layoutControl.txtHighlight12 > input:focus {
  border-width: 2px !important;
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px !important;
  transform: scale(1.01) !important;
  transition: all 0.2s ease !important;
}
.layoutControl[class*=txtLabel] > .labelCaption {
  line-height: unset;
}
.layoutControl[class*=txtLabel] > .labelCaption::after {
  content: " : ";
}
.layoutControl.captionLeft .labelCaption {
  justify-content: flex-start;
  text-align: left;
}
.layoutControl.captionLeft .check > input[type=checkbox] + label {
  text-align: left;
}
.layoutControl.valueLeft input, .layoutControl.valueLeft select {
  justify-content: flex-start;
  text-align: left !important;
}
.layoutControl.valueCenter {
  text-align: center !important;
}
.layoutControl.valueCenter input {
  justify-content: center;
}
.layoutControl.txtLabelGray10 > input {
  font-size: var(--fs11) !important;
}
.layoutControl.txtLabelGray11 > input {
  font-size: var(--fs12) !important;
}
.layoutControl.txtLabelGray14 > input, .layoutControl.txtLabelTitleGray14 > input {
  font-size: var(--fs15) !important;
}
.layoutControl.txtLabelBasic12 > input {
  font-weight: bold !important;
  font-size: var(--fs13) !important;
}
.layoutControl.txtLabelHighlight12 > input {
  font-weight: bold !important;
  font-size: var(--fs13) !important;
  color: #ff6b6b !important;
}
.layoutControl.txtLabelHighlight14 > input, .layoutControl.txtLabeltitleHighlight14 > input {
  font-weight: bold !important;
  font-size: var(--fs15) !important;
  color: #ff6b6b !important;
}
.layoutControl.txtLabelPoint12 > input, .layoutControl.txtLabeltitlePoint12 > input {
  font-weight: bold !important;
  font-size: var(--fs13) !important;
  color: #70bf73 !important;
}
.layoutControl.txtLabelPoint14 > input, .layoutControl.txtLabeltitlePoint14 > input {
  font-weight: bold !important;
  font-size: var(--fs15) !important;
  color: #70bf73 !important;
}
.layoutControl.Dis[class*=txtLabel] > input:hover {
  border: 0 !important;
  background-color: transparent !important;
  box-shadow: none !important;
  cursor: default !important;
}
.layoutControl.Dis[class*=txtLabel] > input:focus {
  box-shadow: none !important;
}
.layoutControl.Dis[class*=txtLabel][controltype=CodeHelp] .btnCodeHelp {
  display: none !important;
}
.layoutControl.Dis[class*=Point] > input:hover {
  color: #70bf73 !important;
}
.layoutControl.Dis[class*=Highlight] > input:hover {
  color: #ff6b6b !important;
}
.layoutControl.txtHighlight12 > input {
  border: 1px solid #ff6b6b !important;
  color: #ff6b6b !important;
  font-weight: bold !important;
  font-size: var(--fs13) !important;
}
.layoutControl.txtHighlight14 > input {
  border: 1px solid #ff6b6b !important;
  color: #ff6b6b !important;
  font-weight: bold !important;
  font-size: var(--fs15) !important;
}
.layoutControl.txtPoint12 > input {
  border: 1px solid #70bf73 !important;
  color: #70bf73 !important;
  font-weight: bold !important;
  font-size: var(--fs13) !important;
}
.layoutControl.txtPoint14 > input {
  border: 1px solid #70bf73 !important;
  color: #70bf73 !important;
  font-weight: bold !important;
  font-size: var(--fs15) !important;
}
.layoutControl.styleOnlyText > .labelCaption {
  color: #777 !important;
}
.layoutControl.styleOnlyText > input {
  padding: 0;
  border: 0px !important;
  background-color: transparent !important;
  font-size: 1.25em;
  font-weight: bold;
}
.layoutControl.styleOnlyText > input:focus, .layoutControl.styleOnlyText > input:hover {
  border: 0px transparent solid !important;
  background-color: transparent !important;
  box-shadow: none !important;
  transform: scale(1) !important;
}
.layoutControl.styleOnlyText > textarea {
  margin: 0;
  padding: 0;
  border: 0px !important;
  background-color: transparent !important;
  font-size: 1em;
}
.layoutControl.styleOnlyText > textarea:focus, .layoutControl.styleOnlyText > textarea:hover {
  border: 0px transparent solid !important;
  background-color: transparent !important;
  font-weight: unset;
  box-shadow: none !important;
  transform: scale(1) !important;
}
.layoutControl.styleLineBox {
  display: flex;
  justify-content: space-between;
  padding: 0 5px;
  border: 1px solid #CBCDDB;
  border-radius: 0px;
  overflow: hidden;
}
.layoutControl.styleLineBox > .labelCaption {
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  flex-shrink: 0;
  color: #777 !important;
  z-index: 1;
}
.layoutControl.styleLineBox > input {
  flex-shrink: unset;
  height: 100%;
  margin: 0;
  padding-right: 5px;
  border: 0px;
  border-radius: 0px;
  background-color: transparent;
  font-size: 1.333em;
  font-weight: bold;
  text-align: right;
}
.layoutControl.styleLineBox.CodeHelp > input {
  padding-right: 30px;
}
.layoutControl.styleLineBox.CodeHelp > .btnCodeHelp {
  right: 4px;
}
.layoutControl.styleLineBox.CodeHelp.Dis > input {
  padding-right: 5px;
}
.layoutControl.styleLineBox.Point > input {
  color: #15b065 !important;
}
.layoutControl.styleLineBox.Dis {
  border: 0px Solid transparent !important;
  background-color: #EDEEF3;
}
.layoutControl.styleLineBox.Dis > input {
  border: 0px Solid transparent !important;
  background-color: transparent !important;
}
.layoutControl.styleInputBorderBold > input {
  padding: 0.5em;
  border-width: 2px;
  border-color: currentColor;
}

.layoutControl[kui-button].btnMinus button, .layoutControl[kui-button].btnPlus button, .layoutControl[kui-button].btnZoom button, .layoutControl[kui-button].btnRefresh button, .layoutControl[kui-button].btnLeft button, .layoutControl[kui-button].btnRight button, .layoutControl[kui-button].btnUp button, .layoutControl[kui-button].btnDataUp button, .layoutControl[kui-button].btnDataDown button, .layoutControl[kui-button].btnDataLeft button, .layoutControl[kui-button].btnDataRight button, .layoutControl[kui-button].btnDataLeftUp button {
  min-height: 23px !important;
  min-width: 23px !important;
  border: 0px !important;
  background-image: url("../../Images/btnMinus.png") !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  text-indent: -99999px;
}
.layoutControl[kui-button].btnMinus button {
  background-image: url("../../Images/btnMinus.png") !important;
  background-size: 90%;
}
.layoutControl[kui-button].btnPlus > button {
  background-image: url("../../Images/btnPlus.png") !important;
  background-size: 90%;
}
.layoutControl[kui-button].btnZoom button {
  background-image: url("../../Images/btnQuery.png") !important;
  background-size: 90%;
}
.layoutControl[kui-button].btnRefresh button {
  background-image: url("../../Images/btnRefresh.png") !important;
}
.layoutControl[kui-button].btnLeft button {
  background-image: url("../../Images/btnLeft.png") !important;
}
.layoutControl[kui-button].btnRight button {
  background-image: url("../../Images/btnRight.png") !important;
}
.layoutControl[kui-button].btnUp button {
  background-image: url("../../Images/btnUp.png") !important;
}
.layoutControl[kui-button].btnDown button {
  background-image: url("../../Images/btnDown.png") !important;
}
.layoutControl[kui-button].btnDataUp button {
  background-image: url("../../Images/btnDataUp.png") !important;
}
.layoutControl[kui-button].btnDataDown button {
  background-image: url("../../Images/btnDataDown.png") !important;
}
.layoutControl[kui-button].btnDataLeft button {
  background-image: url("../../Images/btnDataLeft.png") !important;
}
.layoutControl[kui-button].btnDataRight button {
  background-image: url("../../Images/btnDataRight.png") !important;
}
.layoutControl[kui-button].btnDataLeftUp button {
  background-image: url("../../Images/btnDataLeftUp.png") !important;
}
.layoutControl[kui-button].btnPoint button, .layoutControl[kui-button].btnHighlight button, .layoutControl[kui-button].btnTypeQuery button, .layoutControl[kui-button].btnTypeProc button, .layoutControl[kui-button].btnTypeFileUpload button, .layoutControl[kui-button].btnTypeFileDownload button, .layoutControl[kui-button].btnTypeLink button {
  display: inline-flex;
  align-items: center;
  border: 0px !important;
  color: #fff;
  font-weight: bold;
  font-size: var(--fs13);
  text-align: center;
}
.layoutControl[kui-button].btnPoint {
  background-color: var(--PointColor) !important;
}
.layoutControl[kui-button].btnHighlight {
  background-color: var(--PointColor) !important;
}
.layoutControl[kui-button].btnTypeQuery {
  background-color: var(--ButtonBgColor);
}
.layoutControl[kui-button].btnTypeQuery button {
  padding-left: 23px !important;
  background-image: url("../../Images/btnTypeQuery.png") !important;
  background-repeat: no-repeat;
  background-position: left center;
  text-align: left !important;
}
.layoutControl[kui-button].btnTypeProc button {
  padding-left: 23px !important;
  background-image: url("../../Images/btnTypeProc.png") !important;
  background-repeat: no-repeat;
  background-position: left center;
  text-align: left !important;
}
.layoutControl[kui-button].btnTypeFileUpload button {
  padding-left: 23px !important;
  background-image: url("../../Images/btnTypeFileUpload.png") !important;
  background-repeat: no-repeat;
  background-position: left center;
  text-align: left !important;
}
.layoutControl[kui-button].btnTypeFileDownload button {
  padding-left: 23px !important;
  background-color: var(--ButtonBgColor);
  background-image: url("../../Images/btnTypeFileDownload.png") !important;
  background-repeat: no-repeat;
  background-position: left center;
  text-align: left !important;
}
.layoutControl[kui-button].btnTypeLink button {
  padding-left: 23px !important;
  background-color: var(--ButtonBgColor);
  background-image: url("../../Images/btnTypeLink.png") !important;
  background-repeat: no-repeat;
  background-position: left center;
  text-align: left !important;
}
.layoutControl[kui-button].styleBtnGray, .layoutControl[kui-button].styleBtnGreen, .layoutControl[kui-button].styleBtnPurple {
  padding: 0px;
}
.layoutControl[kui-button].styleBtnGray button, .layoutControl[kui-button].styleBtnGreen button, .layoutControl[kui-button].styleBtnPurple button {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs17);
  font-weight: normal;
  color: var(--MainBgColor);
  box-shadow: rgba(0, 0, 0, 0.2) 0 3px 5px;
}
.layoutControl[kui-button].styleBtnGray button {
  background-color: var(--FontColorGrey);
}
.layoutControl[kui-button].styleBtnPurple button {
  background-color: var(--colorViolet);
}
.layoutControl[kui-button].styleBtnGreen button {
  background-color: var(--colorGreen);
}
.layoutControl[kui-button].styleBtntransparent button {
  border: 0px;
  background-color: transparent;
}
.layoutControl[kui-button].styleBtntransparent:hover {
  background-color: var(--ControlBgColorSelected);
}

.layoutControl[kui-label].lbLRed > label {
  color: var(--colorRed) !important;
  font-size: var(--fs17) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbLViolet > label {
  color: var(--colorViolet) !important;
  font-size: var(--fs17) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbLGreen > label {
  color: var(--colorGreen) !important;
  font-size: var(--fs17) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbLSkyBlue > label {
  color: var(--colorBlue) !important;
  font-size: var(--fs17) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbSGray > label {
  color: var(--FontColorGrey) !important;
  font-size: var(--fs12) !important;
}
.layoutControl[kui-label].lbSOrange > label {
  color: var(--colorOrange) !important;
  font-size: var(--fs12) !important;
}
.layoutControl[kui-label].lbSBoldBlack > label {
  font-size: var(--fs12) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbSBlack > label {
  font-size: var(--fs12) !important;
}
.layoutControl[kui-label].lbTextAlignRight > label {
  justify-content: flex-end;
  text-align: right;
}
.layoutControl[kui-label].lbTitlePoint12 > label {
  font-size: var(--fs13) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbTitlePoint16 > label {
  font-size: var(--fs17) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbHeaderGrayBox > label {
  padding: 2px 4px !important;
  background-color: var(--FontColorGrey) !important;
  color: var(--MainBgColor) !important;
  font-size: var(--fs13) !important;
}
.layoutControl[kui-label].lbDashboardTitle > label {
  font-size: var(--fs15) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbCountTotal > label {
  padding-left: 10px !important;
  border-left: 2px solid var(--colorRed) !important;
  color: var(--colorRed) !important;
  font-size: var(--fs19) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbCountDescription > label {
  color: var(--FontColorGrey) 1 !important;
  font-size: var(--fs13) !important;
}
.layoutControl[kui-label].lbCount > label {
  padding-left: 10px !important;
  border-left: 2px solid var(--colorGreen) !important;
  color: var(--FontColorGrey) 1 !important;
  font-size: var(--fs19) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbCodehelpTitle > label {
  color: var(--FontColorGrey) 1 !important;
  font-size: var(--fs13) !important;
  font-weight: bold;
}
.layoutControl[kui-label].lbHeaderTopLine > label {
  padding: 3px 5px !important;
  border-top: 1px solid var(--BorderGrey);
  font-size: var(--fs13) !important;
  font-weight: bold;
}

.groupBox[kui-groupbox].icon {
  background-position: -1000px;
}
.groupBox[kui-groupbox].icon > .title {
  display: flex;
  align-items: center;
  height: 30px;
  padding-left: 32px;
  background-repeat: no-repeat;
  background-position: left center;
  background-image: inherit;
}
.groupBox[kui-groupbox].icon > .title::before {
  display: none;
}

[kui-groupbox].styleGb02, [kui-groupbox] [stylename=styleGb02], [kui-groupbox].styleGb01, [kui-groupbox] [stylename=styleGb01] {
  display: flex;
  flex-direction: column;
}
[kui-groupbox].styleGb02 > [kui-canvas], [kui-groupbox] [stylename=styleGb02] > [kui-canvas], [kui-groupbox].styleGb01 > [kui-canvas], [kui-groupbox] [stylename=styleGb01] > [kui-canvas] {
  height: 100% !important;
}
[kui-groupbox].styleGb02 .title, [kui-groupbox] [stylename=styleGb02] .title, [kui-groupbox].styleGb01 .title, [kui-groupbox] [stylename=styleGb01] .title {
  flex-shrink: 0;
  height: 40px;
  margin: 0;
  padding: 0 12px;
  font-size: 14px;
}

[kui-groupbox].styleGb02 .title, [kui-groupbox] [stylename=styleGb02] .title {
  border-bottom: 1px solid var(--ControlGroupboxBorder);
}
[kui-groupbox].noMargin {
  margin: 0 !important;
}
[kui-groupbox].noMargin > [kui-canvas] {
  height: 100% !important;
  margin: 0 !important;
}
[kui-groupbox].noMarginCanvas > [kui-grid], [kui-groupbox].noMarginCanvas [kui-gridfill] {
  height: 100% !important;
  margin: 0 !important;
}
[kui-groupbox].noBorder {
  border: 0 !important;
  border-radius: 0;
}
[kui-groupbox].noBorder > [kui-canvas] {
  border: 0 !important;
}
[kui-groupbox].borderBottom {
  border-bottom: 1px solid var(--ControlGroupboxBorder) !important;
}

.contents[kui-canvas].styleGridBgImg {
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.controlTab[kui-tab].styleTabSide {
  display: flex;
}
.controlTab[kui-tab].styleTabSide .tabHeader {
  width: 30px;
  height: 100%;
  writing-mode: vertical-rl;
  text-orientation: sideways;
}
.controlTab[kui-tab].styleTabSide .tabHeader ul {
  height: unset;
}
.controlTab[kui-tab].styleTabSide .tabHeader ul > li a {
  width: 30px;
  height: unset;
  min-width: 30px;
  padding: 10px 6px;
  border: 0;
  border-top: 1px solid var(--BorderGrey);
  border-right: 0;
  border-left: 1px solid var(--BorderGrey);
  background-color: #f4f5f8;
  writing-mode: vertical-rl;
  text-orientation: mixed;
}
.controlTab[kui-tab].styleTabSide .tabHeader ul > li.on a {
  background-color: var(--MainBgColor);
  border-left: 3px solid var(--MainColor);
}
.controlTab[kui-tab].styleTabSide .tabHeader ul > li:last-child > a {
  border-bottom: 1px solid var(--BorderGrey);
}
.controlTab[kui-tab].styleTabSide .tabHeader .btnMoreTabLeft > i {
  transform: rotate(-90deg);
}
.controlTab[kui-tab].styleTabSide .tabHeader .btnMoreTabRight > i {
  transform: rotate(90deg);
}
.controlTab[kui-tab].styleTabSide > .contentsBox {
  height: 100%;
  margin-top: -30px;
  margin-left: 30px;
}

.layoutControl[kui-button].colorSub button {
  background-color: var(--ControlSubColor);
}
.layoutControl[kui-button].colorBlue button {
  background-color: var(--ControlColorBlue);
}
.layoutControl[kui-button].colorGreen button {
  background-color: var(--ControlColorGreen);
}
.layoutControl[kui-button].colorYellow button {
  background-color: var(--ControlColorYellow);
}
.layoutControl[kui-button].colorRed button {
  background-color: var(--ControlColorRed);
}
.layoutControl[kui-button].colorGrey button {
  background-color: var(--ControlColorGrey);
}
.layoutControl[kui-button].colorDefault button {
  background-color: var(--MainFontColor);
}
.layoutControl[kui-button].colorGrdGtoB button {
  background: linear-gradient(97deg, #1DB4FF -48.97%, #0EB16D 101.12%);
  color: #fff;
  font-weight: bold;
}
.layoutControl[kui-button].styleBtnLine button, .layoutControl[kui-button].styleBtnDefault button {
  border: 1px solid currentColor;
  background-color: #fff;
  color: var(--ButtonBgColor);
}
.layoutControl[kui-button].styleBtnLine button:hover, .layoutControl[kui-button].styleBtnLine button:focus, .layoutControl[kui-button].styleBtnDefault button:hover, .layoutControl[kui-button].styleBtnDefault button:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLine button:active, .layoutControl[kui-button].styleBtnDefault button:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLine.colorSub button, .layoutControl[kui-button].styleBtnDefault.colorSub button {
  border-color: var(--ControlSubColor);
  color: var(--ControlSubColor);
}
.layoutControl[kui-button].styleBtnLine.colorBlue button, .layoutControl[kui-button].styleBtnDefault.colorBlue button {
  border-color: var(--ControlColorBlue);
  color: var(--ControlColorBlue);
}
.layoutControl[kui-button].styleBtnLine.colorGreen button, .layoutControl[kui-button].styleBtnDefault.colorGreen button {
  border-color: var(--ControlColorGreen);
  color: var(--ControlColorGreen);
}
.layoutControl[kui-button].styleBtnLine.colorYellow button, .layoutControl[kui-button].styleBtnDefault.colorYellow button {
  border-color: var(--ControlColorYellow);
  color: var(--ControlColorYellow);
}
.layoutControl[kui-button].styleBtnLine.colorRed button, .layoutControl[kui-button].styleBtnDefault.colorRed button {
  border-color: var(--ControlColorRed);
  color: var(--ControlColorRed);
}
.layoutControl[kui-button].styleBtnLine.colorGrey button, .layoutControl[kui-button].styleBtnDefault.colorGrey button {
  border-color: var(--ControlColorGrey);
  color: var(--ControlColorGrey);
}
.layoutControl[kui-button].styleBtnLine.colorDefault button, .layoutControl[kui-button].styleBtnDefault.colorDefault button {
  border-color: var(--MainFontColor);
  color: var(--MainFontColor);
}
.layoutControl[kui-button].styleBtnLight button, .layoutControl[kui-button].styleBtnAdd button {
  background-color: transparent;
  color: var(--ButtonBgColor);
  box-shadow: 0px 0px 0px 0.25px inset currentColor;
}
.layoutControl[kui-button].styleBtnLight button:hover, .layoutControl[kui-button].styleBtnLight button:focus, .layoutControl[kui-button].styleBtnAdd button:hover, .layoutControl[kui-button].styleBtnAdd button:focus {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight button:active, .layoutControl[kui-button].styleBtnAdd button:active {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight button::after, .layoutControl[kui-button].styleBtnAdd button::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 100%;
  height: calc(100% - 4px);
  border-radius: 3px;
  background-color: currentColor;
  opacity: 0.1;
}
.layoutControl[kui-button].styleBtnLight.Dis button, .layoutControl[kui-button].styleBtnAdd.Dis button {
  box-shadow: none !important;
}
.layoutControl[kui-button].styleBtnLight.Dis button::after, .layoutControl[kui-button].styleBtnAdd.Dis button::after {
  background-color: transparent !important;
}
.layoutControl[kui-button].styleBtnLight.colorSub button, .layoutControl[kui-button].styleBtnAdd.colorSub button {
  color: var(--ControlSubColor);
  box-shadow: 0px 0px 0px 0.25px inset var(--ControlSubColor);
}
.layoutControl[kui-button].styleBtnLight.colorSub button:hover, .layoutControl[kui-button].styleBtnLight.colorSub button:focus, .layoutControl[kui-button].styleBtnAdd.colorSub button:hover, .layoutControl[kui-button].styleBtnAdd.colorSub button:focus {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorSub button:active, .layoutControl[kui-button].styleBtnAdd.colorSub button:active {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorSub button::after, .layoutControl[kui-button].styleBtnAdd.colorSub button::after {
  background-color: var(--ControlSubColor);
}
.layoutControl[kui-button].styleBtnLight.colorBlue button, .layoutControl[kui-button].styleBtnAdd.colorBlue button {
  color: var(--ControlColorBlue);
  box-shadow: 0px 0px 0px 0.25px inset var(--ControlColorBlue);
}
.layoutControl[kui-button].styleBtnLight.colorBlue button:hover, .layoutControl[kui-button].styleBtnLight.colorBlue button:focus, .layoutControl[kui-button].styleBtnAdd.colorBlue button:hover, .layoutControl[kui-button].styleBtnAdd.colorBlue button:focus {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorBlue button:active, .layoutControl[kui-button].styleBtnAdd.colorBlue button:active {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorBlue button::after, .layoutControl[kui-button].styleBtnAdd.colorBlue button::after {
  background-color: var(--ControlColorBlue);
}
.layoutControl[kui-button].styleBtnLight.colorGreen button, .layoutControl[kui-button].styleBtnAdd.colorGreen button {
  color: var(--ControlColorGreen);
  box-shadow: 0px 0px 0px 0.25px inset var(--ControlColorGreen);
}
.layoutControl[kui-button].styleBtnLight.colorGreen button:hover, .layoutControl[kui-button].styleBtnLight.colorGreen button:focus, .layoutControl[kui-button].styleBtnAdd.colorGreen button:hover, .layoutControl[kui-button].styleBtnAdd.colorGreen button:focus {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorGreen button:active, .layoutControl[kui-button].styleBtnAdd.colorGreen button:active {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorGreen button::after, .layoutControl[kui-button].styleBtnAdd.colorGreen button::after {
  background-color: var(--ControlColorGreen);
}
.layoutControl[kui-button].styleBtnLight.colorYellow button, .layoutControl[kui-button].styleBtnAdd.colorYellow button {
  color: var(--ControlColorYellow);
  box-shadow: 0px 0px 0px 0.25px inset var(--ControlColorYellow);
}
.layoutControl[kui-button].styleBtnLight.colorYellow button:hover, .layoutControl[kui-button].styleBtnLight.colorYellow button:focus, .layoutControl[kui-button].styleBtnAdd.colorYellow button:hover, .layoutControl[kui-button].styleBtnAdd.colorYellow button:focus {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorYellow button:active, .layoutControl[kui-button].styleBtnAdd.colorYellow button:active {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorYellow button::after, .layoutControl[kui-button].styleBtnAdd.colorYellow button::after {
  background-color: var(--ControlColorYellow);
}
.layoutControl[kui-button].styleBtnLight.colorRed button, .layoutControl[kui-button].styleBtnAdd.colorRed button {
  color: var(--ControlColorRed);
  box-shadow: 0px 0px 0px 0.25px inset var(--ControlColorRed);
}
.layoutControl[kui-button].styleBtnLight.colorRed button:hover, .layoutControl[kui-button].styleBtnLight.colorRed button:focus, .layoutControl[kui-button].styleBtnAdd.colorRed button:hover, .layoutControl[kui-button].styleBtnAdd.colorRed button:focus {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorRed button:active, .layoutControl[kui-button].styleBtnAdd.colorRed button:active {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorRed button::after, .layoutControl[kui-button].styleBtnAdd.colorRed button::after {
  background-color: var(--ControlColorRed);
}
.layoutControl[kui-button].styleBtnLight.colorGrey button, .layoutControl[kui-button].styleBtnAdd.colorGrey button {
  color: var(--ControlColorGrey);
  box-shadow: 0px 0px 0px 0.25px inset var(--ControlColorGrey);
}
.layoutControl[kui-button].styleBtnLight.colorGrey button:hover, .layoutControl[kui-button].styleBtnLight.colorGrey button:focus, .layoutControl[kui-button].styleBtnAdd.colorGrey button:hover, .layoutControl[kui-button].styleBtnAdd.colorGrey button:focus {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorGrey button:active, .layoutControl[kui-button].styleBtnAdd.colorGrey button:active {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorGrey button::after, .layoutControl[kui-button].styleBtnAdd.colorGrey button::after {
  background-color: var(--ControlColorGrey);
}
.layoutControl[kui-button].styleBtnLight.colorDefault button, .layoutControl[kui-button].styleBtnAdd.colorDefault button {
  color: var(--MainFontColor);
  box-shadow: 0px 0px 0px 0.25px inset var(--MainFontColor);
}
.layoutControl[kui-button].styleBtnLight.colorDefault button:hover, .layoutControl[kui-button].styleBtnLight.colorDefault button:focus, .layoutControl[kui-button].styleBtnAdd.colorDefault button:hover, .layoutControl[kui-button].styleBtnAdd.colorDefault button:focus {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorDefault button:active, .layoutControl[kui-button].styleBtnAdd.colorDefault button:active {
  box-shadow: 0px 0px 0px 0.25px inset currentColor, inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.15) 1px 2px 5px;
}
.layoutControl[kui-button].styleBtnLight.colorDefault button::after, .layoutControl[kui-button].styleBtnAdd.colorDefault button::after {
  background-color: var(--MainFontColor);
}

.layoutControl[kui-checkbox].styleCheckDefault {
  align-items: center;
}
.layoutControl[kui-checkbox].styleCheckDefault .check > input[type=checkbox] + label {
  align-items: center;
  flex-shrink: 1;
  word-break: break-word;
  white-space: normal;
}
.layoutControl[kui-checkbox].styleCheckDefault .check > input[type=checkbox] + label::after {
  top: calc(50% - 0.34em);
}
.layoutControl[kui-checkbox].checkRight {
  align-items: center;
}
.layoutControl[kui-checkbox].checkRight .check > input[type=checkbox] + label {
  flex-direction: row-reverse;
  align-items: center;
  flex-shrink: 1;
  text-align: right;
  word-break: break-word;
  white-space: normal;
}
.layoutControl[kui-checkbox].checkRight .check > input[type=checkbox] + label::before {
  margin: 0 0 0 5px;
}
.layoutControl[kui-checkbox].checkRight .check > input[type=checkbox] + label::after {
  top: calc(50% - 0.34em);
  left: unset;
  right: 0.2em;
}
.layoutControl[kui-checkbox].styleCheckToggle, .layoutControl[kui-checkbox].checkOnOff {
  color: var(--ControlBgColorSelected);
}
.layoutControl[kui-checkbox].styleCheckToggle .check, .layoutControl[kui-checkbox].checkOnOff .check {
  color: currentColor;
}
.layoutControl[kui-checkbox].styleCheckToggle .check > input[type=checkbox] + label, .layoutControl[kui-checkbox].checkOnOff .check > input[type=checkbox] + label {
  align-items: center;
  flex-shrink: 1;
  color: var(--MainFontColor);
  word-break: break-word;
  white-space: normal;
  transition: color 0.2s;
  cursor: pointer;
}
.layoutControl[kui-checkbox].styleCheckToggle .check > input[type=checkbox] + label::before, .layoutControl[kui-checkbox].checkOnOff .check > input[type=checkbox] + label::before {
  content: "";
  width: 2.5em;
  height: 1.333em;
  margin-top: -1px;
  border: 0;
  border-radius: 20px;
  background-color: var(--styleCheckToggleBgColor);
  transition: background-color 0.2s;
}
.layoutControl[kui-checkbox].styleCheckToggle .check > input[type=checkbox] + label::after, .layoutControl[kui-checkbox].checkOnOff .check > input[type=checkbox] + label::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.45em);
  left: 0.333em;
  width: 0.833em;
  height: 0.833em;
  border: 0;
  border-radius: 50%;
  background-color: #fff;
  transform: rotate(0);
  transition: left 0.2s;
}
.layoutControl[kui-checkbox].styleCheckToggle .check > input[type=checkbox]:checked + label, .layoutControl[kui-checkbox].checkOnOff .check > input[type=checkbox]:checked + label {
  color: currentColor;
}
.layoutControl[kui-checkbox].styleCheckToggle .check > input[type=checkbox]:checked + label::before, .layoutControl[kui-checkbox].checkOnOff .check > input[type=checkbox]:checked + label::before {
  background-color: var(--ControlBgColorSelected);
}
.layoutControl[kui-checkbox].styleCheckToggle .check > input[type=checkbox]:checked + label::after, .layoutControl[kui-checkbox].checkOnOff .check > input[type=checkbox]:checked + label::after {
  left: 1.3em;
}
.layoutControl[kui-checkbox].styleCheckToggle .check.labelNon > input[type=checkbox] + label, .layoutControl[kui-checkbox].checkOnOff .check.labelNon > input[type=checkbox] + label {
  color: var(--ControlFontColorNon);
}
.layoutControl[kui-checkbox].styleCheckToggle.toggleRight .check > input[type=checkbox] + label, .layoutControl[kui-checkbox].checkOnOff.toggleRight .check > input[type=checkbox] + label {
  display: flex;
  flex-direction: row-reverse;
  text-align: right;
}
.layoutControl[kui-checkbox].styleCheckToggle.toggleRight .check > input[type=checkbox] + label::before, .layoutControl[kui-checkbox].checkOnOff.toggleRight .check > input[type=checkbox] + label::before {
  margin-right: 0;
  margin-left: 5px;
}
.layoutControl[kui-checkbox].styleCheckToggle.toggleRight .check > input[type=checkbox] + label::after, .layoutControl[kui-checkbox].checkOnOff.toggleRight .check > input[type=checkbox] + label::after {
  left: unset;
  right: 1.333em;
  transition: right 0.2s;
}
.layoutControl[kui-checkbox].styleCheckToggle.toggleRight .check > input[type=checkbox]:checked + label::after, .layoutControl[kui-checkbox].checkOnOff.toggleRight .check > input[type=checkbox]:checked + label::after {
  left: unset;
  right: 0.333em;
}
.layoutControl[kui-checkbox].styleCheckToggle.Dis .check > input[type=checkbox] + label, .layoutControl[kui-checkbox].checkOnOff.Dis .check > input[type=checkbox] + label {
  color: var(--MainFontColorLighter);
}
.layoutControl[kui-checkbox].styleCheckToggle.Dis .check > input[type=checkbox] + label::before, .layoutControl[kui-checkbox].checkOnOff.Dis .check > input[type=checkbox] + label::before {
  background-color: #E9E9E9;
  cursor: not-allowed;
}
.layoutControl[kui-checkbox].styleCheckToggle.Dis .check > input[type=checkbox]:checked + label, .layoutControl[kui-checkbox].checkOnOff.Dis .check > input[type=checkbox]:checked + label {
  color: var(--MainFontColorLighter);
}
.layoutControl[kui-checkbox].styleCheckToggle.Dis .check > input[type=checkbox]:checked + label::before, .layoutControl[kui-checkbox].checkOnOff.Dis .check > input[type=checkbox]:checked + label::before {
  background-color: rgba(var(--MainColor-rgb), 0.4);
}
.layoutControl[kui-checkbox].styleCheckHL {
  padding-top: 1px;
  color: var(--ControlBgColorSelected);
}
.layoutControl[kui-checkbox].styleCheckHL .check {
  width: 100%;
  padding: 7px 5px;
}
.layoutControl[kui-checkbox].styleCheckHL .check::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 100%;
  height: calc(100% - 4px);
  border-radius: 3px;
  background-color: currentColor;
  opacity: 0.1;
}
.layoutControl[kui-checkbox].styleCheckHL .check > input[type=checkbox] + label {
  align-items: flex-start;
  flex-shrink: 1;
  margin: 0;
  word-break: break-all;
  white-space: normal;
}
.layoutControl[kui-checkbox].styleCheckHL .check > input[type=checkbox] + label::before {
  align-self: center;
  width: 1.25em;
  height: 1.25em;
  margin-top: -1px;
}
.layoutControl[kui-checkbox].styleCheckHL .check > input[type=checkbox] + label::after {
  top: calc(50% - 0.37em);
  left: 0.292em;
}
.layoutControl[kui-checkbox].styleCheckHL.Dis .check::before {
  background-color: #222;
}
.layoutControl[kui-checkbox].styleCheckHL.Dis .check > input[type=checkbox] + label::before {
  border-color: #d5d5d5;
  background-color: #d5d5d5;
}
.layoutControl[kui-checkbox].styleCheckHL.Dis .check > input[type=checkbox] + label::after {
  border-color: #999;
}
.layoutControl[kui-checkbox].styleCheckboxIcon .check {
  color: currentColor;
}
.layoutControl[kui-checkbox].styleCheckboxIcon .check > input[type=checkbox] + label::before {
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  background-color: currentColor;
  -webkit-mask-size: cover;
}
.layoutControl[kui-checkbox].styleCheckboxIcon .check > input[type=checkbox] + label::after {
  display: none;
}
.layoutControl[kui-checkbox].styleCheckboxIcon .check > input[type=checkbox]:checked + label {
  color: var(--ButtonBgColor);
}
.layoutControl[kui-checkbox].styleCheckboxIcon.Favorite .check > input[type=checkbox] + label::before {
  -webkit-mask-image: url("../../Images/Icon/B_021_001.svg");
  mask-image: url("../../Images/Icon/B_021_001.svg");
}

.layoutControl[kui-optionlist].styleRadioTab, .layoutControl[kui-optionlist].styleRadioTabHrz {
  color: var(--ControlBgColorSelected);
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: 0 !important;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList {
  margin-top: 0;
  border-radius: 3px;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio {
  justify-content: center;
  width: 100%;
  height: 100%;
  margin: 0;
  margin-left: -1px;
  padding: 0 5px;
  border: 1px solid #ccc;
  overflow: hidden;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio:first-child, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio:first-child {
  margin-left: 0;
  border-radius: 3px 0 0 3px;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio:last-child, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio:last-child {
  border-radius: 0 3px 3px 0;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio label, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio label {
  display: block;
  max-width: 100%;
  margin: 0;
  color: #999;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio label::before, .layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio label::after, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio label::before, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio label::after {
  display: none;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio.devChecked, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio.devChecked {
  margin: 0 0 0 -1px;
  border: 1px solid currentColor;
  z-index: 1;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio.devChecked::before, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio.devChecked::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: currentColor;
  opacity: 0.1;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio.devChecked:first-child, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio.devChecked:first-child {
  margin-left: 0;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio input:checked + label, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio input:checked + label {
  color: currentColor;
}
.layoutControl[kui-optionlist].styleRadioTab .controlOption .controlOptionList .radio input:focus + label, .layoutControl[kui-optionlist].styleRadioTabHrz .controlOption .controlOptionList .radio input:focus + label {
  padding: 0 5px;
  border: 1px solid var(--ControlFontColor);
  outline: none;
}
.layoutControl[kui-optionlist].styleRadioTab .multiRadio, .layoutControl[kui-optionlist].styleRadioTabHrz .multiRadio {
  width: 100%;
  color: currentColor;
  line-height: unset;
}
.layoutControl[kui-optionlist].styleRadioTab .multiRadio .controlOption, .layoutControl[kui-optionlist].styleRadioTabHrz .multiRadio .controlOption {
  flex-wrap: nowrap;
  width: 100%;
  border: 0;
}
.layoutControl[kui-optionlist].styleRadioTab .multiRadio .controlOption .title, .layoutControl[kui-optionlist].styleRadioTabHrz .multiRadio .controlOption .title {
  position: relative;
  top: unset;
  left: unset;
  margin: 0 0 8px 0;
  line-height: 1em;
}
.layoutControl[kui-optionlist].styleRadioTabHrz .multiRadio .controlOption {
  flex-direction: row;
  align-items: center;
}
.layoutControl[kui-optionlist].styleRadioTabHrz .multiRadio .controlOption .title {
  width: 110px;
  margin: 0 5px 0 0;
  padding: 0;
  text-align: right;
  overflow: initial;
  word-break: break-all;
  white-space: normal;
}
.layoutControl[kui-optionlist].styleRadioTabHrz .multiRadio .controlOption .controlOptionList {
  flex-grow: 0;
  width: 100%;
  min-height: 26px;
}
.layoutControl[kui-optionlist].styleRadioTabHrz .multiRadio .controlOption .controlOptionList .radio {
  padding: 0 10px;
}
.layoutControl[kui-optionlist].styleRadioHrz .controlOption {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  height: 100%;
  padding: 0;
  border: 0;
}
.layoutControl[kui-optionlist].styleRadioHrz .controlOption .title {
  position: relative;
  top: unset;
  left: unset;
  width: 110px;
  padding: 0;
  margin: 0 5px 0 0;
  text-align: right;
  overflow: initial;
  word-break: break-all;
  white-space: normal;
}
.layoutControl[kui-optionlist].styleRadioHrz .controlOption .controlOptionList {
  flex-grow: 0;
  width: unset;
  min-height: 26px;
  margin-top: 0;
  border: 1px solid var(--BorderGrey) Light;
  border-radius: 3px;
}
.layoutControl[kui-optionlist].styleRadioHrz .controlOption .controlOptionList .radio {
  padding: 0 10px;
}
.layoutControl[kui-optionlist].styleRadioHL {
  color: var(--ControlBgColorSelected);
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio {
  width: 100%;
  color: currentColor;
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption {
  flex-wrap: unset;
  flex-direction: column;
  width: 100%;
  padding: 5px;
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption .title {
  margin-top: -10px;
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption .controlOptionList .radio {
  width: 100%;
  height: 100%;
  min-height: 20px;
  padding: 0 5px;
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption .controlOptionList .radio.devChecked::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  background-color: currentColor;
  opacity: 0.1;
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption .controlOptionList .radio input:checked + label::before {
  border-color: currentColor;
  background-color: currentColor;
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption .controlOptionList .radio input:checked + label::after {
  top: calc(50% - 0.25em);
  left: 0.35em;
  width: 0.5em;
  height: 0.5em;
  background-color: #fff;
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption .controlOptionList .radio:last-child {
  margin-right: 0;
}
.layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption .controlOptionList.Vertical .radio, .layoutControl[kui-optionlist].styleRadioHL .multiRadio .controlOption .controlOptionList.vertical .radio {
  margin-bottom: 0px;
}

.styleScroll.layoutControl[kui-optionlist] .controlOption {
  padding-top: 0 !important;
  padding-right: 0;
  padding-bottom: 0;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption.TitleHidden .controlOptionList {
  height: 100%;
  margin: 0;
  padding: 4px 0 2px 0;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .title {
  margin-top: -6px;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList {
  flex-wrap: wrap;
  height: calc(100% - 10px);
  margin-top: 4px;
  padding-bottom: 2px;
  overflow-y: auto;
  overflow-x: hidden;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .radio, .styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .check {
  margin: 3px 5px 3px 0;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .radio input + label, .styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .check input + label {
  align-items: flex-start;
  flex-shrink: 1;
  line-height: 13px;
  white-space: inherit;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .radio input + label::before, .styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .check input + label::before {
  flex-shrink: 0;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .radio input + label::after, .styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .check input + label::after {
  top: 3px;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .check {
  width: unset;
  margin: 5px 10px 4px 0;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .check input + label::before {
  margin-top: -2px;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList .check input + label::after {
  top: 2px;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList.Vertical, .styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList.vertical {
  flex-direction: row;
}
.styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList.Vertical .radio, .styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList.Vertical .check, .styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList.vertical .radio, .styleScroll.layoutControl[kui-optionlist] .controlOption .controlOptionList.vertical .check {
  flex-basis: 100%;
}
.styleScroll.layoutControl[kui-optionlist].styleRadioHL .multiRadio {
  width: 100%;
}
.styleScroll.layoutControl[kui-optionlist].styleRadioHL .controlOption .controlOptionList .radio {
  display: inline-flex;
  width: auto;
  height: 100%;
  margin-top: 0;
  margin-bottom: 0;
}
.styleScroll.layoutControl[kui-optionlist].styleRadioHL .controlOption .controlOptionList .radio input:checked + label::after {
  top: 4px;
}
.styleScroll.layoutControl[kui-optionlist].styleRadioHL.vertical .controlOption .controlOptionList .radio {
  height: auto;
}
.styleScroll.layoutControl[kui-label] {
  padding-right: 0 !important;
}
.styleScroll.layoutControl[kui-label] > label {
  align-items: flex-start;
  overflow-y: auto;
  word-break: break-all;
  z-index: 1;
}

.layoutControl[kui-label].styleLabelHelp {
  padding-left: 3em;
  background-position: -1000px;
}
.layoutControl[kui-label].styleLabelHelp::before {
  content: "";
  position: calc(50% - 1em);
  top: 6px;
  width: 2em;
  height: 2em;
  background-image: inherit;
  background-repeat: no-repeat;
  background-size: contain;
}
.layoutControl[kui-label].styleLabelHelp label {
  color: inherit;
  font-size: inherit;
  word-break: break-word;
}
.layoutControl[kui-label].styleLabelHelpLine {
  color: var(--ButtonBgColor);
}
.layoutControl[kui-label].styleLabelHelpLine label {
  padding: 0 0 0 8px;
  border-left: 2px solid currentColor;
  color: inherit;
}
.layoutControl[kui-label].styleLabelHelpbox {
  position: absolute;
  padding: 0.625em;
  color: var(--ButtonBgColor);
}
.layoutControl[kui-label].styleLabelHelpbox.icon {
  padding-left: 3em;
  background-position: -1000px;
}
.layoutControl[kui-label].styleLabelHelpbox.icon::before {
  content: "";
  position: absolute;
  top: calc(50% - 1.1665em);
  left: 6px;
  width: 2.333em;
  height: 2.333em;
  background-image: inherit;
  background-repeat: no-repeat;
  background-size: contain;
}
.layoutControl[kui-label].styleLabelHelpbox::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 100%;
  height: calc(100% - 4px);
  border-radius: 5px;
  background-color: currentColor;
  opacity: 0.1;
}
.layoutControl[kui-label].styleLabelHelpbox > label {
  word-break: break-word;
}
.layoutControl[kui-label].styleLabelDivLine {
  background-color: var(--ControlGroupboxBorder);
}
.layoutControl[kui-label].styleLabelDivLineHrz {
  height: 1px !important;
  padding: 0;
  background-color: var(--ControlGroupboxBorder);
}
.layoutControl[kui-label].styleLabelCircle {
  padding: 7px;
}
.layoutControl[kui-label].styleLabelCircle > label {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: currentColor;
}
.layoutControl[kui-label].textCenter label {
  justify-content: center;
  text-align: center;
}

.layoutControl[kui-datebox].styleFromTo > label::after {
  content: "";
  position: absolute;
  top: -1px;
  left: calc(100% + 5px);
  width: 164px;
  height: 100%;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
  background-color: var(--ControlBgColor);
}
.layoutControl[kui-datebox].styleFromTo > input, .layoutControl[kui-datebox].styleFromTo + .layoutControl[kui-datebox] > input {
  border: 0;
  background-color: transparent;
  text-align: center;
}

.layoutControl.Dis.styleTextDis.vertical > .labelCaption::after, .layoutControl.Dis.styleTextDisClean.vertical > .labelCaption::after, .layoutControl.Dis.styleTextDis02.vertical > .labelCaption::after, .layoutControl.Dis.styleTextDisClean02.vertical > .labelCaption::after {
  display: none;
}
.layoutControl.Dis.styleTextDis.vertical > input, .layoutControl.Dis.styleTextDis.vertical select, .layoutControl.Dis.styleTextDis.vertical textarea, .layoutControl.Dis.styleTextDisClean.vertical > input, .layoutControl.Dis.styleTextDisClean.vertical select, .layoutControl.Dis.styleTextDisClean.vertical textarea, .layoutControl.Dis.styleTextDis02.vertical > input, .layoutControl.Dis.styleTextDis02.vertical select, .layoutControl.Dis.styleTextDis02.vertical textarea, .layoutControl.Dis.styleTextDisClean02.vertical > input, .layoutControl.Dis.styleTextDisClean02.vertical select, .layoutControl.Dis.styleTextDisClean02.vertical textarea {
  padding-left: 0;
}
.layoutControl.Dis.styleTextDis > .labelCaption, .layoutControl.Dis.styleTextDisClean > .labelCaption, .layoutControl.Dis.styleTextDis02 > .labelCaption, .layoutControl.Dis.styleTextDisClean02 > .labelCaption {
  color: var(--MainFontColor) !important;
}
.layoutControl.Dis.styleTextDis > .labelCaption::after, .layoutControl.Dis.styleTextDisClean > .labelCaption::after, .layoutControl.Dis.styleTextDis02 > .labelCaption::after, .layoutControl.Dis.styleTextDisClean02 > .labelCaption::after {
  content: "";
  position: absolute;
  top: calc(50% - 6px);
  right: -5px;
  width: 1px;
  height: 12px;
  background-color: #ccc;
}
.layoutControl.Dis.styleTextDis > .labelCaption.labelNon, .layoutControl.Dis.styleTextDisClean > .labelCaption.labelNon, .layoutControl.Dis.styleTextDis02 > .labelCaption.labelNon, .layoutControl.Dis.styleTextDisClean02 > .labelCaption.labelNon {
  color: var(--MainFontColor);
}
.layoutControl.Dis.styleTextDis > input, .layoutControl.Dis.styleTextDisClean > input, .layoutControl.Dis.styleTextDis02 > input, .layoutControl.Dis.styleTextDisClean02 > input {
  padding: 0 0 0 5px;
  border: 0px !important;
  background-color: transparent !important;
  color: unset;
  font-size: 1em;
  font-weight: bold;
  cursor: default;
}
.layoutControl.Dis.styleTextDis > input:hover, .layoutControl.Dis.styleTextDisClean > input:hover, .layoutControl.Dis.styleTextDis02 > input:hover, .layoutControl.Dis.styleTextDisClean02 > input:hover {
  border: 0px transparent solid !important;
  background-color: transparent !important;
  cursor: default !important;
}
.layoutControl.Dis.styleTextDis > input:focus, .layoutControl.Dis.styleTextDisClean > input:focus, .layoutControl.Dis.styleTextDis02 > input:focus, .layoutControl.Dis.styleTextDisClean02 > input:focus {
  box-shadow: none !important;
  cursor: default !important;
}
.layoutControl.Dis.styleTextDis select, .layoutControl.Dis.styleTextDisClean select, .layoutControl.Dis.styleTextDis02 select, .layoutControl.Dis.styleTextDisClean02 select {
  padding: 0 5px;
  border: 0 !important;
  background-color: transparent !important;
  color: inherit;
  font-weight: bold;
  text-align: left;
  appearance: none;
}
.layoutControl.Dis.styleTextDis select:hover, .layoutControl.Dis.styleTextDisClean select:hover, .layoutControl.Dis.styleTextDis02 select:hover, .layoutControl.Dis.styleTextDisClean02 select:hover {
  border: 0px transparent solid !important;
  background-color: transparent !important;
  cursor: default !important;
}
.layoutControl.Dis.styleTextDis select:focus, .layoutControl.Dis.styleTextDisClean select:focus, .layoutControl.Dis.styleTextDis02 select:focus, .layoutControl.Dis.styleTextDisClean02 select:focus {
  box-shadow: none !important;
  cursor: default !important;
}
.layoutControl.Dis.styleTextDis .btnCodeHelp, .layoutControl.Dis.styleTextDisClean .btnCodeHelp, .layoutControl.Dis.styleTextDis02 .btnCodeHelp, .layoutControl.Dis.styleTextDisClean02 .btnCodeHelp {
  display: none;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox] > .labelCaption, .layoutControl.Dis.styleTextDisClean[kui-multitextbox] > .labelCaption, .layoutControl.Dis.styleTextDis02[kui-multitextbox] > .labelCaption, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox] > .labelCaption {
  padding: 3px 0 0 0;
  align-items: flex-start;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox] > .labelCaption::after, .layoutControl.Dis.styleTextDisClean[kui-multitextbox] > .labelCaption::after, .layoutControl.Dis.styleTextDis02[kui-multitextbox] > .labelCaption::after, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox] > .labelCaption::after {
  top: 5px;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox] textarea, .layoutControl.Dis.styleTextDisClean[kui-multitextbox] textarea, .layoutControl.Dis.styleTextDis02[kui-multitextbox] textarea, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox] textarea {
  margin: 0 5px;
  padding: 1px 5px;
  border: 0 !important;
  background-color: transparent !important;
  color: inherit;
  line-height: 1em;
  z-index: 1;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox] textarea:hover, .layoutControl.Dis.styleTextDisClean[kui-multitextbox] textarea:hover, .layoutControl.Dis.styleTextDis02[kui-multitextbox] textarea:hover, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox] textarea:hover {
  border: 0 !important;
  background-color: transparent !important;
  cursor: default !important;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox] textarea:focus, .layoutControl.Dis.styleTextDisClean[kui-multitextbox] textarea:focus, .layoutControl.Dis.styleTextDis02[kui-multitextbox] textarea:focus, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox] textarea:focus {
  box-shadow: none;
  transform: none;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox].vertical, .layoutControl.Dis.styleTextDisClean[kui-multitextbox].vertical, .layoutControl.Dis.styleTextDis02[kui-multitextbox].vertical, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox].vertical {
  flex-direction: column;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox].vertical > .labelCaption, .layoutControl.Dis.styleTextDisClean[kui-multitextbox].vertical > .labelCaption, .layoutControl.Dis.styleTextDis02[kui-multitextbox].vertical > .labelCaption, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox].vertical > .labelCaption {
  width: 100% !important;
  height: 20px;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox].vertical > .labelCaption::after, .layoutControl.Dis.styleTextDisClean[kui-multitextbox].vertical > .labelCaption::after, .layoutControl.Dis.styleTextDis02[kui-multitextbox].vertical > .labelCaption::after, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox].vertical > .labelCaption::after {
  display: none;
}
.layoutControl.Dis.styleTextDis[kui-multitextbox].vertical > textarea, .layoutControl.Dis.styleTextDisClean[kui-multitextbox].vertical > textarea, .layoutControl.Dis.styleTextDis02[kui-multitextbox].vertical > textarea, .layoutControl.Dis.styleTextDisClean02[kui-multitextbox].vertical > textarea {
  width: 100% !important;
  height: 100%;
  margin: 0;
  padding-left: 0;
}
.layoutControl.Dis.styleTextDisClean > .labelCaption::after, .layoutControl.Dis.styleTextDisClean02 > .labelCaption::after {
  display: none;
}
.layoutControl.Dis.styleTextDis02 > .labelCaption, .layoutControl.Dis.styleTextDisClean02 > .labelCaption {
  color: var(--MainFontColorLighter) !important;
  font-size: 1em;
}
.layoutControl.Dis.styleTextDis02 > input, .layoutControl.Dis.styleTextDisClean02 > input {
  font-weight: normal;
  font-size: 1em;
}
.layoutControl.Dis.styleTextDisBox > .labelCaption {
  justify-content: flex-start;
  padding-left: 5px;
  color: currentColor;
  text-align: left;
  z-index: 1;
}
.layoutControl.Dis.styleTextDisBox > input {
  padding-right: 5px;
  border: 0 !important;
  background-color: transparent !important;
  color: currentColor !important;
  font-weight: bold;
  text-align: right;
  cursor: default;
  z-index: 1;
}
.layoutControl.Dis.styleTextDisBox > input:hover {
  border: 0px transparent solid !important;
  background-color: transparent !important;
  cursor: default !important;
}
.layoutControl.Dis.styleTextDisBox > input:focus {
  box-shadow: none !important;
  cursor: default !important;
}
.layoutControl.Dis.styleTextDisBox select {
  padding: 0 5px;
  border: 0 !important;
  background-color: transparent !important;
  color: currentColor !important;
  font-weight: bold;
  text-align: right;
  appearance: none;
}
.layoutControl.Dis.styleTextDisBox::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 100%;
  height: calc(100% - 4px);
  border-radius: 3px;
  background-color: currentColor;
  opacity: 0.1;
}
.layoutControl.Dis.styleTextDisBox:hover {
  cursor: default !important;
}
.layoutControl.Dis.styleTextDisBox.colorGrey {
  color: var(--MainFontColor) !important;
}
.layoutControl.Dis.styleTextDisBox.vertical .labelCaption {
  align-items: flex-start;
  padding-top: 3px;
}
.layoutControl.Dis.styleTextDisBox.vertical > input {
  padding: 0 5px;
}
.layoutControl.Dis.styleTextDisBox[kui-multitextbox] > .labelCaption {
  align-items: flex-start;
  padding: 5px;
}
.layoutControl.Dis.styleTextDisBox[kui-multitextbox] textarea {
  padding-left: 5px;
  border: 0 !important;
  background-color: transparent !important;
  color: inherit;
  z-index: 1;
}
.layoutControl.Dis.styleTextDisBox[kui-multitextbox] textarea:hover {
  border: 0 !important;
  background-color: transparent !important;
  cursor: default !important;
}
.layoutControl.Dis.styleTextDisBox[kui-multitextbox] textarea:focus {
  box-shadow: none;
  transform: none;
}

@font-face {
  font-family: "Code128";
  src: url("/fonts/Code128.ttf") format("truetype");
}
.layoutControl.styleTextHL > .labelCaption {
  font-weight: bold;
}
.layoutControl.styleTextHL > input[type=text] {
  border-width: 2px;
  border-color: currentColor;
}
.layoutControl.styleTextHL .comboBox {
  color: currentColor;
}
.layoutControl.styleTextHL .comboBox select {
  border: 2px solid currentColor;
  color: currentColor;
}
.layoutControl.styleTextHL.colorBlue .comboBox select {
  border-color: #3466FF !important;
  color: #3466FF !important;
}
.layoutControl.styleTextHL.colorGreen .comboBox select {
  border-color: #15b065 !important;
  color: #15b065 !important;
}
.layoutControl.styleTextHL.colorYellow .comboBox select {
  border-color: #FBB024 !important;
  color: #FBB024 !important;
}
.layoutControl.styleTextHL.colorRed .comboBox select {
  border-color: #F05150 !important;
  color: #F05150 !important;
}
.layoutControl.styleTextHL.colorGrey .comboBox select {
  border-color: #999999 !important;
  color: #999999 !important;
}
.layoutControl.styleBarcode {
  font-family: "Code128";
}
.layoutControl.styleBarcode input[type=text] {
  font-family: "Code128";
}
.layoutControl.styleTextLine > .labelCaption {
  justify-content: flex-start;
}
.layoutControl.styleTextLine > input[type=text] {
  border: 0;
  border-bottom: 1px solid var(--ControlBorderColor);
  border-radius: 0;
}

.layoutControl[kui-multitextbox].captionTop .labelCaption {
  align-items: flex-start;
  padding-top: 5px;
}

.layoutControl.MultiCodehelp.captionTop > .labelCaption {
  align-items: flex-start;
  padding-top: 5px;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > input {
  padding: 0;
  margin-right: 30px;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea {
  padding: 0;
  margin-right: 30px;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: unset;
  width: 100%;
  padding: 2px 4px 4px 4px;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea .multiCodeItem {
  width: 100%;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea .multiCodeItem:hover input[type=checkbox]:checked + label {
  background-color: #D5E1EB;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea .multiCodeItem > input[type=checkbox] + label {
  width: 100%;
  color: var(--MainFontColor);
  pointer-events: none;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea .multiCodeItem > input[type=checkbox]:checked + label {
  background-color: #E2EBF3;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea .multiCodeItem > input[type=checkbox]:checked + label + .btnDel {
  color: currentColor;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea .multiCodeItem > .btnDel {
  cursor: pointer;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea .multiCodeItem > .btnDel::before, .layoutControl.MultiCodehelp.styleMultiCodeList > .MultiCodehelpListArea .itemListArea .multiCodeItem > .btnDel::after {
  content: "";
  position: absolute;
  top: calc(50% - 4px);
  left: 6px;
  width: 1px;
  height: 10px;
  background-color: #F04444;
  opacity: 0.7;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .btnCodeHelp {
  top: 2px;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 3px;
  border: 1px solid var(--MainColor);
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .btnCodeHelp > i {
  background-color: var(--MainColor);
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .btnCodeHelpAllDel {
  top: 33px;
  right: 0;
  width: 26px;
  height: 26px;
  border-radius: 4px;
  background-color: transparent;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .btnCodeHelpAllDel:hover {
  background-color: #EDEEEF;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .btnCodeHelpAllDel::before {
  top: 5px;
  left: 5px;
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-color: #808080;
  transform: none;
  mask-image: url("../../Images/icoCodehelp.svg?var(--ImageVersion)");
  -webkit-mask-image: url("../../Images/icoCodehelp.svg?var(--ImageVersion)");
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: -16px 0;
  -webkit-mask-position: -16px 0;
}
.layoutControl.MultiCodehelp.styleMultiCodeList > .btnCodeHelpAllDel::after {
  display: none;
}

.icon.layoutControl[kui-textbox], .icon.layoutControl[kui-datebox], .icon.layoutControl[kui-codehelp], .icon.layoutControl[kui-maskbox], .icon.layoutControl[kui-floatbox], .icon.layoutControl[kui-multitextbox] {
  background-position: -1000px;
}
.icon.layoutControl[kui-button] {
  background-position: -1000px;
  background-repeat: no-repeat;
}
.icon.layoutControl[kui-button] > button {
  background-position: -1000px;
  background-repeat: inherit;
  background-image: inherit;
}
.icon.layoutControl[kui-button] > button::before {
  content: "";
  display: inline-block;
  width: 1.75em;
  height: 1.75em;
  background-repeat: inherit;
  background-position: left center;
  background-image: inherit;
  background-size: contain;
}
.icon.layoutControl > input,
.icon.layoutControl > textarea {
  padding-left: 30px !important;
  background-repeat: no-repeat;
  background-position: left center;
  background-image: inherit !important;
  background-size: inherit;
}
.icon.layoutControl.caption > .labelCaption {
  justify-content: flex-start;
  background-image: inherit;
  background-repeat: no-repeat;
  background-position: -1000px;
  text-align: left;
}
.icon.layoutControl.caption > .labelCaption::before {
  content: "";
  flex-shrink: 0;
  display: inline-block;
  width: 2em;
  height: 2em;
  background-image: inherit !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}
.icon.layoutControl.caption > input,
.icon.layoutControl.caption > textarea {
  padding-left: 4px !important;
  background-image: none !important;
}
.icon.layoutControl[kui-label] {
  padding-left: 1.75em;
  background-position: -1000px;
}
.icon.layoutControl[kui-label] > label {
  background-position: -1000px;
}
.icon.layoutControl[kui-label]::before {
  content: "";
  position: absolute;
  top: calc(50% - 0.875em);
  left: 0;
  width: 1.75em;
  height: 1.75em;
  background-image: inherit;
  background-repeat: no-repeat;
  background-size: contain;
}

.googleIcon[kui-groupbox] .title > i::before, .googleIcon[kui-button]::before, .googleIcon[kui-label] label {
  display: inline-block;
  font-family: "Material Symbols Outlined";
  font-variation-settings: "FILL" 1;
  font-weight: normal;
  font-style: normal;
  font-size: 1em;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.googleIcon[kui-button]::before {
  content: "";
}
.googleIcon[kui-groupbox] .title > i {
  background-image: none;
}
.googleIcon[kui-groupbox] .title > i::before {
  content: "";
}
.googleIcon.colorGradient[kui-label] label, .googleIcon.iconGradient[kui-label] label {
  background: linear-gradient(90deg, #B0BEC5, #768B95);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.googleIcon.colorSub {
  color: var(--ControlSubColor) !important;
}
.googleIcon.colorBlue {
  color: var(--ControlColorBlue) !important;
}
.googleIcon.colorGreen {
  color: var(--ControlColorGreen) !important;
}
.googleIcon.colorYellow {
  color: var(--ControlColorYellow) !important;
}
.googleIcon.colorRed {
  color: var(--ControlColorRed) !important;
}
.googleIcon.colorGrey {
  color: var(--ControlColorGrey) !important;
}
.googleIcon.colorDefault {
  color: var(--MainFontColor) !important;
}

.layoutControl.text12 {
  font-size: var(--fs12);
}
.layoutControl.text13 {
  font-size: var(--fs13);
}
.layoutControl.text14 {
  font-size: var(--fs14);
}
.layoutControl.text15 {
  font-size: var(--fs15);
}
.layoutControl.text16 {
  font-size: var(--fs16);
}
.layoutControl.text17 {
  font-size: var(--fs17);
}
.layoutControl.text18 {
  font-size: var(--fs18);
}
.layoutControl.text19 {
  font-size: var(--fs19);
}
.layoutControl.text20 {
  font-size: var(--fs20);
}
.layoutControl.text21 {
  font-size: var(--fs21);
}
.layoutControl.text22 {
  font-size: var(--fs22);
}
.layoutControl.text23 {
  font-size: var(--fs22);
}
.layoutControl.text24 {
  font-size: var(--fs24);
}
.layoutControl.text25 {
  font-size: var(--fs25);
}
.layoutControl.text26 {
  font-size: var(--fs26);
}
.layoutControl.text27 {
  font-size: var(--fs27);
}
.layoutControl.text28 {
  font-size: var(--fs28);
}
.layoutControl.text29 {
  font-size: var(--fs29);
}
.layoutControl.text30 {
  font-size: var(--fs30);
}
.layoutControl.textBold {
  font-weight: bold;
}
.layoutControl.colorMain {
  color: var(--ButtonBgColor) !important;
}
.layoutControl.colorSub {
  color: var(--ControlSubColor) !important;
}
.layoutControl.colorBlue {
  color: var(--ControlColorBlue) !important;
}
.layoutControl.colorGreen {
  color: var(--ControlColorGreen) !important;
}
.layoutControl.colorYellow {
  color: var(--ControlColorYellow) !important;
}
.layoutControl.colorRed {
  color: var(--ControlColorRed) !important;
}
.layoutControl.colorGrey {
  color: var(--ControlColorGrey) !important;
}
.layoutControl.colorDefault {
  color: var(--MainFontColor) !important;
}

.layoutControl.vertical {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 2px;
}
.layoutControl.vertical > .labelCaption {
  flex-shrink: 0;
  justify-content: flex-start;
  width: 100% !important;
  height: var(--verticalCaptionHeight);
  padding: 0;
  text-align: left;
}
.layoutControl.vertical > .comboBox,
.layoutControl.vertical > .comboBox > select,
.layoutControl.vertical > textarea,
.layoutControl.vertical > input {
  display: flex !important;
  width: 100% !important;
  height: 100%;
  min-height: unset;
  margin-left: 0;
  flex-shrink: unset;
}
.layoutControl.vertical.CodeHelp > .btnCodeHelp {
  top: var(--verticalCaptionHeight);
  height: calc(100% - var(--verticalCaptionHeight));
}
.layoutControl.vertical[captionwidth="0px"] > a {
  top: 0px;
  height: 100%;
}

.layoutControl.styleTextLineBox {
  display: flex;
  justify-content: space-between;
  padding: 0 5px;
  border: 1px solid currentColor;
  border-radius: 3px;
  overflow: hidden;
}
.layoutControl.styleTextLineBox.colorGrey {
  border-color: #CBCDDB;
}
.layoutControl.styleTextLineBox.colorGrey > input {
  color: var(--MainFontColor);
}
.layoutControl.styleTextLineBox > .labelCaption {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  color: #777 !important;
  z-index: 1;
}
.layoutControl.styleTextLineBox > input {
  flex-shrink: unset;
  height: 100%;
  margin: 0;
  padding-right: 5px;
  border: 0px;
  border-radius: 0px;
  background-color: transparent;
  font-size: 1.333em;
  font-weight: bold;
  text-align: right;
}
.layoutControl.styleTextLineBox > input:focus {
  box-shadow: none;
}
.layoutControl.styleTextLineBox.CodeHelp > input {
  padding-right: 30px;
}
.layoutControl.styleTextLineBox.CodeHelp > .btnCodeHelp {
  right: 4px;
}
.layoutControl.styleTextLineBox.Point > input {
  color: #15b065 !important;
}
.layoutControl.styleTextLineBox.Dis {
  border: 0px Solid transparent !important;
  background-color: #EDEEF3;
}
.layoutControl.styleTextLineBox.Dis > input {
  padding-right: 0px;
  border: 0px Solid transparent !important;
  background-color: transparent !important;
}

.layoutControl.updated input, .layoutControl.updated textarea, .layoutControl.updated select {
  border: 1px solid #3466FF !important;
}
.layoutControl.updated.upload {
  border: 1px solid #3466FF !important;
}
.layoutControl.updated::after {
  content: "U";
  position: absolute;
  top: 3px;
  right: -13px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  background-color: #3466FF;
  color: #fff;
  font-size: var(--fs10);
  font-weight: bold;
  line-height: 10px;
}
.layoutControl.updated:hover input, .layoutControl.updated:hover textarea, .layoutControl.updated:hover select {
  border: 1px solid #3466FF !important;
}

.upload.updated {
  border: 1px solid #3466FF !important;
}
.upload.updated .uploadNoFile {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border: 0;
}
.upload.updated::after {
  content: "U";
  position: absolute;
  top: 3px;
  right: -14px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  background-color: #3466FF;
  color: #fff;
  font-size: var(--fs10);
  font-weight: bold;
  line-height: 10px;
}
.upload.updated:hover {
  border: 1px solid #3466FF !important;
}

.layoutControl[kui-label].styleLabelBold > label {
  align-items: unset;
  font-weight: bold;
}
.layoutControl[kui-label].styleLabelLine label {
  background-color: #ebebeb;
}
.layoutControl[kui-label].styleLabelQuestion > label {
  align-items: unset;
  padding: 1em;
  line-height: 1.5em;
  overflow-y: auto;
}
.layoutControl[kui-label].styleLabelQuestion > label::before {
  content: "Q";
  margin-right: 0.25em;
  color: var(--MainColor);
  font-size: var(--fs33);
  font-weight: bold;
}
.layoutControl[kui-label].styleLabelAnwser > label {
  align-items: unset;
  padding: 1em;
  overflow-y: auto;
  line-height: 1.5em;
}
.layoutControl[kui-label].styleLabelAnwser > label::before {
  content: "A";
  margin-right: 0.25em;
  font-size: var(--fs33);
  font-weight: bold;
}

.layoutControl[stylename=CTI_StatusRadio] .controlOptionList {
  padding: 0;
  padding-left: 5px;
  border: 0;
}
.layoutControl[stylename=CTI_StatusRadio] .controlOptionList:focus {
  outline: 0;
}
.layoutControl[stylename=CTI_StatusRadio] .controlOptionList .radio {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 105px;
  height: 35px;
  margin: 0;
  margin-right: 10px;
  border: 1px solid #DCDCDC;
  border-radius: 5px;
  font-size: var(--fs14);
  font-weight: bold;
}
.layoutControl[stylename=CTI_StatusRadio] .controlOptionList .radio .icon {
  width: 16px;
  height: 16px;
  margin-right: 10px;
  border: 1px solid #DCDCDC;
  background-color: var(--MainBgColor);
}
.layoutControl[stylename=CTI_StatusRadio] .controlOptionList .radio .icon::after {
  top: 4px;
  left: 4px;
  width: 6px;
  height: 6px;
  background-color: #15B065;
}
.layoutControl[stylename=CTI_StatusRadio] .controlOptionList .radio.Checked {
  border: 1px solid #15B065;
  background-color: #E9FFF4;
}
.layoutControl[stylename=CTI_StatusRadio] .controlOptionList .radio.Checked .icon {
  border: 1px solid #15B065;
  background-color: #15B065;
}
.layoutControl[stylename=CTI_StatusRadio] .controlOptionList .radio.Checked .icon::after {
  background-color: var(--MainBgColor);
}

.layoutControl[stylename=CTI_CallWrap] .CTI_CallWrap {
  border-radius: 10px;
  background: linear-gradient(210deg, #E7E8EC, var(--MainBgColor));
}

.layoutControl[stylename=CTI_CallInfo] .CTI_CallInfo {
  justify-content: center;
  padding: 0;
  font-size: var(--fs15);
}

.layoutControl[stylename=CTI_CallNb] .CTI_CallNb {
  margin: 0;
  border: 0 !important;
  background-color: transparent !important;
  font-size: var(--fs25);
  font-weight: bold;
  text-align: center;
}

.layoutControl[stylename=CTI_CallBtn_Answer]::before {
  content: "";
  position: absolute;
  width: 57px;
  height: 57px;
  margin: 0 auto;
  border-radius: 100%;
  animation: play 2s ease infinite;
  backface-visibility: hidden;
}
.layoutControl[stylename=CTI_CallBtn_Answer] .CTI_CallBtn_Answer {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #15B065;
}
.layoutControl[stylename=CTI_CallBtn_Answer] .CTI_CallBtn_Answer::before {
  content: "";
  display: inline-block;
  width: 26px;
  height: 25px;
  background-image: url(../../Images/iconCTI.svg);
  background-position: 0 0;
  background-repeat: no-repeat;
}
.layoutControl[stylename=CTI_CallBtn_Answer].Dis::before {
  display: none;
}
.layoutControl[stylename=CTI_CallBtn_Answer].Dis .CTI_CallBtn_Answer {
  border: 0 !important;
  background-color: #E5E5E5 !important;
}
.layoutControl[stylename=CTI_CallBtn_Answer].Dis .CTI_CallBtn_Answer::before {
  background-position: -38px 0;
}

@keyframes play {
  0% {
    box-shadow: 0 0 0 0px rgba(22, 176, 101, 0.4);
    transform: scale(1);
  }
  10% {
    box-shadow: 0 0 0 3px rgba(22, 176, 101, 0.4);
  }
  25% {
    box-shadow: 0 0 0 6px rgba(22, 176, 101, 0.4), 0 0 0 12px rgba(22, 176, 101, 0.2);
  }
  25% {
    box-shadow: 0 0 0 9px rgba(22, 176, 101, 0.4), 0 0 0 20px rgba(22, 176, 101, 0.2);
  }
}
.layoutControl[stylename=CTI_CallBtn_End] .CTI_CallBtn_End {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #FF6464;
}
.layoutControl[stylename=CTI_CallBtn_End] .CTI_CallBtn_End::before {
  content: "";
  display: inline-block;
  width: 27px;
  height: 27px;
  background-image: url(../../Images/iconCTI.svg);
  background-position: 0 -36px;
  background-repeat: no-repeat;
}
.layoutControl[stylename=CTI_CallBtn_End].Dis .CTI_CallBtn_End {
  border: 0 !important;
  background-color: #E5E5E5 !important;
}
.layoutControl[stylename=CTI_CallBtn_End].Dis .CTI_CallBtn_End::before {
  background-position: -37px -36px;
}

.layoutControl[stylename=CTI_CallBtn_Pickup] .CTI_CallBtn_Pickup {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px 5px;
  border: 0;
  border-radius: 5px;
  background-color: transparent;
  color: #333;
  font-size: var(--fs14);
  font-weight: normal;
}
.layoutControl[stylename=CTI_CallBtn_Pickup] .CTI_CallBtn_Pickup::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 17px;
  margin-right: 10px;
  background-image: url(../../Images/iconCTI.svg);
  background-position: 0 -105px;
  background-repeat: no-repeat;
}
.layoutControl[stylename=CTI_CallBtn_Pickup] .CTI_CallBtn_Pickup:hover {
  background-color: #e2e6e8;
  opacity: 1;
}
.layoutControl[stylename=CTI_CallBtn_Pickup].Dis .CTI_CallBtn_Pickup {
  opacity: 0.5;
  border: 0 !important;
  background-color: transparent !important;
}
.layoutControl[stylename=CTI_CallBtn_Pickup].Dis .CTI_CallBtn_Pickup:hover {
  opacity: 0.5 !important;
}

.layoutControl[stylename=CTI_ForwardingTitle] .CTI_ForwardingTitle {
  padding: 0;
  font-size: var(--fs15);
  font-weight: bold;
}

.layoutControl[stylename=CTI_ForwardingToCodehelp] {
  display: flex;
  justify-content: space-between;
  padding: 0 5px;
  border: 1px solid #CBCDDB;
  border-radius: 3px;
  background-color: #E3F1FD;
  overflow: hidden;
}
.layoutControl[stylename=CTI_ForwardingToCodehelp] > label {
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  flex-shrink: 0;
  height: 100%;
  padding-left: 3px;
  font-size: var(--fs14);
  z-index: 1;
}
.layoutControl[stylename=CTI_ForwardingToCodehelp] > input {
  height: 100%;
  margin: 0;
  padding-right: 10px;
  padding-right: 27px;
  border: 0px;
  border-radius: 0px;
  background-color: transparent;
  font-size: var(--fs16);
  font-weight: normal;
  text-align: right;
  letter-spacing: -0.5px;
}

.layoutControl[stylename=CTI_ForwardingNb] {
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
}
.layoutControl[stylename=CTI_ForwardingNb] > label {
  justify-content: flex-start;
  flex-shrink: 0;
  width: 100% !important;
  height: auto;
  padding: 0 0 5px 0;
  text-align: left;
}
.layoutControl[stylename=CTI_ForwardingNb] > input {
  width: 100% !important;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0px !important;
  background-color: transparent !important;
  font-size: var(--fs14);
  font-weight: bold;
  text-align: left;
}

.layoutControl[stylename=CTI_ForwardingBtn] .CTI_ForwardingBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border-radius: 10px;
  background-color: #E4F5FF;
  color: #0096FF;
  font-size: var(--fs11);
  font-weight: normal;
}
.layoutControl[stylename=CTI_ForwardingBtn] .CTI_ForwardingBtn::before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 16px;
  margin-bottom: 6px;
  background-image: url(../../Images/iconCTI.svg);
  background-position: 0 -79px;
  background-repeat: no-repeat;
}
.layoutControl[stylename=CTI_ForwardingBtn].Dis .CTI_ForwardingBtn {
  border: 0 !important;
  background-color: #E5E5E5 !important;
  color: #C8C8C8 !important;
}
.layoutControl[stylename=CTI_ForwardingBtn].Dis .CTI_ForwardingBtn::before {
  background-position: -25px -79px;
}

.lbTitleLinkProgram_K {
  color: #20a4ff !important;
  font-size: var(--fs13) !important;
  font-weight: bold;
}

.lbLinkProgram_K {
  color: #333 !important;
  font-size: var(--fs13) !important;
  font-weight: bold;
}

.lbMainTitle_K {
  color: #333 !important;
  font-size: 36px !important;
  font-weight: bold;
  text-align: center !important;
}

.lbMainDesctiprion {
  color: #666 !important;
  font-size: var(--fs13) !important;
  text-align: center !important;
}

.lbStepCheckSub_K {
  color: #666 !important;
  font-size: var(--fs25) !important;
  text-align: center !important;
}

.lbStepCheck_K {
  color: #666 !important;
  font-size: var(--fs19) !important;
  font-weight: bold !important;
  text-align: center;
}

.lbQuestion2_K {
  color: #666 !important;
  font-size: var(--fs13) !important;
}

.lbQuestion_K {
  color: #666 !important;
  font-size: var(--fs19) !important;
  font-weight: bold;
}

.styleAICCQuery > input {
  margin-right: 5px;
  padding: 0 120px 0 50px;
  border: 1px solid var(--MainColor);
  background-image: url("../../Images/JS/AICC_AI.svg");
  background-repeat: no-repeat;
  background-position: 10px center;
  color: var(--MainColor);
  font-size: var(--fs17);
  font-weight: bold;
}
.styleAICCQuery > input:focus {
  border: 2px solid var(--MainColor);
}

.styleBtnAICCDoc > button {
  display: inline-flex !important;
  align-items: flex-end !important;
  justify-content: unset !important;
  width: 80px;
  height: 90px;
  margin-right: 5px;
  padding: 0 10px 15px 10px !important;
  background-color: transparent !important;
  background-image: url("../../Images/JS/AICC_Doc.svg");
  background-repeat: no-repeat;
  color: #596D8B !important;
  font-size: var(--fs17) !important;
  font-weight: bold;
  text-align: left;
}
.styleBtnAICCDoc > button:hover {
  color: #5861C5;
  cursor: pointer;
}

.btnAICCRefresh > button {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 8px !important;
  border-radius: 2px !important;
  background-color: #5861C5 !important;
  color: #fff !important;
}
.btnAICCRefresh > button::before {
  content: "";
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  width: 15px;
  height: 14px;
  margin-right: 5px;
  background-image: url("../../Images/JS/AICC_Refresh.svg");
  background-repeat: no-repeat;
}
.btnAICCRefresh > button:hover {
  background-color: #3d49d4;
  box-shadow: rgba(0, 0, 0, 0.15) 5px 0 5px;
  cursor: pointer;
}

.JS_AICC_btnActive > button {
  position: relative;
  overflow: hidden;
}

.JS_AICC_btnActive > button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  border-radius: 5px;
  background-color: var(--MainColor);
  background-image: linear-gradient(315deg, #15B065 0%, #52ca4c 74%);
  box-shadow: rgba(255, 255, 255, 0.6) -7px -7px 20px 0px, rgba(255, 255, 255, 0.6) -4px -4px 5px 0px, rgba(255, 255, 255, 0.13) 7px 7px 20px 0px, rgba(0, 0, 0, 0.7) 4px 4px 5px 0px;
  transition: all 0.3s ease;
  animation: ani-btnAICC 3s ease-in-out infinite;
  z-index: -1;
}

@-webkit-keyframes ani-btnAICC {
  0% {
    left: 100%;
    width: 0;
  }
  70% {
    left: 0;
    width: 100%;
  }
  100% {
    left: 100%;
    width: 0;
  }
}
.JS_AICC_checkLike > .check input[type=checkbox] + label {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 16px;
  background-color: var(--MainBgColor);
  color: #75869F;
  font-size: var(--fs13);
}

.JS_AICC_checkLike > .check input[type=checkbox] + label:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 4px;
  border: 0 !important;
  background-color: transparent !important;
  background-image: url("../../Images/JS/JS_AICC.svg");
  background-repeat: no-repeat;
  background-position: -1px -18px;
  transition: all 0.3s ease 0s;
}

.JS_AICC_checkLike > .check input[type=checkbox] + label:after {
  display: none;
}

.JS_AICC_checkLike > .check input[type=checkbox]:focus + label {
  outline: 1px solid #5B75D8 !important;
}

.JS_AICC_checkLike > .check input[type=checkbox]:checked + label {
  background-color: #5B75D8;
  color: #FFF;
}

.JS_AICC_checkLike > .check input[type=checkbox]:checked + label:before {
  background-position-x: -46px;
}

.JS_AICC_checkLike:hover > .check label {
  background-color: #ECF0FE;
  cursor: pointer;
}

.JS_AICC_checkExcept > .check input[type=checkbox] {
  display: none;
}

.JS_AICC_checkExcept > .check input[type=checkbox]:focus + label {
  outline: 1px solid #df6727 !important;
}

.JS_AICC_checkExcept > .check input[type=checkbox] + label {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 16px;
  background-color: var(--MainBgColor);
  color: #75869F;
  font-size: var(--fs13);
}

.JS_AICC_checkExcept > .check input[type=checkbox] + label:before {
  display: inline-block;
  width: 14px;
  height: 15px;
  margin-right: 4px;
  border: 0 !important;
  background-color: transparent !important;
  background-image: url("../../Images/JS/JS_AICC.svg");
  background-repeat: no-repeat;
  background-position: 0px -210px;
}

.JS_AICC_checkExcept > .check input[type=checkbox] + label:after {
  display: none;
}

.JS_AICC_checkExcept > .check input[type=checkbox]:checked + label {
  border: 1px solid #d5bbbb;
  background-color: #ffede4;
  color: #df6727;
}

.JS_AICC_checkExcept > .check input[type=checkbox]:checked + label:before {
  background-position-x: -30px;
}

.JS_AICC_checkExcept:hover > .check label {
  color: #df6727;
  cursor: pointer;
}

.JS_AICC_itemTitle {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 1em;
  font-weight: bold;
}

.JS_AICC_itemTitle::before {
  content: "...";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  padding: 1px 6px;
  border-radius: 4px;
  background-color: #9EACC1;
  color: #fff;
  font-size: var(--fs13);
  font-weight: bold;
}

.JS_AICC_txtQuestion {
  align-items: flex-start;
  padding: 0.75rem 0.5rem 0.75rem 1rem !important;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  background-color: #fff;
  font-size: var(--fs14);
  overflow-y: auto;
}

.JS_AICC_txtQuestion::before {
  position: sticky;
  top: 0;
  content: "Q. ";
  margin-right: 4px;
  font-size: var(--fs19);
  font-weight: bold;
}

.JS_AICC_txtAnswer {
  align-items: flex-start;
  padding: 0.75rem 0.5rem 0.75rem 1rem !important;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  background-color: #e9ecf4;
  font-size: var(--fs14);
  overflow-y: auto;
}

.JS_AICC_txtQuestion .lbNormal,
.JS_AICC_txtAnswer .lbNormal {
  align-items: flex-start;
  font-size: var(--fs14);
  line-height: 20px;
  overflow-y: auto;
}

.JS_AICC_txtAnswer::before {
  content: "A. ";
  position: sticky;
  top: 0;
  margin-right: 4px;
  font-size: var(--fs19);
  font-weight: bold;
}

.JS_AICC_itemTitle.ProductAce::before {
  content: "A";
  background-color: #18B065;
}

.JS_AICC_txtAnswer.ProductAce {
  background-color: #E7F7EF;
}

.JS_AICC_txtAnswer.ProductAce::before {
  color: #18B065;
}

.JS_AICC_itemTitle.ProductGenuine::before {
  content: "G";
  background-color: #7760C7;
}

.JS_AICC_txtAnswer.ProductGenuine {
  background-color: #F1EFF9;
}

.JS_AICC_txtAnswer.ProductGenuine::before {
  color: #7760C7;
}

.JS_AICC_itemTitle.ProductSystemEver::before {
  content: "E";
  background-color: #3AA2FC;
}

.JS_AICC_txtAnswer.ProductSystemEver {
  background-color: #EBF6FE;
}

.JS_AICC_txtAnswer.ProductSystemEver::before {
  color: #3AA2FC;
}

.C_000_001 {
  background-image: url("../../Images/Icon/C_000_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_002 {
  background-image: url("../../Images/Icon/C_000_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_003 {
  background-image: url("../../Images/Icon/C_000_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_004 {
  background-image: url("../../Images/Icon/C_000_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_005 {
  background-image: url("../../Images/Icon/C_000_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_006 {
  background-image: url("../../Images/Icon/C_000_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_007 {
  background-image: url("../../Images/Icon/C_000_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_008 {
  background-image: url("../../Images/Icon/C_000_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_009 {
  background-image: url("../../Images/Icon/C_000_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_010 {
  background-image: url("../../Images/Icon/C_000_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_011 {
  background-image: url("../../Images/Icon/C_000_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_012 {
  background-image: url("../../Images/Icon/C_000_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_013 {
  background-image: url("../../Images/Icon/C_000_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_014 {
  background-image: url("../../Images/Icon/C_000_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_015 {
  background-image: url("../../Images/Icon/C_000_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_016 {
  background-image: url("../../Images/Icon/C_000_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_017 {
  background-image: url("../../Images/Icon/C_000_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_018 {
  background-image: url("../../Images/Icon/C_000_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_019 {
  background-image: url("../../Images/Icon/C_000_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_020 {
  background-image: url("../../Images/Icon/C_000_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_021 {
  background-image: url("../../Images/Icon/C_000_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_022 {
  background-image: url("../../Images/Icon/C_000_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_023 {
  background-image: url("../../Images/Icon/C_000_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_024 {
  background-image: url("../../Images/Icon/C_000_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_025 {
  background-image: url("../../Images/Icon/C_000_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_026 {
  background-image: url("../../Images/Icon/C_000_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_027 {
  background-image: url("../../Images/Icon/C_000_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_028 {
  background-image: url("../../Images/Icon/C_000_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_029 {
  background-image: url("../../Images/Icon/C_000_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_030 {
  background-image: url("../../Images/Icon/C_000_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_031 {
  background-image: url("../../Images/Icon/C_000_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_032 {
  background-image: url("../../Images/Icon/C_000_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_033 {
  background-image: url("../../Images/Icon/C_000_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_034 {
  background-image: url("../../Images/Icon/C_000_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_035 {
  background-image: url("../../Images/Icon/C_000_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_036 {
  background-image: url("../../Images/Icon/C_000_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_037 {
  background-image: url("../../Images/Icon/C_000_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_038 {
  background-image: url("../../Images/Icon/C_000_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_039 {
  background-image: url("../../Images/Icon/C_000_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_040 {
  background-image: url("../../Images/Icon/C_000_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_041 {
  background-image: url("../../Images/Icon/C_000_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_042 {
  background-image: url("../../Images/Icon/C_000_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_043 {
  background-image: url("../../Images/Icon/C_000_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_044 {
  background-image: url("../../Images/Icon/C_000_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_045 {
  background-image: url("../../Images/Icon/C_000_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_046 {
  background-image: url("../../Images/Icon/C_000_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_047 {
  background-image: url("../../Images/Icon/C_000_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_048 {
  background-image: url("../../Images/Icon/C_000_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_049 {
  background-image: url("../../Images/Icon/C_000_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_050 {
  background-image: url("../../Images/Icon/C_000_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_051 {
  background-image: url("../../Images/Icon/C_000_051.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_052 {
  background-image: url("../../Images/Icon/C_000_052.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_053 {
  background-image: url("../../Images/Icon/C_000_053.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_054 {
  background-image: url("../../Images/Icon/C_000_054.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_055 {
  background-image: url("../../Images/Icon/C_000_055.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_056 {
  background-image: url("../../Images/Icon/C_000_056.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_057 {
  background-image: url("../../Images/Icon/C_000_057.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_058 {
  background-image: url("../../Images/Icon/C_000_058.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_059 {
  background-image: url("../../Images/Icon/C_000_059.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_060 {
  background-image: url("../../Images/Icon/C_000_060.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_061 {
  background-image: url("../../Images/Icon/C_000_061.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_062 {
  background-image: url("../../Images/Icon/C_000_062.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_063 {
  background-image: url("../../Images/Icon/C_000_063.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_064 {
  background-image: url("../../Images/Icon/C_000_064.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_065 {
  background-image: url("../../Images/Icon/C_000_065.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_066 {
  background-image: url("../../Images/Icon/C_000_066.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_067 {
  background-image: url("../../Images/Icon/C_000_067.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_068 {
  background-image: url("../../Images/Icon/C_000_068.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_069 {
  background-image: url("../../Images/Icon/C_000_069.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_070 {
  background-image: url("../../Images/Icon/C_000_070.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_071 {
  background-image: url("../../Images/Icon/C_000_071.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_072 {
  background-image: url("../../Images/Icon/C_000_072.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_073 {
  background-image: url("../../Images/Icon/C_000_073.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_074 {
  background-image: url("../../Images/Icon/C_000_074.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_075 {
  background-image: url("../../Images/Icon/C_000_075.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_076 {
  background-image: url("../../Images/Icon/C_000_076.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_077 {
  background-image: url("../../Images/Icon/C_000_077.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_078 {
  background-image: url("../../Images/Icon/C_000_078.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_079 {
  background-image: url("../../Images/Icon/C_000_079.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_080 {
  background-image: url("../../Images/Icon/C_000_080.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_081 {
  background-image: url("../../Images/Icon/C_000_081.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_082 {
  background-image: url("../../Images/Icon/C_000_082.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_083 {
  background-image: url("../../Images/Icon/C_000_083.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_084 {
  background-image: url("../../Images/Icon/C_000_084.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_085 {
  background-image: url("../../Images/Icon/C_000_085.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_086 {
  background-image: url("../../Images/Icon/C_000_086.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_087 {
  background-image: url("../../Images/Icon/C_000_087.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_088 {
  background-image: url("../../Images/Icon/C_000_088.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_089 {
  background-image: url("../../Images/Icon/C_000_089.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_090 {
  background-image: url("../../Images/Icon/C_000_090.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_091 {
  background-image: url("../../Images/Icon/C_000_091.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_092 {
  background-image: url("../../Images/Icon/C_000_092.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_093 {
  background-image: url("../../Images/Icon/C_000_093.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_094 {
  background-image: url("../../Images/Icon/C_000_094.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_095 {
  background-image: url("../../Images/Icon/C_000_095.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_096 {
  background-image: url("../../Images/Icon/C_000_096.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_097 {
  background-image: url("../../Images/Icon/C_000_097.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_098 {
  background-image: url("../../Images/Icon/C_000_098.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_099 {
  background-image: url("../../Images/Icon/C_000_099.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_100 {
  background-image: url("../../Images/Icon/C_000_100.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_101 {
  background-image: url("../../Images/Icon/C_000_101.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_102 {
  background-image: url("../../Images/Icon/C_000_102.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_000_103 {
  background-image: url("../../Images/Icon/C_000_103.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_001 {
  background-image: url("../../Images/Icon/B_000_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_002 {
  background-image: url("../../Images/Icon/B_000_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_003 {
  background-image: url("../../Images/Icon/B_000_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_004 {
  background-image: url("../../Images/Icon/B_000_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_005 {
  background-image: url("../../Images/Icon/B_000_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_006 {
  background-image: url("../../Images/Icon/B_000_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_007 {
  background-image: url("../../Images/Icon/B_000_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_008 {
  background-image: url("../../Images/Icon/B_000_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_009 {
  background-image: url("../../Images/Icon/B_000_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_010 {
  background-image: url("../../Images/Icon/B_000_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_011 {
  background-image: url("../../Images/Icon/B_000_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_012 {
  background-image: url("../../Images/Icon/B_000_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_013 {
  background-image: url("../../Images/Icon/B_000_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_014 {
  background-image: url("../../Images/Icon/B_000_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_015 {
  background-image: url("../../Images/Icon/B_000_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_016 {
  background-image: url("../../Images/Icon/B_000_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_017 {
  background-image: url("../../Images/Icon/B_000_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_018 {
  background-image: url("../../Images/Icon/B_000_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_019 {
  background-image: url("../../Images/Icon/B_000_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_020 {
  background-image: url("../../Images/Icon/B_000_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_021 {
  background-image: url("../../Images/Icon/B_000_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_022 {
  background-image: url("../../Images/Icon/B_000_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_023 {
  background-image: url("../../Images/Icon/B_000_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_024 {
  background-image: url("../../Images/Icon/B_000_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_025 {
  background-image: url("../../Images/Icon/B_000_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_026 {
  background-image: url("../../Images/Icon/B_000_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_027 {
  background-image: url("../../Images/Icon/B_000_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_028 {
  background-image: url("../../Images/Icon/B_000_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_029 {
  background-image: url("../../Images/Icon/B_000_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_030 {
  background-image: url("../../Images/Icon/B_000_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_031 {
  background-image: url("../../Images/Icon/B_000_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_032 {
  background-image: url("../../Images/Icon/B_000_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_033 {
  background-image: url("../../Images/Icon/B_000_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_034 {
  background-image: url("../../Images/Icon/B_000_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_035 {
  background-image: url("../../Images/Icon/B_000_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_036 {
  background-image: url("../../Images/Icon/B_000_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_037 {
  background-image: url("../../Images/Icon/B_000_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_038 {
  background-image: url("../../Images/Icon/B_000_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_039 {
  background-image: url("../../Images/Icon/B_000_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_040 {
  background-image: url("../../Images/Icon/B_000_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_041 {
  background-image: url("../../Images/Icon/B_000_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_042 {
  background-image: url("../../Images/Icon/B_000_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_043 {
  background-image: url("../../Images/Icon/B_000_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_044 {
  background-image: url("../../Images/Icon/B_000_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_045 {
  background-image: url("../../Images/Icon/B_000_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_046 {
  background-image: url("../../Images/Icon/B_000_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_047 {
  background-image: url("../../Images/Icon/B_000_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_048 {
  background-image: url("../../Images/Icon/B_000_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_049 {
  background-image: url("../../Images/Icon/B_000_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_050 {
  background-image: url("../../Images/Icon/B_000_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_051 {
  background-image: url("../../Images/Icon/B_000_051.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_052 {
  background-image: url("../../Images/Icon/B_000_052.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_053 {
  background-image: url("../../Images/Icon/B_000_053.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_054 {
  background-image: url("../../Images/Icon/B_000_054.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_055 {
  background-image: url("../../Images/Icon/B_000_055.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_056 {
  background-image: url("../../Images/Icon/B_000_056.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_057 {
  background-image: url("../../Images/Icon/B_000_057.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_058 {
  background-image: url("../../Images/Icon/B_000_058.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_059 {
  background-image: url("../../Images/Icon/B_000_059.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_060 {
  background-image: url("../../Images/Icon/B_000_060.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_061 {
  background-image: url("../../Images/Icon/B_000_061.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_062 {
  background-image: url("../../Images/Icon/B_000_062.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_063 {
  background-image: url("../../Images/Icon/B_000_063.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_064 {
  background-image: url("../../Images/Icon/B_000_064.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_065 {
  background-image: url("../../Images/Icon/B_000_065.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_066 {
  background-image: url("../../Images/Icon/B_000_066.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_067 {
  background-image: url("../../Images/Icon/B_000_067.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_068 {
  background-image: url("../../Images/Icon/B_000_068.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_069 {
  background-image: url("../../Images/Icon/B_000_069.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_070 {
  background-image: url("../../Images/Icon/B_000_070.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_071 {
  background-image: url("../../Images/Icon/B_000_071.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_072 {
  background-image: url("../../Images/Icon/B_000_072.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_073 {
  background-image: url("../../Images/Icon/B_000_073.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_074 {
  background-image: url("../../Images/Icon/B_000_074.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_075 {
  background-image: url("../../Images/Icon/B_000_075.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_076 {
  background-image: url("../../Images/Icon/B_000_076.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_077 {
  background-image: url("../../Images/Icon/B_000_077.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_078 {
  background-image: url("../../Images/Icon/B_000_078.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_079 {
  background-image: url("../../Images/Icon/B_000_079.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_080 {
  background-image: url("../../Images/Icon/B_000_080.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_081 {
  background-image: url("../../Images/Icon/B_000_081.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_082 {
  background-image: url("../../Images/Icon/B_000_082.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_083 {
  background-image: url("../../Images/Icon/B_000_083.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_084 {
  background-image: url("../../Images/Icon/B_000_084.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_085 {
  background-image: url("../../Images/Icon/B_000_085.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_086 {
  background-image: url("../../Images/Icon/B_000_086.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_087 {
  background-image: url("../../Images/Icon/B_000_087.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_088 {
  background-image: url("../../Images/Icon/B_000_088.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_089 {
  background-image: url("../../Images/Icon/B_000_089.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_090 {
  background-image: url("../../Images/Icon/B_000_090.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_091 {
  background-image: url("../../Images/Icon/B_000_091.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_092 {
  background-image: url("../../Images/Icon/B_000_092.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_093 {
  background-image: url("../../Images/Icon/B_000_093.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_094 {
  background-image: url("../../Images/Icon/B_000_094.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_095 {
  background-image: url("../../Images/Icon/B_000_095.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_096 {
  background-image: url("../../Images/Icon/B_000_096.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_097 {
  background-image: url("../../Images/Icon/B_000_097.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_098 {
  background-image: url("../../Images/Icon/B_000_098.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_099 {
  background-image: url("../../Images/Icon/B_000_099.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_100 {
  background-image: url("../../Images/Icon/B_000_100.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_101 {
  background-image: url("../../Images/Icon/B_000_101.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_102 {
  background-image: url("../../Images/Icon/B_000_102.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_000_103 {
  background-image: url("../../Images/Icon/B_000_103.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_001 {
  background-image: url("../../Images/Icon/W_000_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_002 {
  background-image: url("../../Images/Icon/W_000_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_003 {
  background-image: url("../../Images/Icon/W_000_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_004 {
  background-image: url("../../Images/Icon/W_000_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_005 {
  background-image: url("../../Images/Icon/W_000_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_006 {
  background-image: url("../../Images/Icon/W_000_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_007 {
  background-image: url("../../Images/Icon/W_000_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_008 {
  background-image: url("../../Images/Icon/W_000_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_009 {
  background-image: url("../../Images/Icon/W_000_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_010 {
  background-image: url("../../Images/Icon/W_000_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_011 {
  background-image: url("../../Images/Icon/W_000_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_012 {
  background-image: url("../../Images/Icon/W_000_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_013 {
  background-image: url("../../Images/Icon/W_000_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_014 {
  background-image: url("../../Images/Icon/W_000_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_015 {
  background-image: url("../../Images/Icon/W_000_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_016 {
  background-image: url("../../Images/Icon/W_000_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_017 {
  background-image: url("../../Images/Icon/W_000_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_018 {
  background-image: url("../../Images/Icon/W_000_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_019 {
  background-image: url("../../Images/Icon/W_000_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_020 {
  background-image: url("../../Images/Icon/W_000_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_021 {
  background-image: url("../../Images/Icon/W_000_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_022 {
  background-image: url("../../Images/Icon/W_000_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_023 {
  background-image: url("../../Images/Icon/W_000_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_024 {
  background-image: url("../../Images/Icon/W_000_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_025 {
  background-image: url("../../Images/Icon/W_000_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_026 {
  background-image: url("../../Images/Icon/W_000_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_027 {
  background-image: url("../../Images/Icon/W_000_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_028 {
  background-image: url("../../Images/Icon/W_000_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_029 {
  background-image: url("../../Images/Icon/W_000_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_030 {
  background-image: url("../../Images/Icon/W_000_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_031 {
  background-image: url("../../Images/Icon/W_000_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_032 {
  background-image: url("../../Images/Icon/W_000_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_033 {
  background-image: url("../../Images/Icon/W_000_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_034 {
  background-image: url("../../Images/Icon/W_000_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_035 {
  background-image: url("../../Images/Icon/W_000_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_036 {
  background-image: url("../../Images/Icon/W_000_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_037 {
  background-image: url("../../Images/Icon/W_000_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_038 {
  background-image: url("../../Images/Icon/W_000_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_039 {
  background-image: url("../../Images/Icon/W_000_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_040 {
  background-image: url("../../Images/Icon/W_000_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_041 {
  background-image: url("../../Images/Icon/W_000_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_042 {
  background-image: url("../../Images/Icon/W_000_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_043 {
  background-image: url("../../Images/Icon/W_000_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_044 {
  background-image: url("../../Images/Icon/W_000_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_045 {
  background-image: url("../../Images/Icon/W_000_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_046 {
  background-image: url("../../Images/Icon/W_000_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_047 {
  background-image: url("../../Images/Icon/W_000_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_048 {
  background-image: url("../../Images/Icon/W_000_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_049 {
  background-image: url("../../Images/Icon/W_000_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_050 {
  background-image: url("../../Images/Icon/W_000_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_051 {
  background-image: url("../../Images/Icon/W_000_051.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_052 {
  background-image: url("../../Images/Icon/W_000_052.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_053 {
  background-image: url("../../Images/Icon/W_000_053.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_054 {
  background-image: url("../../Images/Icon/W_000_054.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_055 {
  background-image: url("../../Images/Icon/W_000_055.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_056 {
  background-image: url("../../Images/Icon/W_000_056.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_057 {
  background-image: url("../../Images/Icon/W_000_057.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_058 {
  background-image: url("../../Images/Icon/W_000_058.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_059 {
  background-image: url("../../Images/Icon/W_000_059.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_060 {
  background-image: url("../../Images/Icon/W_000_060.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_061 {
  background-image: url("../../Images/Icon/W_000_061.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_062 {
  background-image: url("../../Images/Icon/W_000_062.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_063 {
  background-image: url("../../Images/Icon/W_000_063.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_064 {
  background-image: url("../../Images/Icon/W_000_064.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_065 {
  background-image: url("../../Images/Icon/W_000_065.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_066 {
  background-image: url("../../Images/Icon/W_000_066.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_067 {
  background-image: url("../../Images/Icon/W_000_067.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_068 {
  background-image: url("../../Images/Icon/W_000_068.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_069 {
  background-image: url("../../Images/Icon/W_000_069.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_070 {
  background-image: url("../../Images/Icon/W_000_070.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_071 {
  background-image: url("../../Images/Icon/W_000_071.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_072 {
  background-image: url("../../Images/Icon/W_000_072.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_073 {
  background-image: url("../../Images/Icon/W_000_073.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_074 {
  background-image: url("../../Images/Icon/W_000_074.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_075 {
  background-image: url("../../Images/Icon/W_000_075.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_076 {
  background-image: url("../../Images/Icon/W_000_076.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_077 {
  background-image: url("../../Images/Icon/W_000_077.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_078 {
  background-image: url("../../Images/Icon/W_000_078.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_079 {
  background-image: url("../../Images/Icon/W_000_079.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_080 {
  background-image: url("../../Images/Icon/W_000_080.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_081 {
  background-image: url("../../Images/Icon/W_000_081.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_082 {
  background-image: url("../../Images/Icon/W_000_082.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_083 {
  background-image: url("../../Images/Icon/W_000_083.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_084 {
  background-image: url("../../Images/Icon/W_000_084.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_085 {
  background-image: url("../../Images/Icon/W_000_085.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_086 {
  background-image: url("../../Images/Icon/W_000_086.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_087 {
  background-image: url("../../Images/Icon/W_000_087.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_088 {
  background-image: url("../../Images/Icon/W_000_088.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_089 {
  background-image: url("../../Images/Icon/W_000_089.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_090 {
  background-image: url("../../Images/Icon/W_000_090.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_091 {
  background-image: url("../../Images/Icon/W_000_091.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_092 {
  background-image: url("../../Images/Icon/W_000_092.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_093 {
  background-image: url("../../Images/Icon/W_000_093.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_094 {
  background-image: url("../../Images/Icon/W_000_094.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_095 {
  background-image: url("../../Images/Icon/W_000_095.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_096 {
  background-image: url("../../Images/Icon/W_000_096.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_097 {
  background-image: url("../../Images/Icon/W_000_097.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_098 {
  background-image: url("../../Images/Icon/W_000_098.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_099 {
  background-image: url("../../Images/Icon/W_000_099.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_100 {
  background-image: url("../../Images/Icon/W_000_100.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_101 {
  background-image: url("../../Images/Icon/W_000_101.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_102 {
  background-image: url("../../Images/Icon/W_000_102.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_000_103 {
  background-image: url("../../Images/Icon/W_000_103.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_001 {
  background-image: url("../../Images/Icon/C_001_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_002 {
  background-image: url("../../Images/Icon/C_001_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_003 {
  background-image: url("../../Images/Icon/C_001_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_004 {
  background-image: url("../../Images/Icon/C_001_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_005 {
  background-image: url("../../Images/Icon/C_001_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_006 {
  background-image: url("../../Images/Icon/C_001_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_007 {
  background-image: url("../../Images/Icon/C_001_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_008 {
  background-image: url("../../Images/Icon/C_001_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_009 {
  background-image: url("../../Images/Icon/C_001_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_010 {
  background-image: url("../../Images/Icon/C_001_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_011 {
  background-image: url("../../Images/Icon/C_001_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_012 {
  background-image: url("../../Images/Icon/C_001_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_013 {
  background-image: url("../../Images/Icon/C_001_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_014 {
  background-image: url("../../Images/Icon/C_001_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_015 {
  background-image: url("../../Images/Icon/C_001_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_016 {
  background-image: url("../../Images/Icon/C_001_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_017 {
  background-image: url("../../Images/Icon/C_001_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_018 {
  background-image: url("../../Images/Icon/C_001_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_019 {
  background-image: url("../../Images/Icon/C_001_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_001_020 {
  background-image: url("../../Images/Icon/C_001_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_001 {
  background-image: url("../../Images/Icon/B_001_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_002 {
  background-image: url("../../Images/Icon/B_001_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_003 {
  background-image: url("../../Images/Icon/B_001_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_004 {
  background-image: url("../../Images/Icon/B_001_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_005 {
  background-image: url("../../Images/Icon/B_001_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_006 {
  background-image: url("../../Images/Icon/B_001_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_007 {
  background-image: url("../../Images/Icon/B_001_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_008 {
  background-image: url("../../Images/Icon/B_001_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_009 {
  background-image: url("../../Images/Icon/B_001_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_010 {
  background-image: url("../../Images/Icon/B_001_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_011 {
  background-image: url("../../Images/Icon/B_001_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_012 {
  background-image: url("../../Images/Icon/B_001_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_013 {
  background-image: url("../../Images/Icon/B_001_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_014 {
  background-image: url("../../Images/Icon/B_001_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_015 {
  background-image: url("../../Images/Icon/B_001_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_016 {
  background-image: url("../../Images/Icon/B_001_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_017 {
  background-image: url("../../Images/Icon/B_001_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_018 {
  background-image: url("../../Images/Icon/B_001_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_019 {
  background-image: url("../../Images/Icon/B_001_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_001_020 {
  background-image: url("../../Images/Icon/B_001_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_001 {
  background-image: url("../../Images/Icon/W_001_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_002 {
  background-image: url("../../Images/Icon/W_001_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_003 {
  background-image: url("../../Images/Icon/W_001_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_004 {
  background-image: url("../../Images/Icon/W_001_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_005 {
  background-image: url("../../Images/Icon/W_001_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_006 {
  background-image: url("../../Images/Icon/W_001_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_007 {
  background-image: url("../../Images/Icon/W_001_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_008 {
  background-image: url("../../Images/Icon/W_001_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_009 {
  background-image: url("../../Images/Icon/W_001_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_010 {
  background-image: url("../../Images/Icon/W_001_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_011 {
  background-image: url("../../Images/Icon/W_001_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_012 {
  background-image: url("../../Images/Icon/W_001_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_013 {
  background-image: url("../../Images/Icon/W_001_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_014 {
  background-image: url("../../Images/Icon/W_001_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_015 {
  background-image: url("../../Images/Icon/W_001_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_016 {
  background-image: url("../../Images/Icon/W_001_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_017 {
  background-image: url("../../Images/Icon/W_001_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_018 {
  background-image: url("../../Images/Icon/W_001_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_019 {
  background-image: url("../../Images/Icon/W_001_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_001_020 {
  background-image: url("../../Images/Icon/W_001_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_001 {
  background-image: url("../../Images/Icon/C_002_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_002 {
  background-image: url("../../Images/Icon/C_002_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_003 {
  background-image: url("../../Images/Icon/C_002_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_004 {
  background-image: url("../../Images/Icon/C_002_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_005 {
  background-image: url("../../Images/Icon/C_002_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_006 {
  background-image: url("../../Images/Icon/C_002_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_007 {
  background-image: url("../../Images/Icon/C_002_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_008 {
  background-image: url("../../Images/Icon/C_002_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_009 {
  background-image: url("../../Images/Icon/C_002_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_010 {
  background-image: url("../../Images/Icon/C_002_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_011 {
  background-image: url("../../Images/Icon/C_002_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_012 {
  background-image: url("../../Images/Icon/C_002_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_002_013 {
  background-image: url("../../Images/Icon/C_002_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_001 {
  background-image: url("../../Images/Icon/B_002_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_002 {
  background-image: url("../../Images/Icon/B_002_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_003 {
  background-image: url("../../Images/Icon/B_002_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_004 {
  background-image: url("../../Images/Icon/B_002_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_005 {
  background-image: url("../../Images/Icon/B_002_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_006 {
  background-image: url("../../Images/Icon/B_002_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_007 {
  background-image: url("../../Images/Icon/B_002_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_008 {
  background-image: url("../../Images/Icon/B_002_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_009 {
  background-image: url("../../Images/Icon/B_002_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_010 {
  background-image: url("../../Images/Icon/B_002_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_011 {
  background-image: url("../../Images/Icon/B_002_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_012 {
  background-image: url("../../Images/Icon/B_002_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_002_013 {
  background-image: url("../../Images/Icon/B_002_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_001 {
  background-image: url("../../Images/Icon/W_002_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_002 {
  background-image: url("../../Images/Icon/W_002_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_003 {
  background-image: url("../../Images/Icon/W_002_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_004 {
  background-image: url("../../Images/Icon/W_002_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_005 {
  background-image: url("../../Images/Icon/W_002_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_006 {
  background-image: url("../../Images/Icon/W_002_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_007 {
  background-image: url("../../Images/Icon/W_002_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_008 {
  background-image: url("../../Images/Icon/W_002_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_009 {
  background-image: url("../../Images/Icon/W_002_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_010 {
  background-image: url("../../Images/Icon/W_002_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_011 {
  background-image: url("../../Images/Icon/W_002_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_012 {
  background-image: url("../../Images/Icon/W_002_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_002_013 {
  background-image: url("../../Images/Icon/W_002_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_001 {
  background-image: url("../../Images/Icon/C_003_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_002 {
  background-image: url("../../Images/Icon/C_003_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_003 {
  background-image: url("../../Images/Icon/C_003_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_004 {
  background-image: url("../../Images/Icon/C_003_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_005 {
  background-image: url("../../Images/Icon/C_003_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_006 {
  background-image: url("../../Images/Icon/C_003_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_007 {
  background-image: url("../../Images/Icon/C_003_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_008 {
  background-image: url("../../Images/Icon/C_003_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_009 {
  background-image: url("../../Images/Icon/C_003_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_010 {
  background-image: url("../../Images/Icon/C_003_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_003_011 {
  background-image: url("../../Images/Icon/C_003_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_001 {
  background-image: url("../../Images/Icon/B_003_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_002 {
  background-image: url("../../Images/Icon/B_003_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_003 {
  background-image: url("../../Images/Icon/B_003_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_004 {
  background-image: url("../../Images/Icon/B_003_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_005 {
  background-image: url("../../Images/Icon/B_003_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_006 {
  background-image: url("../../Images/Icon/B_003_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_007 {
  background-image: url("../../Images/Icon/B_003_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_008 {
  background-image: url("../../Images/Icon/B_003_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_009 {
  background-image: url("../../Images/Icon/B_003_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_010 {
  background-image: url("../../Images/Icon/B_003_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_003_011 {
  background-image: url("../../Images/Icon/B_003_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_001 {
  background-image: url("../../Images/Icon/W_003_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_002 {
  background-image: url("../../Images/Icon/W_003_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_003 {
  background-image: url("../../Images/Icon/W_003_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_004 {
  background-image: url("../../Images/Icon/W_003_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_005 {
  background-image: url("../../Images/Icon/W_003_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_006 {
  background-image: url("../../Images/Icon/W_003_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_007 {
  background-image: url("../../Images/Icon/W_003_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_008 {
  background-image: url("../../Images/Icon/W_003_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_009 {
  background-image: url("../../Images/Icon/W_003_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_010 {
  background-image: url("../../Images/Icon/W_003_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_003_011 {
  background-image: url("../../Images/Icon/W_003_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_001 {
  background-image: url("../../Images/Icon/C_004_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_002 {
  background-image: url("../../Images/Icon/C_004_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_003 {
  background-image: url("../../Images/Icon/C_004_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_004 {
  background-image: url("../../Images/Icon/C_004_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_005 {
  background-image: url("../../Images/Icon/C_004_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_006 {
  background-image: url("../../Images/Icon/C_004_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_007 {
  background-image: url("../../Images/Icon/C_004_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_008 {
  background-image: url("../../Images/Icon/C_004_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_009 {
  background-image: url("../../Images/Icon/C_004_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_010 {
  background-image: url("../../Images/Icon/C_004_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_011 {
  background-image: url("../../Images/Icon/C_004_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_012 {
  background-image: url("../../Images/Icon/C_004_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_004_013 {
  background-image: url("../../Images/Icon/C_004_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_001 {
  background-image: url("../../Images/Icon/B_004_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_002 {
  background-image: url("../../Images/Icon/B_004_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_003 {
  background-image: url("../../Images/Icon/B_004_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_004 {
  background-image: url("../../Images/Icon/B_004_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_005 {
  background-image: url("../../Images/Icon/B_004_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_006 {
  background-image: url("../../Images/Icon/B_004_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_007 {
  background-image: url("../../Images/Icon/B_004_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_008 {
  background-image: url("../../Images/Icon/B_004_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_009 {
  background-image: url("../../Images/Icon/B_004_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_010 {
  background-image: url("../../Images/Icon/B_004_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_011 {
  background-image: url("../../Images/Icon/B_004_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_012 {
  background-image: url("../../Images/Icon/B_004_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_004_013 {
  background-image: url("../../Images/Icon/B_004_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_001 {
  background-image: url("../../Images/Icon/W_004_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_002 {
  background-image: url("../../Images/Icon/W_004_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_003 {
  background-image: url("../../Images/Icon/W_004_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_004 {
  background-image: url("../../Images/Icon/W_004_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_005 {
  background-image: url("../../Images/Icon/W_004_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_006 {
  background-image: url("../../Images/Icon/W_004_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_007 {
  background-image: url("../../Images/Icon/W_004_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_008 {
  background-image: url("../../Images/Icon/W_004_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_009 {
  background-image: url("../../Images/Icon/W_004_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_010 {
  background-image: url("../../Images/Icon/W_004_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_011 {
  background-image: url("../../Images/Icon/W_004_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_012 {
  background-image: url("../../Images/Icon/W_004_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_004_013 {
  background-image: url("../../Images/Icon/W_004_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_001 {
  background-image: url("../../Images/Icon/C_005_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_002 {
  background-image: url("../../Images/Icon/C_005_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_003 {
  background-image: url("../../Images/Icon/C_005_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_004 {
  background-image: url("../../Images/Icon/C_005_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_005 {
  background-image: url("../../Images/Icon/C_005_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_006 {
  background-image: url("../../Images/Icon/C_005_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_007 {
  background-image: url("../../Images/Icon/C_005_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_008 {
  background-image: url("../../Images/Icon/C_005_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_009 {
  background-image: url("../../Images/Icon/C_005_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_010 {
  background-image: url("../../Images/Icon/C_005_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_011 {
  background-image: url("../../Images/Icon/C_005_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_012 {
  background-image: url("../../Images/Icon/C_005_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_013 {
  background-image: url("../../Images/Icon/C_005_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_014 {
  background-image: url("../../Images/Icon/C_005_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_015 {
  background-image: url("../../Images/Icon/C_005_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_016 {
  background-image: url("../../Images/Icon/C_005_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_017 {
  background-image: url("../../Images/Icon/C_005_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_018 {
  background-image: url("../../Images/Icon/C_005_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_019 {
  background-image: url("../../Images/Icon/C_005_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_020 {
  background-image: url("../../Images/Icon/C_005_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_021 {
  background-image: url("../../Images/Icon/C_005_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_022 {
  background-image: url("../../Images/Icon/C_005_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_023 {
  background-image: url("../../Images/Icon/C_005_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_024 {
  background-image: url("../../Images/Icon/C_005_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_025 {
  background-image: url("../../Images/Icon/C_005_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_026 {
  background-image: url("../../Images/Icon/C_005_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_027 {
  background-image: url("../../Images/Icon/C_005_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_028 {
  background-image: url("../../Images/Icon/C_005_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_029 {
  background-image: url("../../Images/Icon/C_005_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_030 {
  background-image: url("../../Images/Icon/C_005_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_031 {
  background-image: url("../../Images/Icon/C_005_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_032 {
  background-image: url("../../Images/Icon/C_005_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_033 {
  background-image: url("../../Images/Icon/C_005_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_034 {
  background-image: url("../../Images/Icon/C_005_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_035 {
  background-image: url("../../Images/Icon/C_005_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_036 {
  background-image: url("../../Images/Icon/C_005_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_037 {
  background-image: url("../../Images/Icon/C_005_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_038 {
  background-image: url("../../Images/Icon/C_005_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_039 {
  background-image: url("../../Images/Icon/C_005_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_040 {
  background-image: url("../../Images/Icon/C_005_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_041 {
  background-image: url("../../Images/Icon/C_005_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_042 {
  background-image: url("../../Images/Icon/C_005_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_043 {
  background-image: url("../../Images/Icon/C_005_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_044 {
  background-image: url("../../Images/Icon/C_005_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_045 {
  background-image: url("../../Images/Icon/C_005_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_046 {
  background-image: url("../../Images/Icon/C_005_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_047 {
  background-image: url("../../Images/Icon/C_005_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_048 {
  background-image: url("../../Images/Icon/C_005_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_049 {
  background-image: url("../../Images/Icon/C_005_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_005_050 {
  background-image: url("../../Images/Icon/C_005_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_001 {
  background-image: url("../../Images/Icon/B_005_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_002 {
  background-image: url("../../Images/Icon/B_005_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_003 {
  background-image: url("../../Images/Icon/B_005_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_004 {
  background-image: url("../../Images/Icon/B_005_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_005 {
  background-image: url("../../Images/Icon/B_005_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_006 {
  background-image: url("../../Images/Icon/B_005_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_007 {
  background-image: url("../../Images/Icon/B_005_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_008 {
  background-image: url("../../Images/Icon/B_005_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_009 {
  background-image: url("../../Images/Icon/B_005_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_010 {
  background-image: url("../../Images/Icon/B_005_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_011 {
  background-image: url("../../Images/Icon/B_005_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_012 {
  background-image: url("../../Images/Icon/B_005_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_013 {
  background-image: url("../../Images/Icon/B_005_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_014 {
  background-image: url("../../Images/Icon/B_005_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_015 {
  background-image: url("../../Images/Icon/B_005_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_016 {
  background-image: url("../../Images/Icon/B_005_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_017 {
  background-image: url("../../Images/Icon/B_005_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_018 {
  background-image: url("../../Images/Icon/B_005_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_019 {
  background-image: url("../../Images/Icon/B_005_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_020 {
  background-image: url("../../Images/Icon/B_005_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_021 {
  background-image: url("../../Images/Icon/B_005_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_022 {
  background-image: url("../../Images/Icon/B_005_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_023 {
  background-image: url("../../Images/Icon/B_005_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_024 {
  background-image: url("../../Images/Icon/B_005_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_025 {
  background-image: url("../../Images/Icon/B_005_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_026 {
  background-image: url("../../Images/Icon/B_005_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_027 {
  background-image: url("../../Images/Icon/B_005_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_028 {
  background-image: url("../../Images/Icon/B_005_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_029 {
  background-image: url("../../Images/Icon/B_005_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_030 {
  background-image: url("../../Images/Icon/B_005_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_031 {
  background-image: url("../../Images/Icon/B_005_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_032 {
  background-image: url("../../Images/Icon/B_005_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_033 {
  background-image: url("../../Images/Icon/B_005_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_034 {
  background-image: url("../../Images/Icon/B_005_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_035 {
  background-image: url("../../Images/Icon/B_005_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_036 {
  background-image: url("../../Images/Icon/B_005_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_037 {
  background-image: url("../../Images/Icon/B_005_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_038 {
  background-image: url("../../Images/Icon/B_005_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_039 {
  background-image: url("../../Images/Icon/B_005_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_040 {
  background-image: url("../../Images/Icon/B_005_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_041 {
  background-image: url("../../Images/Icon/B_005_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_042 {
  background-image: url("../../Images/Icon/B_005_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_043 {
  background-image: url("../../Images/Icon/B_005_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_044 {
  background-image: url("../../Images/Icon/B_005_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_045 {
  background-image: url("../../Images/Icon/B_005_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_046 {
  background-image: url("../../Images/Icon/B_005_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_047 {
  background-image: url("../../Images/Icon/B_005_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_048 {
  background-image: url("../../Images/Icon/B_005_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_049 {
  background-image: url("../../Images/Icon/B_005_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_005_050 {
  background-image: url("../../Images/Icon/B_005_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_001 {
  background-image: url("../../Images/Icon/W_005_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_002 {
  background-image: url("../../Images/Icon/W_005_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_003 {
  background-image: url("../../Images/Icon/W_005_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_004 {
  background-image: url("../../Images/Icon/W_005_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_005 {
  background-image: url("../../Images/Icon/W_005_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_006 {
  background-image: url("../../Images/Icon/W_005_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_007 {
  background-image: url("../../Images/Icon/W_005_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_008 {
  background-image: url("../../Images/Icon/W_005_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_009 {
  background-image: url("../../Images/Icon/W_005_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_010 {
  background-image: url("../../Images/Icon/W_005_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_011 {
  background-image: url("../../Images/Icon/W_005_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_012 {
  background-image: url("../../Images/Icon/W_005_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_013 {
  background-image: url("../../Images/Icon/W_005_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_014 {
  background-image: url("../../Images/Icon/W_005_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_015 {
  background-image: url("../../Images/Icon/W_005_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_016 {
  background-image: url("../../Images/Icon/W_005_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_017 {
  background-image: url("../../Images/Icon/W_005_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_018 {
  background-image: url("../../Images/Icon/W_005_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_019 {
  background-image: url("../../Images/Icon/W_005_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_020 {
  background-image: url("../../Images/Icon/W_005_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_021 {
  background-image: url("../../Images/Icon/W_005_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_022 {
  background-image: url("../../Images/Icon/W_005_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_023 {
  background-image: url("../../Images/Icon/W_005_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_024 {
  background-image: url("../../Images/Icon/W_005_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_025 {
  background-image: url("../../Images/Icon/W_005_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_026 {
  background-image: url("../../Images/Icon/W_005_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_027 {
  background-image: url("../../Images/Icon/W_005_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_028 {
  background-image: url("../../Images/Icon/W_005_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_029 {
  background-image: url("../../Images/Icon/W_005_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_030 {
  background-image: url("../../Images/Icon/W_005_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_031 {
  background-image: url("../../Images/Icon/W_005_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_032 {
  background-image: url("../../Images/Icon/W_005_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_033 {
  background-image: url("../../Images/Icon/W_005_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_034 {
  background-image: url("../../Images/Icon/W_005_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_035 {
  background-image: url("../../Images/Icon/W_005_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_036 {
  background-image: url("../../Images/Icon/W_005_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_037 {
  background-image: url("../../Images/Icon/W_005_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_038 {
  background-image: url("../../Images/Icon/W_005_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_039 {
  background-image: url("../../Images/Icon/W_005_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_040 {
  background-image: url("../../Images/Icon/W_005_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_041 {
  background-image: url("../../Images/Icon/W_005_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_042 {
  background-image: url("../../Images/Icon/W_005_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_043 {
  background-image: url("../../Images/Icon/W_005_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_044 {
  background-image: url("../../Images/Icon/W_005_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_045 {
  background-image: url("../../Images/Icon/W_005_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_046 {
  background-image: url("../../Images/Icon/W_005_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_047 {
  background-image: url("../../Images/Icon/W_005_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_048 {
  background-image: url("../../Images/Icon/W_005_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_049 {
  background-image: url("../../Images/Icon/W_005_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_005_050 {
  background-image: url("../../Images/Icon/W_005_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_001 {
  background-image: url("../../Images/Icon/C_006_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_002 {
  background-image: url("../../Images/Icon/C_006_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_003 {
  background-image: url("../../Images/Icon/C_006_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_004 {
  background-image: url("../../Images/Icon/C_006_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_005 {
  background-image: url("../../Images/Icon/C_006_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_006 {
  background-image: url("../../Images/Icon/C_006_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_007 {
  background-image: url("../../Images/Icon/C_006_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_008 {
  background-image: url("../../Images/Icon/C_006_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_009 {
  background-image: url("../../Images/Icon/C_006_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_006_010 {
  background-image: url("../../Images/Icon/C_006_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_001 {
  background-image: url("../../Images/Icon/B_006_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_002 {
  background-image: url("../../Images/Icon/B_006_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_003 {
  background-image: url("../../Images/Icon/B_006_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_004 {
  background-image: url("../../Images/Icon/B_006_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_005 {
  background-image: url("../../Images/Icon/B_006_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_006 {
  background-image: url("../../Images/Icon/B_006_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_007 {
  background-image: url("../../Images/Icon/B_006_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_008 {
  background-image: url("../../Images/Icon/B_006_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_009 {
  background-image: url("../../Images/Icon/B_006_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_006_010 {
  background-image: url("../../Images/Icon/B_006_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_001 {
  background-image: url("../../Images/Icon/W_006_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_002 {
  background-image: url("../../Images/Icon/W_006_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_003 {
  background-image: url("../../Images/Icon/W_006_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_004 {
  background-image: url("../../Images/Icon/W_006_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_005 {
  background-image: url("../../Images/Icon/W_006_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_006 {
  background-image: url("../../Images/Icon/W_006_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_007 {
  background-image: url("../../Images/Icon/W_006_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_008 {
  background-image: url("../../Images/Icon/W_006_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_009 {
  background-image: url("../../Images/Icon/W_006_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_006_010 {
  background-image: url("../../Images/Icon/W_006_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_001 {
  background-image: url("../../Images/Icon/C_007_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_002 {
  background-image: url("../../Images/Icon/C_007_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_003 {
  background-image: url("../../Images/Icon/C_007_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_004 {
  background-image: url("../../Images/Icon/C_007_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_005 {
  background-image: url("../../Images/Icon/C_007_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_006 {
  background-image: url("../../Images/Icon/C_007_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_007 {
  background-image: url("../../Images/Icon/C_007_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_008 {
  background-image: url("../../Images/Icon/C_007_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_009 {
  background-image: url("../../Images/Icon/C_007_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_010 {
  background-image: url("../../Images/Icon/C_007_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_007_011 {
  background-image: url("../../Images/Icon/C_007_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_001 {
  background-image: url("../../Images/Icon/B_007_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_002 {
  background-image: url("../../Images/Icon/B_007_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_003 {
  background-image: url("../../Images/Icon/B_007_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_004 {
  background-image: url("../../Images/Icon/B_007_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_005 {
  background-image: url("../../Images/Icon/B_007_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_006 {
  background-image: url("../../Images/Icon/B_007_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_007 {
  background-image: url("../../Images/Icon/B_007_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_008 {
  background-image: url("../../Images/Icon/B_007_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_009 {
  background-image: url("../../Images/Icon/B_007_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_010 {
  background-image: url("../../Images/Icon/B_007_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_007_011 {
  background-image: url("../../Images/Icon/B_007_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_001 {
  background-image: url("../../Images/Icon/W_007_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_002 {
  background-image: url("../../Images/Icon/W_007_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_003 {
  background-image: url("../../Images/Icon/W_007_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_004 {
  background-image: url("../../Images/Icon/W_007_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_005 {
  background-image: url("../../Images/Icon/W_007_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_006 {
  background-image: url("../../Images/Icon/W_007_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_007 {
  background-image: url("../../Images/Icon/W_007_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_008 {
  background-image: url("../../Images/Icon/W_007_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_009 {
  background-image: url("../../Images/Icon/W_007_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_010 {
  background-image: url("../../Images/Icon/W_007_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_007_011 {
  background-image: url("../../Images/Icon/W_007_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_001 {
  background-image: url("../../Images/Icon/C_008_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_002 {
  background-image: url("../../Images/Icon/C_008_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_003 {
  background-image: url("../../Images/Icon/C_008_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_004 {
  background-image: url("../../Images/Icon/C_008_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_005 {
  background-image: url("../../Images/Icon/C_008_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_006 {
  background-image: url("../../Images/Icon/C_008_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_007 {
  background-image: url("../../Images/Icon/C_008_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_008 {
  background-image: url("../../Images/Icon/C_008_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_009 {
  background-image: url("../../Images/Icon/C_008_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_010 {
  background-image: url("../../Images/Icon/C_008_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_011 {
  background-image: url("../../Images/Icon/C_008_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_012 {
  background-image: url("../../Images/Icon/C_008_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_008_013 {
  background-image: url("../../Images/Icon/C_008_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_001 {
  background-image: url("../../Images/Icon/B_008_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_002 {
  background-image: url("../../Images/Icon/B_008_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_003 {
  background-image: url("../../Images/Icon/B_008_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_004 {
  background-image: url("../../Images/Icon/B_008_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_005 {
  background-image: url("../../Images/Icon/B_008_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_006 {
  background-image: url("../../Images/Icon/B_008_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_007 {
  background-image: url("../../Images/Icon/B_008_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_008 {
  background-image: url("../../Images/Icon/B_008_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_009 {
  background-image: url("../../Images/Icon/B_008_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_010 {
  background-image: url("../../Images/Icon/B_008_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_011 {
  background-image: url("../../Images/Icon/B_008_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_012 {
  background-image: url("../../Images/Icon/B_008_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_008_013 {
  background-image: url("../../Images/Icon/B_008_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_001 {
  background-image: url("../../Images/Icon/W_008_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_002 {
  background-image: url("../../Images/Icon/W_008_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_003 {
  background-image: url("../../Images/Icon/W_008_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_004 {
  background-image: url("../../Images/Icon/W_008_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_005 {
  background-image: url("../../Images/Icon/W_008_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_006 {
  background-image: url("../../Images/Icon/W_008_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_007 {
  background-image: url("../../Images/Icon/W_008_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_008 {
  background-image: url("../../Images/Icon/W_008_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_009 {
  background-image: url("../../Images/Icon/W_008_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_010 {
  background-image: url("../../Images/Icon/W_008_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_011 {
  background-image: url("../../Images/Icon/W_008_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_012 {
  background-image: url("../../Images/Icon/W_008_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_008_013 {
  background-image: url("../../Images/Icon/W_008_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_001 {
  background-image: url("../../Images/Icon/C_009_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_002 {
  background-image: url("../../Images/Icon/C_009_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_003 {
  background-image: url("../../Images/Icon/C_009_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_004 {
  background-image: url("../../Images/Icon/C_009_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_005 {
  background-image: url("../../Images/Icon/C_009_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_006 {
  background-image: url("../../Images/Icon/C_009_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_007 {
  background-image: url("../../Images/Icon/C_009_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_008 {
  background-image: url("../../Images/Icon/C_009_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_009 {
  background-image: url("../../Images/Icon/C_009_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_010 {
  background-image: url("../../Images/Icon/C_009_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_011 {
  background-image: url("../../Images/Icon/C_009_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_012 {
  background-image: url("../../Images/Icon/C_009_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_013 {
  background-image: url("../../Images/Icon/C_009_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_014 {
  background-image: url("../../Images/Icon/C_009_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_015 {
  background-image: url("../../Images/Icon/C_009_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_016 {
  background-image: url("../../Images/Icon/C_009_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_017 {
  background-image: url("../../Images/Icon/C_009_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_018 {
  background-image: url("../../Images/Icon/C_009_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_019 {
  background-image: url("../../Images/Icon/C_009_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_009_020 {
  background-image: url("../../Images/Icon/C_009_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_001 {
  background-image: url("../../Images/Icon/B_009_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_002 {
  background-image: url("../../Images/Icon/B_009_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_003 {
  background-image: url("../../Images/Icon/B_009_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_004 {
  background-image: url("../../Images/Icon/B_009_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_005 {
  background-image: url("../../Images/Icon/B_009_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_006 {
  background-image: url("../../Images/Icon/B_009_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_007 {
  background-image: url("../../Images/Icon/B_009_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_008 {
  background-image: url("../../Images/Icon/B_009_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_009 {
  background-image: url("../../Images/Icon/B_009_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_010 {
  background-image: url("../../Images/Icon/B_009_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_011 {
  background-image: url("../../Images/Icon/B_009_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_012 {
  background-image: url("../../Images/Icon/B_009_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_013 {
  background-image: url("../../Images/Icon/B_009_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_014 {
  background-image: url("../../Images/Icon/B_009_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_015 {
  background-image: url("../../Images/Icon/B_009_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_016 {
  background-image: url("../../Images/Icon/B_009_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_017 {
  background-image: url("../../Images/Icon/B_009_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_018 {
  background-image: url("../../Images/Icon/B_009_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_019 {
  background-image: url("../../Images/Icon/B_009_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_009_020 {
  background-image: url("../../Images/Icon/B_009_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_001 {
  background-image: url("../../Images/Icon/W_009_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_002 {
  background-image: url("../../Images/Icon/W_009_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_003 {
  background-image: url("../../Images/Icon/W_009_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_004 {
  background-image: url("../../Images/Icon/W_009_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_005 {
  background-image: url("../../Images/Icon/W_009_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_006 {
  background-image: url("../../Images/Icon/W_009_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_007 {
  background-image: url("../../Images/Icon/W_009_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_008 {
  background-image: url("../../Images/Icon/W_009_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_009 {
  background-image: url("../../Images/Icon/W_009_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_010 {
  background-image: url("../../Images/Icon/W_009_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_011 {
  background-image: url("../../Images/Icon/W_009_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_012 {
  background-image: url("../../Images/Icon/W_009_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_013 {
  background-image: url("../../Images/Icon/W_009_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_014 {
  background-image: url("../../Images/Icon/W_009_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_015 {
  background-image: url("../../Images/Icon/W_009_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_016 {
  background-image: url("../../Images/Icon/W_009_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_017 {
  background-image: url("../../Images/Icon/W_009_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_018 {
  background-image: url("../../Images/Icon/W_009_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_019 {
  background-image: url("../../Images/Icon/W_009_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_009_020 {
  background-image: url("../../Images/Icon/W_009_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_001 {
  background-image: url("../../Images/Icon/C_010_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_002 {
  background-image: url("../../Images/Icon/C_010_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_003 {
  background-image: url("../../Images/Icon/C_010_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_004 {
  background-image: url("../../Images/Icon/C_010_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_005 {
  background-image: url("../../Images/Icon/C_010_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_006 {
  background-image: url("../../Images/Icon/C_010_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_007 {
  background-image: url("../../Images/Icon/C_010_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_008 {
  background-image: url("../../Images/Icon/C_010_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_010_009 {
  background-image: url("../../Images/Icon/C_010_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_001 {
  background-image: url("../../Images/Icon/B_010_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_002 {
  background-image: url("../../Images/Icon/B_010_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_003 {
  background-image: url("../../Images/Icon/B_010_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_004 {
  background-image: url("../../Images/Icon/B_010_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_005 {
  background-image: url("../../Images/Icon/B_010_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_006 {
  background-image: url("../../Images/Icon/B_010_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_007 {
  background-image: url("../../Images/Icon/B_010_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_008 {
  background-image: url("../../Images/Icon/B_010_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_010_009 {
  background-image: url("../../Images/Icon/B_010_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_001 {
  background-image: url("../../Images/Icon/W_010_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_002 {
  background-image: url("../../Images/Icon/W_010_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_003 {
  background-image: url("../../Images/Icon/W_010_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_004 {
  background-image: url("../../Images/Icon/W_010_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_005 {
  background-image: url("../../Images/Icon/W_010_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_006 {
  background-image: url("../../Images/Icon/W_010_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_007 {
  background-image: url("../../Images/Icon/W_010_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_008 {
  background-image: url("../../Images/Icon/W_010_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_010_009 {
  background-image: url("../../Images/Icon/W_010_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_001 {
  background-image: url("../../Images/Icon/C_011_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_002 {
  background-image: url("../../Images/Icon/C_011_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_003 {
  background-image: url("../../Images/Icon/C_011_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_004 {
  background-image: url("../../Images/Icon/C_011_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_005 {
  background-image: url("../../Images/Icon/C_011_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_006 {
  background-image: url("../../Images/Icon/C_011_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_007 {
  background-image: url("../../Images/Icon/C_011_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_008 {
  background-image: url("../../Images/Icon/C_011_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_009 {
  background-image: url("../../Images/Icon/C_011_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_011_010 {
  background-image: url("../../Images/Icon/C_011_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_001 {
  background-image: url("../../Images/Icon/B_011_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_002 {
  background-image: url("../../Images/Icon/B_011_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_003 {
  background-image: url("../../Images/Icon/B_011_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_004 {
  background-image: url("../../Images/Icon/B_011_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_005 {
  background-image: url("../../Images/Icon/B_011_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_006 {
  background-image: url("../../Images/Icon/B_011_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_007 {
  background-image: url("../../Images/Icon/B_011_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_008 {
  background-image: url("../../Images/Icon/B_011_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_009 {
  background-image: url("../../Images/Icon/B_011_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_011_010 {
  background-image: url("../../Images/Icon/B_011_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_001 {
  background-image: url("../../Images/Icon/W_011_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_002 {
  background-image: url("../../Images/Icon/W_011_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_003 {
  background-image: url("../../Images/Icon/W_011_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_004 {
  background-image: url("../../Images/Icon/W_011_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_005 {
  background-image: url("../../Images/Icon/W_011_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_006 {
  background-image: url("../../Images/Icon/W_011_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_007 {
  background-image: url("../../Images/Icon/W_011_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_008 {
  background-image: url("../../Images/Icon/W_011_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_009 {
  background-image: url("../../Images/Icon/W_011_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_011_010 {
  background-image: url("../../Images/Icon/W_011_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_001 {
  background-image: url("../../Images/Icon/C_012_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_002 {
  background-image: url("../../Images/Icon/C_012_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_003 {
  background-image: url("../../Images/Icon/C_012_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_004 {
  background-image: url("../../Images/Icon/C_012_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_005 {
  background-image: url("../../Images/Icon/C_012_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_006 {
  background-image: url("../../Images/Icon/C_012_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_007 {
  background-image: url("../../Images/Icon/C_012_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_008 {
  background-image: url("../../Images/Icon/C_012_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_012_009 {
  background-image: url("../../Images/Icon/C_012_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_001 {
  background-image: url("../../Images/Icon/B_012_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_002 {
  background-image: url("../../Images/Icon/B_012_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_003 {
  background-image: url("../../Images/Icon/B_012_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_004 {
  background-image: url("../../Images/Icon/B_012_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_005 {
  background-image: url("../../Images/Icon/B_012_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_006 {
  background-image: url("../../Images/Icon/B_012_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_007 {
  background-image: url("../../Images/Icon/B_012_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_008 {
  background-image: url("../../Images/Icon/B_012_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_012_009 {
  background-image: url("../../Images/Icon/B_012_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_001 {
  background-image: url("../../Images/Icon/W_012_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_002 {
  background-image: url("../../Images/Icon/W_012_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_003 {
  background-image: url("../../Images/Icon/W_012_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_004 {
  background-image: url("../../Images/Icon/W_012_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_005 {
  background-image: url("../../Images/Icon/W_012_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_006 {
  background-image: url("../../Images/Icon/W_012_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_007 {
  background-image: url("../../Images/Icon/W_012_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_008 {
  background-image: url("../../Images/Icon/W_012_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_012_009 {
  background-image: url("../../Images/Icon/W_012_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_001 {
  background-image: url("../../Images/Icon/C_013_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_002 {
  background-image: url("../../Images/Icon/C_013_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_003 {
  background-image: url("../../Images/Icon/C_013_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_004 {
  background-image: url("../../Images/Icon/C_013_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_005 {
  background-image: url("../../Images/Icon/C_013_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_006 {
  background-image: url("../../Images/Icon/C_013_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_007 {
  background-image: url("../../Images/Icon/C_013_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_008 {
  background-image: url("../../Images/Icon/C_013_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_009 {
  background-image: url("../../Images/Icon/C_013_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_010 {
  background-image: url("../../Images/Icon/C_013_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_013_011 {
  background-image: url("../../Images/Icon/C_013_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_001 {
  background-image: url("../../Images/Icon/B_013_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_002 {
  background-image: url("../../Images/Icon/B_013_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_003 {
  background-image: url("../../Images/Icon/B_013_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_004 {
  background-image: url("../../Images/Icon/B_013_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_005 {
  background-image: url("../../Images/Icon/B_013_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_006 {
  background-image: url("../../Images/Icon/B_013_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_007 {
  background-image: url("../../Images/Icon/B_013_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_008 {
  background-image: url("../../Images/Icon/B_013_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_009 {
  background-image: url("../../Images/Icon/B_013_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_010 {
  background-image: url("../../Images/Icon/B_013_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_013_011 {
  background-image: url("../../Images/Icon/B_013_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_001 {
  background-image: url("../../Images/Icon/W_013_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_002 {
  background-image: url("../../Images/Icon/W_013_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_003 {
  background-image: url("../../Images/Icon/W_013_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_004 {
  background-image: url("../../Images/Icon/W_013_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_005 {
  background-image: url("../../Images/Icon/W_013_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_006 {
  background-image: url("../../Images/Icon/W_013_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_007 {
  background-image: url("../../Images/Icon/W_013_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_008 {
  background-image: url("../../Images/Icon/W_013_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_009 {
  background-image: url("../../Images/Icon/W_013_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_010 {
  background-image: url("../../Images/Icon/W_013_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_013_011 {
  background-image: url("../../Images/Icon/W_013_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_001 {
  background-image: url("../../Images/Icon/C_014_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_002 {
  background-image: url("../../Images/Icon/C_014_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_003 {
  background-image: url("../../Images/Icon/C_014_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_004 {
  background-image: url("../../Images/Icon/C_014_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_005 {
  background-image: url("../../Images/Icon/C_014_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_006 {
  background-image: url("../../Images/Icon/C_014_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_007 {
  background-image: url("../../Images/Icon/C_014_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_008 {
  background-image: url("../../Images/Icon/C_014_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_009 {
  background-image: url("../../Images/Icon/C_014_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_010 {
  background-image: url("../../Images/Icon/C_014_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_011 {
  background-image: url("../../Images/Icon/C_014_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_012 {
  background-image: url("../../Images/Icon/C_014_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_013 {
  background-image: url("../../Images/Icon/C_014_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_014 {
  background-image: url("../../Images/Icon/C_014_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_015 {
  background-image: url("../../Images/Icon/C_014_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_016 {
  background-image: url("../../Images/Icon/C_014_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_014_017 {
  background-image: url("../../Images/Icon/C_014_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_001 {
  background-image: url("../../Images/Icon/B_014_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_002 {
  background-image: url("../../Images/Icon/B_014_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_003 {
  background-image: url("../../Images/Icon/B_014_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_004 {
  background-image: url("../../Images/Icon/B_014_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_005 {
  background-image: url("../../Images/Icon/B_014_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_006 {
  background-image: url("../../Images/Icon/B_014_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_007 {
  background-image: url("../../Images/Icon/B_014_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_008 {
  background-image: url("../../Images/Icon/B_014_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_009 {
  background-image: url("../../Images/Icon/B_014_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_010 {
  background-image: url("../../Images/Icon/B_014_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_011 {
  background-image: url("../../Images/Icon/B_014_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_012 {
  background-image: url("../../Images/Icon/B_014_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_013 {
  background-image: url("../../Images/Icon/B_014_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_014 {
  background-image: url("../../Images/Icon/B_014_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_015 {
  background-image: url("../../Images/Icon/B_014_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_016 {
  background-image: url("../../Images/Icon/B_014_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_017 {
  background-image: url("../../Images/Icon/B_014_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_001 {
  background-image: url("../../Images/Icon/W_014_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_002 {
  background-image: url("../../Images/Icon/W_014_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_003 {
  background-image: url("../../Images/Icon/W_014_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_004 {
  background-image: url("../../Images/Icon/W_014_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_005 {
  background-image: url("../../Images/Icon/W_014_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_006 {
  background-image: url("../../Images/Icon/W_014_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_007 {
  background-image: url("../../Images/Icon/W_014_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_008 {
  background-image: url("../../Images/Icon/W_014_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_009 {
  background-image: url("../../Images/Icon/W_014_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_010 {
  background-image: url("../../Images/Icon/W_014_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_011 {
  background-image: url("../../Images/Icon/W_014_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_012 {
  background-image: url("../../Images/Icon/W_014_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_013 {
  background-image: url("../../Images/Icon/W_014_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_014 {
  background-image: url("../../Images/Icon/W_014_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_015 {
  background-image: url("../../Images/Icon/W_014_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_016 {
  background-image: url("../../Images/Icon/W_014_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_014_017 {
  background-image: url("../../Images/Icon/W_014_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_001 {
  background-image: url("../../Images/Icon/C_015_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_002 {
  background-image: url("../../Images/Icon/C_015_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_003 {
  background-image: url("../../Images/Icon/C_015_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_004 {
  background-image: url("../../Images/Icon/C_015_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_005 {
  background-image: url("../../Images/Icon/C_015_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_006 {
  background-image: url("../../Images/Icon/C_015_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_007 {
  background-image: url("../../Images/Icon/C_015_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_008 {
  background-image: url("../../Images/Icon/C_015_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_009 {
  background-image: url("../../Images/Icon/C_015_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_010 {
  background-image: url("../../Images/Icon/C_015_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_011 {
  background-image: url("../../Images/Icon/C_015_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_012 {
  background-image: url("../../Images/Icon/C_015_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_013 {
  background-image: url("../../Images/Icon/C_015_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_014 {
  background-image: url("../../Images/Icon/C_015_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_015_015 {
  background-image: url("../../Images/Icon/C_015_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_001 {
  background-image: url("../../Images/Icon/B_015_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_002 {
  background-image: url("../../Images/Icon/B_015_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_003 {
  background-image: url("../../Images/Icon/B_015_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_004 {
  background-image: url("../../Images/Icon/B_015_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_005 {
  background-image: url("../../Images/Icon/B_015_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_006 {
  background-image: url("../../Images/Icon/B_015_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_007 {
  background-image: url("../../Images/Icon/B_015_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_008 {
  background-image: url("../../Images/Icon/B_015_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_009 {
  background-image: url("../../Images/Icon/B_015_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_010 {
  background-image: url("../../Images/Icon/B_015_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_011 {
  background-image: url("../../Images/Icon/B_015_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_012 {
  background-image: url("../../Images/Icon/B_015_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_013 {
  background-image: url("../../Images/Icon/B_015_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_014 {
  background-image: url("../../Images/Icon/B_015_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_015_015 {
  background-image: url("../../Images/Icon/B_015_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_001 {
  background-image: url("../../Images/Icon/W_015_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_002 {
  background-image: url("../../Images/Icon/W_015_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_003 {
  background-image: url("../../Images/Icon/W_015_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_004 {
  background-image: url("../../Images/Icon/W_015_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_005 {
  background-image: url("../../Images/Icon/W_015_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_006 {
  background-image: url("../../Images/Icon/W_015_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_007 {
  background-image: url("../../Images/Icon/W_015_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_008 {
  background-image: url("../../Images/Icon/W_015_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_009 {
  background-image: url("../../Images/Icon/W_015_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_010 {
  background-image: url("../../Images/Icon/W_015_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_011 {
  background-image: url("../../Images/Icon/W_015_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_012 {
  background-image: url("../../Images/Icon/W_015_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_013 {
  background-image: url("../../Images/Icon/W_015_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_014 {
  background-image: url("../../Images/Icon/W_015_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_015_015 {
  background-image: url("../../Images/Icon/W_015_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_001 {
  background-image: url("../../Images/Icon/C_016_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_002 {
  background-image: url("../../Images/Icon/C_016_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_003 {
  background-image: url("../../Images/Icon/C_016_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_004 {
  background-image: url("../../Images/Icon/C_016_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_005 {
  background-image: url("../../Images/Icon/C_016_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_006 {
  background-image: url("../../Images/Icon/C_016_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_007 {
  background-image: url("../../Images/Icon/C_016_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_008 {
  background-image: url("../../Images/Icon/C_016_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_009 {
  background-image: url("../../Images/Icon/C_016_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_010 {
  background-image: url("../../Images/Icon/C_016_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_011 {
  background-image: url("../../Images/Icon/C_016_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_016_012 {
  background-image: url("../../Images/Icon/C_016_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_001 {
  background-image: url("../../Images/Icon/B_016_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_002 {
  background-image: url("../../Images/Icon/B_016_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_003 {
  background-image: url("../../Images/Icon/B_016_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_004 {
  background-image: url("../../Images/Icon/B_016_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_005 {
  background-image: url("../../Images/Icon/B_016_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_006 {
  background-image: url("../../Images/Icon/B_016_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_007 {
  background-image: url("../../Images/Icon/B_016_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_008 {
  background-image: url("../../Images/Icon/B_016_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_009 {
  background-image: url("../../Images/Icon/B_016_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_010 {
  background-image: url("../../Images/Icon/B_016_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_011 {
  background-image: url("../../Images/Icon/B_016_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_016_012 {
  background-image: url("../../Images/Icon/B_016_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_001 {
  background-image: url("../../Images/Icon/W_016_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_002 {
  background-image: url("../../Images/Icon/W_016_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_003 {
  background-image: url("../../Images/Icon/W_016_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_004 {
  background-image: url("../../Images/Icon/W_016_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_005 {
  background-image: url("../../Images/Icon/W_016_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_006 {
  background-image: url("../../Images/Icon/W_016_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_007 {
  background-image: url("../../Images/Icon/W_016_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_008 {
  background-image: url("../../Images/Icon/W_016_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_009 {
  background-image: url("../../Images/Icon/W_016_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_010 {
  background-image: url("../../Images/Icon/W_016_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_011 {
  background-image: url("../../Images/Icon/W_016_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_016_012 {
  background-image: url("../../Images/Icon/W_016_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_001 {
  background-image: url("../../Images/Icon/C_017_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_002 {
  background-image: url("../../Images/Icon/C_017_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_003 {
  background-image: url("../../Images/Icon/C_017_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_004 {
  background-image: url("../../Images/Icon/C_017_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_005 {
  background-image: url("../../Images/Icon/C_017_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_006 {
  background-image: url("../../Images/Icon/C_017_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_007 {
  background-image: url("../../Images/Icon/C_017_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_008 {
  background-image: url("../../Images/Icon/C_017_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_017_009 {
  background-image: url("../../Images/Icon/C_017_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_001 {
  background-image: url("../../Images/Icon/B_017_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_002 {
  background-image: url("../../Images/Icon/B_017_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_003 {
  background-image: url("../../Images/Icon/B_017_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_004 {
  background-image: url("../../Images/Icon/B_017_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_005 {
  background-image: url("../../Images/Icon/B_017_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_006 {
  background-image: url("../../Images/Icon/B_017_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_007 {
  background-image: url("../../Images/Icon/B_017_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_008 {
  background-image: url("../../Images/Icon/B_017_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_017_009 {
  background-image: url("../../Images/Icon/B_017_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_001 {
  background-image: url("../../Images/Icon/W_017_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_002 {
  background-image: url("../../Images/Icon/W_017_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_003 {
  background-image: url("../../Images/Icon/W_017_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_004 {
  background-image: url("../../Images/Icon/W_017_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_005 {
  background-image: url("../../Images/Icon/W_017_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_006 {
  background-image: url("../../Images/Icon/W_017_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_007 {
  background-image: url("../../Images/Icon/W_017_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_008 {
  background-image: url("../../Images/Icon/W_017_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_017_009 {
  background-image: url("../../Images/Icon/W_017_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_001 {
  background-image: url("../../Images/Icon/C_018_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_002 {
  background-image: url("../../Images/Icon/C_018_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_003 {
  background-image: url("../../Images/Icon/C_018_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_004 {
  background-image: url("../../Images/Icon/C_018_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_005 {
  background-image: url("../../Images/Icon/C_018_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_006 {
  background-image: url("../../Images/Icon/C_018_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_007 {
  background-image: url("../../Images/Icon/C_018_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_008 {
  background-image: url("../../Images/Icon/C_018_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_018_009 {
  background-image: url("../../Images/Icon/C_018_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_001 {
  background-image: url("../../Images/Icon/B_018_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_002 {
  background-image: url("../../Images/Icon/B_018_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_003 {
  background-image: url("../../Images/Icon/B_018_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_004 {
  background-image: url("../../Images/Icon/B_018_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_005 {
  background-image: url("../../Images/Icon/B_018_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_006 {
  background-image: url("../../Images/Icon/B_018_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_007 {
  background-image: url("../../Images/Icon/B_018_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_008 {
  background-image: url("../../Images/Icon/B_018_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_018_009 {
  background-image: url("../../Images/Icon/B_018_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_001 {
  background-image: url("../../Images/Icon/W_018_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_002 {
  background-image: url("../../Images/Icon/W_018_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_003 {
  background-image: url("../../Images/Icon/W_018_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_004 {
  background-image: url("../../Images/Icon/W_018_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_005 {
  background-image: url("../../Images/Icon/W_018_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_006 {
  background-image: url("../../Images/Icon/W_018_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_007 {
  background-image: url("../../Images/Icon/W_018_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_008 {
  background-image: url("../../Images/Icon/W_018_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_018_009 {
  background-image: url("../../Images/Icon/W_018_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_019_001 {
  background-image: url("../../Images/Icon/C_019_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_019_002 {
  background-image: url("../../Images/Icon/C_019_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_019_003 {
  background-image: url("../../Images/Icon/C_019_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_019_004 {
  background-image: url("../../Images/Icon/C_019_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_019_005 {
  background-image: url("../../Images/Icon/C_019_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_019_006 {
  background-image: url("../../Images/Icon/C_019_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_019_007 {
  background-image: url("../../Images/Icon/C_019_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_019_008 {
  background-image: url("../../Images/Icon/C_019_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_019_001 {
  background-image: url("../../Images/Icon/B_019_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_019_002 {
  background-image: url("../../Images/Icon/B_019_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_019_003 {
  background-image: url("../../Images/Icon/B_019_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_019_004 {
  background-image: url("../../Images/Icon/B_019_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_019_005 {
  background-image: url("../../Images/Icon/B_019_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_019_006 {
  background-image: url("../../Images/Icon/B_019_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_019_007 {
  background-image: url("../../Images/Icon/B_019_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_019_008 {
  background-image: url("../../Images/Icon/B_019_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_019_001 {
  background-image: url("../../Images/Icon/W_019_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_019_002 {
  background-image: url("../../Images/Icon/W_019_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_019_003 {
  background-image: url("../../Images/Icon/W_019_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_019_004 {
  background-image: url("../../Images/Icon/W_019_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_019_005 {
  background-image: url("../../Images/Icon/W_019_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_019_006 {
  background-image: url("../../Images/Icon/W_019_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_019_007 {
  background-image: url("../../Images/Icon/W_019_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_019_008 {
  background-image: url("../../Images/Icon/W_019_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_001 {
  background-image: url("../../Images/Icon/C_020_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_002 {
  background-image: url("../../Images/Icon/C_020_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_003 {
  background-image: url("../../Images/Icon/C_020_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_004 {
  background-image: url("../../Images/Icon/C_020_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_005 {
  background-image: url("../../Images/Icon/C_020_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_006 {
  background-image: url("../../Images/Icon/C_020_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_007 {
  background-image: url("../../Images/Icon/C_020_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_008 {
  background-image: url("../../Images/Icon/C_020_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_009 {
  background-image: url("../../Images/Icon/C_020_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_010 {
  background-image: url("../../Images/Icon/C_020_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_020_011 {
  background-image: url("../../Images/Icon/C_020_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_001 {
  background-image: url("../../Images/Icon/B_020_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_002 {
  background-image: url("../../Images/Icon/B_020_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_003 {
  background-image: url("../../Images/Icon/B_020_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_004 {
  background-image: url("../../Images/Icon/B_020_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_005 {
  background-image: url("../../Images/Icon/B_020_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_006 {
  background-image: url("../../Images/Icon/B_020_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_007 {
  background-image: url("../../Images/Icon/B_020_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_008 {
  background-image: url("../../Images/Icon/B_020_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_009 {
  background-image: url("../../Images/Icon/B_020_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_010 {
  background-image: url("../../Images/Icon/B_020_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_020_011 {
  background-image: url("../../Images/Icon/B_020_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_001 {
  background-image: url("../../Images/Icon/W_020_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_002 {
  background-image: url("../../Images/Icon/W_020_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_003 {
  background-image: url("../../Images/Icon/W_020_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_004 {
  background-image: url("../../Images/Icon/W_020_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_005 {
  background-image: url("../../Images/Icon/W_020_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_006 {
  background-image: url("../../Images/Icon/W_020_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_007 {
  background-image: url("../../Images/Icon/W_020_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_008 {
  background-image: url("../../Images/Icon/W_020_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_009 {
  background-image: url("../../Images/Icon/W_020_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_010 {
  background-image: url("../../Images/Icon/W_020_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_020_011 {
  background-image: url("../../Images/Icon/W_020_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_001 {
  background-image: url("../../Images/Icon/C_021_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_002 {
  background-image: url("../../Images/Icon/C_021_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_003 {
  background-image: url("../../Images/Icon/C_021_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_004 {
  background-image: url("../../Images/Icon/C_021_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_005 {
  background-image: url("../../Images/Icon/C_021_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_006 {
  background-image: url("../../Images/Icon/C_021_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_007 {
  background-image: url("../../Images/Icon/C_021_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_008 {
  background-image: url("../../Images/Icon/C_021_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_009 {
  background-image: url("../../Images/Icon/C_021_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_010 {
  background-image: url("../../Images/Icon/C_021_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_011 {
  background-image: url("../../Images/Icon/C_021_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_012 {
  background-image: url("../../Images/Icon/C_021_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_021_013 {
  background-image: url("../../Images/Icon/C_021_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_001 {
  background-image: url("../../Images/Icon/B_021_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_002 {
  background-image: url("../../Images/Icon/B_021_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_003 {
  background-image: url("../../Images/Icon/B_021_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_004 {
  background-image: url("../../Images/Icon/B_021_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_005 {
  background-image: url("../../Images/Icon/B_021_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_006 {
  background-image: url("../../Images/Icon/B_021_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_007 {
  background-image: url("../../Images/Icon/B_021_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_008 {
  background-image: url("../../Images/Icon/B_021_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_009 {
  background-image: url("../../Images/Icon/B_021_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_010 {
  background-image: url("../../Images/Icon/B_021_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_011 {
  background-image: url("../../Images/Icon/B_021_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_012 {
  background-image: url("../../Images/Icon/B_021_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_021_013 {
  background-image: url("../../Images/Icon/B_021_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_001 {
  background-image: url("../../Images/Icon/W_021_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_002 {
  background-image: url("../../Images/Icon/W_021_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_003 {
  background-image: url("../../Images/Icon/W_021_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_004 {
  background-image: url("../../Images/Icon/W_021_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_005 {
  background-image: url("../../Images/Icon/W_021_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_006 {
  background-image: url("../../Images/Icon/W_021_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_007 {
  background-image: url("../../Images/Icon/W_021_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_008 {
  background-image: url("../../Images/Icon/W_021_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_009 {
  background-image: url("../../Images/Icon/W_021_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_010 {
  background-image: url("../../Images/Icon/W_021_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_011 {
  background-image: url("../../Images/Icon/W_021_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_012 {
  background-image: url("../../Images/Icon/W_021_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_021_013 {
  background-image: url("../../Images/Icon/W_021_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_001 {
  background-image: url("../../Images/Icon/C_022_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_002 {
  background-image: url("../../Images/Icon/C_022_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_003 {
  background-image: url("../../Images/Icon/C_022_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_004 {
  background-image: url("../../Images/Icon/C_022_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_005 {
  background-image: url("../../Images/Icon/C_022_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_006 {
  background-image: url("../../Images/Icon/C_022_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_007 {
  background-image: url("../../Images/Icon/C_022_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_008 {
  background-image: url("../../Images/Icon/C_022_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_009 {
  background-image: url("../../Images/Icon/C_022_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_010 {
  background-image: url("../../Images/Icon/C_022_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_022_011 {
  background-image: url("../../Images/Icon/C_022_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_001 {
  background-image: url("../../Images/Icon/B_022_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_002 {
  background-image: url("../../Images/Icon/B_022_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_003 {
  background-image: url("../../Images/Icon/B_022_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_004 {
  background-image: url("../../Images/Icon/B_022_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_005 {
  background-image: url("../../Images/Icon/B_022_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_006 {
  background-image: url("../../Images/Icon/B_022_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_007 {
  background-image: url("../../Images/Icon/B_022_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_008 {
  background-image: url("../../Images/Icon/B_022_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_009 {
  background-image: url("../../Images/Icon/B_022_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_010 {
  background-image: url("../../Images/Icon/B_022_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_022_011 {
  background-image: url("../../Images/Icon/B_022_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_001 {
  background-image: url("../../Images/Icon/W_022_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_002 {
  background-image: url("../../Images/Icon/W_022_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_003 {
  background-image: url("../../Images/Icon/W_022_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_004 {
  background-image: url("../../Images/Icon/W_022_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_005 {
  background-image: url("../../Images/Icon/W_022_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_006 {
  background-image: url("../../Images/Icon/W_022_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_007 {
  background-image: url("../../Images/Icon/W_022_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_008 {
  background-image: url("../../Images/Icon/W_022_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_009 {
  background-image: url("../../Images/Icon/W_022_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_010 {
  background-image: url("../../Images/Icon/W_022_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_022_011 {
  background-image: url("../../Images/Icon/W_022_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_001 {
  background-image: url("../../Images/Icon/C_023_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_002 {
  background-image: url("../../Images/Icon/C_023_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_003 {
  background-image: url("../../Images/Icon/C_023_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_004 {
  background-image: url("../../Images/Icon/C_023_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_005 {
  background-image: url("../../Images/Icon/C_023_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_006 {
  background-image: url("../../Images/Icon/C_023_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_007 {
  background-image: url("../../Images/Icon/C_023_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_008 {
  background-image: url("../../Images/Icon/C_023_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_009 {
  background-image: url("../../Images/Icon/C_023_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_010 {
  background-image: url("../../Images/Icon/C_023_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_011 {
  background-image: url("../../Images/Icon/C_023_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_012 {
  background-image: url("../../Images/Icon/C_023_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_013 {
  background-image: url("../../Images/Icon/C_023_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_023_014 {
  background-image: url("../../Images/Icon/C_023_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_001 {
  background-image: url("../../Images/Icon/B_023_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_002 {
  background-image: url("../../Images/Icon/B_023_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_003 {
  background-image: url("../../Images/Icon/B_023_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_004 {
  background-image: url("../../Images/Icon/B_023_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_005 {
  background-image: url("../../Images/Icon/B_023_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_006 {
  background-image: url("../../Images/Icon/B_023_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_007 {
  background-image: url("../../Images/Icon/B_023_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_008 {
  background-image: url("../../Images/Icon/B_023_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_009 {
  background-image: url("../../Images/Icon/B_023_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_010 {
  background-image: url("../../Images/Icon/B_023_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_011 {
  background-image: url("../../Images/Icon/B_023_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_012 {
  background-image: url("../../Images/Icon/B_023_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_013 {
  background-image: url("../../Images/Icon/B_023_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_023_014 {
  background-image: url("../../Images/Icon/B_023_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_001 {
  background-image: url("../../Images/Icon/W_023_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_002 {
  background-image: url("../../Images/Icon/W_023_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_003 {
  background-image: url("../../Images/Icon/W_023_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_004 {
  background-image: url("../../Images/Icon/W_023_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_005 {
  background-image: url("../../Images/Icon/W_023_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_006 {
  background-image: url("../../Images/Icon/W_023_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_007 {
  background-image: url("../../Images/Icon/W_023_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_008 {
  background-image: url("../../Images/Icon/W_023_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_009 {
  background-image: url("../../Images/Icon/W_023_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_010 {
  background-image: url("../../Images/Icon/W_023_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_011 {
  background-image: url("../../Images/Icon/W_023_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_012 {
  background-image: url("../../Images/Icon/W_023_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_013 {
  background-image: url("../../Images/Icon/W_023_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_023_014 {
  background-image: url("../../Images/Icon/W_023_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_001 {
  background-image: url("../../Images/Icon/C_024_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_002 {
  background-image: url("../../Images/Icon/C_024_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_003 {
  background-image: url("../../Images/Icon/C_024_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_004 {
  background-image: url("../../Images/Icon/C_024_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_005 {
  background-image: url("../../Images/Icon/C_024_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_006 {
  background-image: url("../../Images/Icon/C_024_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_007 {
  background-image: url("../../Images/Icon/C_024_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_008 {
  background-image: url("../../Images/Icon/C_024_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_009 {
  background-image: url("../../Images/Icon/C_024_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_010 {
  background-image: url("../../Images/Icon/C_024_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_011 {
  background-image: url("../../Images/Icon/C_024_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_012 {
  background-image: url("../../Images/Icon/C_024_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_013 {
  background-image: url("../../Images/Icon/C_024_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_014 {
  background-image: url("../../Images/Icon/C_024_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_015 {
  background-image: url("../../Images/Icon/C_024_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_016 {
  background-image: url("../../Images/Icon/C_024_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_017 {
  background-image: url("../../Images/Icon/C_024_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_018 {
  background-image: url("../../Images/Icon/C_024_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_019 {
  background-image: url("../../Images/Icon/C_024_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_020 {
  background-image: url("../../Images/Icon/C_024_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_021 {
  background-image: url("../../Images/Icon/C_024_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_022 {
  background-image: url("../../Images/Icon/C_024_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_023 {
  background-image: url("../../Images/Icon/C_024_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_024 {
  background-image: url("../../Images/Icon/C_024_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_025 {
  background-image: url("../../Images/Icon/C_024_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_026 {
  background-image: url("../../Images/Icon/C_024_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_027 {
  background-image: url("../../Images/Icon/C_024_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_028 {
  background-image: url("../../Images/Icon/C_024_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_029 {
  background-image: url("../../Images/Icon/C_024_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_030 {
  background-image: url("../../Images/Icon/C_024_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_031 {
  background-image: url("../../Images/Icon/C_024_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_032 {
  background-image: url("../../Images/Icon/C_024_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_033 {
  background-image: url("../../Images/Icon/C_024_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_034 {
  background-image: url("../../Images/Icon/C_024_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_035 {
  background-image: url("../../Images/Icon/C_024_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_024_036 {
  background-image: url("../../Images/Icon/C_024_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_001 {
  background-image: url("../../Images/Icon/B_024_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_002 {
  background-image: url("../../Images/Icon/B_024_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_003 {
  background-image: url("../../Images/Icon/B_024_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_004 {
  background-image: url("../../Images/Icon/B_024_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_005 {
  background-image: url("../../Images/Icon/B_024_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_006 {
  background-image: url("../../Images/Icon/B_024_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_007 {
  background-image: url("../../Images/Icon/B_024_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_008 {
  background-image: url("../../Images/Icon/B_024_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_009 {
  background-image: url("../../Images/Icon/B_024_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_010 {
  background-image: url("../../Images/Icon/B_024_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_011 {
  background-image: url("../../Images/Icon/B_024_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_012 {
  background-image: url("../../Images/Icon/B_024_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_013 {
  background-image: url("../../Images/Icon/B_024_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_014 {
  background-image: url("../../Images/Icon/B_024_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_015 {
  background-image: url("../../Images/Icon/B_024_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_016 {
  background-image: url("../../Images/Icon/B_024_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_017 {
  background-image: url("../../Images/Icon/B_024_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_018 {
  background-image: url("../../Images/Icon/B_024_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_019 {
  background-image: url("../../Images/Icon/B_024_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_020 {
  background-image: url("../../Images/Icon/B_024_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_021 {
  background-image: url("../../Images/Icon/B_024_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_022 {
  background-image: url("../../Images/Icon/B_024_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_023 {
  background-image: url("../../Images/Icon/B_024_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_024 {
  background-image: url("../../Images/Icon/B_024_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_025 {
  background-image: url("../../Images/Icon/B_024_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_026 {
  background-image: url("../../Images/Icon/B_024_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_027 {
  background-image: url("../../Images/Icon/B_024_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_028 {
  background-image: url("../../Images/Icon/B_024_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_029 {
  background-image: url("../../Images/Icon/B_024_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_030 {
  background-image: url("../../Images/Icon/B_024_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_031 {
  background-image: url("../../Images/Icon/B_024_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_032 {
  background-image: url("../../Images/Icon/B_024_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_033 {
  background-image: url("../../Images/Icon/B_024_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_034 {
  background-image: url("../../Images/Icon/B_024_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_035 {
  background-image: url("../../Images/Icon/B_024_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_024_036 {
  background-image: url("../../Images/Icon/B_024_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_001 {
  background-image: url("../../Images/Icon/W_024_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_002 {
  background-image: url("../../Images/Icon/W_024_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_003 {
  background-image: url("../../Images/Icon/W_024_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_004 {
  background-image: url("../../Images/Icon/W_024_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_005 {
  background-image: url("../../Images/Icon/W_024_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_006 {
  background-image: url("../../Images/Icon/W_024_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_007 {
  background-image: url("../../Images/Icon/W_024_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_008 {
  background-image: url("../../Images/Icon/W_024_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_009 {
  background-image: url("../../Images/Icon/W_024_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_010 {
  background-image: url("../../Images/Icon/W_024_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_011 {
  background-image: url("../../Images/Icon/W_024_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_012 {
  background-image: url("../../Images/Icon/W_024_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_013 {
  background-image: url("../../Images/Icon/W_024_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_014 {
  background-image: url("../../Images/Icon/W_024_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_015 {
  background-image: url("../../Images/Icon/W_024_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_016 {
  background-image: url("../../Images/Icon/W_024_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_017 {
  background-image: url("../../Images/Icon/W_024_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_018 {
  background-image: url("../../Images/Icon/W_024_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_019 {
  background-image: url("../../Images/Icon/W_024_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_020 {
  background-image: url("../../Images/Icon/W_024_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_021 {
  background-image: url("../../Images/Icon/W_024_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_022 {
  background-image: url("../../Images/Icon/W_024_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_023 {
  background-image: url("../../Images/Icon/W_024_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_024 {
  background-image: url("../../Images/Icon/W_024_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_025 {
  background-image: url("../../Images/Icon/W_024_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_026 {
  background-image: url("../../Images/Icon/W_024_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_027 {
  background-image: url("../../Images/Icon/W_024_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_028 {
  background-image: url("../../Images/Icon/W_024_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_029 {
  background-image: url("../../Images/Icon/W_024_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_030 {
  background-image: url("../../Images/Icon/W_024_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_031 {
  background-image: url("../../Images/Icon/W_024_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_032 {
  background-image: url("../../Images/Icon/W_024_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_033 {
  background-image: url("../../Images/Icon/W_024_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_034 {
  background-image: url("../../Images/Icon/W_024_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_035 {
  background-image: url("../../Images/Icon/W_024_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_024_036 {
  background-image: url("../../Images/Icon/W_024_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_001 {
  background-image: url("../../Images/Icon/C_025_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_002 {
  background-image: url("../../Images/Icon/C_025_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_003 {
  background-image: url("../../Images/Icon/C_025_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_004 {
  background-image: url("../../Images/Icon/C_025_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_005 {
  background-image: url("../../Images/Icon/C_025_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_006 {
  background-image: url("../../Images/Icon/C_025_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_007 {
  background-image: url("../../Images/Icon/C_025_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_008 {
  background-image: url("../../Images/Icon/C_025_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_009 {
  background-image: url("../../Images/Icon/C_025_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_010 {
  background-image: url("../../Images/Icon/C_025_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_011 {
  background-image: url("../../Images/Icon/C_025_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_012 {
  background-image: url("../../Images/Icon/C_025_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_013 {
  background-image: url("../../Images/Icon/C_025_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_014 {
  background-image: url("../../Images/Icon/C_025_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_015 {
  background-image: url("../../Images/Icon/C_025_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_016 {
  background-image: url("../../Images/Icon/C_025_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_017 {
  background-image: url("../../Images/Icon/C_025_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_018 {
  background-image: url("../../Images/Icon/C_025_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_019 {
  background-image: url("../../Images/Icon/C_025_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_020 {
  background-image: url("../../Images/Icon/C_025_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_021 {
  background-image: url("../../Images/Icon/C_025_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_022 {
  background-image: url("../../Images/Icon/C_025_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_023 {
  background-image: url("../../Images/Icon/C_025_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_024 {
  background-image: url("../../Images/Icon/C_025_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_025 {
  background-image: url("../../Images/Icon/C_025_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_026 {
  background-image: url("../../Images/Icon/C_025_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_027 {
  background-image: url("../../Images/Icon/C_025_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_028 {
  background-image: url("../../Images/Icon/C_025_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_029 {
  background-image: url("../../Images/Icon/C_025_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_030 {
  background-image: url("../../Images/Icon/C_025_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_031 {
  background-image: url("../../Images/Icon/C_025_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_032 {
  background-image: url("../../Images/Icon/C_025_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_033 {
  background-image: url("../../Images/Icon/C_025_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_034 {
  background-image: url("../../Images/Icon/C_025_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_035 {
  background-image: url("../../Images/Icon/C_025_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_036 {
  background-image: url("../../Images/Icon/C_025_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_037 {
  background-image: url("../../Images/Icon/C_025_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_038 {
  background-image: url("../../Images/Icon/C_025_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_039 {
  background-image: url("../../Images/Icon/C_025_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_040 {
  background-image: url("../../Images/Icon/C_025_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_041 {
  background-image: url("../../Images/Icon/C_025_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_042 {
  background-image: url("../../Images/Icon/C_025_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_043 {
  background-image: url("../../Images/Icon/C_025_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_044 {
  background-image: url("../../Images/Icon/C_025_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_045 {
  background-image: url("../../Images/Icon/C_025_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_046 {
  background-image: url("../../Images/Icon/C_025_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_047 {
  background-image: url("../../Images/Icon/C_025_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_048 {
  background-image: url("../../Images/Icon/C_025_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_049 {
  background-image: url("../../Images/Icon/C_025_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_050 {
  background-image: url("../../Images/Icon/C_025_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_051 {
  background-image: url("../../Images/Icon/C_025_051.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_052 {
  background-image: url("../../Images/Icon/C_025_052.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_053 {
  background-image: url("../../Images/Icon/C_025_053.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_054 {
  background-image: url("../../Images/Icon/C_025_054.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_025_055 {
  background-image: url("../../Images/Icon/C_025_055.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_001 {
  background-image: url("../../Images/Icon/B_025_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_002 {
  background-image: url("../../Images/Icon/B_025_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_003 {
  background-image: url("../../Images/Icon/B_025_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_004 {
  background-image: url("../../Images/Icon/B_025_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_005 {
  background-image: url("../../Images/Icon/B_025_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_006 {
  background-image: url("../../Images/Icon/B_025_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_007 {
  background-image: url("../../Images/Icon/B_025_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_008 {
  background-image: url("../../Images/Icon/B_025_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_009 {
  background-image: url("../../Images/Icon/B_025_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_010 {
  background-image: url("../../Images/Icon/B_025_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_011 {
  background-image: url("../../Images/Icon/B_025_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_012 {
  background-image: url("../../Images/Icon/B_025_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_013 {
  background-image: url("../../Images/Icon/B_025_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_014 {
  background-image: url("../../Images/Icon/B_025_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_015 {
  background-image: url("../../Images/Icon/B_025_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_016 {
  background-image: url("../../Images/Icon/B_025_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_017 {
  background-image: url("../../Images/Icon/B_025_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_018 {
  background-image: url("../../Images/Icon/B_025_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_019 {
  background-image: url("../../Images/Icon/B_025_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_020 {
  background-image: url("../../Images/Icon/B_025_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_021 {
  background-image: url("../../Images/Icon/B_025_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_022 {
  background-image: url("../../Images/Icon/B_025_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_023 {
  background-image: url("../../Images/Icon/B_025_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_024 {
  background-image: url("../../Images/Icon/B_025_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_025 {
  background-image: url("../../Images/Icon/B_025_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_026 {
  background-image: url("../../Images/Icon/B_025_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_027 {
  background-image: url("../../Images/Icon/B_025_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_028 {
  background-image: url("../../Images/Icon/B_025_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_029 {
  background-image: url("../../Images/Icon/B_025_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_030 {
  background-image: url("../../Images/Icon/B_025_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_031 {
  background-image: url("../../Images/Icon/B_025_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_032 {
  background-image: url("../../Images/Icon/B_025_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_033 {
  background-image: url("../../Images/Icon/B_025_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_034 {
  background-image: url("../../Images/Icon/B_025_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_035 {
  background-image: url("../../Images/Icon/B_025_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_036 {
  background-image: url("../../Images/Icon/B_025_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_037 {
  background-image: url("../../Images/Icon/B_025_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_038 {
  background-image: url("../../Images/Icon/B_025_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_039 {
  background-image: url("../../Images/Icon/B_025_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_040 {
  background-image: url("../../Images/Icon/B_025_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_041 {
  background-image: url("../../Images/Icon/B_025_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_042 {
  background-image: url("../../Images/Icon/B_025_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_043 {
  background-image: url("../../Images/Icon/B_025_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_044 {
  background-image: url("../../Images/Icon/B_025_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_045 {
  background-image: url("../../Images/Icon/B_025_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_046 {
  background-image: url("../../Images/Icon/B_025_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_047 {
  background-image: url("../../Images/Icon/B_025_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_048 {
  background-image: url("../../Images/Icon/B_025_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_049 {
  background-image: url("../../Images/Icon/B_025_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_050 {
  background-image: url("../../Images/Icon/B_025_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_051 {
  background-image: url("../../Images/Icon/B_025_051.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_052 {
  background-image: url("../../Images/Icon/B_025_052.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_053 {
  background-image: url("../../Images/Icon/B_025_053.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_054 {
  background-image: url("../../Images/Icon/B_025_054.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_025_055 {
  background-image: url("../../Images/Icon/B_025_055.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_001 {
  background-image: url("../../Images/Icon/W_025_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_002 {
  background-image: url("../../Images/Icon/W_025_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_003 {
  background-image: url("../../Images/Icon/W_025_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_004 {
  background-image: url("../../Images/Icon/W_025_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_005 {
  background-image: url("../../Images/Icon/W_025_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_006 {
  background-image: url("../../Images/Icon/W_025_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_007 {
  background-image: url("../../Images/Icon/W_025_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_008 {
  background-image: url("../../Images/Icon/W_025_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_009 {
  background-image: url("../../Images/Icon/W_025_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_010 {
  background-image: url("../../Images/Icon/W_025_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_011 {
  background-image: url("../../Images/Icon/W_025_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_012 {
  background-image: url("../../Images/Icon/W_025_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_013 {
  background-image: url("../../Images/Icon/W_025_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_014 {
  background-image: url("../../Images/Icon/W_025_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_015 {
  background-image: url("../../Images/Icon/W_025_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_016 {
  background-image: url("../../Images/Icon/W_025_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_017 {
  background-image: url("../../Images/Icon/W_025_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_018 {
  background-image: url("../../Images/Icon/W_025_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_019 {
  background-image: url("../../Images/Icon/W_025_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_020 {
  background-image: url("../../Images/Icon/W_025_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_021 {
  background-image: url("../../Images/Icon/W_025_021.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_022 {
  background-image: url("../../Images/Icon/W_025_022.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_023 {
  background-image: url("../../Images/Icon/W_025_023.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_024 {
  background-image: url("../../Images/Icon/W_025_024.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_025 {
  background-image: url("../../Images/Icon/W_025_025.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_026 {
  background-image: url("../../Images/Icon/W_025_026.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_027 {
  background-image: url("../../Images/Icon/W_025_027.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_028 {
  background-image: url("../../Images/Icon/W_025_028.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_029 {
  background-image: url("../../Images/Icon/W_025_029.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_030 {
  background-image: url("../../Images/Icon/W_025_030.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_031 {
  background-image: url("../../Images/Icon/W_025_031.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_032 {
  background-image: url("../../Images/Icon/W_025_032.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_033 {
  background-image: url("../../Images/Icon/W_025_033.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_034 {
  background-image: url("../../Images/Icon/W_025_034.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_035 {
  background-image: url("../../Images/Icon/W_025_035.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_036 {
  background-image: url("../../Images/Icon/W_025_036.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_037 {
  background-image: url("../../Images/Icon/W_025_037.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_038 {
  background-image: url("../../Images/Icon/W_025_038.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_039 {
  background-image: url("../../Images/Icon/W_025_039.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_040 {
  background-image: url("../../Images/Icon/W_025_040.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_041 {
  background-image: url("../../Images/Icon/W_025_041.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_042 {
  background-image: url("../../Images/Icon/W_025_042.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_043 {
  background-image: url("../../Images/Icon/W_025_043.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_044 {
  background-image: url("../../Images/Icon/W_025_044.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_045 {
  background-image: url("../../Images/Icon/W_025_045.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_046 {
  background-image: url("../../Images/Icon/W_025_046.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_047 {
  background-image: url("../../Images/Icon/W_025_047.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_048 {
  background-image: url("../../Images/Icon/W_025_048.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_049 {
  background-image: url("../../Images/Icon/W_025_049.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_050 {
  background-image: url("../../Images/Icon/W_025_050.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_051 {
  background-image: url("../../Images/Icon/W_025_051.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_052 {
  background-image: url("../../Images/Icon/W_025_052.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_053 {
  background-image: url("../../Images/Icon/W_025_053.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_054 {
  background-image: url("../../Images/Icon/W_025_054.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_025_055 {
  background-image: url("../../Images/Icon/W_025_055.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_001 {
  background-image: url("../../Images/Icon/C_026_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_002 {
  background-image: url("../../Images/Icon/C_026_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_003 {
  background-image: url("../../Images/Icon/C_026_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_004 {
  background-image: url("../../Images/Icon/C_026_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_005 {
  background-image: url("../../Images/Icon/C_026_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_006 {
  background-image: url("../../Images/Icon/C_026_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_007 {
  background-image: url("../../Images/Icon/C_026_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_008 {
  background-image: url("../../Images/Icon/C_026_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_009 {
  background-image: url("../../Images/Icon/C_026_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_010 {
  background-image: url("../../Images/Icon/C_026_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_011 {
  background-image: url("../../Images/Icon/C_026_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_012 {
  background-image: url("../../Images/Icon/C_026_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_013 {
  background-image: url("../../Images/Icon/C_026_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_014 {
  background-image: url("../../Images/Icon/C_026_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_015 {
  background-image: url("../../Images/Icon/C_026_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_026_016 {
  background-image: url("../../Images/Icon/C_026_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_001 {
  background-image: url("../../Images/Icon/B_026_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_002 {
  background-image: url("../../Images/Icon/B_026_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_003 {
  background-image: url("../../Images/Icon/B_026_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_004 {
  background-image: url("../../Images/Icon/B_026_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_005 {
  background-image: url("../../Images/Icon/B_026_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_006 {
  background-image: url("../../Images/Icon/B_026_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_007 {
  background-image: url("../../Images/Icon/B_026_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_008 {
  background-image: url("../../Images/Icon/B_026_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_009 {
  background-image: url("../../Images/Icon/B_026_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_010 {
  background-image: url("../../Images/Icon/B_026_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_011 {
  background-image: url("../../Images/Icon/B_026_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_012 {
  background-image: url("../../Images/Icon/B_026_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_013 {
  background-image: url("../../Images/Icon/B_026_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_014 {
  background-image: url("../../Images/Icon/B_026_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_015 {
  background-image: url("../../Images/Icon/B_026_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_026_016 {
  background-image: url("../../Images/Icon/B_026_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_001 {
  background-image: url("../../Images/Icon/W_026_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_002 {
  background-image: url("../../Images/Icon/W_026_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_003 {
  background-image: url("../../Images/Icon/W_026_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_004 {
  background-image: url("../../Images/Icon/W_026_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_005 {
  background-image: url("../../Images/Icon/W_026_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_006 {
  background-image: url("../../Images/Icon/W_026_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_007 {
  background-image: url("../../Images/Icon/W_026_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_008 {
  background-image: url("../../Images/Icon/W_026_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_009 {
  background-image: url("../../Images/Icon/W_026_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_010 {
  background-image: url("../../Images/Icon/W_026_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_011 {
  background-image: url("../../Images/Icon/W_026_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_012 {
  background-image: url("../../Images/Icon/W_026_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_013 {
  background-image: url("../../Images/Icon/W_026_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_014 {
  background-image: url("../../Images/Icon/W_026_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_015 {
  background-image: url("../../Images/Icon/W_026_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_026_016 {
  background-image: url("../../Images/Icon/W_026_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_001 {
  background-image: url("../../Images/Icon/C_027_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_002 {
  background-image: url("../../Images/Icon/C_027_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_003 {
  background-image: url("../../Images/Icon/C_027_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_004 {
  background-image: url("../../Images/Icon/C_027_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_005 {
  background-image: url("../../Images/Icon/C_027_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_006 {
  background-image: url("../../Images/Icon/C_027_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_007 {
  background-image: url("../../Images/Icon/C_027_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_008 {
  background-image: url("../../Images/Icon/C_027_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_009 {
  background-image: url("../../Images/Icon/C_027_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_010 {
  background-image: url("../../Images/Icon/C_027_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_011 {
  background-image: url("../../Images/Icon/C_027_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_012 {
  background-image: url("../../Images/Icon/C_027_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_013 {
  background-image: url("../../Images/Icon/C_027_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_014 {
  background-image: url("../../Images/Icon/C_027_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_015 {
  background-image: url("../../Images/Icon/C_027_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_016 {
  background-image: url("../../Images/Icon/C_027_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_017 {
  background-image: url("../../Images/Icon/C_027_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_018 {
  background-image: url("../../Images/Icon/C_027_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_019 {
  background-image: url("../../Images/Icon/C_027_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.C_027_020 {
  background-image: url("../../Images/Icon/C_027_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_001 {
  background-image: url("../../Images/Icon/B_027_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_002 {
  background-image: url("../../Images/Icon/B_027_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_003 {
  background-image: url("../../Images/Icon/B_027_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_004 {
  background-image: url("../../Images/Icon/B_027_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_005 {
  background-image: url("../../Images/Icon/B_027_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_006 {
  background-image: url("../../Images/Icon/B_027_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_007 {
  background-image: url("../../Images/Icon/B_027_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_008 {
  background-image: url("../../Images/Icon/B_027_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_009 {
  background-image: url("../../Images/Icon/B_027_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_010 {
  background-image: url("../../Images/Icon/B_027_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_011 {
  background-image: url("../../Images/Icon/B_027_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_012 {
  background-image: url("../../Images/Icon/B_027_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_013 {
  background-image: url("../../Images/Icon/B_027_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_014 {
  background-image: url("../../Images/Icon/B_027_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_015 {
  background-image: url("../../Images/Icon/B_027_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_016 {
  background-image: url("../../Images/Icon/B_027_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_017 {
  background-image: url("../../Images/Icon/B_027_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_018 {
  background-image: url("../../Images/Icon/B_027_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_019 {
  background-image: url("../../Images/Icon/B_027_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_027_020 {
  background-image: url("../../Images/Icon/B_027_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_001 {
  background-image: url("../../Images/Icon/W_027_001.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_002 {
  background-image: url("../../Images/Icon/W_027_002.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_003 {
  background-image: url("../../Images/Icon/W_027_003.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_004 {
  background-image: url("../../Images/Icon/W_027_004.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_005 {
  background-image: url("../../Images/Icon/W_027_005.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_006 {
  background-image: url("../../Images/Icon/W_027_006.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_007 {
  background-image: url("../../Images/Icon/W_027_007.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_008 {
  background-image: url("../../Images/Icon/W_027_008.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_009 {
  background-image: url("../../Images/Icon/W_027_009.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_010 {
  background-image: url("../../Images/Icon/W_027_010.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_011 {
  background-image: url("../../Images/Icon/W_027_011.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_012 {
  background-image: url("../../Images/Icon/W_027_012.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_013 {
  background-image: url("../../Images/Icon/W_027_013.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_014 {
  background-image: url("../../Images/Icon/W_027_014.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_015 {
  background-image: url("../../Images/Icon/W_027_015.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_016 {
  background-image: url("../../Images/Icon/W_027_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_017 {
  background-image: url("../../Images/Icon/W_027_017.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_018 {
  background-image: url("../../Images/Icon/W_027_018.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_019 {
  background-image: url("../../Images/Icon/W_027_019.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.W_027_020 {
  background-image: url("../../Images/Icon/W_027_020.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.B_014_016 {
  background-image: url("../../Images/Icon/B_014_016.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

@font-face {
  font-family: "Material Symbols Outlined";
  font-style: normal;
  font-weight: 400;
  src: url(fonts/GoogleMaterialSymbols/material-symbols-outlined.woff2) format("woff2");
}
*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
*::-webkit-scrollbar-track {
  background-color: transparent;
}
*::-webkit-scrollbar-track:hover {
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
*::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.15);
}
*::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.25);
}
*::-webkit-scrollbar-thumb:active {
  background-color: rgba(0, 0, 0, 0.4);
}
*::-webkit-scrollbar-corner {
  background-color: transparent;
}
*::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  background-color: transparent;
}
* {
  scrollbar-face-color: transparent;
  scrollbar-track-color: transparent;
  scrollbar-3dlight-color: transparent;
  scrollbar-highlight-color: transparent;
  scrollbar-darkshadow-color: transparent;
  scrollbar-shadow-color: transparent;
  scrollbar-arrow-color: transparent;
}

article.wrap {
  position: relative;
  width: 100%;
  height: 100%;
  margin-top: 0px;
  transition: margin-top 0.5s;
  z-index: 11000;
}

.pgmTopArea {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 300px;
  height: var(--PgmTopHeight);
}
.pgmTopArea .pgmTop {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.pgmTopArea .pgmTop .btnExit {
  display: none;
}
.pgmTopArea .pgmTop .pgmTitleWrap {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0 5px;
  border-radius: 4px;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitle {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding: 5px 10px 5px 4px;
  border-radius: 4px;
  cursor: default;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitle i.AIPgm {
  position: absolute;
  top: 1px;
  left: 34px;
  cursor: pointer;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitle .btnViewPath {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitle.btnPgmTitle {
  position: relative;
  padding: 3px 3px 3px 0;
  cursor: pointer;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitle.btnPgmTitle:hover, .pgmTopArea .pgmTop .pgmTitleWrap .pgmTitle.btnPgmTitle.Selected {
  background-color: #e2e7ee;
  color: initial;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea {
  display: flex;
  align-items: center;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea .pgmTitleTxt {
  padding-left: 5px;
  color: var(--MainFontColor);
  font-size: var(--fs15);
  font-weight: bold;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea .btnDev {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-left: 3px;
  padding: 3px;
  border-radius: 4px;
  cursor: pointer;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea .btnDev::before {
  content: "</>";
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 10px;
  background-color: #FCC34A;
  font-size: var(--fs10);
  font-weight: 800;
  border-radius: 3px;
  overflow: hidden;
  opacity: 0;
  transition: ease-in 0.2s;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea .btnDev:hover::before {
  opacity: 1;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea .btnDev.loading {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: opaitiy 0.5s ease;
  cursor: default;
  pointer-events: none;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea .btnDev.loading::before, .pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea .btnDev.loading > i {
  display: none;
}
.pgmTopArea .pgmTop .pgmTitleWrap .pgmTitleTxtArea .btnDev.loading:after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border: 3px solid #ccc;
  border-top-color: #3b82f6;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  box-sizing: border-box;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPathWrap {
  position: absolute;
  top: 35px;
  left: 20px;
  display: flex;
  z-index: 9;
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPath {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 40px;
  padding: 10px 15px;
  background-color: #fff;
  border-radius: 8px;
  box-shadow: var(--dlgBoxShadow);
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPath > .item {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPath > .item > i {
  margin-right: 5px;
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPath > .item .name {
  font-size: var(--fs14);
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPath > .item .name:hover {
  text-decoration: underline;
  color: initial;
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPath > .item .thmbPrcs {
  position: absolute;
  top: 50px;
  left: 30px;
  width: 250px;
  border: 1px solid #d7d7d7;
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPath > .item .thmbPrcs > img {
  width: 100%;
}
.pgmTopArea .pgmTop .pgmTitleWrap .dlgPgmPath i.pgmArrow {
  transform: rotate(-180deg);
  margin: 0 10px;
}
.dlgExtensionList {
  position: absolute;
  top: 75px;
  padding: 5px;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: var(--dlgBoxShadow);
  padding: 10px;
  z-index: 121;
}
.dlgExtensionList .contextMenu > li {
  margin-bottom: 5px;
}
.dlgExtensionList .contextMenu > li:last-child {
  margin-bottom: 0;
}
.dlgExtensionList .contextMenu > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px;
  border-radius: 4px;
}
.dlgExtensionList .contextMenu > li > a .icoWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-right: 12px;
  border-radius: 4px;
  background-color: #F9CD0E;
}
.dlgExtensionList .contextMenu > li > a .txtWrap .title {
  display: flex;
  align-items: center;
  margin-bottom: 4px;
}
.dlgExtensionList .contextMenu > li > a .txtWrap .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.dlgExtensionList .contextMenu > li > a .txtWrap .title .tagDev {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 5px;
  padding: 3px 8px;
  border-radius: 10px;
  background-color: #E3E7EB;
  color: #9a9a9a;
  font-size: var(--fs12);
}
.dlgExtensionList .contextMenu > li > a .txtWrap .subTxt {
  font-size: var(--fs13);
}
.dlgExtensionList .contextMenu > li > a:hover {
  background-color: #f5f5f5;
  color: initial;
}
.dlgExtensionList .contextMenu > li > a.wwAI .icoWrap {
  background: linear-gradient(133deg, #F8F7FF 9.9%, #E8E4FF 47.85%, #E7D2FF 90.65%);
}
.dlgExtensionList .contextMenu > li > a.myDefVal .icoWrap {
  background-color: #F9CD0E;
}
.dlgExtensionList .contextMenu > li > a.dataScrap .icoWrap {
  background-color: #3A94FE;
}
.dlgExtensionList .contextMenu > li > a.kbot .icoWrap {
  background: var(--AIColor);
}
.dlgExtensionList .contextMenu > li > a.pgmReload .icoWrap {
  background-color: #707070;
}
.dlgExtensionList .contextMenu > li > a.sheetSetting .icoWrap {
  background-color: #E57F53;
}
.dlgExtensionList .contextMenu > li > a.everDesign .icoWrap {
  background-color: #9CACFF;
}
.dlgExtensionList .contextMenu > li > a.everView .icoWrap {
  background-color: #15B065;
}
.dlgExtensionList .contextMenu > li > a.promptEditor .icoWrap {
  background: linear-gradient(135deg, #6C68EC, #AC48E9);
}

.pgmTopArea .extensionArea {
  position: absolute;
  right: 0;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  background-color: var(--PgmAreaBgColor);
}
.pgmTopArea .extensionArea .pgmTools {
  display: flex;
  align-items: center;
  padding: 0 10px;
  border-left: 1px solid #CFD8DC;
}
.pgmTopArea .extensionArea .pgmTools > button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 3px;
  cursor: pointer;
}
.pgmTopArea .extensionArea .pgmTools > button:hover {
  background-color: #e2e7ee;
}
.pgmTopArea .extensionArea .pgmTools > button.btnFav:hover {
  background-color: transparent;
}
.pgmTopArea .extensionArea .pgmTools > button:last-child {
  margin-right: 0;
}
.pgmTopArea .extensionArea .extension {
  padding: 0 5px;
}
.pgmTopArea .extensionArea .extension > button.btnExtList {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  padding: 0 6px 0 8px;
  border-radius: 4px;
  gap: 5px;
  cursor: pointer;
}
.pgmTopArea .extensionArea .extension > button.btnExtList .txt {
  color: var(--MainFontColor);
  font-size: var(--fs13);
  font-weight: bold;
}
.pgmTopArea .extensionArea .extension > button.btnExtList:hover {
  background-color: #e2e7ee;
}

.dlgTrspWrap.wwAI {
  display: flex;
  align-items: center;
  justify-content: center;
}

.dlgWorkingWithAI {
  display: flex;
  align-items: center;
  flex-direction: column;
  width: 425px;
  min-height: 400px;
  padding: 20px;
  border-radius: 4px;
  background-color: #fff;
  box-shadow: var(--dlgBoxShadow);
  gap: 10px;
  z-index: 121;
}
.dlgWorkingWithAI > header {
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  padding: 20px;
  border-radius: 8px;
  background: linear-gradient(102deg, #F6F5FF 6.18%, #E3F4FF 93.49%);
}
.dlgWorkingWithAI > header > .title {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
}
.dlgWorkingWithAI > header > .title .txtTitle {
  color: #6C68EC;
  font-size: var(--fs16);
  font-weight: bold;
}
.dlgWorkingWithAI > header > .title .txtSub {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  font-weight: 500;
  line-height: 150%;
}
.dlgWorkingWithAI > header .imgWorkingWithAI {
  position: absolute;
  right: 25px;
  bottom: 0;
}
.dlgWorkingWithAI .contextMenu {
  width: 100%;
  height: 100%;
}
.dlgWorkingWithAI .contextMenu > li {
  margin-bottom: 5px;
}
.dlgWorkingWithAI .contextMenu > li:last-child {
  margin-bottom: 0;
}
.dlgWorkingWithAI .contextMenu > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px;
  border-radius: 4px;
}
.dlgWorkingWithAI .contextMenu > li > a .icoWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-right: 12px;
  border-radius: 4px;
  background-color: #F9CD0E;
}
.dlgWorkingWithAI .contextMenu > li > a .txtWrap .title {
  display: flex;
  align-items: center;
  margin-bottom: 4px;
}
.dlgWorkingWithAI .contextMenu > li > a .txtWrap .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.dlgWorkingWithAI .contextMenu > li > a .txtWrap .title .tagDev {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 5px;
  padding: 3px 8px;
  border-radius: 10px;
  background-color: #E3E7EB;
  color: #9a9a9a;
  font-size: var(--fs12);
}
.dlgWorkingWithAI .contextMenu > li > a .txtWrap .subTxt {
  font-size: var(--fs13);
}
.dlgWorkingWithAI .contextMenu > li > a:hover {
  background-color: #f5f5f5;
  color: initial;
}
.dlgWorkingWithAI .contextMenu > li > a.wwAI .icoWrap {
  background: linear-gradient(133deg, #F8F7FF 9.9%, #E8E4FF 47.85%, #E7D2FF 90.65%);
}
.dlgWorkingWithAI .contextMenu > li > a.kbot .icoWrap {
  background: var(--AIColor);
}
.dlgWorkingWithAI .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 40px;
  margin-top: auto;
  border-radius: 4px;
  background-color: #F2F5F8;
  color: var(--MainFontColor);
  font-size: var(--fs14);
  cursor: pointer;
}

.btnLineWhite {
  min-width: 120px;
  margin-right: 16px;
  padding: 4px 35px;
  border: 2px solid #fff;
  background-color: transparent;
  color: #fff;
  font-size: var(--fs17);
}
.btnLineWhite:hover, .btnLineWhite:focus {
  opacity: 1;
  box-shadow: 3px 5px 10px rgba(0, 0, 0, 0.3);
  cursor: pointer;
}

.errorPageWrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
}
.errorPageWrapper.logout .errorContent .errorIconWrap {
  width: 250px;
  height: 250px;
}
.errorPageWrapper .errorContent {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  margin-top: -50px;
}
.errorPageWrapper .errorContent .errorIconWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  height: 150px;
}
.errorPageWrapper .errorContent .errorTitle {
  margin-bottom: 30px;
  color: var(--MainFontColor);
  font-size: var(--fs20);
  font-weight: bold;
  text-align: center;
}
.errorPageWrapper .errorContent .errorCodeBox {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 250px;
  height: 36px;
  margin-bottom: 50px;
  padding: 0 8px 0 16px;
  border-radius: 4px;
  background-color: #F2F3F3;
}
.errorPageWrapper .errorContent .errorCodeBox .errorCodeLabel {
  font-size: var(--fs13);
  font-weight: bold;
  color: #6C777D;
  margin-right: 8px;
}
.errorPageWrapper .errorContent .errorCodeBox .errorCodeValue {
  font-size: var(--fs14);
  color: var(--MainFontColor);
  margin-right: 8px;
}
.errorPageWrapper .errorContent .errorCodeBox .btnCopyCode {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-left: auto;
  border-radius: 4px;
  cursor: pointer;
}
.errorPageWrapper .errorContent .errorCodeBox .btnCopyCode:hover {
  background-color: #fff;
}
.errorPageWrapper .errorContent .btnRetryLogin {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 250px;
  height: 42px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background-color: var(--MainColor);
  color: #fff;
  font-size: var(--fs15);
  font-weight: bold;
  cursor: pointer;
}
.errorPageWrapper .errorContent .btnRetryLogin:hover {
  background-color: var(--btnRetryLoginColorHover);
}

.errorHomeWrap, .error404Wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: #eae9e8;
  overflow-y: auto;
}
.errorHomeWrap.expired, .error404Wrap.expired {
  background-color: var(--InvertFontColor);
}
.errorHomeWrap.expired .errorBox, .error404Wrap.expired .errorBox {
  width: 100%;
}
.errorHomeWrap.expired .errorBox .errorTitle, .error404Wrap.expired .errorBox .errorTitle {
  display: inline-block;
  margin-bottom: 25px;
}
.errorHomeWrap.expired .errorBox .errorTitle .errorTitleImg, .error404Wrap.expired .errorBox .errorTitle .errorTitleImg {
  display: inline-block;
  width: 190px;
  height: 152px;
  margin-bottom: 45px;
  background-position-x: 20px;
}
.errorHomeWrap.expired .errorBox .errorTitle > h1, .error404Wrap.expired .errorBox .errorTitle > h1 {
  font-size: var(--fs27);
  color: var(--errorColor);
}
.errorHomeWrap.expired .errorBox .errorHomeArea, .error404Wrap.expired .errorBox .errorHomeArea {
  margin: 0;
  padding: 0;
}
.errorHomeWrap.expired .errorBox .errorHomeArea > .errorStitle, .error404Wrap.expired .errorBox .errorHomeArea > .errorStitle {
  font-weight: normal;
  font-size: var(--fs17);
}
.errorHomeWrap .errorBox, .error404Wrap .errorBox {
  width: 730px;
  text-align: center;
}
.errorHomeWrap .errorBox .errorTitle, .error404Wrap .errorBox .errorTitle {
  text-align: center;
}
.errorHomeWrap .errorBox .errorTitle .errorTitleImg, .error404Wrap .errorBox .errorTitle .errorTitleImg {
  width: 106px;
  height: 133px;
  margin: 0 auto;
  text-align: center;
}
.errorHomeWrap .errorBox .errorTitle .browserTitleImg, .error404Wrap .errorBox .errorTitle .browserTitleImg {
  width: 140px;
  height: 133px;
  margin: 0 auto;
  background-position: center;
  text-align: center;
}
.errorHomeWrap .errorBox .errorTitle .error404Img, .error404Wrap .errorBox .errorTitle .error404Img {
  width: 700px;
  height: 208px;
  margin: 0 auto;
  text-align: center;
}
.errorHomeWrap .errorBox .errorTitle h1, .error404Wrap .errorBox .errorTitle h1 {
  margin: 0;
  color: #565a5c;
  font-size: 60px;
  font-weight: bold;
  line-height: 55px;
}
.errorHomeWrap .errorBox .errorHomeArea, .error404Wrap .errorBox .errorHomeArea {
  margin-top: 27px;
  padding: 45px;
  background-color: var(--MainBgColor);
}
.errorHomeWrap .errorBox .errorHomeArea .errorStitle, .error404Wrap .errorBox .errorHomeArea .errorStitle {
  margin: 0;
  color: var(--MainFontColor);
  font-size: var(--fs19);
}
.errorHomeWrap .errorBox .errorHomeArea .errorText, .error404Wrap .errorBox .errorHomeArea .errorText {
  margin: 30px 0 0 0;
  color: var(--FontColorGrey1);
  font-size: var(--fs16);
}
.errorHomeWrap .errorBox .errorHomeArea .errorBtnArea, .error404Wrap .errorBox .errorHomeArea .errorBtnArea {
  width: 250px;
  margin: 0 auto;
  padding-top: 20px;
}
.errorHomeWrap .errorBox .errorHomeArea .errorBtnArea .errorBtn, .error404Wrap .errorBox .errorHomeArea .errorBtnArea .errorBtn {
  display: block;
  width: 250px;
  height: 50px;
  margin-top: 10px;
  padding: 14px;
  border: 0px;
  background-color: #ff5d5d;
  color: #fff;
  cursor: pointer;
  font-size: var(--fs15);
  text-align: center;
  text-decoration-line: none;
}
.errorHomeWrap .errorBox .errorHomeArea .errorBtnArea .errorBtn.Explorer, .error404Wrap .errorBox .errorHomeArea .errorBtnArea .errorBtn.Explorer {
  background-color: #19a7ef;
  font-size: var(--fs17);
}
.errorHomeWrap .errorBox .errorHomeArea .errorBtnArea .errorBtn.Chrome, .error404Wrap .errorBox .errorHomeArea .errorBtnArea .errorBtn.Chrome {
  background-color: #129f5b;
  font-size: var(--fs17);
}

.error404Wrap {
  background-color: #34495e;
}

.nicePageWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
}
.nicePageWrap .niceContent {
  display: inline-flex;
  align-items: center;
  flex-direction: column;
  margin-top: -50px;
}
.nicePageWrap .niceContent .niceIconWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  height: 150px;
}
.nicePageWrap .niceContent .niceTitle {
  margin-bottom: 30px;
  color: var(--MainFontColor);
  font-size: var(--fs20);
  font-weight: bold;
  text-align: center;
}
.nicePageWrap .niceContent .btnRetryLogin {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 250px;
  height: 42px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background-color: var(--MainColor);
  color: #fff;
  font-size: var(--fs15);
  font-weight: bold;
  cursor: pointer;
}
.nicePageWrap .niceContent .btnRetryLogin:hover {
  background-color: var(--InputDateBtnDeleteColorHover);
}

.msgWrap {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--DimColor);
  z-index: 1000;
  animation: fade-in 0.5s forwards;
}
.msgWrap.close {
  animation: fade-out 0.5s forwards;
}
.msgWrap.close .msgBox {
  animation: slide-out 0.5s forwards;
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slide-in {
  100% {
    transform: translateY(0px);
  }
}
@keyframes fade-out {
  100% {
    opacity: 0;
  }
}
@keyframes slide-out {
  0% {
    transform: translateY(50px);
  }
  100% {
    transform: translateY(200%);
  }
}
.msgWrap .msgBox {
  display: flex;
  flex-direction: column;
  width: 400px;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 9px 24px;
  transform: translateY(50px);
  animation: slide-in 0.5s forwards;
}
.msgWrap .msgBox .msgTitle {
  display: flex;
  align-items: center;
  padding: 20px 15px 30px 15px;
}
.msgWrap .msgBox .msgTitle .iconMsgType {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 50%;
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.msgWrap .msgBox .msgTitle .txtTitle {
  flex-shrink: 0;
  font-size: var(--fs17);
  font-weight: bold;
}
.msgWrap .msgBox .msgTitle .btnLinkHelp {
  display: flex;
  align-items: center;
  margin-left: auto;
  color: var(--MainFontColorLighter);
  font-size: var(--fs14);
}
.msgWrap .msgBox .msgTitle .btnLinkHelp > i {
  margin-right: 4px;
}
.msgWrap .msgBox .msgContent {
  padding: 0 15px 20px 15px;
}
.msgWrap .msgBox .msgContent .txtDescription {
  max-height: 200px;
  font-size: var(--fs15);
  line-height: 150%;
  white-space: pre-line;
  overflow-y: auto;
}
.msgWrap .msgBox .msgContent .txtDescriptionSub {
  margin-top: 15px;
  color: var(--MainFontColorLighter);
  font-size: var(--fs14);
  white-space: pre-line;
}
.msgWrap .msgBox .msgContent .txtDescriptionSub .btnJump {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 6px 8px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 4px;
  background-color: #F3F5FA;
  font-size: var(--fs14);
  transition: all 0.3s;
}
.msgWrap .msgBox .msgContent .txtDescriptionSub .btnJump > i.pgm {
  margin-right: 4px;
}
.msgWrap .msgBox .msgContent .txtDescriptionSub .btnJump > i.arrow {
  margin-left: 4px;
}
.msgWrap .msgBox .msgContent .txtDescriptionSub .btnJump:hover {
  background-color: #e1e6f3;
  cursor: pointer;
}
.msgWrap .msgBox .msgContent .txtReasonBox {
  display: flex;
  flex-direction: column;
  padding-top: 20px;
}
.msgWrap .msgBox .msgContent .txtReasonBox > .txtReasonTitle {
  padding-bottom: 5px;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.msgWrap .msgBox .msgContent .txtReasonBox > .textareaReason {
  height: 70px;
}
.msgWrap .msgBox .msgContent input[type=text],
.msgWrap .msgBox .msgContent input[type=number],
.msgWrap .msgBox .msgContent input[type=password],
.msgWrap .msgBox .msgContent textarea {
  width: 100%;
  min-height: 36px;
  padding: 5px 10px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 3px;
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  font-size: var(--fs15);
  transition: all 0.3s;
}
.msgWrap .msgBox .msgContent input[type=text]:hover,
.msgWrap .msgBox .msgContent input[type=number]:hover,
.msgWrap .msgBox .msgContent input[type=password]:hover,
.msgWrap .msgBox .msgContent textarea:hover {
  border-color: var(--MainColor);
}
.msgWrap .msgBox .msgContent input[type=number] {
  text-align: right;
}
.msgWrap .msgBox .msgContent input[type=number]::-webkit-outer-spin-button, .msgWrap .msgBox .msgContent input[type=number]::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
.msgWrap .msgBox .msgContent textarea {
  height: 100px;
  resize: none;
}
.msgWrap .msgBox .btnWrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-top: 1px solid var(--BorderGreyLight);
  padding: 15px;
}
.msgWrap .msgBox .btnWrap input[type=button], .msgWrap .msgBox .btnWrap button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  margin-left: 10px;
  min-width: 80px;
  padding: 0 15px;
  border: 0;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  font-size: var(--fs15);
  transition: all 0.3s;
}
.msgWrap .msgBox .btnWrap input[type=button].btnDefault, .msgWrap .msgBox .btnWrap button.btnDefault {
  background-color: var(--MainColor);
  color: #fff;
  cursor: pointer;
}
.msgWrap .msgBox .btnWrap input[type=button].btnDefault:hover, .msgWrap .msgBox .btnWrap button.btnDefault:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.msgWrap .msgBox .btnWrap input[type=button].btnDefault:active, .msgWrap .msgBox .btnWrap button.btnDefault:active {
  background-color: var(--ButtonDefaultColorActive);
}
.msgWrap .msgBox .btnWrap input[type=button].btnLine, .msgWrap .msgBox .btnWrap button.btnLine {
  border: 1px solid var(--BorderGreyLight);
  background-color: transparent;
  color: var(--MainColor);
}
.msgWrap .msgBox .btnWrap input[type=button].btnLine:hover, .msgWrap .msgBox .btnWrap button.btnLine:hover {
  border-color: rgba(var(--MainColor-rgb), 0.1);
  background-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.msgWrap .msgBox .btnWrap input[type=button].btnLine:active, .msgWrap .msgBox .btnWrap button.btnLine:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  border-color: rgba(var(--MainColor-rgb), 0.15);
  cursor: pointer;
}
.msgWrap .msgBox .btnWrap input[type=button].btnDel, .msgWrap .msgBox .btnWrap button.btnDel {
  border: 1px solid var(--BorderGreyLight);
  background-color: transparent;
  color: var(--ControlCaptionFontColorError);
}
.msgWrap .msgBox .btnWrap input[type=button].btnDel:hover, .msgWrap .msgBox .btnWrap button.btnDel:hover {
  border-color: rgba(var(--ControlCaptionFontColorError), 0.1);
  background-color: rgba(var(--ControlCaptionFontColorError), 0.1);
  cursor: pointer;
}
.msgWrap .msgBox .btnWrap input[type=button].btnDel:active, .msgWrap .msgBox .btnWrap button.btnDel:active {
  border-color: rgba(var(--ControlCaptionFontColorError), 0.15);
  background-color: rgba(var(--ControlCaptionFontColorError), 0.15);
  cursor: pointer;
}
.msgWrap .msgBox .btnWrap input[type=button].seperate, .msgWrap .msgBox .btnWrap button.seperate {
  position: absolute;
  top: 15px;
  left: 20px;
  margin-right: auto;
  margin-left: 0;
}
.msgWrap .msgBox .btnWrap input[type=button].focus-wa:focus-visible, .msgWrap .msgBox .btnWrap button.focus-wa:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.msgWrap .msgBox.Error .msgTitle .iconMsgType {
  background-color: rgba(var(--errorColor), 0.1);
}
.msgWrap .msgBox.Error .msgTitle .iconMsgType > i {
  background-color: var(--errorColor);
}
.msgWrap .msgBox.Error .btnWrap input[type=button].btnDefault {
  background-color: var(--errorColor);
  cursor: pointer;
}
.msgWrap .msgBox.Error .btnWrap input[type=button].btnDefault:hover {
  background-color: var(--errorColorHover);
}
.msgWrap .msgBox.Error .btnWrap input[type=button].btnDefault:active {
  background-color: var(--errorColorActive);
}
.msgWrap .msgBox.Error .btnWrap input[type=button].btnLine {
  color: var(--errorColor);
}
.msgWrap .msgBox.Error .btnWrap input[type=button].btnLine:hover {
  background-color: rgba(var(--errorColor), 0.1);
  border-color: rgba(var(--errorColor), 0.1);
}
.msgWrap .msgBox.Error .btnWrap input[type=button].btnLine:active {
  background-color: rgba(var(--errorColor), 0.15);
  border-color: rgba(var(--errorColor), 0.15);
}
.msgWrap .msgBox.scrollList {
  width: 500px;
}
.msgWrap .msgBox.scrollList .msgTitle .iconMsgType {
  background-color: rgba(var(--errorColor), 0.1);
}
.msgWrap .msgBox.scrollList .msgTitle .iconMsgType > i {
  background-position: -13px 0;
}
.msgWrap .msgBox.scrollList .msgContent {
  padding: 0;
}
.msgWrap .msgBox.scrollList .msgContent .errorList {
  width: 100%;
  border-collapse: collapse;
}
.msgWrap .msgBox.scrollList .msgContent .errorList th, .msgWrap .msgBox.scrollList .msgContent .errorList td {
  padding: 7px 15px;
}
.msgWrap .msgBox.scrollList .msgContent .errorList thead {
  display: block;
  width: 100%;
  background-color: #F5F7F9;
  border-top: 1px solid var(--BorderGreyLight);
}
.msgWrap .msgBox.scrollList .msgContent .errorList thead tr {
  display: table;
  width: 100%;
}
.msgWrap .msgBox.scrollList .msgContent .errorList thead tr th {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  font-weight: normal;
  text-align: left;
}
.msgWrap .msgBox.scrollList .msgContent .errorList tbody {
  display: block;
  width: 100%;
  max-height: 120px;
  overflow-y: auto;
}
.msgWrap .msgBox.scrollList .msgContent .errorList tbody tr {
  display: table;
  width: 100%;
}
.msgWrap .msgBox.scrollList .msgContent .errorList tbody tr td {
  font-size: var(--fs14);
}
.msgWrap .msgBox.scrollList .msgContent .errorList tbody tr td:last-child {
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.msgWrap .msgBox.scrollList .msgContent .errorList tbody tr:last-child td {
  border-bottom: 0;
}
.msgWrap .msgBox.scrollList .btnWrap input[type=button].btnDefault {
  background-color: var(--errorColor);
}
.msgWrap .msgBox.scrollList .btnWrap input[type=button].btnDefault:hover {
  background-color: var(--errorColorHover);
}
.msgWrap .msgBox.scrollList .btnWrap input[type=button].btnDefault:active {
  background-color: var(--errorColorActive);
}
.msgWrap .msgBox.scrollList.sheetError .msgContent .errorList th:first-child, .msgWrap .msgBox.scrollList.sheetError .msgContent .errorList td:first-child {
  width: 70px;
  text-align: center;
}
.msgWrap .msgBox.scrollList.uploadFailed .msgContent .errorList thead {
  padding-right: 8px;
}
.msgWrap .msgBox.scrollList.uploadFailed .msgContent .errorList thead tr {
  table-layout: fixed;
}
.msgWrap .msgBox.scrollList.uploadFailed .msgContent .errorList tbody {
  overflow-y: scroll;
}
.msgWrap .msgBox.scrollList.uploadFailed .msgContent .errorList tbody tr {
  table-layout: fixed;
}
.msgWrap .msgBox.scrollList.uploadFailed .msgContent .errorList tbody tr td:first-child .filenameBox {
  display: flex;
}
.msgWrap .msgBox.scrollList.uploadFailed .msgContent .errorList tbody tr td:first-child .filenameBox .name {
  display: inline-block;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.msgWrap .msgBox.scrollList.uploadFailed .msgContent .errorList tbody tr td:first-child .filenameBox .ext {
  display: inline-block;
  flex-shrink: 0;
}
.msgWrap .msgBox.pgmInfo {
  width: auto;
  min-width: 360px;
}
.msgWrap .msgBox.pgmInfo .msgContent {
  display: flex;
  flex-direction: column-reverse;
  padding: 0;
}
.msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList {
  width: 100%;
  border-collapse: collapse;
  border-bottom: 1px solid var(--BorderGreyLight);
}
.msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody {
  width: 100%;
}
.msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr {
  width: 100%;
}
.msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr th, .msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr td {
  padding: 7px 15px;
  border-bottom: 1px solid var(--BorderGreyLight);
  font-size: var(--fs13);
}
.msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr th {
  width: 130px;
  text-align: left;
  border-right: 1px solid var(--BorderGreyLight);
  background-color: #F5F7F9;
}
.msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr.infoDetail {
  display: none;
}
.msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr:first-child th, .msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr:first-child td {
  border-top: 1px solid var(--BorderGreyLight);
}
.msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr:last-child th, .msgWrap .msgBox.pgmInfo .msgContent .pgmInfoList tbody tr:last-child td {
  border-bottom: 0;
}
.msgWrap .msgBox.pgmInfo .msgContent > .btnScreenInfo {
  display: none;
}
.msgWrap .msgBox.pgmInfo .msgContent > .btnScreenInfo + label {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  height: 50px;
  padding: 0 15px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  opacity: 0.6;
}
.msgWrap .msgBox.pgmInfo .msgContent > .btnScreenInfo + label > i {
  width: 6px;
  height: 6px;
  margin-left: 5px;
  border-right: 1px solid var(--MainFontColor);
  border-bottom: 1px solid var(--MainFontColor);
  transform: rotate(45deg);
}
.msgWrap .msgBox.pgmInfo .msgContent > .btnScreenInfo + label:hover {
  opacity: 1;
  cursor: pointer;
}
.msgWrap .msgBox.pgmInfo .msgContent > .btnScreenInfo:checked + label > i {
  margin-top: 5px;
  transform: rotate(225deg);
}
.msgWrap .msgBox.pgmInfo .msgContent > .btnScreenInfo:checked ~ .pgmInfoList tbody .infoDetail {
  display: table-row;
}
.msgWrap .msgBox.pgmInfo .btnWrap {
  border-top: none;
}
.msgWrap .msgBox.reason .msgContent textarea {
  margin-top: 10px;
}
.msgWrap .msgBox.apprBatchMsg .msgContent {
  padding: 0;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .txtDescription {
  padding: 0 15px;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap {
  width: 100%;
  padding: 20px 15px;
  margin-top: 20px;
  border-top: 1px solid var(--BorderGreyLight);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .titleArea {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: var(--fs13);
  margin-bottom: 10px;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .titleArea .title {
  color: var(--MainFontColor);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .titleArea .title .optTxt {
  color: var(--FontColorGrey);
  font-weight: normal;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .titleArea .title .optTxt.required {
  color: #FE8739;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .titleArea .info {
  margin-left: auto;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .commentWrite {
  width: 100%;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .commentWrite > input {
  width: 100%;
  height: 32px;
  background-color: var(--ControlBgColor);
  border: 1px solid var(--BorderGreyLight);
  padding: 0 10px;
  font-size: var(--fs14);
  transition: all 0.3s;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .commentWrite > input:hover {
  border-color: var(--MainColor);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .requiredTxt {
  display: flex;
  align-items: center;
  margin: 10px 0 0px 0;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .requiredTxt .iconTinyInfo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  border-radius: 50%;
  background-color: #FE8739;
  color: #fff;
  font-size: var(--fs11);
  font-weight: bold;
  font-style: normal;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .requiredTxt .txt {
  color: #FE8739;
  font-size: var(--fs13);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap .requiredTxt .iconTinyInfo::after {
  content: "!";
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap + .divBtnArea {
  display: flex;
  justify-content: center;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap + .divBtnArea > .btnLineWhite {
  width: 130px;
  height: 45px;
  margin: 0 5px;
  padding: 0;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprCommentWrap + .divBtnArea > .btnLineWhite#msgBtnCancelAsync {
  background-color: transparent;
  border: 1px solid var(--MainColor);
  color: var(--MainColor);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap {
  width: 100%;
  max-width: 400px;
  min-height: 70px;
  max-height: 170px;
  margin-top: 20px;
  border-top: 1px solid var(--BorderGreyLight);
  color: var(--MainFontColor);
  overflow-y: auto;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item {
  padding: 10px 15px;
  border-bottom: 1px solid var(--BorderGreyLight);
  text-align: left;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item .titleWrap {
  display: inline-block;
  width: 100%;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: var(--MainFontColor);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item .titleWrap .drafter {
  font-size: var(--fs14);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item .titleWrap .drafter::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: 0 7px;
  background-color: #ccc;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item .titleWrap .docTitle {
  font-weight: bold;
  font-size: var(--fs14);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item .detailWrap {
  display: flex;
  align-items: center;
  margin: 5px 0 0px 0;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item .detailWrap .iconTinyInfo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: var(--errorColor);
  color: #fff;
  font-size: var(--fs11);
  font-weight: bold;
  font-style: normal;
  margin-right: 5px;
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item .detailWrap .txt {
  color: var(--errorColor);
  text-align: left;
  font-size: var(--fs13);
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item .detailWrap .iconTinyInfo::after {
  content: "!";
}
.msgWrap .msgBox.apprBatchMsg .msgContent .apprFailedWrap .item:last-child {
  border-bottom: 0;
}
.msgWrap .msgBox.favoriteAdd {
  width: 300px;
  transform: none;
}
.msgWrap .msgBox.favoriteAdd .titleArea {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px 15px;
}
.msgWrap .msgBox.favoriteAdd .titleArea .title {
  display: flex;
  align-items: center;
  font-size: var(--fs16);
  font-weight: bold;
}
.msgWrap .msgBox.favoriteAdd .titleArea .title > i {
  margin-right: 4px;
}
.msgWrap .msgBox.favoriteAdd .titleArea .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: -8px;
  margin-left: auto;
  border-radius: 50%;
  width: 34px;
  height: 34px;
}
.msgWrap .msgBox.favoriteAdd .titleArea .btnClose:hover, .msgWrap .msgBox.favoriteAdd .titleArea .btnClose:focus {
  background-color: #e6e6e6;
  cursor: pointer;
}
.msgWrap .msgBox.favoriteAdd .titleArea .btnClose:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.msgWrap .msgBox.favoriteAdd .pgmNameWrap {
  position: relative;
  width: 100%;
  margin-bottom: 15px;
  padding: 0 15px;
}
.msgWrap .msgBox.favoriteAdd .pgmNameWrap > label {
  display: block;
  margin-bottom: 5px;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.msgWrap .msgBox.favoriteAdd .pgmNameWrap > input {
  width: 100%;
  height: 40px;
  padding: 0 10px;
  font-size: var(--fs13);
  border-radius: 4px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  transition: all 0.3s;
}
.msgWrap .msgBox.favoriteAdd .pgmNameWrap > input:focus {
  border-color: var(--MainColor);
}
.msgWrap .msgBox.favoriteAdd .pgmNameWrap > input:disabled {
  background-color: transparent;
  border-color: transparent;
  padding: 0;
  height: 20px;
}
.msgWrap .msgBox.favoriteAdd .pgmNameWrap > .txtInfo {
  padding-top: 5px;
  padding-left: 5px;
  color: var(--MainColor);
  font-size: var(--fs12);
}
.msgWrap .msgBox.favoriteAdd .tooltipForEdit {
  position: absolute;
  top: 62px;
  left: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(var(--MainFontColor-rgb), 0.85);
  padding: 5px 5px;
  border-radius: 4px;
  display: none;
}
.msgWrap .msgBox.favoriteAdd .tooltipForEdit > p {
  color: #fff;
  font-size: var(--fs11);
}
.msgWrap .msgBox.favoriteAdd .tooltipForEdit::after {
  content: "";
  position: absolute;
  top: -4px;
  left: 35px;
  width: 1px;
  height: 1px;
  border-top: 5px solid rgba(var(--MainFontColor-rgb), 0.85);
  border-right: 5px solid rgba(var(--MainFontColor-rgb), 0.85);
  border-left: 4px solid transparent;
  border-bottom: 4px solid transparent;
  transform: rotate(-45deg);
}
.msgWrap .msgBox.favoriteAdd .sltFolder {
  margin-top: 10px;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .titleWrap {
  display: flex;
  margin-bottom: 7px;
  padding: 0 15px;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .titleWrap .title {
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .titleWrap .title .count {
  margin-left: 5px;
  color: var(--MainColor);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .titleWrap .btnAddFolder {
  font-size: var(--fs13);
  margin-left: auto;
  color: var(--MainFontColor);
  cursor: pointer;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .titleWrap .btnAddFolder:hover {
  opacity: 0.6;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList {
  width: 100%;
  height: 150px;
  overflow: auto;
  border: 1px solid var(--BorderGreyLight);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li {
  position: relative;
  display: flex;
  width: 100%;
  height: 33px;
  padding: 0 15px;
  line-height: 18px;
  color: var(--MainFontColor);
  font-size: var(--fs14);
  text-align: left;
  cursor: pointer;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox] + label {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  font-size: 1em;
  cursor: pointer;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  margin-right: 5px;
  width: 1.25em;
  height: 1.25em;
  border-radius: 3px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox] + label > i {
  margin-right: 5px;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox]:checked + label::before {
  border: 1px solid var(--MainColor);
  background-color: var(--MainColor);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: calc(50% - 4px);
  left: 0.333em;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  height: 0.333em;
  width: 0.667em;
  transform: rotate(-45deg);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox]:disabled + label {
  cursor: not-allowed !important;
  color: var(--ControlFontColorDis);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox]:disabled + label::before {
  background-color: var(--ControlBgColorDis);
  border: 1px solid var(--ControlBorderColorDis);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox]:disabled:checked + label::after {
  border-color: var(--ControlBorderColorDis);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li > input[type=checkbox]:focus-visible + label {
  outline: 1px solid var(--MainFontColor);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li .folderName {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new {
  align-items: center;
  padding: 0 5px 0 15px;
  background-color: rgba(var(--MainColor-rgb), 0.1);
  animation: newfolder 2 1s ease-in-out;
  transition: all 0.3s;
}
@keyframes newfolder {
  0% {
    background-color: rgba(var(--MainColor-rgb), 0.1);
  }
  50% {
    background-color: rgba(var(--MainColor-rgb), 0.3);
  }
  100% {
    background-color: rgba(var(--MainColor-rgb), 0.1);
  }
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new > input[type=checkbox] + label {
  flex-shrink: unset;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new > input[type=checkbox] + label .inputNewFolder {
  width: calc(100% - 30px);
  height: 28px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 0 5px;
  transition: all 0.3s;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new > input[type=checkbox] + label .inputNewFolder:hover {
  border-color: var(--MainColor);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new > input[type=checkbox] + label .inputNewFolder:focus {
  color: var(--MainColor);
  border-color: var(--MainColor);
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new .btnDelete {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin-left: auto;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new .btnDelete > i {
  display: inline-block;
  width: 8px;
  height: 8px;
  background-position: -170px -351px;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .ulGroupList li.new .btnDelete:hover {
  background-color: rgba(var(--MainFontColor-rgb), 0.1);
  cursor: pointer;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .tooltipForEdit {
  top: -35px;
}
.msgWrap .msgBox.favoriteAdd .sltFolder .tooltipForEdit::after {
  top: unset;
  bottom: -4px;
  left: 50px;
  border-top-color: transparent;
  border-right-color: transparent;
  border-left-color: rgba(var(--MainFontColor-rgb), 0.85);
  border-bottom-color: rgba(var(--MainFontColor-rgb), 0.85);
}
.msgWrap .msgBox.favoriteAdd .btnArea {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  width: 100%;
  padding: 15px;
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 80px;
  height: 36px;
  padding: 0 15px;
  border: 0;
  background-color: var(--MainColor);
  color: #fff;
  border-radius: 5px;
  margin-left: 10px;
  transition: all 0.3s;
  cursor: pointer;
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button].btnPrimary {
  background-color: var(--MainColor);
  color: #fff;
  cursor: pointer;
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button].btnPrimary:hover {
  background-color: var(--ButtonDefaultColorHover);
  opacity: 1;
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button].btnPrimary:active {
  background-color: var(--ButtonDefaultColorActive);
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button].btnPrimary:disabled {
  background-color: #ddd;
  color: #999;
  opacity: 0.5;
  pointer-events: none;
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button].btnSecondary {
  border: 1px solid #E3E3E3;
  background-color: #fff;
  color: var(--MainColor);
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button].btnSecondary:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border-color: rgba(var(--MainColor-rgb), 0.1);
  opacity: 1;
  cursor: pointer;
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button].btnSecondary:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  border-color: rgba(var(--MainColor-rgb), 0.15);
}
.msgWrap .msgBox.favoriteAdd .btnArea input[type=button]:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.msgWrap .msgBox.sltData .msgContent {
  padding: 0;
}
.msgWrap .msgBox.sltData .msgContent .sltDataList {
  border-top: 1px solid var(--BorderGreyLight);
  max-height: 190px;
  overflow: auto;
}
.msgWrap .msgBox.sltData .msgContent .sltDataList li {
  height: 38px;
  border-bottom: 1px solid var(--BorderGreyLight);
}
.msgWrap .msgBox.sltData .msgContent .sltDataList li:last-child {
  border-bottom: 0;
}
.msgWrap .msgBox.sltData .msgContent .sltDataList li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0 15px;
  font-size: var(--fs13);
}
.msgWrap .msgBox.sltData .msgContent .sltDataList li > a .info {
  margin-left: 5px;
  color: var(--MainFontColorLighter);
}
.msgWrap .msgBox.sltData .msgContent .sltDataList li:hover, .msgWrap .msgBox.sltData .msgContent .sltDataList li.On {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--MainColor);
}
.msgWrap .msgBox.sltData .msgContent .sltDataList li:hover > a p, .msgWrap .msgBox.sltData .msgContent .sltDataList li.On > a p {
  color: var(--MainColor);
}
.msgWrap .msgBox.fromtoCalendar {
  width: 500px;
  height: 515px;
}
.msgWrap .msgBox.fromtoCalendar .msgTitle {
  justify-content: center;
  padding: 15px;
}
.msgWrap .msgBox.fromtoCalendar .msgTitle .txtTitle {
  font-size: var(--fs15);
}
.msgWrap .msgBox.fromtoCalendar .msgTitle .btnClose {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 50%;
}
.msgWrap .msgBox.fromtoCalendar .msgTitle .btnClose > i {
  width: 12px;
  height: 12px;
  background-position: -68px 0;
  pointer-events: none;
}
.msgWrap .msgBox.fromtoCalendar .msgTitle .btnClose:hover, .msgWrap .msgBox.fromtoCalendar .msgTitle .btnClose:focus {
  background-color: #e6e6e6;
  cursor: pointer;
}
.msgWrap .msgBox.fromtoCalendar .msgContent {
  height: 100%;
}
.msgWrap.sessionTimeOut {
  background-color: var(--MainBgColor);
}
.msgWrap.sessionTimeOut .msgBox {
  width: 700px;
  transform: none;
  box-shadow: none;
  text-align: center;
}
.msgWrap.sessionTimeOut .msgBox .msgTitle {
  justify-content: center;
}
.msgWrap.sessionTimeOut .msgBox .msgTitle .txtTitle {
  font-size: var(--fs21);
  font-weight: bold;
}
.msgWrap.sessionTimeOut .msgBox .msgTitle .txtTitle .count {
  margin-left: 5px;
  color: var(--MainColor);
}
.msgWrap.sessionTimeOut .msgBox .msgContent .msgImg {
  width: 196px;
  height: 196px;
  text-align: center;
  margin: 0 auto 20px;
}
.msgWrap.sessionTimeOut .msgBox .msgContent .txtDescription {
  text-align: center;
}
.msgWrap.sessionTimeOut .btnWrap {
  justify-content: center;
  border: 0;
}
.msgWrap.apprAddMyAppLine {
  position: absolute;
  top: 100px;
  left: 100px;
  z-index: 2;
  width: unset;
  height: unset;
  background-color: transparent;
}
.msgWrap.apprAddMyAppLine .msgBox {
  width: 300px;
  transform: none;
}

.toastUI {
  position: fixed;
  top: 0;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 45px;
  padding: 0 10px 0 20px;
  border-radius: 10px;
  background-color: rgba(var(--MainFontColor-rgb), 0.9);
  transform: translateX(-50%) translateY(-110%);
  transition: transform 0.35s ease, opacity 0.35s ease;
  opacity: 0;
  z-index: 1100;
}
.toastUI > p {
  color: var(--InvertFontColor);
  font-size: var(--fs14);
}
.toastUI .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  margin-left: 10px;
  cursor: pointer;
}
.toastUI .btnClose > i {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
.toastUI .btnClose > i::before, .toastUI .btnClose > i::after {
  content: "";
  position: absolute;
  top: 9px;
  left: 3px;
  width: 14px;
  height: 1px;
  background-color: var(--MainBgColor);
  transform: rotate(-45deg);
}
.toastUI .btnClose > i::after {
  transform: rotate(45deg);
}
.toastUI .btnClose:hover {
  background-color: #676767;
}
.toastUI.show {
  opacity: 1;
  transform: translateX(-50%) translateY(100%);
}
.toastUI.hide {
  animation: toast-fade-out 0.5s forwards;
}
@keyframes toast-fade-in {
  0% {
    opacity: 0;
    transform: translateX(-50%) translateY(-50%);
  }
  100% {
    opacity: 1;
    transform: translateX(-50%) translateY(100%);
  }
}
@keyframes toast-fade-out {
  0% {
    opacity: 1;
    transform: translateX(-50%) translateY(100%);
  }
  100% {
    opacity: 0;
    transform: translateX(-50%) translateY(-50%);
  }
}

.dlgTrspWrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 121;
}

.dlgContextUI {
  position: absolute;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  box-shadow: var(--dlgBoxShadow);
  overflow: auto;
}
.dlgContextUI .group + .group {
  border-top: 1px solid #E3E7EB;
}
.dlgContextUI .group .titleWrap {
  padding: 15px 13px 5px 13px;
}
.dlgContextUI .group .titleWrap > .title {
  font-size: var(--fs13);
  color: #A3ABB6;
}
.dlgContextUI .group .contextMenu {
  width: 100%;
  padding: 5px;
}
.dlgContextUI .group .contextMenu > li {
  display: flex;
  width: 100%;
  margin-top: 5px;
}
.dlgContextUI .group .contextMenu > li:first-child {
  margin-top: 0;
}
.dlgContextUI .group .contextMenu > li.Dis .item .txt {
  opacity: 0.4;
}
.dlgContextUI .group .contextMenu > li.Dis .item.subArrow {
  opacity: 0.2;
}
.dlgContextUI .group .contextMenu > li.Dis .item:hover {
  cursor: default;
  background-color: transparent;
}
.dlgContextUI .group .contextMenu > li.Dis.excel > .item > i, .dlgContextUI .group .contextMenu > li.Dis.hancell > .item > i {
  opacity: 0.2;
}
.dlgContextUI .group .contextMenu > li > .item {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 33px;
  padding: 0 10px 0 8px;
  border-radius: 4px;
  font-size: var(--fs14);
  cursor: pointer;
}
.dlgContextUI .group .contextMenu > li > .item > i {
  flex-shrink: 0;
  margin-right: 5px;
}
.dlgContextUI .group .contextMenu > li > .item > i.contextArrow {
  margin-left: auto;
}
.dlgContextUI .group .contextMenu > li > .item .txt {
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.dlgContextUI .group .contextMenu > li > .item .hasChild {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
}
.dlgContextUI .group .contextMenu > li > .item:hover {
  background-color: #f5f5f5;
  color: initial;
}
.dlgContextUI.pgmMore {
  z-index: 121;
}
.dlgContextUI.pgmMore + .child {
  z-index: 122;
}
.dlgContextUI.naverWorks {
  width: 240px;
}
.dlgContextUI.naverWorks .group .contextMenu {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 10px;
}
.dlgContextUI.naverWorks .group .contextMenu > li {
  width: 33%;
  height: 68px;
}
.dlgContextUI.naverWorks .group .contextMenu > li > .item {
  justify-content: center;
  flex-direction: column;
  padding: 0;
  gap: 6px;
}
.dlgContextUI.naverWorks .group .contextMenu > li > .item > i {
  margin-right: 5px;
}
.dlgContextUI.naverWorks .group .contextMenu > li > .item .txt {
  font-size: var(--fs12);
}

[data-tooltip] {
  position: relative;
  display: inline-block;
}
[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  bottom: 100%;
  padding: 8px 12px;
  background-color: #263238;
  color: #eee;
  opacity: 0;
  font-size: var(--fs13);
  white-space: nowrap;
  border-radius: 4px;
  transform: translate(-50%, 65px);
  transition: opacity 0.35s ease 0.25s;
  box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.65);
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 999;
}
[data-tooltip].ttMulti:after {
  width: 100vw;
  max-width: 240px;
  white-space: normal;
}
[data-tooltip][class*=ttB]:after {
  transform: translate(-50%, 7px);
  bottom: auto;
  top: 100%;
}
[data-tooltip].ttBL:after {
  transform: translate(-18px, 7px);
}
[data-tooltip].ttBR:after {
  left: auto;
  right: 50%;
  transform: translate(18px, 7px);
}
[data-tooltip].ttTL:after {
  transform: translate(-18px, -7px);
}
[data-tooltip].ttTR:after {
  left: auto;
  right: 50%;
  transform: translate(18px, -7px);
}
[data-tooltip]:hover::after {
  opacity: 1;
}

.programActionArea {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  width: 0;
  height: 100%;
  transition: width 0.3s;
}
.programActionArea.ProgramActionButtonOpen {
  width: 150px;
}
.programActionArea.ProgramActionButtonOpen .actionBtnArea {
  width: 150px;
}
.programActionArea .programActionBg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 16;
}
.programActionArea .btnShowHide {
  position: absolute;
  top: 0px;
  left: -15px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 40px;
  background-color: #666;
  z-index: 16;
}
.programActionArea .btnShowHide > i {
  width: 4px;
  height: 20px;
  background-position: 0 0;
}
.programActionArea .btnShowHide:hover, .programActionArea .btnShowHide:focus {
  cursor: pointer;
  background-color: var(--programActionBtnShowHideBgColorHover);
}
.programActionArea .actionBtnArea {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 0;
  height: 100%;
  padding: 20px 0;
  background-color: var(--programActionBtnAreaBgColor);
  text-align: center;
  overflow: hidden;
  overflow-y: auto;
  transition: width 0.3s;
  z-index: 16;
}
.programActionArea .actionBtnArea > .ulActionBtn {
  width: 110px;
}
.programActionArea .actionBtnArea > .ulActionBtn.devMode {
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  margin-top: 20px;
  padding-top: 20px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li {
  margin: 0 auto;
  padding: 8px 0;
  text-align: center;
}
.programActionArea .actionBtnArea > .ulActionBtn > li:hover > .icon, .programActionArea .actionBtnArea > .ulActionBtn > li:focus > .icon {
  background-color: var(--programActionBtnBgColorHover);
  cursor: pointer;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--programActionBtnBgColor);
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon > i {
  display: inline-block;
  width: 23px;
  height: 23px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.ScreenInfo > i {
  background-position: 0 -30px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.ScreenHelp > i {
  width: 12px;
  height: 20px;
  background-position: 0 -311px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.Language > i {
  background-position: 0 -62px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.CloseAllTab > i {
  height: 19px;
  background-position: 0 -95px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.DeleteCache > i {
  background-position: 0 -124px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.CtrlSetting > i {
  width: 27px;
  background-position: 4px -157px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.Share > i {
  width: 25px;
  height: 17px;
  background-position: 0 -189px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.EasyFlow > i {
  height: 26px;
  background-position: 0 -216px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.BISetting > i {
  width: 23px;
  height: 22px;
  background-position: 0 -252px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .icon.MyDefaultValue > i {
  width: 20px;
  height: 18px;
  background-position: 0 -284px;
}
.programActionArea .actionBtnArea > .ulActionBtn > li .txtCaption {
  font-size: var(--fs13);
  color: var(--InvertFontColor);
  padding: 4px;
}
.programActionArea .actionBtnArea .languageOptionList {
  position: absolute;
  top: 120px;
  right: 150px;
  min-width: 90px;
  background-color: var(--programActionBtnAreaBgColor);
}
.programActionArea .actionBtnArea .languageOptionList li > a {
  display: block;
  padding: 6px 15px;
  color: var(--InvertFontColor);
  font-size: var(--fs13);
}
.programActionArea .actionBtnArea .languageOptionList li > a:hover, .programActionArea .actionBtnArea .languageOptionList li > a:focus {
  background-color: #575b61;
  cursor: pointer;
}
.programActionArea .actionBtnArea .languageOptionList li.on > a {
  background-color: var(--programActionBtnBgColorHover);
}

.BarIndicator {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--BarIndicatorHeight);
  padding: 0 10px;
  background-color: var(--BarIndicatorBgColor);
  z-index: 1000;
}
.BarIndicator .txtMessage {
  font-size: var(--fs14);
  color: #fff;
}
.BarIndicator .btnWrap {
  margin-left: 10px;
  height: 24px;
}
.BarIndicator .btnWrap > .btn {
  font-size: var(--fs13);
  color: #fff;
  border: 1px solid #fff;
  border-radius: 50px;
  padding: 2px 10px;
  margin-right: 5px;
  cursor: pointer;
}
.BarIndicator .btnWrap > .btn:hover {
  background-color: #fff;
  color: #6e7484;
}
.BarIndicator .btnClose {
  display: inline-block;
  width: 14px;
  height: 14px;
  background-position: 0 -595px;
  cursor: pointer;
  font-style: normal;
  margin-left: auto;
}
.BarIndicator + .wrap.IndicatorMargin {
  margin-top: var(--BarIndicatorHeight);
  height: calc(100% - var(--BarIndicatorHeight));
}
.BarIndicator + .wrap.IndicatorMargin .RadialBall {
  top: 40px;
}
.BarIndicator + .wrap.IndicatorMargin .RadialBall .btnRadialBall {
  top: 30px;
}
.BarIndicator + .wrap.IndicatorMargin .RadialBall.open {
  top: -320px;
}
.BarIndicator + .wrap.IndicatorMargin .RadialBall.open .btnRadialBall {
  top: -40px;
}
.BarIndicator + .wrap.IndicatorMargin .RadialBall.open .depth1 {
  top: -170px;
}
.BarIndicator + .wrap.IndicatorMargin .RadialBall.open .depth2 {
  top: -320px;
}
.BarIndicator + .wrap.IndicatorMargin .processToolbarArea {
  top: var(--BarIndicatorHeight);
}
.BarIndicator + .wrap.IndicatorMargin .ProcessMenuEdit {
  top: var(--processMenuEditTopBarHeight)var(--BarIndicatorHeight);
  height: calc(100% - var(--processMenuEditTopBarHeight) - var(--BarIndicatorHeight));
}
.BarIndicator + .wrap.IndicatorMargin .notiAreaWrap {
  top: 30px;
  height: calc(100% - 30px);
}
.BarIndicator + .wrap.IndicatorMargin .notiAreaWrap .notiArea {
  top: 30px;
  height: calc(100% - 30px);
}
.BarIndicator + .wrap.IndicatorMargin devModalCommonDlg .CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer {
  top: 30px;
}

.modalCommonDlg .modalDlgArea {
  display: none;
  position: absolute;
  border: 1px solid #ccc;
  background-color: var(--PgmAreaBgColor);
  box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 9px 24px;
  border-radius: 5px;
  overflow: hidden;
  animation: fade-in 0.5s;
  transition: all 0.3s;
}
@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes slide-in {
  100% {
    transform: translateY(0px);
  }
}
@keyframes slide-in {
  100% {
    transform: translateY(0px);
  }
}
@keyframes fade-out {
  100% {
    opacity: 0;
  }
}
@keyframes slide-out {
  0% {
    transform: translateY(50px);
  }
  100% {
    transform: translateY(200%);
  }
}
.modalCommonDlg .modalDlgArea > .dlgContentsArea {
  display: inline-block;
  width: 100%;
  height: calc(100% - 40px) !important;
}
.modalCommonDlg .modalDlgArea > .divTitleArea {
  position: relative;
  height: 40px;
  background-color: var(--PgmAreaBgColor);
}
.modalCommonDlg .modalDlgArea > .divTitleArea .titleWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .titleWrap > i {
  margin-right: 5px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .titleWrap .txtTitle {
  font-size: var(--fs17);
  font-weight: bold;
  color: var(--MainFontColor);
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btn {
  position: absolute;
  top: 3px;
  right: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btn > i {
  width: 12px;
  height: 12px;
  background-position: 0 0;
  pointer-events: none;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btn.Max {
  right: 35px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btn.Max > i {
  width: 12px;
  height: 12px;
  background-position: 0 0;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btn.Min {
  right: 35px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btn.Min > i {
  width: 14px;
  height: 13px;
  background-position: -22px 0;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btn.Close > i {
  background-position: -68px 0;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btn:hover {
  background-color: var(--btnModalDlgHover);
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btnHelp {
  position: absolute;
  top: 7px;
  right: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  background-color: #CBD6DD;
  border-radius: 50%;
  cursor: pointer;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btnHelp > i {
  width: 6px;
  height: 13px;
  background-position: -117px 0;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btnMore {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  cursor: pointer;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btnMore:hover {
  background-color: var(--btnModalDlgHover);
}
.modalCommonDlg .modalDlgArea > .divTitleArea .btnMore > i {
  width: 4px;
  height: 18px;
  background-position: 0 -30px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap {
  position: absolute;
  top: 41px;
  left: -20px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn {
  display: flex;
  background-color: var(--programActionBtnAreaBgColor);
  padding: 7px;
  border-radius: 5px;
  box-shadow: 3px 4px 5px rgba(0, 0, 0, 0.2);
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 35px;
  width: 12px;
  height: 12px;
  background-color: var(--programActionBtnAreaBgColor);
  transform: rotate(45deg);
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li {
  display: inline-block;
  width: 80px;
  padding: 8px 0;
  margin: 0 6px;
  text-align: center;
  cursor: pointer;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li:last-child {
  margin-right: 0;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li > .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--programActionBtnBgColor);
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li:hover > .icon {
  cursor: pointer;
  background-color: var(--programActionBtnBgColorHover);
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li .icon > i {
  display: inline-block;
  width: 23px;
  height: 23px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li .icon.ScreenInfo > i {
  background-position: 0 -30px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li .icon.CtrlSetting > i {
  width: 27px;
  background-position: 4px -157px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li .icon.DeleteCache > i {
  background-position: 0 -124px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li .icon.Share > i {
  width: 25px;
  height: 17px;
  background-position: 0 -189px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li .icon.EasyFlow > i {
  height: 26px;
  background-position: 0 -216px;
}
.modalCommonDlg .modalDlgArea > .divTitleArea .actionBtnWrap .ulActionBtn > li .txtCaption {
  padding-top: 4px;
  font-size: var(--fs13);
  color: var(--InvertFontColor);
}

.programArea.dlgPgm .pgmTopArea .pgmTop .pgmTitleWrap .pgmTitle {
  display: none;
}
.programArea.dlgPgm .pgmTopArea .pgmTop .pgmTitleWrap .pgmTools {
  border-left: 0;
  padding-left: 0;
}

.popupDragLine {
  position: absolute;
  display: block;
  border: 1px dotted #fff;
}

.newTabWrap {
  display: flex;
  align-items: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: var(--PgmAreaBgColor);
}
.newTabWrap .newTabHeader {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 40px;
  padding: 0 10px;
  background-color: var(--PgmAreaBgColor);
  border-bottom: 1px solid #E4E4E4;
}
.newTabWrap .newTabHeader .pgmTitle {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
}
.newTabWrap .newTabHeader .pgmTitle > i {
  margin-right: 5px;
}
.newTabWrap .newTabHeader .pgmTitle .txtTitle {
  font-size: var(--fs15);
  font-weight: bold;
  color: var(--MainFontColor);
}
.newTabWrap .newTabHeader .pgmTools {
  position: absolute;
  top: 0;
  right: 10px;
  display: flex;
  align-items: center;
  height: 40px;
  margin: 0 5px;
}
.newTabWrap .newTabHeader .pgmTools > button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 3px;
  cursor: pointer;
}
.newTabWrap .newTabHeader .pgmTools > button:last-child {
  margin-right: 0;
}
.newTabWrap .newTabHeader .btnWrap {
  position: absolute;
  top: 0;
  right: 10px;
  display: flex;
  align-items: center;
  height: 40px;
}
.newTabWrap .newTabHeader .btnWrap > button {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  margin-left: 5px;
  border-radius: 4px;
}
.newTabWrap .newTabHeader .btnWrap > button:hover {
  background-color: #eee;
  cursor: pointer;
}
.newTabWrap .newTabHeader .btnWrap > button > i {
  width: 15px;
  height: 15px;
  background-position: -90px 0;
}
.newTabWrap .newTabHeader .btnWrap > button.btnFavorite > i {
  background-position: -90px 0;
}
.newTabWrap .newTabHeader .btnWrap > button.btnFavorite.On > i {
  background-position: -115px 0;
}
.newTabWrap .newTabHeader .btnWrap > button.btnPgmInfo > i {
  background-position: -140px 0;
}
.newTabWrap .newTabHeader .btnWrap > button.btnHelp > i {
  width: 17px;
  height: 17px;
  background-position: -165px 0;
}
.newTabWrap .newTabContent {
  width: 100%;
  height: 100%;
  border: 0;
}

.popupIframe {
  position: absolute;
  top: -200px;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
  visibility: collapse;
  opacity: 0;
  z-index: 130;
}
.popupIframe.Close {
  top: -200px;
  transition: ease-in 0.3s;
  visibility: collapse;
  opacity: 0;
}
.popupIframe.Open {
  top: 0px;
  transition: ease-out 0.3s;
  visibility: visible;
  opacity: 1;
}

.modalCommonDlg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  z-index: 30;
}
.modalCommonDlg.easyFillDlg {
  z-index: 50;
}
.modalCommonDlg.addressDlg {
  z-index: 110;
}
.modalCommonDlg.devApprLinkDetail {
  z-index: 40;
}
.modalCommonDlg .dlgWrap {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.25);
}
.modalCommonDlg .dlgFakeWrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.25);
}

.modalReportDlg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  padding-top: 50px;
  z-index: 130;
}
.modalReportDlg > .divTitleArea {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 50px;
  padding: 0 10px;
  background-color: #333;
  text-align: center;
}
.modalReportDlg > .divTitleArea .titleInfo {
  display: flex;
  align-items: center;
}
.modalReportDlg > .divTitleArea .titleInfo .btnReportID {
  display: inline-block;
  width: 29px;
  height: 16px;
  margin-right: 10px;
  background-position: 0 0;
  cursor: pointer;
}
.modalReportDlg > .divTitleArea .titleInfo .divReportID {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 0;
  height: 22px;
  padding: 2px 0;
  margin-right: 10px;
  color: #fff;
  border-radius: 3px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  font-size: var(--fs13);
  overflow: hidden;
  opacity: 0;
  transition: all 0.2s linear;
}
.modalReportDlg > .divTitleArea .titleInfo .divReportID.open {
  max-width: 250px;
  padding-left: 10px;
  padding-right: 10px;
  opacity: 1;
}
.modalReportDlg > .divTitleArea .titleInfo .txtTitle {
  display: inline-block;
  color: #fff;
  font-size: var(--fs17);
  line-height: 50px;
}
.modalReportDlg > .divTitleArea .titleInfo .btnMoreReport {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  cursor: pointer;
}
.modalReportDlg > .divTitleArea .titleInfo .btnMoreReport > i {
  width: 7px;
  height: 4px;
  background-position: 0 -26px;
}
.modalReportDlg > .divTitleArea .titleInfo .btnMoreReport:hover {
  background-color: var(--PointColor);
}
.modalReportDlg > .divTitleArea .txtInstall {
  position: absolute;
  top: 0;
  left: calc(50% - 120px);
  display: flex;
  align-items: center;
  height: 100%;
  font-size: var(--fs14);
  color: #fff;
  cursor: pointer;
}
.modalReportDlg > .divTitleArea .txtInstall:hover {
  text-decoration: underline;
}
.modalReportDlg > .divTitleArea .txtInstall > i {
  display: inline-block;
  width: 19px;
  height: 19px;
  margin-right: 10px;
  background-position: 0 -40px;
}
.modalReportDlg .moreReportList {
  position: absolute;
  top: 50px;
  left: 0;
}
.modalReportDlg .moreReportList > ul {
  min-width: 150px;
  max-height: 200px;
  background-color: #000;
  overflow: auto;
}
.modalReportDlg .moreReportList > ul > li {
  color: var(--InvertFontColor);
  font-size: var(--fs14);
  padding: 5px 10px;
  text-align: left;
  cursor: pointer;
}
.modalReportDlg .moreReportList > ul > li:last-child {
  padding-bottom: 10px;
}
.modalReportDlg .moreReportList > ul > li:hover {
  background: var(--PointColor);
}
.modalReportDlg .btnClose {
  position: absolute;
  top: 7px;
  right: 10px;
  display: inline-block;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  z-index: 131;
}
.modalReportDlg .btnClose::before, .modalReportDlg .btnClose::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 17px;
  width: 2px;
  height: 20px;
  background-color: #fff;
  transform: rotate(45deg);
}
.modalReportDlg .btnClose::after {
  transform: rotate(-45deg);
}
.modalReportDlg .btnClose:hover {
  background-color: #666666;
  cursor: pointer;
}
.modalReportDlg > .modalDlgArea {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  overflow: auto;
  text-align: center;
}
.modalReportDlg > .modalDlgArea > .dlgContentsArea {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  overflow: auto;
}
.modalReportDlg > .modalDlgArea > .dlgContentsArea#reportContentsArea {
  height: 100% !important;
}
.modalReportDlg > .modalDlgArea > .dlgContentsArea > iframe {
  width: 100%;
  height: calc(100% - 50px);
}
.modalReportDlg > .modalDlgArea > .dlgContentsArea > iframe > html {
  width: 100%;
  height: 100%;
}
.modalReportDlg > .modalDlgArea > .dlgContentsArea > iframe > html > body {
  width: 100%;
  height: 100%;
}
.modalReportDlg.onlineViewer .titleInfo > i {
  width: 15px;
  height: 19px;
  margin-right: 10px;
  background-position: 0 -96px;
}
.modalReportDlg.onlineViewer .titleInfo .txtTitle {
  font-size: var(--fs17);
}
.modalReportDlg.onlineViewer .btnArea {
  margin-left: 10px;
}
.modalReportDlg.onlineViewer button {
  min-width: 60px;
  background-color: transparent;
  color: var(--InvertFontColor);
  padding: 4px 10px;
  border-radius: 5px;
  border: 1px solid #fff;
  margin-right: 5px;
  font-size: var(--fs14);
  transition: all 0.3s;
  cursor: pointer;
}
.modalReportDlg.onlineViewer button:focus, .modalReportDlg.onlineViewer button.on {
  background-color: var(--MainColor);
  border: 1px solid var(--MainColor);
}
.modalReportDlg.onlineViewer button > .iconCheck {
  display: inline-block;
  width: 14px;
  height: 12px;
  margin-right: 5px;
  background-position: 0 -125px;
}
.modalReportDlg.onlineViewer button.dis {
  background-color: #555;
  border-color: #666;
  color: rgba(255, 255, 255, 0.3);
  cursor: default;
  pointer-events: none;
}
.modalReportDlg.onlineViewer button.dis > i {
  opacity: 0.3;
}
.modalReportDlg.onlineViewer .inputArea {
  position: absolute;
  display: flex;
  flex-direction: column;
  width: 400px;
  padding: 10px;
  background-color: var(--InvertBgColor);
}
.modalReportDlg.onlineViewer .inputArea textarea {
  width: 100%;
  height: 140px;
  padding: 5px;
  border: 0;
}
.modalReportDlg.onlineViewer .inputArea > button {
  margin: 10px 0 0 auto;
  background-color: var(--MainColor);
  border: 1px solid var(--MainColor);
  color: var(--InvertFontColor);
  cursor: pointer;
}
.modalReportDlg.onlineViewer .inputArea > button:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.modalReportDlg.onlineViewer .rightArea {
  margin-left: auto;
}
.modalReportDlg.onlineViewer .rightArea .btnComment {
  margin-right: 0;
  border: 1px solid #fff;
  background-color: transparent;
  color: #fff;
}
.modalReportDlg.onlineViewer .rightArea .btnComment:hover {
  background-color: #fff;
  color: #333;
}

.divPageLoading {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
  width: 100%;
  height: 100%;
  z-index: 100;
}
.divPageLoading .divBg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}
.divPageLoading > .divPageLoadingMsg {
  position: relative;
  flex-direction: column;
  min-width: 340px;
  padding: 25px;
  border-radius: 5px;
  background-color: var(--MainBgColor);
  color: var(--MainFontColor);
  font-size: var(--fs15);
  text-align: center;
  box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 9px 24px;
  z-index: 0;
  animation: fade-in 0.5s forwards;
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.divPageLoading > .divPageLoadingMsg .txtTitle {
  font-size: var(--fs16);
  font-weight: bold;
  margin-bottom: 15px;
}
.divPageLoading > .divPageLoadingMsg .txtDescription {
  color: var(--MainFontColor);
  font-size: var(--fs15);
  margin-bottom: 30px;
}
.divPageLoading > .divPageLoadingMsg .spinner {
  display: inline-block;
  width: 70px;
  text-align: center;
  z-index: 1;
}
.divPageLoading > .divPageLoadingMsg .spinner > div {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-color: rgba(var(--MainColor-rgb), 0.2);
  border-radius: 100%;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.divPageLoading > .divPageLoadingMsg .spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.divPageLoading > .divPageLoadingMsg .spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.divPageLoading > .divPageLoadingMsg .btnWrap {
  padding: 0 15px;
  margin-top: 30px;
}
.divPageLoading > .divPageLoadingMsg .btnWrap .txtLoading {
  margin-bottom: 20px;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.divPageLoading > .divPageLoadingMsg .btnWrap .btnClose {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 80px;
  height: 36px;
  border-radius: 5px;
  border: 1px solid var(--BorderGreyLight);
  color: var(--MainColor);
  font-size: var(--fs15);
  transition: all 0.3s;
}
.divPageLoading > .divPageLoadingMsg .btnWrap .btnClose:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.divPageLoading > .divPageLoadingMsg .btnWrap .btnClose:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  border-color: rgba(var(--MainColor-rgb), 0.15);
  cursor: pointer;
}
.divPageLoading > .divPageLoadingMsg.msgHidden {
  background: transparent;
  border: 0;
  box-shadow: none;
  animation: none;
}
.divPageLoading > .divPageLoadingMsg.msgHidden .txtTitle {
  display: none;
}
.divPageLoading > .divPageLoadingMsg.msgHidden .txtDescription {
  display: none;
}
.divPageLoading > .divPageLoadingMsg.msgHidden .spinner > div {
  background-color: var(--MainBgColor);
}
.divPageLoading > .divPageLoadingMsg.msgHidden .btnWrap .txtLoading {
  color: #fff;
}
.divPageLoading > .divPageLoadingMsg.msgHidden .btnWrap .btnClose {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0);
}
.divPageLoading > .divPageLoadingMsg.msgHidden .btnWrap .btnClose:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.1);
  cursor: pointer;
}
.divPageLoading > .divPageLoadingMsg.msgHidden .btnWrap .btnClose:active {
  background-color: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.15);
  cursor: pointer;
}

.RightArea11 {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 120;
}
.RightArea11::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--DimColor);
}
.RightArea11.RightAreaShow {
  display: block;
  width: 100%;
  opacity: 1;
}
.RightArea11.RightAreaShow .codehelpArea {
  animation: aniRightAreaOpen 0.3s;
}
.RightArea11.RightAreaHidden {
  opacity: 0;
  visibility: collapse;
}
.RightArea11.RightAreaHidden .codehelpArea {
  animation: aniRightAreaClose 0.3s;
}
@keyframes aniRightAreaOpen {
  0% {
    right: -400px;
    opacity: 0;
    visibility: visible;
  }
  100% {
    right: 0px;
    opacity: 1;
    visibility: visible;
  }
}
@keyframes aniRightAreaClose {
  0% {
    right: 0px;
    opacity: 1;
    visibility: visible;
  }
  100% {
    right: -400px;
    opacity: 0;
    visibility: collapse;
  }
}
.RightArea11 .codehelpArea {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  width: var(--codehelpAreaListWidth);
  height: 100%;
  background-color: var(--codehelpAreaListBgColor);
  transition: all 0.3s;
}
.RightArea11 .codehelpArea .titleArea {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  margin-top: 35px;
}
.RightArea11 .codehelpArea .titleArea .btnBack {
  position: absolute;
  top: 3px;
  left: 0px;
  display: inline-block;
  width: 42px;
  height: 42px;
  background-position: 0 -446px;
  cursor: pointer;
}
.RightArea11 .codehelpArea .titleArea .title {
  display: inline-block;
  width: 100%;
  font-size: var(--fs19);
  font-weight: normal;
  color: var(--InvertFontColor);
  line-height: 20px;
  padding: 0 12px;
}
.RightArea11 .codehelpArea .titleArea .radioViewmode {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  border-radius: 5px;
  padding: 3px;
  background-color: #60696e;
}
.RightArea11 .codehelpArea .titleArea .radioViewmode li {
  float: left;
  min-width: 45px;
  height: 20px;
}
.RightArea11 .codehelpArea .titleArea .radioViewmode li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: var(--fs11);
  color: rgba(255, 255, 255, 0.4);
  font-weight: bold;
  border-radius: 3px;
}
.RightArea11 .codehelpArea .titleArea .radioViewmode li > a.On {
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
}
.RightArea11 .codehelpArea .titleArea .radioViewmode li:hover > a {
  color: #fff;
}
.RightArea11 .codehelpArea .titleArea .btnCustomCodehelp {
  position: absolute;
  top: 6px;
  right: 100px;
  display: inline-block;
  display: none;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background-color: var(--MainBgColor);
  background-position: 0px -91px;
}
.RightArea11 .codehelpArea .searchCodehelpArea {
  flex-shrink: 0;
  margin-top: 0px;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .combo {
  position: relative;
  height: 30px;
  padding: 0 10px;
  margin-bottom: 10px;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .combo > .comboBoxItem {
  display: none;
  height: 100%;
  background-color: transparent;
  border: 0;
  color: var(--InvertFontColor);
  z-index: 120;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .combo > .comboBoxItem > option {
  color: #333;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox {
  display: flex;
  width: 100%;
  height: 40px;
  background-color: var(--MainBgColor);
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent > i {
  width: 13px;
  height: 12px;
  background-position: -54px -48px;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent.selected > i {
  background-position: -79px -48px;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent:hover {
  background-color: #edefef;
  cursor: pointer;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox > .txtCodeHelp {
  flex: 1;
  width: auto;
  min-width: 138px;
  height: 100%;
  border: 0px;
  color: var(--MainFontColor);
  font-size: var(--fs17);
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap {
  margin-left: auto;
  flex-shrink: 0;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn {
  float: left;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 0px;
  background-color: var(--MainColor);
  border: 0;
  cursor: pointer;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn:hover, .RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.Query > i {
  width: 16px;
  height: 17px;
  background-position: 0 -48px;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery > i {
  width: 16px;
  height: 19px;
  background-position: -28px -48px;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.Dis, .RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery.Dis {
  background-color: #aaa;
  cursor: default;
}
.RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.Dis > i, .RightArea11 .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery.Dis > i {
  opacity: 0.5;
}
.RightArea11 .codehelpArea .detailConditionArea {
  flex-shrink: 0;
  padding: 8px 16px 0px 16px;
}
.RightArea11 .codehelpArea .detailConditionArea > .option {
  margin-bottom: 5px;
}
.RightArea11 .codehelpArea .detailConditionArea > .option::after {
  clear: both;
}
.RightArea11 .codehelpArea .detailConditionArea > .option > li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  height: 30px;
}
.RightArea11 .codehelpArea .detailConditionArea > .option > li > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: var(--fs13);
  text-align: center;
  color: rgba(var(--InvertFontColor-rgb), 0.5);
  background-color: var(--codehelpAreaListBgColor);
  border: 1px solid #fff;
}
.RightArea11 .codehelpArea .detailConditionArea > .option > li:hover > a {
  color: #fff;
}
.RightArea11 .codehelpArea .detailConditionArea > .option > li.selected > a {
  color: var(--MainColor);
  background-color: #fff;
}
.RightArea11 .codehelpArea .detailConditionArea > .option > li:last-child > a {
  border-left: 0;
}
.RightArea11 .codehelpArea .detailConditionArea .combo {
  height: 30px;
  margin-bottom: 10px;
}
.RightArea11 .codehelpArea .detailConditionArea .combo .comboBoxItem {
  display: none;
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: 1px solid #fff;
  color: #fff;
}
.RightArea11 .codehelpArea .detailConditionArea .combo .comboBoxItem > option {
  color: #333;
}
.RightArea11 .codehelpArea .divCodehelpList {
  position: relative;
  width: var(--codehelpAreaListWidth);
  height: 100%;
  overflow: auto;
  scrollbar-face-color: #666;
  scrollbar-shadow-color: #999;
  scrollbar-darkshadow-color: #ccc;
  scrollbar-track-color: #ccc;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList {
  position: relative;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li {
  position: relative;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li > a {
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  min-height: 60px;
  padding: 0px 10px 0 15px;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li:hover > a {
  cursor: pointer;
  background-color: #4f575c;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li.checked > a {
  background-color: var(--ulCodeHelpListBgColorHover);
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li p.mainItem {
  width: 100%;
  min-width: 25px;
  font-size: var(--fs15);
  color: var(--InvertFontColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li p.subItem {
  font-size: var(--fs13);
  color: rgba(var(--InvertFontColor-rgb), 0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 100%;
  padding: 0;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar > i {
  width: 4px;
  height: 18px;
  background-position: -103px 0;
  opacity: 0.6;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar:hover {
  background-color: var(--ButtonDefaultColorHover);
  cursor: pointer;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar:hover > i {
  opacity: 1;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: var(--MainColor);
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li {
  display: inline-flex;
  align-items: center;
  float: left;
  height: 100%;
  text-align: center;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  padding: 0px 8px;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .icon {
  display: inline-block;
  width: 30px;
  height: 26px;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .txtName {
  display: block;
  color: var(--InvertFontColor);
  font-size: var(--fs14);
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a:hover {
  background-color: var(--ulToolbarColorHover);
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 100%;
  padding: 0;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a > i {
  width: 4px;
  height: 18px;
  background-position: -103px 0;
  opacity: 0.6;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarReplace > .btnAction .icon {
  width: 18px;
  background-position: 0 -94px;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarDel > .btnAction .icon {
  width: 18px;
  background-position: -28px -93px;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarPersonal > .btnAction .icon {
  width: 18px;
  background-position: -56px -97px;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li > a {
  display: flex;
  justify-content: center;
  flex-direction: column;
  min-height: 69px;
  padding-left: 47px;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li > a:first-child::before {
  content: "";
  position: absolute;
  top: 22px;
  left: 10px;
  width: 24px;
  height: 24px;
  background-position: 0 -151px;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li > a.btnToolbar {
  padding-left: 0;
}
.RightArea11 .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li.checked > a:first-child::before {
  background-position: -34px -151px;
}
.RightArea11 .codehelpArea .divCodehelpList.listNone .noneMsg {
  color: var(--InvertFontColor);
  font-size: var(--fs14);
  text-align: center;
  margin-top: 150px;
}
.RightArea11 .codehelpArea .divCodehelpList.listNone .ulCodeHelpList li {
  display: none;
}
.RightArea11 .codehelpArea .btnArea {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 75px;
  padding: 15px 10px;
  box-shadow: 0px -2px 5px rgba(0, 0, 0, 0.08);
}
.RightArea11 .codehelpArea .btnArea > input[type=button] {
  min-width: 130px;
  height: 36px;
  padding: 8px 16px;
  margin-right: 8px;
  font-size: var(--fs15);
  border: 0;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  box-shadow: rgba(0, 0, 0, 0.25) 1px 2px 5px;
  transition: all 0.3s;
  cursor: pointer;
}
.RightArea11 .codehelpArea .btnArea > input[type=button]:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.RightArea11 .codehelpArea .btnArea > input[type=button]:active {
  background-color: var(--ButtonDefaultColorActive);
}

.CodeHelpSheet {
  z-index: 40;
}
.CodeHelpSheet .popupCodehelp {
  position: absolute;
  top: calc(50% - 285px);
  left: calc(50% - 450px);
  width: 900px;
  height: 570px;
  transform: none;
  animation: unset;
}
.CodeHelpSheet .popupCodehelp .popupCodehelpContent {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.CodeHelpSheet .popupCodehelp .topArea {
  position: relative;
  flex-shrink: 0;
  height: 55px;
  text-align: center;
}
.CodeHelpSheet .popupCodehelp .topArea .radioViewmode {
  position: absolute;
  top: 15px;
  left: 15px;
  display: flex;
  flex-direction: row-reverse;
  border-radius: 5px;
  background-color: #eee;
  padding: 3px;
}
.CodeHelpSheet .popupCodehelp .topArea .radioViewmode > li {
  float: left;
  min-width: 53px;
  height: 20px;
}
.CodeHelpSheet .popupCodehelp .topArea .radioViewmode > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--FontColorGrey);
  font-size: var(--fs11);
  font-weight: bold;
  border-radius: 3px;
}
.CodeHelpSheet .popupCodehelp .topArea .radioViewmode > li > a.On {
  background-color: #fff;
  color: var(--MainFontColor);
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1);
}
.CodeHelpSheet .popupCodehelp .topArea .radioViewmode > li:hover > a {
  color: var(--MainFontColor);
}
.CodeHelpSheet .popupCodehelp .topArea .txtTitle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 14px 24px;
  font-size: var(--fs18);
  font-weight: 700;
  color: var(--MainFontColor);
  text-align: center;
}
.CodeHelpSheet .popupCodehelp .topArea .btn {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 0;
}
.CodeHelpSheet .popupCodehelp .topArea .btn > i {
  pointer-events: none;
}
.CodeHelpSheet .popupCodehelp .topArea .btn.Close > i {
  width: 12px;
  height: 12px;
  background-position: -67px 0;
}
.CodeHelpSheet .popupCodehelp .topArea .btn.Max {
  display: flex;
  right: 40px;
}
.CodeHelpSheet .popupCodehelp .topArea .btn.Max > i {
  width: 12px;
  height: 12px;
  background-position: 0 0;
}
.CodeHelpSheet .popupCodehelp .topArea .btn.Min {
  display: flex;
  right: 40px;
}
.CodeHelpSheet .popupCodehelp .topArea .btn.Min > i {
  width: 13px;
  height: 13px;
  background-position: -22px 0;
}
.CodeHelpSheet .popupCodehelp .topArea .btn:hover {
  background-color: #eaeaea;
  cursor: pointer;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea {
  position: relative;
  padding: 0 16px 10px 16px;
  width: 100%;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .combo {
  float: left;
  width: 150px;
  height: 40px;
  padding: 0px;
  border: 2px solid var(--MainColor);
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .combo select.comboBoxItem {
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0 5px;
  font-size: var(--fs16);
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .combo select:focus-visible {
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea > .ulToolbar {
  display: block;
  z-index: 99999;
  width: 100%;
  height: 100%;
  background-color: var(--MainColor);
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox {
  position: relative;
  display: flex;
  height: 40px;
  width: calc(100% - 150px);
  border-top: 2px solid var(--MainColor);
  border-bottom: 2px solid var(--MainColor);
  padding-top: 0;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 36px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent > i {
  width: 13px;
  height: 12px;
  background-position: -54px -48px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent.selected > i {
  background-position: -79px -48px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent:hover {
  background-color: #edefef;
  cursor: pointer;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox > .txtCodeHelp {
  width: 100%;
  min-width: 138px;
  height: 100%;
  border: 0px;
  color: var(--MainFontColor);
  background-color: transparent;
  font-size: var(--fs17);
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox > .txtCodeHelp:valid {
  padding-right: 26px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox > .txtCodeHelp:valid + .btnDelValue {
  display: flex;
  align-items: center;
  justify-content: center;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox > .btnDelValue {
  display: none;
  flex-shrink: 0;
  position: absolute;
  top: 0;
  right: 120px;
  width: 26px;
  height: 36px;
  cursor: pointer;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox > .btnDelValue > i {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: rgba(var(--InvertBgColor-rgb), 0.3);
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox > .btnDelValue > i::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 9px;
  background-color: var(--MainBgColor);
  transform: rotate(45deg);
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox > .btnDelValue > i::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 1px;
  background-color: var(--MainBgColor);
  transform: rotate(45deg);
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox > .btnDelValue:hover > i {
  background-color: rgba(var(--InvertBgColor-rgb), 0.5);
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap {
  margin-left: auto;
  flex-shrink: 0;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn {
  float: left;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: -2px 0 0 0;
  background-color: var(--MainColor);
  cursor: pointer;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn:hover, .CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn.Query {
  border-right: 1px solid #fff;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn.Query > i {
  width: 16px;
  height: 17px;
  background-position: 0 -48px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn.LocalQuery > i {
  width: 16px;
  height: 19px;
  background-position: -28px -48px;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn.LocalQuery.Dis {
  background-color: #aaa;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn.Dis {
  background-color: #aaa;
  cursor: default;
}
.CodeHelpSheet .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn.Dis > i {
  opacity: 0.5;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea {
  padding: 0 16px;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea > .option {
  display: flex;
  width: 100%;
  padding: 0 0 10px 0;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea > .option > li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea > .option > li > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-width: 100px;
  margin-left: -1px;
  padding: 0 10px;
  border: 1px solid #ccc;
  background-color: #fff;
  color: #d1d1d1;
  font-size: var(--fs13);
  text-align: center;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea > .option > li:hover > a {
  color: var(--MainColor);
  background-color: #f4f4f4;
  cursor: pointer;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea > .option > li:first-child > a {
  margin-left: 0;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea > .option > li.selected {
  z-index: 0;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea > .option > li.selected > a {
  border: 1px solid var(--MainColor);
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--MainColor);
}
.CodeHelpSheet .popupCodehelp .detailConditionArea .combo {
  float: left;
  width: 24%;
  height: 30px;
  margin-right: 5px;
  margin-bottom: 10px;
  padding: 0;
}
.CodeHelpSheet .popupCodehelp .detailConditionArea .combo > .comboBoxItem {
  display: none;
  width: 100%;
  height: 100%;
  border: 1px solid var(--BorderGrey);
}
.CodeHelpSheet .popupCodehelp .detailConditionArea .combo > .comboBoxItem:focus-visible {
  border-color: var(--MainColor);
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px;
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: calc(100% - 30px);
  min-height: 35px;
  margin: 0 15px;
  border-radius: 5px 5px 0 0;
  background-color: var(--multiSelectedAreaBgColor);
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea .txtTotal {
  flex-shrink: 0;
  padding: 0 8px;
  font-size: var(--fs13);
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea .txtTotal > .txtValue {
  font-weight: bold;
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-height: 44px;
  padding: 5px;
  overflow-y: auto;
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-track {
  background-color: transparent;
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-track:hover {
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.15);
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.25);
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-thumb:active {
  background-color: rgba(0, 0, 0, 0.4);
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-corner {
  background-color: transparent;
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  background-color: transparent;
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .divWrap {
  scrollbar-face-color: transparent;
  scrollbar-track-color: transparent;
  scrollbar-3dlight-color: transparent;
  scrollbar-highlight-color: transparent;
  scrollbar-darkshadow-color: transparent;
  scrollbar-shadow-color: transparent;
  scrollbar-arrow-color: transparent;
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .btnCodeHelpAllDel {
  display: inline-flex;
  font-size: var(--fs11);
  flex-shrink: 0;
  margin: 0 10px;
  padding: 4px 8px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 2px;
  background-color: var(--ControlBgColor);
  color: var(--ControlFontColor);
}
.CodeHelpSheet .popupCodehelp .multiSelectedArea > .btnCodeHelpAllDel:hover {
  border: 1px solid #dfb6b6;
  background-color: #fdecec;
  color: #ff6262;
  cursor: pointer;
}
.CodeHelpSheet .popupCodehelp .queryListArea {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0 15px;
  overflow: hidden;
}
.CodeHelpSheet .popupCodehelp .queryListArea.SubConditionArea1 {
  display: inline-block;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  width: 100%;
  min-height: 33px;
  padding: 0 15px;
  font-size: var(--fs13);
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn {
  display: inline-block;
  flex-shrink: 0;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn li {
  float: left;
  margin-right: 10px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn li a {
  display: inline-block;
  vertical-align: middle;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn li a:hover {
  color: var(--MainColor);
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn li a span {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 4px;
  color: #666;
  font-size: var(--fs13);
  line-height: 41px;
  vertical-align: middle;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn .copy {
  background-position: -4px -7px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn .save {
  background-position: -4px -29px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn .rowDel {
  background-position: -4px -71px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn .delete {
  background-position: -4px -50px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn .userCodeAdd {
  background-position: -4px -95px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .actionBtn .userCodeEdit {
  background-position: -4px -121px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .searchCount {
  display: inline-flex;
  align-items: center;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .searchCount > label {
  padding-right: 4px;
  color: var(--MainFontColor);
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .searchCount > select:focus-visible {
  border-color: var(--MainColor);
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging {
  margin-left: 10px;
  padding: 5px 0;
  text-align: center;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 23px;
  border: 1px solid #ccc;
  border-right: 0;
  background-color: var(--MainBgColor);
  line-height: 22px;
  text-decoration: none;
  vertical-align: top;
  overflow: hidden;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a span {
  display: block;
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a:last-child {
  border-right: 1px solid #ccc;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a:hover {
  background-color: #eaeaea;
  cursor: pointer;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a.arrow {
  background-color: var(--MainBgColor);
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a.arrow span {
  width: 6px;
  height: 9px;
  padding: 0;
  background-position: 0 0;
  text-indent: -9999px;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a.arrow.prev span {
  background-position: 0 0;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a.arrow.next span {
  background-position: 0 0;
  transform: rotate(180deg);
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a.current {
  border: 1px solid var(--MainColor);
  background-color: #fff;
  color: var(--MainColor);
  font-weight: bold;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom .paging a.current span {
  color: var(--MainColor);
  font-weight: bold;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom.Dis {
  opacity: 0.3;
}
.CodeHelpSheet .popupCodehelp .codeHelpBottom.Dis * {
  pointer-events: none;
}
.CodeHelpSheet .popupCodehelp .btnWrap {
  justify-content: center;
  width: 100%;
  padding: 5px 15px 15px 15px;
  border: 0;
}
.CodeHelpSheet .popupCodehelp .btnWrap .btnDefault {
  width: 150px;
  min-width: 150px;
  margin: 0 5px;
  font-size: var(--fs16);
}
.CodeHelpSheet .popupCodehelp .btnWrap .btnDefault:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.CodeHelpSheet .popupCodehelp .btnWrap .btnDefault:active {
  background-color: var(--ButtonDefaultColorActive);
}
.CodeHelpSheet .popupCodehelp .btnWrap .btnDefault:focus-visible {
  outline: 1px solid var(--MainFontColor);
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px;
}
.CodeHelpSheet .popupCodehelp.Max {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: 0;
}

.RightArea.RightAreaShow {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: 120;
}
.RightArea.RightAreaShow::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--DimColor);
}
.RightArea.RightAreaShow .codehelpArea {
  animation: aniRightAreaOpen 0.3s;
}
.RightArea.RightAreaHidden {
  display: none;
  opacity: 0;
  visibility: collapse;
}
.RightArea.RightAreaHidden .codehelpArea {
  animation: aniRightAreaClose 0.3s;
}
@keyframes aniRightAreaOpen {
  0% {
    right: -400px;
    opacity: 0;
    visibility: visible;
  }
  100% {
    right: 0px;
    opacity: 1;
    visibility: visible;
  }
}
@keyframes aniRightAreaClose {
  0% {
    right: 0px;
    opacity: 1;
    visibility: visible;
  }
  100% {
    right: -400px;
    opacity: 0;
    visibility: collapse;
  }
}
.RightArea .codehelpArea {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  width: var(--codehelpAreaListWidth);
  height: 100%;
  background-color: var(--codehelpAreaListBgColor);
  transition: all 0.3s;
}
.RightArea .codehelpArea .titleArea {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  margin-top: 35px;
}
.RightArea .codehelpArea .titleArea .btnBack {
  position: absolute;
  top: 3px;
  left: 0px;
  display: inline-block;
  width: 42px;
  height: 42px;
  background-position: 0 -446px;
  cursor: pointer;
}
.RightArea .codehelpArea .titleArea .title {
  display: inline-block;
  width: 100%;
  font-size: var(--fs19);
  font-weight: normal;
  color: var(--InvertFontColor);
  line-height: 20px;
  padding: 0 12px;
}
.RightArea .codehelpArea .titleArea .radioViewmode {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  flex-direction: row-reverse;
  border-radius: 5px;
  padding: 3px;
  background-color: #60696e;
}
.RightArea .codehelpArea .titleArea .radioViewmode li {
  float: left;
  min-width: 45px;
  height: 20px;
}
.RightArea .codehelpArea .titleArea .radioViewmode li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: var(--fs11);
  color: rgba(255, 255, 255, 0.4);
  font-weight: bold;
  border-radius: 3px;
}
.RightArea .codehelpArea .titleArea .radioViewmode li > a.On {
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
}
.RightArea .codehelpArea .titleArea .radioViewmode li:hover > a {
  color: #fff;
}
.RightArea .codehelpArea .titleArea .btnCustomCodehelp {
  position: absolute;
  top: 6px;
  right: 100px;
  display: inline-block;
  display: none;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background-color: var(--MainBgColor);
  background-position: 0px -91px;
}
.RightArea .codehelpArea .searchCodehelpArea {
  flex-shrink: 0;
  margin-top: 0px;
}
.RightArea .codehelpArea .searchCodehelpArea > .combo {
  position: relative;
  height: 30px;
  padding: 0 10px;
  margin-bottom: 10px;
}
.RightArea .codehelpArea .searchCodehelpArea > .combo > .comboBoxItem {
  display: none;
  height: 100%;
  background-color: transparent;
  border: 0;
  color: var(--InvertFontColor);
  z-index: 120;
}
.RightArea .codehelpArea .searchCodehelpArea > .combo > .comboBoxItem > option {
  color: #333;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox {
  position: relative;
  display: flex;
  width: 100%;
  height: 40px;
  background-color: var(--MainBgColor);
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent > i {
  width: 13px;
  height: 12px;
  background-position: -54px -48px;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent.selected > i {
  background-position: -79px -48px;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .tbtnPercent:hover {
  background-color: #edefef;
  cursor: pointer;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .txtCodeHelp {
  flex: 1;
  width: auto;
  min-width: 138px;
  height: 100%;
  border: 0px;
  color: var(--MainFontColor);
  font-size: var(--fs17);
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .txtCodeHelp:valid {
  padding-right: 26px;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .txtCodeHelp:valid + .btnDelValue {
  display: flex;
  align-items: center;
  justify-content: center;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .btnDelValue {
  display: none;
  flex-shrink: 0;
  position: absolute;
  top: 0;
  right: 120px;
  width: 26px;
  height: 100%;
  cursor: pointer;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .btnDelValue > i {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: rgba(var(--InvertBgColor-rgb), 0.3);
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .btnDelValue > i::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 9px;
  background-color: var(--MainBgColor);
  transform: rotate(45deg);
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .btnDelValue > i::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 1px;
  background-color: var(--MainBgColor);
  transform: rotate(45deg);
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox > .btnDelValue:hover > i {
  background-color: rgba(var(--InvertBgColor-rgb), 0.5);
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap {
  margin-left: auto;
  flex-shrink: 0;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn {
  float: left;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 0px;
  background-color: var(--MainColor);
  border: 0;
  cursor: pointer;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn:hover, .RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.Query > i {
  width: 16px;
  height: 17px;
  background-position: 0 -48px;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery > i {
  width: 16px;
  height: 19px;
  background-position: -28px -48px;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.Dis, .RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery.Dis {
  background-color: #aaa;
  cursor: default;
}
.RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.Dis > i, .RightArea .codehelpArea .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery.Dis > i {
  opacity: 0.5;
}
.RightArea .codehelpArea .detailConditionArea {
  flex-shrink: 0;
  padding: 8px 16px 0px 16px;
}
.RightArea .codehelpArea .detailConditionArea > .option {
  margin-bottom: 5px;
}
.RightArea .codehelpArea .detailConditionArea > .option::after {
  clear: both;
}
.RightArea .codehelpArea .detailConditionArea > .option > li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  height: 30px;
}
.RightArea .codehelpArea .detailConditionArea > .option > li > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: var(--fs13);
  text-align: center;
  color: rgba(var(--InvertFontColor-rgb), 0.5);
  background-color: var(--codehelpAreaListBgColor);
  border: 1px solid #fff;
}
.RightArea .codehelpArea .detailConditionArea > .option > li:hover > a {
  color: #fff;
}
.RightArea .codehelpArea .detailConditionArea > .option > li.selected > a {
  color: var(--MainColor);
  background-color: #fff;
}
.RightArea .codehelpArea .detailConditionArea > .option > li:last-child > a {
  border-left: 0;
}
.RightArea .codehelpArea .detailConditionArea .combo {
  height: 30px;
  margin-bottom: 10px;
}
.RightArea .codehelpArea .detailConditionArea .combo .comboBoxItem {
  display: none;
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: 1px solid #fff;
  color: #fff;
}
.RightArea .codehelpArea .detailConditionArea .combo .comboBoxItem > option {
  color: #333;
}
.RightArea .codehelpArea .divCodehelpList {
  position: relative;
  width: var(--codehelpAreaListWidth);
  height: 100%;
  overflow: auto;
  scrollbar-face-color: #666;
  scrollbar-shadow-color: #999;
  scrollbar-darkshadow-color: #ccc;
  scrollbar-track-color: #ccc;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList {
  position: relative;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li {
  position: relative;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li > a {
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  min-height: 60px;
  padding: 0px 10px 0 15px;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li:hover > a {
  cursor: pointer;
  background-color: #4f575c;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li.checked > a {
  background-color: var(--ulCodeHelpListBgColorHover);
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li p.mainItem {
  width: 100%;
  min-width: 25px;
  font-size: var(--fs15);
  color: var(--InvertFontColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li p.subItem {
  font-size: var(--fs13);
  color: rgba(var(--InvertFontColor-rgb), 0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 100%;
  padding: 0;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar > i {
  width: 4px;
  height: 18px;
  background-position: -103px 0;
  opacity: 0.6;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar:hover {
  background-color: var(--ButtonDefaultColorHover);
  cursor: pointer;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList > li .btnToolbar:hover > i {
  opacity: 1;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: var(--MainColor);
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li {
  display: inline-flex;
  align-items: center;
  float: left;
  height: 100%;
  text-align: center;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  padding: 0px 8px;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .icon {
  display: inline-block;
  width: 30px;
  height: 26px;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .txtName {
  display: block;
  color: var(--InvertFontColor);
  font-size: var(--fs14);
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li a:hover {
  background-color: var(--ulToolbarColorHover);
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 100%;
  padding: 0;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a > i {
  width: 4px;
  height: 18px;
  background-position: -103px 0;
  opacity: 0.6;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarReplace > .btnAction .icon {
  width: 18px;
  background-position: 0 -94px;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarDel > .btnAction .icon {
  width: 18px;
  background-position: -28px -93px;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarPersonal > .btnAction .icon {
  width: 18px;
  background-position: -56px -97px;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li > a {
  display: flex;
  justify-content: center;
  flex-direction: column;
  min-height: 69px;
  padding-left: 47px;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li > a:first-child::before {
  content: "";
  position: absolute;
  top: 22px;
  left: 10px;
  width: 24px;
  height: 24px;
  background-position: 0 -151px;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li > a.btnToolbar {
  padding-left: 0;
}
.RightArea .codehelpArea .divCodehelpList .ulCodeHelpList.MultiSelect > li.checked > a:first-child::before {
  background-position: -34px -151px;
}
.RightArea .codehelpArea .divCodehelpList.listNone .noneMsg {
  color: var(--InvertFontColor);
  font-size: var(--fs14);
  text-align: center;
  margin-top: 150px;
}
.RightArea .codehelpArea .divCodehelpList.listNone .ulCodeHelpList li {
  display: none;
}
.RightArea .codehelpArea .btnArea {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 75px;
  padding: 15px 10px;
  box-shadow: 0px -2px 5px rgba(0, 0, 0, 0.08);
}
.RightArea .codehelpArea .btnArea > input[type=button] {
  min-width: 130px;
  height: 36px;
  padding: 8px 16px;
  margin-right: 8px;
  font-size: var(--fs15);
  border: 0;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  box-shadow: rgba(0, 0, 0, 0.25) 1px 2px 5px;
  transition: all 0.3s;
  cursor: pointer;
}
.RightArea .codehelpArea .btnArea > input[type=button]:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.RightArea .codehelpArea .btnArea > input[type=button]:active {
  background-color: var(--ButtonDefaultColorActive);
}
.RightArea .codehelpAreaTest {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  width: var(--codehelpAreaListWidth);
  height: 100%;
  background-color: var(--MainBgColor);
  transition: all 0.3s;
}
.RightArea .codehelpAreaTest.favCodeMode .searchCodehelpArea .combo {
  border-color: var(--FavCodeBgColor);
}
.RightArea .codehelpAreaTest.favCodeMode .searchCodehelpArea > .searchBox {
  border-color: var(--FavCodeBgColor);
}
.RightArea .codehelpAreaTest.favCodeMode .searchCodehelpArea > .searchBox .tbtnPercent.selected > i {
  background-position: -44px -260px;
}
.RightArea .codehelpAreaTest.favCodeMode .searchCodehelpArea > .searchBox .btnWrap .btn {
  border-color: var(--FavCodeBgColor);
  background-color: var(--FavCodeBgColor);
}
.RightArea .codehelpAreaTest.favCodeMode .searchCodehelpArea > .searchBox .btnWrap .btn:hover {
  background-color: #44b3fc;
  cursor: pointer;
}
.RightArea .codehelpAreaTest.favCodeMode .searchCodehelpArea > .searchBox .btnWrap .btn:active {
  background-color: #3aaffb;
  cursor: pointer;
}
.RightArea .codehelpAreaTest.favCodeMode .detailConditionArea {
  display: none !important;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li.checked > a {
  background-color: rgba(93, 189, 252, 0.1);
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li.checked > a .mainItem {
  color: var(--FavCodeBgColor);
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li.checked > a .subItem {
  color: rgba(93, 189, 252, 0.5);
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .iconFavCode {
  display: flex;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .dataWrap .titleData .favName {
  display: flex;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li {
  position: relative;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li > a {
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  min-height: 60px;
  padding: 0px 10px 0 15px;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li:hover > a {
  cursor: pointer;
  background-color: #4f575c;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li.checked > a {
  background-color: var(--ulCodeHelpListBgColorHover);
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li p.mainItem {
  width: 100%;
  min-width: 25px;
  font-size: var(--fs15);
  color: var(--InvertFontColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li p.subItem {
  font-size: var(--fs13);
  color: rgba(var(--InvertFontColor-rgb), 0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li .btnToolbar {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 100%;
  padding: 0;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li .btnToolbar > i {
  width: 4px;
  height: 18px;
  background-position: -103px 0;
  opacity: 0.6;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li .btnToolbar:hover {
  background-color: var(--ButtonDefaultColorHover);
  cursor: pointer;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a > li .btnToolbar:hover > i {
  opacity: 1;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: var(--MainColor);
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li {
  display: inline-flex;
  align-items: center;
  float: left;
  height: 100%;
  text-align: center;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li a.btnAction {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  padding: 0px 8px;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li a.btnAction .icon {
  display: inline-block;
  width: 30px;
  height: 26px;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li a.btnAction .txtName {
  display: block;
  color: var(--InvertFontColor);
  font-size: var(--fs14);
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li a:hover {
  background-color: var(--ulToolbarColorHover);
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li.toolbarClose > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 100%;
  padding: 0;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li.toolbarClose > a > i {
  width: 4px;
  height: 18px;
  background-position: -103px 0;
  opacity: 0.6;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li.toolbarReplace > .btnAction .icon {
  width: 18px;
  background-position: 0 -94px;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li.toolbarDel > .btnAction .icon {
  width: 18px;
  background-position: -28px -93px;
}
.RightArea .codehelpAreaTest.favCodeMode .divCodehelpList .ulCodeHelpList > li > a .ulToolbar > li.toolbarPersonal > .btnAction .icon {
  width: 18px;
  background-position: -56px -97px;
}
.RightArea .codehelpAreaTest .titleArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  flex-wrap: wrap;
  width: 100%;
  padding: 10px 15px 20px 15px;
}
.RightArea .codehelpAreaTest .titleArea .title {
  display: inline-block;
  font-size: var(--fs17);
  font-weight: bold;
  color: var(--MainFontColor);
}
.RightArea .codehelpAreaTest .titleArea .topBtnBox {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
}
.RightArea .codehelpAreaTest .titleArea .topBtnBox .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 0;
}
.RightArea .codehelpAreaTest .titleArea .topBtnBox .btn > i {
  pointer-events: none;
}
.RightArea .codehelpAreaTest .titleArea .topBtnBox .btn.Close > i {
  width: 13px;
  height: 13px;
  background-position: -45px -202px;
}
.RightArea .codehelpAreaTest .titleArea .topBtnBox .btn.sheetView {
  margin-right: 3px;
}
.RightArea .codehelpAreaTest .titleArea .topBtnBox .btn.sheetView > i {
  width: 18px;
  height: 13px;
  background-position: -95px -202px;
}
.RightArea .codehelpAreaTest .titleArea .topBtnBox .btn:hover {
  background-color: #eaeaea;
  cursor: pointer;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp {
  display: flex;
  align-items: center;
  width: 100%;
  height: 28px;
  border-radius: 5px;
  margin-top: 10px;
  overflow: hidden;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li {
  width: 50%;
  height: 100%;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0 10px;
  background-color: #F7F7F7;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  font-weight: bold;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a > i {
  margin-right: 5px;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a.allCode > i {
  width: 10px;
  height: 8px;
  background-position: 0 -233px;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a.allCode.On {
  background-color: rgba(var(--MainColor-rgb), 0.15);
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a.allCode.On > i {
  background-position: -21px -233px;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a.favCode > i {
  width: 8px;
  height: 11px;
  background-position: -41px -233px;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a.favCode.On {
  background-color: rgba(93, 189, 252, 0.15);
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a.favCode.On > i {
  background-position: -59px -233px;
}
.RightArea .codehelpAreaTest .titleArea .tabCodehelp li > a.On {
  color: var(--MainFontColor);
}
.RightArea .codehelpAreaTest .searchCodehelpArea {
  flex-shrink: 0;
  margin-bottom: 20px;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .combo {
  position: relative;
  flex-shrink: 0;
  padding: 0 10px;
  margin-bottom: 10px;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .combo > .comboBoxItem {
  display: none;
  height: 100%;
  border: 0;
  color: var(--MainFontColor);
  font-size: var(--fs14);
  z-index: 120;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .combo > .comboBoxItem > option {
  color: #333;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox {
  display: flex;
  height: 37px;
  margin: 0 15px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--MainColor);
  border-radius: 5px;
  overflow: hidden;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox > .tbtnPercent {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 100%;
  flex-shrink: 0;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox > .tbtnPercent > i {
  width: 13px;
  height: 12px;
  background-position: -54px -48px;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox > .tbtnPercent.selected > i {
  background-position: -79px -48px;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox > .tbtnPercent:hover {
  background-color: #edefef;
  cursor: pointer;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox > .txtCodeHelp {
  flex: 1;
  width: auto;
  min-width: 138px;
  height: 100%;
  border: 0px;
  color: var(--MainFontColor);
  font-size: var(--fs16);
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap {
  margin-left: auto;
  flex-shrink: 0;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  width: 36px;
  height: 100%;
  border-radius: 0px;
  background-color: var(--MainColor);
  border: 0;
  cursor: pointer;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn:hover, .RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn.Query > i {
  width: 16px;
  height: 17px;
  background-position: 0 -48px;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery > i {
  width: 16px;
  height: 19px;
  background-position: -28px -48px;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn.Dis, .RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery.Dis {
  background-color: #aaa;
  cursor: default;
}
.RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn.Dis > i, .RightArea .codehelpAreaTest .searchCodehelpArea > .searchBox .btnWrap .btn.LocalQuery.Dis > i {
  opacity: 0.5;
}
.RightArea .codehelpAreaTest .detailConditionArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin: 0 15px 10px 15px;
}
.RightArea .codehelpAreaTest .detailConditionArea > .option {
  display: inline-flex;
  padding: 0 5px;
  border-left: 1px solid var(--BorderGrey);
}
.RightArea .codehelpAreaTest .detailConditionArea > .option:first-child {
  border-left: 0;
  padding-left: 0;
}
.RightArea .codehelpAreaTest .detailConditionArea > .option:first-child li:first-child {
  padding-left: 0;
}
.RightArea .codehelpAreaTest .detailConditionArea > .option > li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
}
.RightArea .codehelpAreaTest .detailConditionArea > .option > li > a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.RightArea .codehelpAreaTest .detailConditionArea > .option > li > a::before {
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid var(--ControlBorderColor);
  margin-right: 5px;
}
.RightArea .codehelpAreaTest .detailConditionArea > .option > li.selected > a {
  color: var(--MainFontColor);
}
.RightArea .codehelpAreaTest .detailConditionArea > .option > li.selected > a::after {
  content: "";
  width: 6px;
  height: 6px;
  background-color: var(--MainColor);
  border-radius: 50%;
  position: absolute;
  top: 5px;
  left: 4px;
}
.RightArea .codehelpAreaTest .detailConditionArea > .option > li:hover > a {
  color: var(--MainFontColor);
}
.RightArea .codehelpAreaTest .detailConditionArea .combo {
  height: 20px;
  padding: 0;
  margin-right: 10px;
}
.RightArea .codehelpAreaTest .detailConditionArea .combo > .comboBoxItem {
  display: inline-flex;
  display: none;
  height: 100%;
  border: 0;
  font-size: var(--fs13);
}
.RightArea .codehelpAreaTest .divCodehelpList {
  position: relative;
  width: var(--codehelpAreaListWidth);
  height: 100%;
  overflow: auto;
  scrollbar-face-color: #666;
  scrollbar-shadow-color: #999;
  scrollbar-darkshadow-color: #ccc;
  scrollbar-track-color: #ccc;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList {
  position: relative;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li {
  position: relative;
  border-top: 1px solid #ececec;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li > a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  width: 100%;
  min-height: 56px;
  padding: 0 15px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li > a.btnToolbar {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 100%;
  padding: 0;
  opacity: 0;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li > a.btnToolbar > i {
  width: 4px;
  height: 18px;
  background-position: 0 -292px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li:hover > a {
  background-color: var(--ulCodeHelpListColorHover);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li:hover .btnToolbar {
  opacity: 1;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li:hover .btnToolbar:hover {
  background-color: var(--ulCodeHelpListColorHover);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li.checked > a {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li.checked > a .mainItem {
  color: var(--MainColor);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li.checked > a .subItem {
  color: rgba(var(--MainColor-rgb), 0.5);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li.checked > a.btnToolbar {
  background-color: transparent;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li.checked:hover > a {
  background-color: rgba(var(--MainColor-rgb), 0.15);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li.checked:hover > a.btnToolbar {
  background-color: transparent;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li.checked:hover > a.btnToolbar:hover {
  background-color: rgba(var(--MainBgColor-rgb), 0.5);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .iconFavCode {
  display: none;
  align-items: flex-start;
  flex-shrink: 0;
  width: 15px;
  height: 100%;
  margin-top: -15px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .iconFavCode > i {
  display: inline-block;
  width: 8px;
  height: 11px;
  margin-right: 5px;
  background-position: -31px 0;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: calc(100% - 15px);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData {
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 2px;
  overflow: hidden;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData .mainItem {
  min-width: 30px;
  font-size: var(--fs14);
  color: var(--MainFontColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData .favName {
  display: none;
  align-items: center;
  flex-shrink: 0;
  max-width: calc(100% - 40px);
  padding: 2px 4px;
  border-radius: 5px;
  background-color: rgba(93, 189, 252, 0.2);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData .favName .txt {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--FavCodeBgColor);
  font-size: var(--fs13);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData .favName > i {
  flex-shrink: 0;
  width: 9px;
  height: 9px;
  background-position: -77px -233px;
  margin-left: 5px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData .favNameEditBox {
  display: none;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData .favNameEditBox.open {
  position: absolute;
  top: 35px;
  display: flex;
  width: 170px;
  background-color: var(--MainBgColor);
  border-radius: 5px;
  padding: 7px;
  box-shadow: -1px 0px 10px 1px rgba(0, 0, 0, 0.15);
  z-index: 9;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .titleData .favNameEditBox.open > input {
  width: 100%;
  border: 1px solid var(--ControlBorderColor);
  font-size: var(--fs14);
  padding: 2px 5px;
  background-color: rgba(93, 189, 252, 0.1);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .subData {
  display: flex;
  width: 100%;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .subData .subItem {
  position: relative;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
  padding: 0 7px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .subData .subItem::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 0;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background-color: var(--MainFontColorLighter);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .subData .subItem:first-child {
  padding-left: 0;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .subData .subItem:first-child::before {
  display: none;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li .dataWrap .subData .refItem {
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li p.mainItem {
  width: 100%;
  min-width: 25px;
  font-size: var(--fs14);
  color: var(--MainFontColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList > li p.subItem {
  max-width: 100%;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  flex-direction: column;
  display: none;
  background-color: var(--MainBgColor);
  border: 1px solid #ededed;
  border-radius: 5px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  z-index: 2;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li {
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 35px;
  text-align: center;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li a {
  display: flex;
  align-items: center;
  padding: 0 12px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction {
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0px 10px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .icon {
  display: inline-block;
  flex-shrink: 0;
  width: 8px;
  height: 10px;
  margin-right: 10px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li a.btnAction .txtName {
  color: var(--MainFontColor);
  font-size: var(--fs13);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li a:hover {
  background-color: var(--ulCodeHelpListColorHover);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose {
  display: none;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 100%;
  padding: 0;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarClose > a > i {
  width: 4px;
  height: 18px;
  background-position: -103px 0;
  opacity: 0.6;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarPersonal > .btnAction .icon {
  width: 8px;
  height: 10px;
  background-position: -59px -233px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarReplace > .btnAction .icon {
  width: 9px;
  height: 9px;
  background-position: -77px -233px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList .ulToolbar > li.toolbarDel > .btnAction .icon {
  width: 8px;
  height: 8px;
  background-position: -95px -233px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList.MultiSelect > li > a {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  padding-left: 45px;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList.MultiSelect > li > a:first-child::before {
  content: "";
  position: absolute;
  top: 18px;
  left: 15px;
  width: 20px;
  height: 20px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
  background-color: var(--ControlBgColor);
  box-sizing: border-box;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList.MultiSelect > li > a.btnToolbar {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  padding: 0;
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList.MultiSelect > li.checked > a:first-child::before {
  border-color: var(--MainColor);
}
.RightArea .codehelpAreaTest .divCodehelpList .ulCodeHelpList.MultiSelect > li.checked > a:first-child::after {
  content: "";
  position: absolute;
  top: 22px;
  left: 10px;
  top: 23px;
  left: 19px;
  width: 10px;
  height: 5px;
  border-left: 2px solid var(--MainColor);
  border-bottom: 2px solid var(--MainColor);
  transform: rotate(-45deg);
}
.RightArea .codehelpAreaTest .divCodehelpList.listNone .noneMsg {
  color: var(--MainFontColor);
  font-size: var(--fs14);
  text-align: center;
  margin-top: 150px;
}
.RightArea .codehelpAreaTest .divCodehelpList.listNone .ulCodeHelpList li {
  display: none;
}
.RightArea .codehelpAreaTest .actionBtn {
  display: inline-block;
  flex-shrink: 0;
  padding: 15px;
  animation: actionBtnSlideIn 0.3s forwards;
}
@keyframes actionBtnSlideIn {
  0% {
    opacity: 0;
    transform: translateY(-150px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
.RightArea .codehelpAreaTest .actionBtn ul {
  display: flex;
  align-items: center;
  height: 38px;
  background-color: #F2F2F2;
  border-radius: 5px;
  padding: 0 15px;
}
.RightArea .codehelpAreaTest .actionBtn ul li {
  display: flex;
  align-items: center;
  margin-right: 15px;
}
.RightArea .codehelpAreaTest .actionBtn ul li a {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  font-size: var(--fs13);
}
.RightArea .codehelpAreaTest .actionBtn ul li a:hover {
  text-decoration: underline;
  color: var(--MainFontColor);
}
.RightArea .codehelpAreaTest .actionBtn ul li a i {
  display: inline-block;
  width: 12px;
  height: 12px;
  font-size: var(--fs13);
  margin-right: 5px;
}
.RightArea .codehelpAreaTest .actionBtn ul li a i.copy {
  width: 8px;
  height: 11px;
  background-position: -31px 0;
}
.RightArea .codehelpAreaTest .actionBtn ul li a i.rowDel {
  width: 8px;
  height: 8px;
  background-position: -31px -60px;
}
.RightArea .codehelpAreaTest .actionBtn ul li a i.delete {
  width: 12px;
  height: 11px;
  background-position: -31px -78px;
}
.RightArea .codehelpAreaTest .btnArea {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 70px;
  border-top: 1px solid var(--BorderGreyLight);
  padding: 15px 10px;
}
.RightArea .codehelpAreaTest .btnArea > input[type=button] {
  min-width: 100px;
  height: 36px;
  padding: 8px 16px;
  margin-right: 8px;
  font-size: var(--fs15);
  border: 0;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  transition: all 0.3s;
  cursor: pointer;
}
.RightArea .codehelpAreaTest .btnArea > input[type=button]:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.RightArea .codehelpAreaTest .btnArea > input[type=button]:active {
  background-color: var(--ButtonDefaultColorActive);
}
.RightArea .codehelpAreaTest .btnArea > input[type=button].btnLine {
  border: 1px solid var(--BorderGreyLight);
  background-color: transparent;
  color: var(--MainColor);
}
.RightArea .codehelpAreaTest .btnArea > input[type=button].btnLine:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.RightArea .codehelpAreaTest .btnArea > input[type=button].btnLine:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  border-color: rgba(var(--MainColor-rgb), 0.15);
  cursor: pointer;
}

.editFavCode {
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.1);
  width: 100%;
  height: 100%;
}
.editFavCode .msgBox {
  position: absolute;
  top: calc(50% - 45px);
  left: calc(50% - 105px);
  display: flex;
  flex-direction: column;
  background-color: var(--MainBgColor);
  border: 1px solid #ededed;
  border-radius: 5px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  z-index: 2;
}
.editFavCode .msgBox .msgContent {
  padding: 10px;
}
.editFavCode .msgBox .msgContent .editInput {
  display: flex;
  align-items: center;
  width: 190px;
  height: 30px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
}
.editFavCode .msgBox .msgContent .editInput > i {
  display: inline-block;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position: -19px -292px;
  margin: 0 5px;
}
.editFavCode .msgBox .msgContent .editInput input[type=text] {
  width: 100%;
  background-color: transparent;
  border: 0;
}
.editFavCode .msgBox .btnWrap {
  display: flex;
  justify-content: flex-end;
  padding: 0 10px 10px 0;
}
.editFavCode .msgBox .btnWrap > input[type=button] {
  min-width: 50px;
  height: 30px;
  border-radius: 5px;
  font-size: var(--fs13);
  border: 0;
  margin-left: 5px;
  border: 1px solid var(--FavCodeBgColor);
  cursor: pointer;
}
.editFavCode .msgBox .btnWrap > input[type=button].btnDefault {
  background-color: var(--FavCodeBgColor);
  color: #fff;
}
.editFavCode .msgBox .btnWrap > input[type=button].btnDefault:hover {
  background-color: #44b3fc;
  cursor: pointer;
}
.editFavCode .msgBox .btnWrap > input[type=button].btnDefault:active {
  background-color: #3aaffb;
  cursor: pointer;
}
.editFavCode .msgBox .btnWrap > input[type=button].btnLine {
  border-color: var(--BorderGreyLight);
  background-color: transparent;
  color: var(--FavCodeBgColor);
}
.editFavCode .msgBox .btnWrap > input[type=button].btnLine:hover {
  background-color: rgba(93, 189, 252, 0.1);
  border-color: rgba(93, 189, 252, 0.1);
  cursor: pointer;
}
.editFavCode .msgBox .btnWrap > input[type=button].btnLine:active {
  background-color: rgba(93, 189, 252, 0.15);
  border-color: rgba(93, 189, 252, 0.15);
  cursor: pointer;
}

.CodeHelpSheetTest {
  z-index: 40;
}
.CodeHelpSheetTest .popupCodehelp {
  position: absolute;
  top: calc(50% - 285px);
  left: calc(50% - 435px);
  width: 870px;
  height: 570px;
  transform: none;
  animation: unset;
  overflow: hidden;
}
.CodeHelpSheetTest .popupCodehelp .popupCodehelpContent {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.CodeHelpSheetTest .popupCodehelp .popupCodehelpContent.favCodeMode .searchCodehelpArea .combo {
  border-color: var(--FavCodeBgColor);
}
.CodeHelpSheetTest .popupCodehelp .popupCodehelpContent.favCodeMode .searchCodehelpArea .searchBox {
  border-color: var(--FavCodeBgColor);
}
.CodeHelpSheetTest .popupCodehelp .popupCodehelpContent.favCodeMode .searchCodehelpArea .searchBox .tbtnPercent.selected > i {
  background-position: -44px -260px;
}
.CodeHelpSheetTest .popupCodehelp .popupCodehelpContent.favCodeMode .searchCodehelpArea .searchBtnWrap .btn {
  border-color: var(--FavCodeBgColor);
  background-color: var(--FavCodeBgColor);
}
.CodeHelpSheetTest .popupCodehelp .popupCodehelpContent.favCodeMode .searchCodehelpArea .searchBtnWrap .btn:hover {
  background-color: #44b3fc;
  cursor: pointer;
}
.CodeHelpSheetTest .popupCodehelp .popupCodehelpContent.favCodeMode .searchCodehelpArea .searchBtnWrap .btn:active {
  background-color: #3aaffb;
  cursor: pointer;
}
.CodeHelpSheetTest .popupCodehelp .popupCodehelpContent.favCodeMode .detailConditionArea {
  display: none !important;
}
.CodeHelpSheetTest .popupCodehelp .topArea {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 56px;
  text-align: center;
}
.CodeHelpSheetTest .popupCodehelp .topArea .radioViewmode {
  position: absolute;
  top: 15px;
  left: 15px;
  display: flex;
  border-radius: 5px;
  background-color: #eee;
  padding: 3px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .radioViewmode > li {
  float: left;
  min-width: 53px;
  height: 20px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .radioViewmode > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--FontColorGrey);
  font-size: var(--fs11);
  font-weight: bold;
  border-radius: 3px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .radioViewmode > li > a.On {
  background-color: #fff;
  color: var(--MainFontColor);
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1);
}
.CodeHelpSheetTest .popupCodehelp .topArea .radioViewmode > li:hover > a {
  color: var(--MainFontColor);
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox {
  display: flex;
  align-items: center;
  padding: 0 15px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .txtTitle {
  font-size: var(--fs17);
  font-weight: bold;
  color: var(--MainFontColor);
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp {
  display: flex;
  align-items: center;
  height: 28px;
  border-radius: 5px;
  margin-left: 15px;
  overflow: hidden;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li {
  height: 100%;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0 10px;
  background-color: #F7F7F7;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  font-weight: bold;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a > i {
  margin-right: 5px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a.allCode > i {
  width: 10px;
  height: 8px;
  background-position: 0 -233px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a.allCode.On {
  background-color: rgba(var(--MainColor-rgb), 0.15);
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a.allCode.On > i {
  background-position: -21px -233px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a.favCode > i {
  width: 8px;
  height: 11px;
  background-position: -41px -233px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a.favCode.On {
  background-color: rgba(93, 189, 252, 0.15);
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a.favCode.On > i {
  background-position: -59px -233px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .titleBox .tabCodehelp li > a.On {
  color: var(--MainFontColor);
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 0;
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn > i {
  pointer-events: none;
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn.Close > i {
  width: 13px;
  height: 13px;
  background-position: -45px -202px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn.Max > i {
  width: 12px;
  height: 12px;
  background-position: 0 -202px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn.Min > i {
  width: 14px;
  height: 14px;
  background-position: -22px -202px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn.listView {
  margin-right: 3px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn.listView > i {
  width: 18px;
  height: 13px;
  background-position: -67px -202px;
}
.CodeHelpSheetTest .popupCodehelp .topArea .topBtnBox .btn:hover {
  background-color: #eaeaea;
  cursor: pointer;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea {
  position: relative;
  display: flex;
  flex-shrink: 0;
  width: 570px;
  height: 36px;
  margin: 0 15px;
  margin-bottom: 15px;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .combo {
  flex-shrink: 0;
  width: 140px;
  padding: 0 5px 0 0;
  border-radius: 5px 0 0 5px;
  border: 1px solid var(--MainColor);
  border-right: 0;
  overflow: hidden;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .combo select.comboBoxItem {
  width: 100%;
  height: 100%;
  padding: 0 5px;
  font-size: var(--fs14);
  font-weight: bold;
  border: 0;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBox {
  display: flex;
  width: 100%;
  border: 1px solid var(--MainColor);
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 36px;
  height: 100%;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent > i {
  width: 13px;
  height: 12px;
  background-position: 0 -260px;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent.selected > i {
  background-position: -22px -260px;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBox .tbtnPercent:hover {
  background-color: #edefef;
  cursor: pointer;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBox > .txtCodeHelp {
  width: 100%;
  min-width: 138px;
  height: 100%;
  border: 0px;
  color: var(--MainFontColor);
  font-size: var(--fs17);
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBtnWrap {
  margin-left: auto;
  flex-shrink: 0;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBtnWrap .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 100%;
  border: 1px solid var(--MainColor);
  border-radius: 0 5px 5px 0;
  background-color: var(--MainColor);
  cursor: pointer;
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBtnWrap .btn:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBtnWrap .btn:active {
  background-color: var(--ButtonDefaultColorActive);
}
.CodeHelpSheetTest .popupCodehelp .searchCodehelpArea .searchBtnWrap .btn.Query > i {
  width: 16px;
  height: 17px;
  background-position: -66px -260px;
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea {
  display: flex;
  align-items: center;
  padding: 0 15px;
  margin-bottom: 10px;
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option {
  display: inline-flex;
  padding: 0 5px;
  border-left: 1px solid var(--BorderGrey);
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option:first-child {
  border-left: 0;
  padding-left: 0;
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option:first-child li:first-child {
  padding-left: 0;
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option > li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option > li > a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option > li > a::before {
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid var(--ControlBorderColor);
  margin-right: 5px;
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option > li.selected > a {
  color: var(--MainFontColor);
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option > li.selected > a::after {
  content: "";
  width: 6px;
  height: 6px;
  background-color: var(--MainColor);
  border-radius: 50%;
  position: absolute;
  top: 5px;
  left: 4px;
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea > .option > li:hover > a {
  color: var(--MainFontColor);
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea .combo {
  height: 20px;
  padding: 0;
  margin-right: 10px;
}
.CodeHelpSheetTest .popupCodehelp .detailConditionArea .combo > .comboBoxItem {
  display: inline-flex;
  display: none;
  height: 100%;
  border: 0;
  font-size: var(--fs13);
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  min-height: 35px;
  padding: 0 15px;
  background-color: var(--multiSelectedAreaBgColor);
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea .txtTotal {
  flex-shrink: 0;
  font-size: var(--fs13);
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea .txtTotal > .txtValue {
  font-weight: bold;
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-height: 44px;
  padding: 5px;
  overflow-y: auto;
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-track {
  background-color: transparent;
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-track:hover {
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.15);
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.25);
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-thumb:active {
  background-color: rgba(0, 0, 0, 0.4);
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-corner {
  background-color: transparent;
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  background-color: transparent;
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .divWrap {
  scrollbar-face-color: transparent;
  scrollbar-track-color: transparent;
  scrollbar-3dlight-color: transparent;
  scrollbar-highlight-color: transparent;
  scrollbar-darkshadow-color: transparent;
  scrollbar-shadow-color: transparent;
  scrollbar-arrow-color: transparent;
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .btnCodeHelpAllDel {
  display: inline-flex;
  font-size: var(--fs11);
  flex-shrink: 0;
  padding: 4px 8px;
  border-radius: 2px;
  color: var(--ControlFontColor);
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
}
.CodeHelpSheetTest .popupCodehelp .multiSelectedArea > .btnCodeHelpAllDel:hover {
  cursor: pointer;
  color: #ff6262;
  border: 1px solid #dfb6b6;
  background-color: #fdecec;
}
.CodeHelpSheetTest .popupCodehelp .queryListArea {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.CodeHelpSheetTest .popupCodehelp .queryListArea.SubConditionArea1 {
  display: inline-block;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  justify-content: space-between;
  width: 100%;
  min-height: 45px;
  padding: 0 15px;
  font-size: var(--fs13);
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn {
  display: inline-block;
  flex-shrink: 0;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul {
  display: flex;
  align-items: center;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li {
  display: flex;
  align-items: center;
  margin-right: 15px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a {
  display: inline-flex;
  align-items: center;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a:hover {
  text-decoration: underline;
  color: var(--MainFontColor);
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a i {
  display: inline-block;
  width: 12px;
  height: 12px;
  font-size: var(--fs13);
  margin-right: 5px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a i.copy {
  width: 8px;
  height: 11px;
  background-position: -31px 0;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a i.save {
  width: 10px;
  height: 10px;
  background-position: -31px -99px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a i.rowDel {
  width: 8px;
  height: 8px;
  background-position: -31px -60px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a i.delete {
  width: 12px;
  height: 11px;
  background-position: -31px -78px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a i.userCodeAdd {
  width: 11px;
  height: 11px;
  background-position: -30px -21px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .actionBtn ul li a i.userCodeEdit {
  width: 8px;
  height: 9px;
  background-position: -31px -42px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging {
  display: flex;
  height: 24px;
  padding: 0;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging .searchCount {
  display: inline-flex;
  align-items: center;
  margin-right: 5px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging .searchCount > label {
  padding-right: 4px;
  color: var(--MainFontColor);
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging .searchCount select {
  height: 24px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
  font-size: var(--fs13);
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 100%;
  line-height: 22px;
  border: 1px solid #ccc;
  border-right: 0;
  background-color: var(--MainBgColor);
  text-decoration: none;
  vertical-align: top;
  overflow: hidden;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a span {
  display: block;
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a:last-child {
  border-right: 1px solid #ccc;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a:hover {
  background-color: #f4f4f4;
  cursor: pointer;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow {
  background-color: #F1F1F1;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow span {
  width: 6px;
  height: 9px;
  background-position: 0 0;
  text-indent: -9999px;
  padding: 0;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow.prev {
  border-radius: 3px 0 0 3px;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow.prev span {
  background-position: 0 0;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow.next {
  border-radius: 0 3px 3px 0;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow.next span {
  background-position: 0 0;
  transform: rotate(180deg);
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow:hover {
  background-color: #e4e4e4;
  cursor: pointer;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.arrow:active {
  background-color: #dfdfdf;
  cursor: pointer;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.current {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--MainColor);
  font-weight: bold;
}
.CodeHelpSheetTest .popupCodehelp .codeHelpBottom .paging a.current span {
  color: var(--MainColor);
  font-weight: bold;
}
.CodeHelpSheetTest .popupCodehelp .btnWrap {
  justify-content: center;
  width: 100%;
  height: 65px;
  background-color: #F8F8F8;
}
.CodeHelpSheetTest .popupCodehelp .btnWrap .btnDefault {
  min-width: 100px;
  width: 100px;
  margin: 0 5px;
  font-size: var(--fs16);
}
.CodeHelpSheetTest .popupCodehelp .btnWrap .btnDefault:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.CodeHelpSheetTest .popupCodehelp .btnWrap .btnDefault:active {
  background-color: var(--ButtonDefaultColorActive);
}
.CodeHelpSheetTest .popupCodehelp.Max {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
}

.excPgmDim {
  position: fixed;
  background-color: rgba(0, 0, 0, 0.25);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 20;
}

.devModeWrap {
  position: fixed;
  bottom: 4px;
  left: 0;
  display: flex;
  align-items: center;
  padding: 0 15px;
  color: var(--InvertFontColor);
  z-index: 12000;
}
.devModeWrap .btnDevMode {
  width: 40px;
  height: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1px 5px;
  border-radius: 10px;
  cursor: pointer;
}
.devModeWrap .btnDevMode:hover {
  color: var(--InvertFontColor);
  background-color: var(--btnBgDevMode);
}
.devModeWrap .accInfo {
  color: #fff;
  font-size: var(--fs11);
  margin-left: 5px;
}

.wrap .secRightPanel {
  position: absolute;
  top: calc(var(--CenterHeaderHeight) + var(--CenterAreaPadding) + var(--PgmTopHeight) + 2px);
  right: 0px;
  width: var(--rightPanelDefaultWidth);
  height: calc(100% - var(--CenterHeaderHeight) - (var(--CenterAreaPadding) * 2) - var(--PgmTopHeight) - (2px *2));
  z-index: 21;
}
.wrap.pgmFullScreen .leftNewMenuArea {
  display: none;
}
.wrap.pgmFullScreen .CenterArea .CenterHeaderArea {
  display: none !important;
}
.wrap.pgmFullScreen .secRightPanel {
  position: absolute;
  top: calc(var(--CenterAreaPadding) + var(--PgmTopHeight) + 2px);
  right: 0px;
  height: calc(100% - (var(--CenterAreaPadding) * 2) - var(--PgmTopHeight) - (2px *2));
}
.wrap.pgmFullScreen .rightKbotArea {
  top: 0;
  height: 100%;
}
.wrap.pgmFullScreen .rightKbotArea .kbotWrap {
  border-radius: 0;
}
.wrap.fixedFav .secRightPanel {
  position: absolute;
  top: calc(var(--CenterHeaderHeight) + var(--PgmTabHeight) + var(--CenterAreaPadding) + var(--PgmTopHeight) + 2px);
  right: 0px;
  height: calc(100% - var(--CenterHeaderHeight) - var(--PgmTabHeight) - (var(--CenterAreaPadding) * 2) - var(--PgmTopHeight) - (2px *2));
}

.wrap .btnFlyout {
  display: none;
}
.wrap.Flyout > .CenterArea {
  width: 100% !important;
  left: 0px !important;
}
.wrap.Flyout .btnFlyout {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background-color: var(--BtnFlyoutBgColor);
  color: var(--BtnFlyoutIconColor);
}
.wrap.Flyout .btnFlyout > i {
  position: relative;
  display: inline-block;
  height: 2px;
  width: 15px;
  background-color: currentColor;
  transition: 0.3s;
}
.wrap.Flyout .btnFlyout > i::before, .wrap.Flyout .btnFlyout > i::after {
  content: "";
  position: absolute;
  height: 2px;
  width: 15px;
  background-color: currentColor;
}
.wrap.Flyout .btnFlyout > i::before {
  top: -5px;
}
.wrap.Flyout .btnFlyout > i::after {
  bottom: -5px;
}
.wrap.Flyout .btnFlyout + .btn {
  margin-left: 5px;
}
.wrap.Flyout .btnFlyout:hover {
  background-color: #5e97f0;
  cursor: pointer;
}
.wrap.Flyout .LeftModuleMenuArea, .wrap.Flyout .LeftArea, .wrap.Flyout .LeftTileMenuArea, .wrap.Flyout .LeftModuleMenuArea .moduleBookmark, .wrap.Flyout .expanderMenu {
  display: none !important;
}
.wrap.Flyout .LeftModuleMenuArea .moduleScrollArea .moduleDown, .wrap.Flyout .LeftModuleMenuArea .moduleScrollArea .moduleUp {
  display: none !important;
}
.wrap.Flyout .LeftModuleBottom, .wrap.Flyout .tileMenuList .titleEditBtn .iconMd, .wrap.Flyout .lmnRightMenu {
  display: none !important;
}
.wrap.Flyout.Show .btnFlyout {
  background-color: transparent;
  z-index: 16;
}
.wrap.Flyout.Show .btnFlyout > i {
  background-color: transparent;
}
.wrap.Flyout.Show .btnFlyout > i:before {
  top: auto;
  transform: rotate(45deg);
}
.wrap.Flyout.Show .btnFlyout > i:after {
  bottom: auto;
  transform: rotate(135deg);
}
.wrap.Flyout.Show .LeftModuleMenuArea, .wrap.Flyout.Show .LeftArea, .wrap.Flyout.Show .LeftTileMenuArea, .wrap.Flyout.Show .LeftModuleBottom {
  display: block !important;
}
.wrap.Flyout.Show .LeftModuleMenuArea {
  width: var(--LeftModuleMenuAreaFlyoutWidth);
}
.wrap.Flyout.Show .LeftModuleMenuArea .moduleScrollArea {
  width: 100%;
  height: calc(100% - 220px);
  padding-top: 40px;
}
.wrap.Flyout.Show .LeftModuleMenuArea .moduleScrollArea .moduleIconMenu .ulModuleIcon {
  width: 100%;
}
.wrap.Flyout.Show .LeftModuleMenuArea .moduleScrollArea .moduleIconMenu .ulModuleIcon li {
  width: 100%;
  text-align: left;
}
.wrap.Flyout.Show .LeftModuleMenuArea .moduleScrollArea .moduleIconMenu .ulModuleIcon li > a {
  display: flex;
  align-items: center;
  padding: 8px 0 8px 10px;
}
.wrap.Flyout.Show .LeftModuleMenuArea .moduleScrollArea .moduleIconMenu .ulModuleIcon li .img > img {
  width: 16px;
  margin-right: 5px;
}
.wrap.Flyout.Show .LeftModuleMenuArea .moduleScrollArea .moduleIconMenu .ulModuleIcon li span {
  margin: 0;
  padding: 0;
}
.wrap.Flyout.Show .LeftArea {
  left: var(--LeftModuleMenuAreaFlyoutWidth) !important;
  animation: none;
  z-index: 13;
}
.wrap.Flyout.Show .LeftTileMenuArea {
  left: 500px !important;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap {
  top: auto;
  bottom: 0;
  display: block !important;
  width: auto;
  height: auto;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice {
  left: 0px;
  bottom: 15px;
  width: 230px !important;
  min-width: 240px;
  background-color: var(--moduleNoticeBgColor);
  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.4);
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice * {
  color: var(--InvertFontColor) !important;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice::after {
  display: none;
  bottom: 25px;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .infoPeople {
  display: block;
  text-align: left;
  padding-left: 70px;
  background-color: var(--MainColor);
  text-align: left;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .infoPeople > .picArea {
  position: absolute;
  left: 10px;
  background-color: var(--MainColor);
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .infoPeople p {
  color: var(--MainFontColor);
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .infoPeople span {
  color: var(--MainFontColor);
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .infoPeople .iconLogout.ico_main {
  background-position: -52px -105px;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .infoPeople .iconLogout:hover, .wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .infoPeople .iconLogout:focus {
  background-color: #c2cfd8;
  cursor: pointer;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .mainAlarmTalkArea {
  border-top: var(--BorderGreyLight);
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .mainAlarmTalkArea ul li > a > p {
  color: var(--MainFontColor);
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .mainAlarmTalkArea ul li.SMS > a > .ico_main {
  background-position: -309px -142px;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .mainAlarmTalkArea ul li.Mail > a > .ico_main {
  background-position: -351px -144px;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .mainAlarmTalkArea ul li.Fax > a > .ico_main {
  background-position: -401px -142px;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .btnArea {
  width: 100%;
  border-radius: 0;
  margin: 0;
  padding: 0;
}
.wrap.Flyout.Show .LeftModuleBottom .moduleNoticeWrap .moduleNotice .btnArea ul li > a > p {
  color: var(--InvertFontColor);
}

article.wrap .KotraTopMenu {
  display: none;
  flex-shrink: 0;
  width: 100%;
  height: 60px;
  background-color: #008349;
}
article.wrap .KotraTopMenu > .logoArea {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0 20px;
}
article.wrap .KotraTopMenu > .logoArea > .logo {
  width: 116px;
  height: 31px;
  background-image: url("../../Images/ThemeKotra/ThemeKotra_iconMain.svg?var(--imageVersion)");
  background-repeat: no-repeat;
  background-position: -96px -623px;
}
article.wrap .KotraTopMenu > .logoArea > .txt {
  padding-left: 12px;
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  white-space: nowrap;
}
article.wrap .KotraTopMenu > .menuArea {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}
article.wrap .KotraTopMenu > .menuArea > li {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 100%;
}
article.wrap .KotraTopMenu > .menuArea > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0 15px;
  color: var(--InvertFontColor);
  font-size: var(--fs16);
  font-weight: bold;
}
article.wrap .KotraTopMenu > .menuArea > li > .subMenu {
  position: absolute;
  top: 60px;
  left: 0;
  display: none;
  height: 50px;
  z-index: 9;
}
article.wrap .KotraTopMenu > .menuArea > li > .subMenu > li {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 100%;
  background-color: var(--LeftModuleMenuAreaBgColor);
}
article.wrap .KotraTopMenu > .menuArea > li > .subMenu > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0 15px;
  color: var(--InvertFontColor);
  font-size: var(--fs15);
  font-weight: bold;
}
article.wrap .KotraTopMenu > .menuArea > li > .subMenu > li > a:hover {
  background-color: rgba(0, 0, 0, 0.3);
}
article.wrap .KotraTopMenu > .menuArea > li > .subMenu > li + li:before {
  content: "";
  width: 1px;
  height: 10px;
  background-color: rgba(var(--InvertFontColor-rgb), 0.5);
}
article.wrap .KotraTopMenu > .menuArea > li:hover {
  background-color: var(--LeftModuleMenuAreaBgColor);
}
article.wrap .KotraTopMenu > .menuArea > li:hover > .subMenu {
  display: flex;
}
article.wrap .KotraTopMenu > .btnArea {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 100%;
  background-color: #008349;
  z-index: 1;
}
article.wrap .KotraTopMenu > .btnArea > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 100%;
}
article.wrap .KotraTopMenu > .btnArea > a:hover {
  background-color: var(--LeftModuleMenuAreaBgColor);
}
article.wrap .KotraTopMenu > .btnArea > a > .ico_main {
  width: 18px;
  height: 18px;
  background-image: url("../../Images/ThemeKotra/ThemeKotra_iconMain.svg?var(--imageVersion)");
  background-repeat: no-repeat;
}
article.wrap .KotraTopMenu > .btnArea > a.btnQuery > .ico_main {
  background-position: 0px -682px;
}
article.wrap .KotraTopMenu > .btnArea > a.btnHelp > .ico_main {
  background-position: -105px -682px;
}
article.wrap .KotraTopMenu > .btnArea > a.btnSetting > .ico_main {
  background-position: -220px -629px;
}
article.wrap .KotraTopMenu > .myInfoArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 100%;
  padding-left: 20px;
  border-left: 1px solid rgba(var(--MainBgColor-rgb), 0.15);
  background-color: #008349;
  z-index: 1;
}
article.wrap .KotraTopMenu > .myInfoArea > .imgProfile {
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}
article.wrap .KotraTopMenu > .myInfoArea > .avatarText {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: rgba(var(--MainBgColor-rgb), 0.2);
  color: rgba(var(--InvertFontColor-rgb), 0.8);
  font-size: var(--fs22);
}
article.wrap .KotraTopMenu > .myInfoArea > .infoTxt {
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 0 25px 0 12px;
  color: var(--InvertFontColor);
  letter-spacing: -0.06em;
}
article.wrap .KotraTopMenu > .myInfoArea > .infoTxt > .department {
  font-size: var(--fs13);
}
article.wrap .KotraTopMenu > .myInfoArea > .infoTxt > .name {
  font-size: var(--fs16);
  font-weight: bold;
}
article.wrap .KotraTopMenu > .myInfoArea > .infoTxt > .name > .position {
  padding-left: 5px;
  font-size: var(--fs13);
  font-weight: normal;
  font-style: normal;
}
article.wrap .KotraTopMenu > .myInfoArea > .btnLogout {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 100%;
}
article.wrap .KotraTopMenu > .myInfoArea > .btnLogout:hover {
  background-color: var(--LeftModuleMenuAreaBgColor);
}
article.wrap .KotraTopMenu > .myInfoArea > .btnLogout > .ico_main {
  width: 14px;
  height: 14px;
  background-image: url("../../Images/ThemeKotra/ThemeKotra_iconMain.svg?var(--imageVersion)");
  background-repeat: no-repeat;
  background-position: -245px -632px;
}
article.wrap .KotraTopMenu + .defaultWrap .leftNewMenuArea .btnMenuModule {
  top: 60px;
}
article.wrap .KotraTopMenu + .defaultWrap .leftNewMenuArea.styleOld.Show .contentWrap > .blindRight {
  width: 100%;
  z-index: 0;
}
article.wrap .KotraTopMenu + .defaultWrap .CenterArea .CenterHeaderArea .btnR, article.wrap .KotraTopMenu + .defaultWrap .CenterArea .CenterHeaderArea .RadialBall {
  display: none !important;
}
article.wrap .KotraTopMenu + .defaultWrap .CenterArea .CenterHeaderArea .openMenuMoreList {
  top: 100px;
  right: 0 !important;
  left: unset !important;
}
article.wrap .KotraTopMenu + .defaultWrap .toolbarArea .ulToolbar > li.seperator {
  border-color: rgba(255, 255, 255, 0.2);
}
article.wrap .defaultWrap {
  position: relative;
  width: 100%;
  height: 100%;
}

.CenterArea {
  position: absolute;
  top: 0;
  height: 100%;
  background-color: var(--CenterAreaBgColor);
}
.CenterArea .CenterHeaderArea {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 580px;
  height: var(--CenterHeaderHeight);
  background-color: var(--CenterHeaderAreaBgColor);
  overflow: hidden;
}
.CenterArea .CenterHeaderArea.NotUseBtnHelp {
  padding-right: 0;
}
.CenterArea .CenterHeaderArea.FixedFav {
  height: 80px;
  align-items: flex-start;
  background-position-y: -84px;
}
.CenterArea .CenterHeaderArea.FixedFav .btnFavorite {
  display: none;
}
.CenterArea .CenterHeaderArea.FixedFav .btnLeftWrap {
  position: absolute;
  bottom: 0;
  left: 0;
}
.CenterArea .CenterHeaderArea.FixedFav .modeQuickMenu {
  height: 32px;
  background-color: var(--quickListBgColor);
  border-radius: 0 0 8px 8px;
}
.CenterArea .CenterHeaderArea.FixedFav .modeQuickMenu .quickList {
  position: relative;
  padding-left: 10px;
  border-color: transparent;
  background-color: transparent;
}
.CenterArea .CenterHeaderArea.FixedFav .modeQuickMenu .quickList > i.tbFav {
  display: block;
  background-position-x: -100px;
}
.CenterArea .CenterHeaderArea.FixedFav .modeQuickMenu .btnFavoritePin {
  flex-shrink: 0;
}
.CenterArea .CenterHeaderArea.FixedFav .modeQuickMenu .btnFavoritePin .tbPin {
  background-position-x: -144px;
}
.CenterArea .CenterHeaderArea.FixedFav .modeOpenList {
  position: absolute;
  top: 40px;
  display: flex;
  padding: 0 10px;
  border-right: none;
  opacity: 1;
}
.CenterArea .CenterHeaderArea.FixedFav .openMenuMoreList {
  top: 80px;
  right: 0px;
}
.CenterArea .CenterHeaderArea.FixedFav .btnRightWrap {
  justify-content: flex-end;
}
.CenterArea .CenterHeaderArea.FixedFav ~ .homeArea,
.CenterArea .CenterHeaderArea.FixedFav ~ .processHomeWrap,
.CenterArea .CenterHeaderArea.FixedFav ~ .pgmHomeWrap,
.CenterArea .CenterHeaderArea.FixedFav ~ .programArea {
  height: calc(100% - 80px);
}
.CenterArea .CenterHeaderArea .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 100%;
}
.CenterArea .CenterHeaderArea .btn .tabWrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 30px;
  border-radius: 6px;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .btn:hover .tabWrap {
  background-color: var(--CenterHeaderAreaBtnOn);
  z-index: 3;
}
.CenterArea .CenterHeaderArea .btn.StartPage {
  z-index: 3;
}
.CenterArea .CenterHeaderArea .btn.Process, .CenterArea .CenterHeaderArea .btn.Pgm {
  position: relative;
  font-size: var(--fs13);
  color: var(--MainFontColor);
}
.CenterArea .CenterHeaderArea .btn.Process .tabWrap, .CenterArea .CenterHeaderArea .btn.Pgm .tabWrap {
  padding: 0 4px;
}
.CenterArea .CenterHeaderArea .btn.Process .tabWrap .txtWrap, .CenterArea .CenterHeaderArea .btn.Pgm .tabWrap .txtWrap {
  display: flex;
  align-items: center;
}
.CenterArea .CenterHeaderArea .btn.Process.On, .CenterArea .CenterHeaderArea .btn.Pgm.On {
  padding-top: 5px;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .btn.Process.On::before, .CenterArea .CenterHeaderArea .btn.Process.On::after, .CenterArea .CenterHeaderArea .btn.Pgm.On::before, .CenterArea .CenterHeaderArea .btn.Pgm.On::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 10px;
  height: 10px;
  background-color: var(--PgmAreaBgColor);
  z-index: 1;
}
.CenterArea .CenterHeaderArea .btn.Process.On:before, .CenterArea .CenterHeaderArea .btn.Pgm.On:before {
  left: -5px;
}
.CenterArea .CenterHeaderArea .btn.Process.On:after, .CenterArea .CenterHeaderArea .btn.Pgm.On:after {
  right: -5px;
}
.CenterArea .CenterHeaderArea .btn.Process.On + li, .CenterArea .CenterHeaderArea .btn.Pgm.On + li {
  z-index: 3;
}
.CenterArea .CenterHeaderArea .btn.Process.On .tabWrap, .CenterArea .CenterHeaderArea .btn.Pgm.On .tabWrap {
  align-items: flex-start;
  height: 100%;
  padding-top: 5px;
  border-radius: 8px 8px 0 0;
  background-color: var(--PgmAreaBgColor);
  box-shadow: 3px 4px 4px 0 rgba(0, 0, 0, 0.05);
}
.CenterArea .CenterHeaderArea .btn.Process.On .tabWrap::before, .CenterArea .CenterHeaderArea .btn.Process.On .tabWrap::after, .CenterArea .CenterHeaderArea .btn.Pgm.On .tabWrap::before, .CenterArea .CenterHeaderArea .btn.Pgm.On .tabWrap::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 10px;
  height: 10px;
  background-color: var(--CenterAreaBgColor);
  z-index: 2;
}
.CenterArea .CenterHeaderArea .btn.Process.On .tabWrap::before, .CenterArea .CenterHeaderArea .btn.Pgm.On .tabWrap::before {
  border-radius: 0 0 10px 0;
  left: -10px;
}
.CenterArea .CenterHeaderArea .btn.Process.On .tabWrap::after, .CenterArea .CenterHeaderArea .btn.Pgm.On .tabWrap::after {
  border-radius: 0 0 0 10px;
  right: -10px;
  box-shadow: inset 2px 0px 2px 0 rgba(0, 0, 0, 0.05);
}
.CenterArea .CenterHeaderArea .btn.Process.On .tabWrap a:focus-visible, .CenterArea .CenterHeaderArea .btn.Pgm.On .tabWrap a:focus-visible {
  outline: 1px solid var(--InvertFontColor);
}
.CenterArea .CenterHeaderArea .btn.Process:hover, .CenterArea .CenterHeaderArea .btn.Process:focus, .CenterArea .CenterHeaderArea .btn.Pgm:hover, .CenterArea .CenterHeaderArea .btn.Pgm:focus {
  background-color: transparent;
}
.CenterArea .CenterHeaderArea .btn.Process.On + .Pgm {
  z-index: 3;
}
.CenterArea .CenterHeaderArea .btn.Pgm.On + .btnFavorite {
  z-index: 3;
}
.CenterArea .CenterHeaderArea .btnLeftWrap {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  height: 40px;
  padding-left: 5px;
}
.CenterArea .CenterHeaderArea .btnFavorite {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 30px;
  margin-left: 2px;
  border-radius: 8px;
  border: 1px solid transparent;
  border-right: none;
}
.CenterArea .CenterHeaderArea .btnFavorite:hover {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.CenterArea .CenterHeaderArea .btnFavorite.on {
  background-color: var(--quickListBgColor);
  border-color: var(--quickListBorderColor);
  border-radius: 8px 0 0 8px;
}
.CenterArea .CenterHeaderArea .btnFavorite.on .tbFav {
  background-position-x: -100px;
}
.CenterArea .CenterHeaderArea .btnRightWrap {
  display: flex;
  align-items: center;
  padding: 5px 10px;
  margin-left: auto;
}
.CenterArea .CenterHeaderArea .btnR {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 30px;
  margin-left: 2px;
  border-radius: 6px;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .btnR:hover, .CenterArea .CenterHeaderArea .btnR.On {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.CenterArea .CenterHeaderArea .btnR.Kbot.On {
  border: 1px solid var(--btnKbotOnBorderColor);
  background: var(--btnKbotOnBgColor);
}
.CenterArea .CenterHeaderArea .btnR.New:after {
  content: attr(data-new);
  position: absolute;
  top: 2px;
  right: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 15px;
  min-height: 15px;
  padding: 0 3px;
  border-radius: 30px;
  background-color: var(--CenterHeaderAreaBtnNew);
  color: #fff;
  font-size: var(--fs11);
  font-weight: bold;
  box-sizing: border-box;
}
.CenterArea .CenterHeaderArea .btnR.QuickLink {
  width: auto;
  min-width: 32px;
  padding: 0 4px;
}
.CenterArea .CenterHeaderArea .btnR.QuickLink > .btnLink {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  background-color: var(--CenterHeaderAreaBtnRLinkBgColor);
  font-size: var(--fs11);
  overflow: hidden;
}
.CenterArea .CenterHeaderArea .btnR.QuickLink > .btnLink > img {
  width: 100%;
  height: 100%;
}
.CenterArea .CenterHeaderArea .btnR.QuickLink > .btnLink:hover {
  background-color: var(--CenterHeaderAreaBtnRLinkBgColor) Hover;
  color: var(--InvertFontColor);
}
.CenterArea .CenterHeaderArea .btnR.QuickLink > .btnLink + .btnLink {
  margin-left: 6px;
}
.CenterArea .CenterHeaderArea .btnR.QuickLink + .ProgramQuery > .btnQuery {
  border-left: none;
}
.CenterArea .CenterHeaderArea .btnR.QuickLink.hide {
  display: none;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting {
  display: flex;
  align-items: center;
  width: unset;
  max-width: 230px;
  margin-right: 10px;
  border-radius: 0;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting::before, .CenterArea .CenterHeaderArea .btnR.TopSetting::after {
  content: "";
  width: 1px;
  height: 20px;
  background-color: #a8b2b8;
  margin-right: 14px;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting::after {
  margin-left: 14px;
  margin-right: 0;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting:hover, .CenterArea .CenterHeaderArea .btnR.TopSetting.On {
  background-color: transparent;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting > .txtInfo {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  margin-left: 4px;
  overflow: hidden;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting > .txtInfo > .name {
  color: var(--modeTopOpenListTabPgmTitleColorHover);
  font-size: var(--fs13);
  font-weight: bold;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting > .txtInfo > .dept {
  color: var(--modeTopOpenListTabPgmTitleColor);
  font-size: var(--fs11);
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting.UserLicenseAlert > .txtInfo {
  position: relative;
  padding-left: 22px;
}
.CenterArea .CenterHeaderArea .btnR.TopSetting.UserLicenseAlert > .txtInfo:before {
  content: "";
  position: absolute;
  top: 8px;
  left: 0;
  display: inline-block;
  width: 16px;
  height: 12px;
  margin-right: 8px;
  background-color: transparent;
  background-position: -649px 0px;
}
.CenterArea .CenterHeaderArea .btnR.ProgramQuery {
  z-index: 9;
}
.CenterArea .CenterHeaderArea .btnR.ProgramQuery > .btnQuery {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .btnR.ProgramQuery .programQueryArea {
  position: absolute;
  top: 0;
  right: 0;
  width: 0px;
  height: 40px;
  padding: 2px 2px 2px 15px;
  background-color: var(--CenterHeaderAreaBtnRightBgColor);
  overflow: hidden;
  opacity: 0;
  z-index: 9999;
}
.CenterArea .CenterHeaderArea .btnR.ProgramQuery .programQueryArea .inputProgramQuery {
  float: left;
  height: 36px;
  width: 247px;
  font-size: var(--fs17);
  color: var(--InvertFontColor);
  border: 0px;
  background-color: transparent;
}
.CenterArea .CenterHeaderArea .btnR.ProgramQuery .programQueryArea .btnProgramQuery {
  float: left;
  width: 36px;
  height: 36px;
  border: 0px;
  background-color: transparent;
  background-position: -230px 7px;
}
.CenterArea .CenterHeaderArea .btnR.ProgramQuery .programQueryArea .btnProgramQuery:hover, .CenterArea .CenterHeaderArea .btnR.ProgramQuery .programQueryArea .btnProgramQuery:focus {
  background-color: #d9d9d9;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .btnR.ProgramQuery .programQueryArea.Close {
  animation: aniProgramQueryAreaClose 0.3s ease 1 forwards;
}
.CenterArea .CenterHeaderArea .btnR.ProgramQuery .programQueryArea.Open {
  animation: aniProgramQueryAreaOpen 0.3s ease 1 forwards;
}
@keyframes aniProgramQueryAreaClose {
  0% {
    opacity: 1;
    width: 300px;
    visibility: visible;
  }
  100% {
    opacity: 0;
    width: 0px;
    visibility: collapse;
  }
}
@keyframes aniProgramQueryAreaOpen {
  0% {
    opacity: 0;
    width: 0px;
    visibility: collapse;
  }
  100% {
    opacity: 1;
    width: 300px;
    visibility: visible;
  }
}
.CenterArea .CenterHeaderArea .quickLinkList {
  z-index: 120;
}
.CenterArea .CenterHeaderArea .quickLinkList.hide {
  display: none;
}
.CenterArea .CenterHeaderArea .quickLinkList .dlgContextUI {
  position: absolute;
  top: 43px;
  right: 39px;
  max-width: 360px;
  min-width: 260px;
}
.CenterArea .CenterHeaderArea .quickLinkList .dlgContextUI .group .titleWrap {
  display: flex;
  align-items: center;
  padding: 16px 24px;
  border-bottom: 1px solid var(--BorderGreyLight);
  font-size: var(--fs15);
  font-weight: bold;
}
.CenterArea .CenterHeaderArea .quickLinkList .dlgContextUI .group .titleWrap .title {
  color: var(--MainFontColor);
  font-size: var(--fs15);
  font-weight: bold;
}
.CenterArea .CenterHeaderArea .quickLinkList .dlgContextUI .group .titleWrap .count {
  padding-left: 5px;
  color: var(--MainColor);
}
.CenterArea .CenterHeaderArea .quickLinkList .dlgContextUI .group .contextMenu .item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.CenterArea .CenterHeaderArea .quickLinkList .dlgContextUI .group .contextMenu .item > .name {
  color: var(--MainFontColor);
  font-size: var(--fs14);
}
.CenterArea .CenterHeaderArea .quickLinkList .dlgContextUI .group .contextMenu .item > .ico_main {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-left: 10px;
  background-position: -429px -683px;
}
.CenterArea .CenterHeaderArea .linkListWrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 120;
}
.CenterArea .CenterHeaderArea .linkListWrap.hide {
  display: none;
}
.CenterArea .CenterHeaderArea .linkListWrap > .linkListArea {
  position: absolute;
  top: 43px;
  right: 39px;
  max-width: 360px;
  min-width: 260px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 10px;
  background-color: var(--MainBgColor);
  box-shadow: -3px 3px 6px rgba(0, 0, 0, 0.16);
}
.CenterArea .CenterHeaderArea .linkListWrap > .linkListArea > .title {
  padding: 16px 24px;
  border-bottom: 1px solid var(--BorderGreyLight);
  font-size: var(--fs15);
  font-weight: bold;
}
.CenterArea .CenterHeaderArea .linkListWrap > .linkListArea > .title > .count {
  padding-left: 5px;
  color: var(--MainColor);
}
.CenterArea .CenterHeaderArea .linkListWrap > .linkListArea > .linkList {
  padding: 8px 0;
}
.CenterArea .CenterHeaderArea .linkListWrap > .linkListArea > .linkList > .item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 24px;
}
.CenterArea .CenterHeaderArea .linkListWrap > .linkListArea > .linkList > .item > .name {
  color: var(--MainFontColor);
  font-size: var(--fs14);
}
.CenterArea .CenterHeaderArea .linkListWrap > .linkListArea > .linkList > .item > .ico_main {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-left: 10px;
  background-position: -429px -683px;
}
.CenterArea .CenterHeaderArea .linkListWrap > .linkListArea > .linkList > .item:hover {
  background-color: var(--CenterHeaderAreaBtnRLinkBgColor);
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .userInfoWrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 121;
}
.CenterArea .CenterHeaderArea .userInfoWrap.hide {
  display: none;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer {
  position: absolute;
  top: 43px;
  right: 100px;
  min-width: 280px;
  max-width: 320px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--BorderGreyLight);
  border-radius: 10px;
  box-shadow: rgba(15, 15, 15, 0.03) 0px 0px 0px 1px, rgba(15, 15, 15, 0.05) 0px 3px 6px, rgba(15, 15, 15, 0.1) 0px 9px 24px;
  overflow: hidden;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .InfoWrap {
  display: flex;
  flex-direction: column;
  padding: 10px 15px 5px 15px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .InfoWrap .userNameArea {
  display: flex;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .InfoWrap .userNameArea .avatarText {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  margin-right: 10px;
  background-color: #ECEFF1;
  border-radius: 8px;
  color: #78909C;
  font-size: var(--fs21);
  font-weight: bold;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .InfoWrap .userNameArea .userName {
  display: flex;
  align-items: center;
  width: 100%;
  height: 44px;
  color: var(--MainFontColor);
  font-size: var(--fs16);
  font-weight: bold;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .InfoWrap .userNameArea .userName .txt {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .InfoWrap .userInfo {
  padding: 5px 0 0 0;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .InfoWrap .userInfo > p {
  display: flex;
  align-items: center;
  margin: 4px 0 8px 0;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .InfoWrap .userInfo > p > span {
  margin-left: 4px;
  color: var(--FontColorGrey);
  font-size: var(--fs13);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .btnWrap {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  height: 40px;
  border-top: 1px solid var(--BorderGreyLight);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .btnWrap > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  height: 100%;
  font-size: var(--fs14);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .btnWrap > a > .icoTopBar16 {
  margin-right: 4px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .btnWrap > a:hover {
  background-color: rgba(var(--InvertBgColor-rgb), 0.05);
  color: var(--MainFontColor);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .btnWrap > a.btnLogout {
  border-left: 1px solid var(--BorderGreyLight);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .userLicense {
  position: relative;
  font-size: var(--fs11);
  color: var(--colorRed);
  border-top: 1px solid var(--BorderGreyLight);
  padding: 10px 10px 10px 38px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .userLicense:before {
  content: "";
  position: absolute;
  left: 15px;
  top: 12px;
  display: inline-block;
  width: 16px;
  height: 12px;
  background-position: -649px 0px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea {
  display: flex;
  flex-direction: column;
  max-height: 40px;
  border-top: 1px solid var(--BorderGreyLight);
  font-size: var(--fs13);
  overflow: hidden;
  transition: max-height 0.3s;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .titleArea {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  height: 40px;
  padding: 0 15px;
  background-color: #F5F5F5;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .titleArea > .title {
  display: flex;
  align-items: center;
  font-size: var(--fs13);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .titleArea > .title > .txt {
  padding-left: 4px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea {
  display: flex;
  flex-direction: column;
  padding: 5px 15px 15px 20px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contLeft {
  display: flex;
  flex-direction: column;
  padding-top: 4px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contLeft > .txtInfo {
  margin-bottom: 8px;
  line-height: 18px;
  font-size: var(--fs14);
  margin-bottom: 12px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contLeft > .txtInfo > b {
  font-weight: 600;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contLeft > .codeBox {
  display: flex;
  align-items: center;
  width: 100%;
  height: 35px;
  min-width: 170px;
  padding: 0 8px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 2px;
  background-color: rgba(var(--InvertBgColor-rgb), 0.06);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contLeft > .codeBox > i.cpCode {
  margin-right: 6px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contLeft > .codeBox > .txtCode {
  display: flex;
  align-items: center;
  height: 100%;
  border: none;
  background-color: transparent;
  color: var(--MainColor);
  font-size: var(--fs15);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contLeft > .codeBox.noData > i.cpCode {
  display: none;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contLeft > .codeBox.noData > .txtCode {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contRight {
  display: flex;
  align-items: center;
  flex-direction: column;
  margin-top: 12px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contRight .qrTitle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contRight .qrTitle > .txt {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3px 5px;
  font-size: var(--fs14);
  color: #616161;
  background-color: #fff;
  z-index: 1;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea > .contentArea > .contRight .qrTitle::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #CFD8DC;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea.Expand {
  max-height: 500px;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea.Expand > .titleArea {
  background-color: transparent;
}
.CenterArea .CenterHeaderArea .userInfoWrap .userInfoLayer .useMobileArea.Expand > .titleArea .uiArrow {
  margin-top: -4px;
  transform: rotate(-180deg);
}
.CenterArea .CenterHeaderArea.BIMode .btnR.BI {
  display: inline-flex;
}
.CenterArea .CenterHeaderArea .modeQuickMenu {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 2px 0;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 30px;
  background-color: var(--quickListBgColor);
  border: 1px solid var(--quickListBorderColor);
  border-left: none;
  border-radius: 0 8px 8px 0;
  overflow: hidden;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList > i.tbFav {
  display: none;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList {
  position: relative;
  display: flex;
  width: calc(100% - 40px);
  float: left;
  margin-left: 5px;
  overflow: hidden;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList > li {
  position: relative;
  float: left;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList > li:first-child {
  margin: 0;
  padding: 0;
  background: none;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList > li:first-child > a {
  padding-left: 8px;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList > li:first-child::before {
  display: none;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList > li::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 0;
  width: 1px;
  height: 12px;
  background-color: #b7b7b7;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList > li > a {
  display: block;
  max-width: 250px;
  height: 30px;
  line-height: 30px;
  padding: 0px 10px;
  font-size: var(--fs13);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--modeTopOpenListTabPgmTitleColorHover);
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList > li > a:hover, .CenterArea .CenterHeaderArea .modeQuickMenu .quickList .ulQuickList > li > a:focus {
  border: none;
  cursor: pointer;
  color: var(-quickListTxtcolor);
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .quickMenuMore {
  position: absolute;
  top: 4px;
  right: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickList .quickMenuMore:hover, .CenterArea .CenterHeaderArea .modeQuickMenu .quickList .quickMenuMore:focus {
  cursor: pointer;
  background-color: var(--CenterHeaderAreaBtnOn);
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickMenuMoreList {
  position: fixed;
  top: 40px;
  right: 160px;
  z-index: 1;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickMenuMoreList > .ulQuickMenuMore {
  display: inline-block;
  width: 200px;
  max-height: 200px;
  padding: 8px 0;
  border-radius: 6px;
  background-color: var(--MainBgColor);
  overflow: auto;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.16);
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickMenuMoreList > .ulQuickMenuMore li {
  font-size: var(--fs13);
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickMenuMoreList > .ulQuickMenuMore li > a {
  display: flex;
  color: var(--MainFontColor);
  width: 100%;
  padding: 5px 10px;
  word-break: break-all;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .quickMenuMoreList > .ulQuickMenuMore li > a:hover, .CenterArea .CenterHeaderArea .modeQuickMenu .quickMenuMoreList > .ulQuickMenuMore li > a:focus {
  background-color: #bcc3da;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .btnFavoritePin {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin-right: 10px;
  border-radius: 50%;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeQuickMenu .btnFavoritePin:hover, .CenterArea .CenterHeaderArea .modeQuickMenu .btnFavoritePin:focus {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.CenterArea .CenterHeaderArea .modeOpenList {
  display: none;
  width: 100%;
  height: 100%;
  transition: opacity 0.3s;
  opacity: 0;
  overflow: hidden;
  z-index: 8;
}
.CenterArea .CenterHeaderArea .modeOpenList.Show {
  display: flex;
  padding-left: 5px;
  opacity: 1;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList {
  position: relative;
  display: flex;
  width: 100%;
  height: var(--PgmTabHeight);
  overflow: hidden;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  height: 40px;
  padding: 0 0 0 10px;
  overflow-x: auto;
  overflow-y: hidden;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList::-webkit-scrollbar {
  display: none;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  height: 100%;
  padding-top: 6px;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 5px 0 10px;
  border-radius: 8px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab .tabPgmTitle {
  margin-right: 4px;
  font-size: var(--fs13);
  color: var(--modeTopOpenListTabPgmTitleColor);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab > .tabClose {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin: 0;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab > .tabClose > i {
  background-color: var(--modeTopOpenListBtnCloseColor);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab > .tabClose:hover > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab > .tabClose:focus > i {
  background-color: var(--modeTopOpenListBtnCloseColorHover);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab .addFavorite, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab .newTab {
  display: none;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab .tabPin {
  display: inline-block;
  visibility: hidden;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin: 0;
  background-position: -318px -417px;
  transform: rotate(90deg);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab .tabPin:hover, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li .tab .tabPin:focus {
  background-position: -300px -417px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:hover .tab, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:focus .tab {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:hover .tab .tabPgmTitle, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:focus .tab .tabPgmTitle {
  border: none;
  color: var(--modeTopOpenListTabPgmTitleColorHover);
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:hover .tab .tabPin, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:hover .tab .tabClose, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:focus .tab .tabPin, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:focus .tab .tabClose {
  visibility: visible;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:has(+ .Selected) {
  z-index: 3;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected {
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected::before, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 10px;
  height: 10px;
  background-color: var(--PgmAreaBgColor);
  z-index: 1;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected:before {
  left: -10px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected:after {
  right: -10px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected + li {
  z-index: 3;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab {
  align-items: unset;
  height: 100%;
  padding: 6px 5px 0 10px;
  border-radius: 8px 8px 0 0;
  background-color: var(--PgmAreaBgColor);
  box-shadow: 3px 4px 4px 0 rgba(0, 0, 0, 0.05);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab::before, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 10px;
  height: 10px;
  background-color: var(--CenterAreaBgColor);
  z-index: 2;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab::before {
  border-radius: 0 0 10px 0;
  left: -10px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab::after {
  border-radius: 0 0 0 10px;
  right: -10px;
  box-shadow: inset 2px 0px 2px 0 rgba(0, 0, 0, 0.05);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab a:focus-visible {
  outline: 1px solid var(--InvertFontColor);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab .tabPgmTitle {
  color: var(--MainFontColor);
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab .addFavorite {
  flex-shrink: 0;
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -61px -418px;
  opacity: 0.5;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab .addFavorite:hover, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab .addFavorite:focus {
  opacity: 1;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab .addFavorite.on {
  background-position: -82px -418px;
  opacity: 1;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .newTab {
  display: inline-block;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-position: -103px -418px;
  opacity: 0.5;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .newTab:hover, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .newTab:focus {
  opacity: 1;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .tabPin {
  visibility: visible;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .tabPin:hover, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .tabPin:focus {
  background-position: -336px -417px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .tabClose {
  margin-top: -2px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .tabClose > i {
  background-color: #aaa;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .tabClose:hover > i, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected .tab > .tabClose:focus > i {
  background-color: #424242;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected.Fixed .tabPin {
  background-position-y: -417px;
  transform: none;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected.Fixed .tabPin:hover, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.Selected.Fixed .tabPin:focus {
  background-position-y: -417px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:not(.Selected):hover .tab .tabPgmTitle, .CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li:not(.Selected):focus .tab .tabPgmTitle {
  color: var(--modeTopOpenListTabPgmTitleColorHover);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li.ui-sortable-helper {
  cursor: move;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .ulTopOpenList > li + li {
  margin-left: 10px;
  z-index: 2;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 40px;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext > i {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-position: -12px 0px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev:hover,
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabNext:hover {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnMoreTabPrev > i {
  transform: rotate(180deg);
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnOpenTabMore {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnOpenTabMore .tabMoreWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 8px;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .modeOpenList .modeTopOpenList .btnOpenTabMore .tabMoreWrap:hover {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.CenterArea .CenterHeaderArea .openMenuMoreList {
  position: absolute;
  top: 40px;
  right: 120px;
  height: 80%;
  z-index: 7;
}
.CenterArea .CenterHeaderArea .openMenuMoreList .ulOpenMenuMore {
  display: inline-block;
  width: 180px;
  max-height: 100%;
  padding: 2px 0;
  background-color: var(--MainBgColor);
  overflow-y: auto;
  overflow-x: auto;
  border: 1px solid var(--BorderGreyLight);
  box-shadow: rgba(15, 15, 15, 0.03) 0px 0px 0px 1px, rgba(15, 15, 15, 0.05) 0px 3px 6px, rgba(15, 15, 15, 0.1) 0px 9px 24px;
}
.CenterArea .CenterHeaderArea .openMenuMoreList .ulOpenMenuMore li {
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .openMenuMoreList .ulOpenMenuMore li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 5px 10px;
  font-size: var(--fs12);
  color: var(--MainFontColor);
  word-break: break-all;
}
.CenterArea .CenterHeaderArea .openMenuMoreList .ulOpenMenuMore li:hover > a, .CenterArea .CenterHeaderArea .openMenuMoreList .ulOpenMenuMore li:focus > a {
  background-color: #eaeaea;
  cursor: pointer;
}
.CenterArea .CenterHeaderArea .openMenuMoreList .ulOpenMenuMore li.Fixed > a:after {
  content: "";
  display: flex;
  flex-shrink: 0;
  width: 16px;
  height: 12px;
  background-position: -298px -421px;
  opacity: 0.5;
}
.CenterArea .closeAreaEvent {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
}

.dlgMoreErp {
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  background-color: #fcfdff;
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.16);
  overflow: hidden;
  z-index: 121;
}
.dlgMoreErp .dialogHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px 10px 10px 20px;
}
.dlgMoreErp .dialogHeader > .title {
  font-size: var(--fs17);
  font-weight: 700;
}
.dlgMoreErp .dialogHeader .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}
.dlgMoreErp .dialogHeader .btnClose:hover {
  background-color: var(--PgmAreaBgColor);
  cursor: pointer;
}
.dlgMoreErp .dialogContent {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.dlgMoreErp.shortcuts {
  position: fixed;
  top: 50%;
  right: 10px;
  width: 330px;
  height: 640px;
  transform: translateY(-50%);
  cursor: move;
}
.dlgMoreErp.shortcuts::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 90%);
  pointer-events: none;
}
.dlgMoreErp.shortcuts .dialogContent {
  height: 100%;
  padding: 10px 0;
  gap: 20px;
  overflow-y: auto;
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0 16px 0 20px;
  gap: 10px;
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutHeader {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 100%;
  gap: 4px;
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutHeader > .title {
  padding: 4px 0;
  font-size: var(--fs15);
  font-weight: 700;
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutsList {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 12px;
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutsList .shortcutItem {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 10px;
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutsList .shortcutItem .itemName {
  flex-shrink: 0;
  min-width: 110px;
  font-weight: 500;
  color: #606060;
  font-size: var(--fs13);
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutsList .shortcutItem .itemKeys {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  gap: 6px;
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutsList .shortcutItem .itemKeys > kbd {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 22px;
  padding: 2px 6px;
  border: 1px solid #d8d8d8;
  border-radius: 3px;
  background-color: #f3f7f8;
  font-size: var(--fs13);
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutsList .shortcutItem .itemKeys > kbd.bgWhite {
  background-color: var(--MainBgColor);
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection .shortcutsList .shortcutItem .itemKeys .txtPlus {
  font-size: var(--fs14);
  color: var(--FontColorGrey1);
}
.dlgMoreErp.shortcuts .dialogContent .shortcutSection.sheetSection {
  padding: 20px 16px 20px 20px;
  background-color: var(--PgmAreaBgColor);
}

.dlgTrspWrap .dlgMoreErp {
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  background-color: #fcfdff;
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.16);
  overflow: hidden;
}
.dlgTrspWrap .dlgMoreErp .dialogHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px 10px 10px 20px;
}
.dlgTrspWrap .dlgMoreErp .dialogHeader > .title {
  font-size: var(--fs17);
  font-weight: 700;
}
.dlgTrspWrap .dlgMoreErp .dialogHeader .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}
.dlgTrspWrap .dlgMoreErp .dialogHeader .btnClose:hover {
  background-color: var(--PgmAreaBgColor);
  cursor: pointer;
}
.dlgTrspWrap .dlgMoreErp .dialogContent {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.dlgTrspWrap .dlgMoreErp.version {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 300px;
  transform: translate(-50%, -50%);
}
.dlgTrspWrap .dlgMoreErp.version .dialogHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px 10px 10px 20px;
}
.dlgTrspWrap .dlgMoreErp.version .dialogHeader > .title {
  font-size: var(--fs17);
  font-weight: 700;
}
.dlgTrspWrap .dlgMoreErp.version .dialogHeader .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}
.dlgTrspWrap .dlgMoreErp.version .dialogHeader .btnClose:hover {
  background-color: var(--PgmAreaBgColor);
  cursor: pointer;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent {
  padding: 30px 0 40px 0;
  gap: 24px;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .logoArea {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .infoArea {
  width: 100%;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .infoArea .infoContent {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0 16px;
  gap: 16px;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo {
  display: flex;
  align-items: center;
  flex-direction: column;
  width: 100%;
  gap: 12px;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .versionBox {
  display: flex;
  align-items: center;
  width: 100%;
  border-radius: 4px;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .versionBox .versionItem {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  flex-direction: column;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .versionBox .versionItem > .label,
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .versionBox .versionItem > .value {
  width: 100%;
  padding: 2px 8px;
  font-size: var(--fs13);
  text-align: center;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .versionBox .versionItem > .label {
  color: #757575;
  font-weight: 500;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .versionBox .versionItem > .value {
  color: #424242;
  font-weight: 600;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .versionBox .versionDivider {
  width: 1px;
  height: 24px;
  background-color: #E0E1E3;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .latestVersion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 8px 10px;
  border-radius: 2px;
  background-color: #f0f3f6;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .latestVersion > .label,
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .latestVersion > .value {
  font-size: var(--fs13);
  font-weight: 500;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .latestVersion > .label {
  color: #757575;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .versionInfo .latestVersion > .value {
  color: #616161;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .detailInfo {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  padding: 0 10px;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .detailInfo > .label {
  width: 80px;
  margin-bottom: 4px;
  color: #757575;
  font-size: var(--fs12);
  font-weight: 500;
}
.dlgTrspWrap .dlgMoreErp.version .dialogContent .detailInfo > .value {
  width: 100%;
  color: #424242;
  font-size: var(--fs13);
}
.dlgTrspWrap .dlgMoreErp.version .txtFooter {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 10px 0;
  color: #9e9e9e;
  font-size: var(--fs11);
  font-weight: 500;
}
.dlgTrspWrap .dlgMoreErp.userlog {
  width: 300px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent {
  width: 100%;
  padding: 0 12px 12px;
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent .infoTable {
  display: flex;
  flex-direction: column;
  width: 100%;
  border-top: 1px solid #788a93;
  border-bottom: 1px solid #788a93;
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent .infoTable .infoItem {
  display: flex;
  align-items: center;
  padding: 0 8px;
  width: 100%;
  border-bottom: 1px solid #e3e7eb;
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent .infoTable .infoItem:last-child {
  border-bottom: none;
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent .infoTable .infoItem .label {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 70px;
  padding: 12px 4px;
  color: var(--FontColorGrey1);
  font-size: var(--fs13);
  font-weight: 500;
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent .infoTable .infoItem .value {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  padding: 12px 0 12px 8px;
  font-size: var(--fs14);
  gap: 10px;
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent .infoTable .infoItem .value.valueMultiline {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent .infoTable .infoItem .value.valueMultiline .ipAddress {
  font-weight: 500;
}
.dlgTrspWrap .dlgMoreErp.userlog .dialogContent .infoTable .infoItem .value.valueMultiline .ipTime {
  color: #1979e6;
}
.dlgTrspWrap .dlgMoreErp.feedback {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 440px;
  height: 360px;
  padding-bottom: 16px;
  background-color: #ffffff;
  gap: 4px;
  transform: translate(-50%, -50%);
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0 16px;
  gap: 8px;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .inputWrapper {
  position: relative;
  width: 100%;
  height: 100%;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .inputWrapper .inputContainer {
  width: 100%;
  height: 100%;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .inputWrapper .inputContainer .feedbackInput {
  width: 100%;
  height: 100%;
  padding: 12px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 4px;
  background-color: var(--ControlBgColor);
  font-size: var(--fs15);
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .inputWrapper .inputContainer .feedbackInput::placeholder {
  color: #ccc;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .inputWrapper .inputContainer .feedbackInput:focus {
  border-color: rgba(46, 112, 229, 0.55);
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .inputWrapper .inputContainer .chatIcon {
  position: absolute;
  right: 25px;
  bottom: 15px;
  opacity: 0.7;
  filter: blur(0.89px);
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .buttonWrapper {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  padding: 2px 0;
  gap: 10px;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .buttonWrapper .btnSubmit {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 100%;
  height: 36px;
  background-color: #cccccc;
  border: none;
  border-radius: 3px;
  gap: 4px;
  transition: background-color 0.2s, opacity 0.2s;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .buttonWrapper .btnSubmit > .txt {
  color: var(--InvertFontColor);
  font-size: var(--fs15);
  font-weight: 700;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .buttonWrapper .btnSubmit > .subTxt {
  color: rgba(var(--InvertFontColor), 0.7);
  font-size: var(--fs12);
  font-weight: 600;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .buttonWrapper .btnSubmit:disabled {
  background-color: var(--ControlBgColorDis);
  color: var(--ControlCaptionFontColorDis);
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .buttonWrapper .btnSubmit:not(:disabled) {
  background-color: #1979e6;
  gap: 4px;
  cursor: pointer;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogContent .buttonWrapper .btnSubmit:hover:not(:disabled) {
  opacity: 0.9;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogFooter {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 4px 16px 0;
  gap: 2px;
}
.dlgTrspWrap .dlgMoreErp.feedback .dialogFooter .noticeText {
  color: var(--FontColorGrey1);
  font-size: var(--fs13);
}

.openPgmList .dlgContextUI, .favPgmList .dlgContextUI {
  display: flex;
  min-width: 170px;
  max-height: 80%;
  overflow: hidden;
}
.openPgmList .dlgContextUI .group, .favPgmList .dlgContextUI .group {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0 0 10px 0;
}
.openPgmList .dlgContextUI .group .contextMenu, .favPgmList .dlgContextUI .group .contextMenu {
  overflow-y: auto;
  height: 100%;
}
.openPgmList .dlgContextUI .group .contextMenu > li, .favPgmList .dlgContextUI .group .contextMenu > li {
  margin-bottom: 0;
}
.openPgmList .dlgContextUI .group .contextMenu > li > .item, .favPgmList .dlgContextUI .group .contextMenu > li > .item {
  min-height: 30px;
}
.openPgmList .dlgContextUI .group .contextMenu > li > .item > i, .favPgmList .dlgContextUI .group .contextMenu > li > .item > i {
  margin-right: 4px;
}
.openPgmList .dlgContextUI .group .contextMenu > li > .item .txt, .favPgmList .dlgContextUI .group .contextMenu > li > .item .txt {
  font-size: var(--fs13);
}

.IframeDashBoard {
  width: 100%;
  height: 100%;
}

.dashboardEmptyWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.mainDashboardArea {
  display: none;
}

.modalSearchDlg .dlgWrap .modalDlgArea {
  flex-direction: column;
  border-radius: 10px;
  background-color: var(--MainBgColor);
  overflow: hidden;
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 60px;
  padding: 0 8px 0 16px;
  border-bottom: 1px solid #CFD8DC;
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea > .inputText {
  width: 100%;
  height: 100%;
  padding: 0 8px;
  border: none;
  border-radius: 5px;
  color: var(--MainFontColor);
  font-size: var(--fs17);
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea > .inputText:valid + .btnDelSearch {
  display: flex;
  align-items: center;
  justify-content: center;
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnDelSearch {
  display: none;
  position: relative;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-right: 16px;
  margin-left: 10px;
  border-radius: 50%;
  background-color: #E6E8E9;
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnDelSearch > i {
  background-color: #616161;
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnDelSearch:hover, .modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnDelSearch:focus {
  background-color: #C7C7C7;
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnDelSearch:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 4px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnClose:hover, .modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnClose:focus {
  background-color: #f5f5f5;
}
.modalSearchDlg .dlgWrap .modalDlgArea .inputQueryArea .btnClose:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea {
  display: flex;
  align-items: center;
  height: 40px;
  flex-shrink: 0;
  gap: 10px;
  padding: 0 20px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .btnCondition {
  display: flex;
  align-items: center;
  height: 24px;
  gap: 5px;
  border: 1px solid #CFD8DC;
  border-radius: 4px;
  padding: 4px 8px 4px 4px;
  cursor: pointer;
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .btnCondition .txt {
  font-size: var(--fs12);
  color: var(--MainFontColorLighter);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .btnCondition:hover {
  border-color: var(--MainFontColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .btnCondition.On > i {
  background-color: var(--MainColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .btnCondition.On .txt {
  color: var(--MainFontColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .btnCondition.selectType {
  padding: 4px 8px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .btnCondition.selectType .txt {
  color: var(--MainFontColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .btnCondition.selectType > i {
  background-color: var(--MainFontColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition {
  position: absolute;
  display: inline-flex;
  padding: 8px;
  background-color: var(--MainBgColor);
  border-radius: 8px;
  border: 1px solid #C4CFDD;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.01), 0px 0px 20px 0px rgba(0, 0, 0, 0.05), 0px 9px 24px 0px rgba(0, 0, 0, 0.25);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item {
  display: flex;
  align-items: center;
  padding: 5px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item .itemTxt {
  display: flex;
  flex-direction: column;
  font-size: var(--fs13);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item .itemTxt .subTxt {
  margin-top: 8px;
  color: var(--MainFontColorLighter);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item .toggleCheck {
  display: flex;
  margin-left: 70px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item .toggleCheck > input[type=checkbox] {
  display: none;
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item .toggleCheck > input[type=checkbox] + label {
  position: relative;
  width: 32px;
  height: 18px;
  border-radius: 30px;
  background-color: #CFD8DC;
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item .toggleCheck > input[type=checkbox] + label > i {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: var(--ControlBgColor);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  transition: 0.3s;
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item .toggleCheck > input[type=checkbox]:checked + label {
  background-color: var(--MainColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .conditionArea .dlgSearchCondition > .item .toggleCheck > input[type=checkbox]:checked + label > i {
  left: 16px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding-bottom: 15px;
  overflow: hidden;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .fixedTop {
  display: flex;
  align-items: center;
  height: 40px;
  gap: 12px;
  flex-shrink: 0;
  width: calc(100% - 8px);
  height: 42px;
  padding: 0 16px;
  margin-bottom: 10px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .fixedTop input[type=radio] {
  display: none;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .fixedTop input[type=radio] + label {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 6px;
  border-bottom: 2px solid transparent;
  color: var(--FontColorGrey);
  font-size: var(--fs14);
  font-weight: bold;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .fixedTop input[type=radio] + label > span {
  margin-left: 4px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .fixedTop input[type=radio] + label:hover {
  cursor: pointer;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .fixedTop input[type=radio]:checked + label {
  border-color: var(--MainFontColor);
  color: var(--MainFontColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .fixedTop .icoSearch16 {
  margin-right: 4px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .fixedTop .txt {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  font-weight: bold;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea {
  padding: 16px 0;
  overflow: auto;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group {
  margin-bottom: 15px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group > .title {
  padding: 0 20px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group > .title .txt {
  color: #9E9E9E;
  font-size: var(--fs13);
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group .recentList {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 4px 8px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group .recentList > li {
  width: 100%;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 12px;
  border-radius: 4px;
  flex-grow: 0;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group .recentList > li > .item {
  display: inline-flex;
  align-items: center;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group .recentList > li > .item > i {
  margin-right: 4px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group .recentList > li > .item .txt {
  color: var(--MainFontColor);
  font-size: var(--fs14);
}
.modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group .recentList > li:hover, .modalSearchDlg .dlgWrap .modalDlgArea .resultQueryArea .recentArea .group .recentList > li:focus {
  background-color: #f5f5f5;
  cursor: pointer;
}
.modalSearchDlg .dlgWrap .modalDlgArea .iconArea {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.modalSearchDlg .dlgWrap .modalDlgArea .iconArea > .txtInfo {
  margin-top: 16px;
  font-size: var(--fs14);
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.modalSearchDlg .dlgWrap .modalDlgArea .searchLoading {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
}
.modalSearchDlg .dlgWrap .modalDlgArea .searchLoading .spinner {
  display: inline-block;
  width: 70px;
  text-align: center;
  z-index: 1;
}
.modalSearchDlg .dlgWrap .modalDlgArea .searchLoading .spinner > div {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-color: rgba(var(--MainColor), 0.3);
  border-radius: 100%;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.modalSearchDlg .dlgWrap .modalDlgArea .searchLoading .spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.modalSearchDlg .dlgWrap .modalDlgArea .searchLoading .spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea {
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0 8px 8px 8px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li {
  width: 100%;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 12px;
  border-radius: 4px;
  flex-grow: 0;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 20px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a > i {
  margin-right: 4px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a.txtProgramName {
  color: var(--MainFontColor);
  font-size: var(--fs14);
  margin-bottom: 4px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a.txtModule {
  padding-left: 2px;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a.txtModule > .txt:hover {
  text-decoration: underline;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a.prcsItem {
  flex-direction: column;
  align-items: unset;
  width: 100%;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a.prcsItem .prcsTitle {
  display: flex;
  align-items: center;
  height: 20px;
  margin-bottom: 4px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a.prcsItem .prcsTitle > i {
  margin-right: 4px;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a.prcsItem .prcsTitle .txt {
  color: var(--MainFontColor);
  font-size: var(--fs14);
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li > a.prcsItem .subTxt {
  width: 100%;
  padding-top: 3px;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li:hover, .modalSearchDlg .dlgWrap .modalDlgArea .scrollArea .ulResultList > li:focus {
  background-color: #f5f5f5;
  cursor: pointer;
}

.pageProgramQueryArea {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  visibility: collapse;
  z-index: 701;
}
.pageProgramQueryArea.FullPageAreaOpen {
  animation: aniFullPageOpen 0.5s ease 1 forwards;
  animation-delay: 0.3s;
}
.pageProgramQueryArea.FullPageAreaClose {
  animation: aniFullPageClose 0.5s ease 1 forwards;
  animation-delay: 0.3s;
}
@keyframes aniFullPageOpen {
  0% {
    top: -100px;
    left: 0px;
    opacity: 0;
    visibility: visible;
  }
  100% {
    top: 0px;
    left: 0px;
    opacity: 1;
    visibility: visible;
  }
}
@keyframes aniFullPageClose {
  0% {
    opacity: 1;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: collapse;
  }
}
.pageProgramQueryArea .btnClose {
  position: absolute;
  top: 30px;
  right: 30px;
  width: 48px;
  height: 48px;
  padding-left: 3px;
  border-radius: 50%;
  background-color: var(--MainBgColor);
  font-size: var(--fs40);
  color: var(--pageProgramQueryAreaBgColor);
  text-align: left;
  line-height: 48px;
}
.pageProgramQueryArea .btnClose::before, .pageProgramQueryArea .btnClose::after {
  content: "";
  position: absolute;
  top: 24px;
  left: 12px;
  width: 25px;
  height: 2px;
  background-color: var(--MainFontColor);
  transform: rotate(45deg);
}
.pageProgramQueryArea .btnClose::after {
  transform: rotate(-45deg);
}
.pageProgramQueryArea .btnClose:hover, .pageProgramQueryArea .btnClose:focus {
  background-color: var(--MainBgColor);
  transition: all 0.3s ease !important;
  box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 5px !important;
  cursor: pointer;
}
.pageProgramQueryArea .resultListArea {
  max-width: 900px;
  height: 100%;
  margin: 0px auto;
  padding: 80px 50px;
}
.pageProgramQueryArea .resultListArea .inputQeuryArea {
  width: 100%;
  height: 60px;
  border-bottom: 1px solid var(--InvertBgColor);
}
.pageProgramQueryArea .resultListArea .inputQeuryArea .inputText {
  float: left;
  width: calc(100% - 50px);
  padding: 10px 20px;
  border: 0px;
  background-color: transparent;
  font-size: var(--fs22);
  color: var(--MainFontColor);
}
.pageProgramQueryArea .resultListArea .inputQeuryArea .btnQuery {
  float: left;
  width: 50px;
  height: 50px;
  border-radius: 25px;
  border: 0px;
  background-color: var(--MainColor);
  background-position: 3px -494px;
}
.pageProgramQueryArea .resultListArea .inputQeuryArea .btnQuery:hover, .pageProgramQueryArea .resultListArea .inputQeuryArea .btnQuery:focus {
  cursor: pointer;
  background-color: #086a41;
  cursor: pointer;
  transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
}
.pageProgramQueryArea .resultListArea > .scrollArea {
  height: calc(100% - 100px);
  overflow: auto;
}
.pageProgramQueryArea .resultListArea > .scrollArea::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}
.pageProgramQueryArea .resultListArea > .scrollArea::-webkit-scrollbar-track {
  background-color: transparent;
}
.pageProgramQueryArea .resultListArea > .scrollArea::-webkit-scrollbar-track:hover {
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.pageProgramQueryArea .resultListArea > .scrollArea::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.15);
}
.pageProgramQueryArea .resultListArea > .scrollArea::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.25);
}
.pageProgramQueryArea .resultListArea > .scrollArea::-webkit-scrollbar-thumb:active {
  background-color: rgba(0, 0, 0, 0.4);
}
.pageProgramQueryArea .resultListArea > .scrollArea::-webkit-scrollbar-corner {
  background-color: transparent;
}
.pageProgramQueryArea .resultListArea > .scrollArea::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  background-color: transparent;
}
.pageProgramQueryArea .resultListArea > .scrollArea {
  scrollbar-face-color: transparent;
  scrollbar-track-color: transparent;
  scrollbar-3dlight-color: transparent;
  scrollbar-highlight-color: transparent;
  scrollbar-darkshadow-color: transparent;
  scrollbar-shadow-color: transparent;
  scrollbar-arrow-color: transparent;
}
.pageProgramQueryArea .resultListArea .ulResultList {
  width: 100%;
  margin-top: 20px;
}
.pageProgramQueryArea .resultListArea .ulResultList li {
  display: flex;
  align-items: center;
  text-align: left;
}
.pageProgramQueryArea .resultListArea .ulResultList li > a {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 8px;
}
.pageProgramQueryArea .resultListArea .ulResultList li > a:hover, .pageProgramQueryArea .resultListArea .ulResultList li > a:focus {
  background-color: var(--MainColor);
  cursor: pointer;
}
.pageProgramQueryArea .resultListArea .ulResultList li > a:hover .txtProgramName, .pageProgramQueryArea .resultListArea .ulResultList li > a:focus .txtProgramName {
  color: var(--InvertFontColor);
}
.pageProgramQueryArea .resultListArea .ulResultList li > a .txtModule {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor-rgb), 0.7);
  background-color: var(--ulResultListTxtModuleBgColor);
  font-size: var(--fs14);
  padding: 4px 8px;
  margin-right: 5px;
}
.pageProgramQueryArea .resultListArea .ulResultList li > a .txtModule > i {
  display: inline-block;
  width: 18px;
  height: 16px;
  margin-right: 5px;
  background-position: -32px -638px;
  cursor: pointer;
}
.pageProgramQueryArea .resultListArea .ulResultList li > a .txtProgramName {
  font-size: var(--fs15);
  color: var(--MainFontColor);
  word-break: break-all;
}

.RadialBall {
  position: relative;
  width: 36px;
  height: 40px;
  border-radius: 50%;
  background-image: none;
  transition: all 0.1s;
}
.RadialBall .btnRadialBall {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 30px;
  margin-top: 4px;
}
.RadialBall .everListWrap {
  display: none;
  width: 100%;
  height: 100%;
  background-color: transparent;
}
.RadialBall .everListWrap .everList {
  position: absolute;
  top: 43px;
  right: 3px;
  min-width: 170px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 10px;
  background-color: var(--MainBgColor);
  box-shadow: -3px 3px 6px rgba(0, 0, 0, 0.15);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.RadialBall .everListWrap .depth1 {
  padding: 16px 24px 0;
  font-size: var(--fs14);
  font-weight: bold;
  color: rgba(var(--MainFontColor-rgb), 0.4);
}
.RadialBall .everListWrap .depth1 ~ .depth1 {
  border-top: 1px solid #DBDBDB;
}
.RadialBall .everListWrap .depth2 {
  padding: 5px 0 12px;
}
.RadialBall .everListWrap .depth2 li {
  padding: 5px 24px;
  color: var(--MainFontColor);
  font-size: var(--fs14);
  font-weight: bold;
}
.RadialBall .everListWrap .depth2 li:hover {
  color: var(--MainColor);
  cursor: pointer;
}
.RadialBall.open {
  display: block;
  z-index: 120;
}
.RadialBall.open .btnRadialBall:before {
  content: "";
  position: absolute;
  bottom: 3px;
  left: 5px;
  width: 26px;
  height: 2px;
  background-color: var(--MainColor);
}
.RadialBall.open .btnRadialBall > i {
  background-position-x: -131px;
}
.RadialBall.open .everListWrap {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
}
.RadialBall.singleDepth.open .depth1 {
  display: none;
}
.RadialBall.singleDepth.open .depth2 {
  padding: 12px 0;
}

.leftNewMenuArea {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  width: 40px;
  height: 100%;
  overflow: hidden;
  background-color: var(--LeftModuleMenuAreaBgColor);
  z-index: 16;
  transition: width 0.3s linear, background-color 0.3s linear;
}
.leftNewMenuArea .contentWrap {
  background-color: var(--LeftModuleMenuAreaBgColor);
}
.leftNewMenuArea .blindLeft {
  display: none;
  z-index: 101;
}
.leftNewMenuArea .blindRight {
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s linear;
}
.leftNewMenuArea .btnMenuModule {
  position: fixed;
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 17;
  transition: background-color 0.3s linear;
}
.leftNewMenuArea .btnMenuModule .lbModule {
  transition: background-color 0.3s linear;
}
.leftNewMenuArea .moduleArea {
  position: absolute;
  top: 40px;
  left: 0;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 40px;
  height: calc(100% - 40px);
  overflow: hidden;
  z-index: 100;
  transition: width 0.3s linear;
}
.leftNewMenuArea .moduleArea .iconBox {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
}
.leftNewMenuArea .moduleArea > .moduleList {
  width: var(--LeftAreaWidth);
  height: 100%;
  overflow: hidden;
  transition: background-color 0.3s linear;
}
.leftNewMenuArea .moduleArea > .moduleList > ul {
  width: 100%;
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li {
  width: 100%;
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 46px;
  padding: 3px 0;
  overflow: hidden;
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li > a > .iconBox .icoModule {
  background-color: var(--moduleIconColor);
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li > a > .moduleName {
  display: none;
  width: 100%;
  padding: 4px 8px;
  font-size: var(--fs14);
  color: var(--InvertFontColor);
  text-align: center;
  word-break: break-word;
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li > a:hover:not(.selected) {
  background-color: rgba(0, 0, 0, 0.3);
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li + li > a {
  border-top: 1px solid transparent;
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li.selected > a {
  box-shadow: 4px 0 0 var(--moduleIconColorSelected) inset;
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li.selected > a > .iconBox .icoModule {
  background-color: var(--moduleIconColorSelected);
}
.leftNewMenuArea .moduleArea > .moduleList > ul > li.selected > a > .moduleName {
  color: var(--moduleIconColorSelected);
}
.leftNewMenuArea .moduleArea > .bottomArea {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 100%;
  height: 76px;
  padding: 10px 3px 0;
  transition: width 0.3s linear, background-color 0.3s linear;
}
.leftNewMenuArea .moduleArea > .bottomArea .btnArrow {
  display: none;
  padding-bottom: 10px;
}
.leftNewMenuArea .moduleArea > .bottomArea .prcsMenuToggle {
  position: absolute;
  top: 10px;
  left: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 18px;
}
.leftNewMenuArea .moduleArea > .bottomArea .prcsMenuToggle > input[type=checkbox] {
  display: none;
}
.leftNewMenuArea .moduleArea > .bottomArea .prcsMenuToggle > input[type=checkbox]:checked + label {
  background-color: var(--leftMenuPrcsToggleOnBgColor);
}
.leftNewMenuArea .moduleArea > .bottomArea .prcsMenuToggle > input[type=checkbox]:checked + label > .circle {
  left: 15px;
  background-color: var(--leftMenuPrcsToggleOnCircleBgColor);
}
.leftNewMenuArea .moduleArea > .bottomArea .prcsMenuToggle > input[type=checkbox]:checked + label > .circle > i {
  background-color: var(--leftMenuPrcsToggleOnIconColor);
}
.leftNewMenuArea .moduleArea > .bottomArea .prcsMenuToggle > label {
  width: 100%;
  height: 100%;
  border-radius: 30px;
  background-color: var(--leftMenuPrcsToggleBgColor);
}
.leftNewMenuArea .moduleArea > .bottomArea .prcsMenuToggle > label > .circle {
  position: absolute;
  top: 1px;
  left: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: var(--leftMenuPrcsToggleCircleBgColor);
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
  transition: left 0.3s;
}
.leftNewMenuArea .moduleArea.Show {
  width: var(--LeftAreaWidth);
  box-shadow: 3px 0 6px rgba(0, 0, 0, 0.2);
  z-index: 100;
}
.leftNewMenuArea .moduleArea.Show > .moduleList {
  overflow-y: auto;
}
.leftNewMenuArea .moduleArea.Show > .moduleList > ul > li > a .moduleName {
  display: inline-flex;
}
.leftNewMenuArea .moduleArea.Show > .moduleList > ul > li + li > a {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.leftNewMenuArea .moduleArea.Show > .bottomArea {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.leftNewMenuArea .tabArea {
  display: flex;
  flex-direction: column;
  padding-left: 40px;
  width: var(--LeftAreaWidth);
  height: 100%;
  overflow: hidden;
}
.leftNewMenuArea .tabArea > .topBtnArea {
  display: flex;
  justify-content: space-between;
  flex-shrink: 0;
  width: var(--LeftAreaWidth)-40px;
  height: 40px;
  background-color: #263238;
}
.leftNewMenuArea .tabArea > .topBtnArea > .btnLeft, .leftNewMenuArea .tabArea > .topBtnArea .btnRight {
  display: flex;
}
.leftNewMenuArea .tabArea > .topBtnArea > .btnRight {
  padding-right: 10px;
}
.leftNewMenuArea .tabArea > .topBtnArea > .btnRight .btn {
  width: 28px;
}
.leftNewMenuArea .tabArea > .topBtnArea .btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
}
.leftNewMenuArea .tabArea > .topBtnArea .btn.selected > .icoLeftBarMask20 {
  background-color: var(--moduleIconColorSelectedSub);
}
.leftNewMenuArea .tabArea > .topBtnArea .btn.fixed.pin > .icoLeftBarMask16 {
  mask-position: -112px -22px;
}
.leftNewMenuArea .tabArea > .topBtnArea .btn.folder {
  display: none;
  margin-left: auto;
  color: var(--InvertFontColor);
  font-size: var(--fs14);
}
.leftNewMenuArea .tabArea > .topBtnArea .btn.folder .lbNewFolder {
  margin-right: 4px;
}
.leftNewMenuArea .tabArea > .topBtnArea .btn:hover:not(.selected) {
  opacity: 0.5;
}
.leftNewMenuArea .tabArea > .tabContentArea {
  position: relative;
  width: calc(var(--LeftAreaWidth) - 40px);
  height: 100%;
  overflow: hidden;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList {
  display: none;
  flex-direction: column;
  width: calc(var(--LeftAreaWidth) - 40px);
  height: 100%;
  background-color: var(--PgmAreaBgColor);
  overflow: hidden;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: var(--PgmAreaBgColor);
  border-right: 1px solid var(--BorderGreyLight);
  overflow-y: auto;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup {
  display: flex;
  flex-direction: column;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > .depthTitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > .depthTitle > .txtTitle {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 36px;
  padding: 9px 4px 9px 12px;
  color: var(--MainFontColor);
  font-weight: bold;
  font-size: var(--fs13);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > .depthTitle > .btnToggle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > .depthTitle > .btnToggle > .lbArrow {
  display: none;
  transform: rotate(-90deg);
  transition: linear 0.15s;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > .depthTitle:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > .depthTitle:focus {
  cursor: pointer;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > .depthTitle:hover > .txtTitle, .leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > .depthTitle:focus > .txtTitle {
  color: var(--MainColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > ul {
  display: none;
  width: 100%;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > ul > .item {
  width: 100%;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > ul > .item > .txtName {
  display: block;
  width: 100%;
  min-height: 28px;
  padding: 8px 12px 8px 20px;
  background-color: var(--MainBgColor);
  font-size: var(--fs13);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > ul > .item > .txtName > span {
  color: var(--MainFontColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup > ul > .item > .txtName:hover > span {
  color: var(--MainColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup:hover > .depthTitle > .btnToggle > .lbArrow {
  display: flex;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup.Show > .depthTitle > .btnToggle > .lbArrow {
  display: flex;
  transform: unset;
  transition: linear 0.15s;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup.Show > ul {
  display: block;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup.divide {
  border-bottom: 1px solid #C6CFD9;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea > .ulDepth > .depthGroup:last-child.divide {
  border-bottom: 0;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea li p {
  font-size: var(--fs13);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Group > a {
  display: flex;
  align-items: center;
  padding: 8px 10px 8px 12px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Group > a:hover {
  background-color: #E3E7EB;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Group > a > p {
  width: 100%;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Group.Open {
  border-bottom: 1px solid var(--BorderGreyLight);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Group.Close > a > i {
  transform: rotate(-90deg);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Program > a {
  display: flex;
  align-items: center;
  padding: 8px 10px 8px 8px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Program > a .bar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Program > a .bar::before {
  content: "";
  width: 7px;
  height: 1px;
  background-color: var(--MainFontColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .Program > a:hover {
  background-color: #E3E7EB;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .lmnDepth1 > .Group > a {
  flex-direction: row-reverse;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .lmnDepth1 > .Group > a > p {
  font-weight: bold;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .lmnDepth2 > .Group > a, .leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .lmnDepth2 > .Program > a {
  padding-left: 20px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .lmnDepth3 > .Group > a, .leftNewMenuArea .tabArea > .tabContentArea > .contentList > .listArea .lmnDepth3 > .Program > a {
  padding-left: 32px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.menu > .moduleName {
  flex-shrink: 0;
  width: 100%;
  padding: 10px 12px;
  border-bottom: 1px solid #C6CFD9;
  font-size: var(--fs16);
  font-weight: bold;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav {
  display: flex;
  flex-shrink: 0;
  width: 100%;
  border-right: 1px solid var(--BorderGreyLight);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex: 1;
  padding: 10px 16px;
  background-color: #F1F3F5;
  box-shadow: 0 -3px 4px rgba(0, 0, 0, 0.03) inset;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a > .icoLeftBar16, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a > .icoLeftBar16 {
  margin-right: 5px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a > span, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a > span {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs13);
  font-weight: 600;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a:hover > span, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a:hover > span {
  color: var(--MainFontColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a.selected, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a.selected {
  background-color: var(--PgmAreaBgColor);
  box-shadow: none;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a.selected::before, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a.selected::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: var(--MainColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a.selected > .icoLeftBar16.lbPrcs, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a.selected > .icoLeftBar16.lbPrcs {
  background-position-x: -48px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a.selected > .icoLeftBar16.lbPgm, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a.selected > .icoLeftBar16.lbPgm {
  background-position-x: -16px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .tabFav > a.selected > span, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .tabFav > a.selected > span {
  color: var(--MainFontColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  border-right: 1px solid var(--BorderGreyLight);
  background-color: var(--PgmAreaBgColor);
  overflow-y: auto;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList {
  border-bottom: 1px solid #C6CFD9;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus {
  display: flex;
  align-items: center;
  padding: 4px 8px;
  background-color: var(--PgmAreaBgColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Move, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Del, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Move, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Del {
  display: none;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderText {
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 30px;
  background-color: transparent;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  font-weight: bold;
  line-height: 30px;
  cursor: pointer;
  overflow: hidden;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderText > i, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderText > i {
  flex-shrink: 0;
  margin-right: 3px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderText .foldername, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderText .foldername {
  width: 100%;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderInput, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderInput {
  display: none;
  width: 100%;
  height: 28px;
  padding: 5px 5px 5px 3px;
  margin-left: -2px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  font-weight: bold;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 4px;
  transition: all 0.3s;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderInput:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderInput:hover {
  border: 1px solid rgba(var(--MainFontColor-rgb), 0.2);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderInput:focus, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderInput:focus {
  border: 1px solid var(--MainColor);
  background-color: #fff;
  color: var(--MainFontColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Add, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Add {
  background: #1369d1;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Add > span, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Add > span {
  visibility: visible;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Add:hover > .btn, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Add:hover > .btn {
  visibility: collapse;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .menuState, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .menuState {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  width: 22px;
  height: 100%;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .menuState > i, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .menuState > i {
  transform-origin: center center;
  transition: all 0.3s ease-out 0s;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Open > .menuState > i, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Open > .menuState > i {
  transform: rotate(0deg);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Close > .menuState > i, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus.Close > .menuState > i {
  transform: rotate(-90deg);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:focus, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:focus {
  cursor: pointer;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:hover > .folderText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:focus > .folderText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:hover > .folderText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:focus > .folderText {
  color: var(--MainColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:hover > .folderText > .icoLeftBarMask16, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:focus > .folderText > .icoLeftBarMask16, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:hover > .folderText > .icoLeftBarMask16, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus:focus > .folderText > .icoLeftBarMask16 {
  background-color: var(--MainColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul {
  width: 100%;
  padding-bottom: 10px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li {
  display: flex;
  align-items: center;
  height: 34px;
  background-color: transparent;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li:focus, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li:focus {
  cursor: pointer;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li:hover .listText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li:focus .listText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li:hover .listText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li:focus .listText {
  color: var(--MainColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li:hover .pageBookmark, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li:focus .pageBookmark, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li:hover .pageBookmark, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li:focus .pageBookmark {
  opacity: 1;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li.noDrop, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li.noDrop {
  cursor: no-drop;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li.noDrop .listText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li.noDrop .listText {
  cursor: no-drop;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .listText, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .listText {
  display: inline-block;
  width: 100%;
  min-height: 34px;
  padding: 8px 20px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  word-break: break-all;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .listInput, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .listInput {
  display: none;
  width: 100%;
  height: 28px;
  padding: 5px 5px 5px 3px;
  border: 1px solid transparent;
  border-radius: 3px;
  background-color: transparent;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  transition: all 0.3s;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .listInput:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .listInput:hover {
  border: 1px solid rgba(var(--MainFontColor-rgb), 0.2);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .listInput:focus, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .listInput:focus {
  background-color: var(--ControlBgColor);
  border-color: var(--MainColor);
  color: var(--MainFontColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .listInput:focus + .tooltipForEdit, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .listInput:focus + .tooltipForEdit {
  display: flex;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .moveMenu, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .moveMenu {
  display: none;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .pageBookmark, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .pageBookmark {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 30px;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .pageBookmark.Selected > .lbFav, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .pageBookmark.Selected > .lbFav {
  background-position-x: -80px;
  opacity: 1;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .pageBookmark:focus-visible, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .pageBookmark:focus-visible {
  opacity: 1;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li {
  position: relative;
  background: transparent;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li .bookmarkH, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li .bookmarkH {
  display: none;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li .bookmarkH:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li .bookmarkH:focus, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li .bookmarkH:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li .bookmarkH:focus {
  cursor: pointer;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li .tooltipForEdit, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.ulBookmark > li .tooltipForEdit {
  display: none;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ulRecentList li, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.ulRecentList li {
  position: relative;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ulOpenList li, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.ulOpenList li {
  position: relative;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.Drag li, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.Drag li {
  opacity: 0.5;
  transform: scale(0.95);
  transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.Drag li:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.Drag li:focus, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.Drag li:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul.Drag li:focus {
  opacity: 1;
  transform: scale(1);
  transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList .tooltipForEdit, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList .tooltipForEdit {
  position: absolute;
  top: -32px;
  left: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 220px;
  background-color: rgba(var(--MainFontColor-rgb), 0.85);
  padding: 5px 5px;
  border-radius: 4px;
  display: none;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList .tooltipForEdit > p, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList .tooltipForEdit > p {
  color: #fff;
  font-size: var(--fs11);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList .tooltipForEdit::after, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList .tooltipForEdit::after {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 35px;
  width: 1px;
  height: 1px;
  border-top: 4px solid rgba(var(--MainFontColor-rgb), 0.85);
  border-right: 4px solid rgba(var(--MainFontColor-rgb), 0.85);
  border-left: 4px solid transparent;
  border-bottom: 4px solid transparent;
  transform: rotate(135deg);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList.New .tileListTitle .mdfolderPlus, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList.New .tileListTitle .mdfolderPlus {
  background-color: rgba(var(--MainColor), 0);
  animation: newfolder 1 1s ease-in-out;
  transition: all 0.3s;
}
@keyframes newfolder {
  0% {
    background-color: rgba(var(--MainColor), 0);
  }
  50% {
    background-color: rgba(var(--MainColor), 0.2);
  }
  100% {
    background-color: rgba(var(--MainColor), 0);
  }
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .noDropInfo, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .noDropInfo {
  position: absolute;
  bottom: 80px;
  left: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100% - 20px);
  z-index: 1;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .noDropInfo .txtBox, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .noDropInfo .txtBox {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 34px;
  background-color: rgba(51, 51, 51, 0.8);
  border-radius: 5px;
  padding: 8px 15px;
  z-index: 2;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .noDropInfo .txtBox .txt, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .noDropInfo .txtBox .txt {
  width: 100%;
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  text-align: center;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .editBtns, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .editBtns {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  width: 100%;
  padding: 12px;
  border-right: 1px solid var(--BorderGreyLight);
  background-color: var(--PgmAreaBgColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .editBtns > button, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .editBtns > button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  padding: 8px;
  font-size: var(--fs13);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .editBtns > button.btnEdit, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .editBtns > button.btnCancel, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .editBtns > button.btnEdit, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .editBtns > button.btnCancel {
  border: 1px solid var(--MainColor);
  border-radius: 4px;
  color: var(--MainColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .editBtns > button.btnSave, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .editBtns > button.btnSave {
  display: none;
  margin-left: 4px;
  border: 1px solid var(--MainColor);
  border-radius: 4px;
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .editBtns > button.btnCancel, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .editBtns > button.btnCancel {
  display: none;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.favorite > .editBtns > button:hover, .leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .editBtns > button:hover {
  cursor: pointer;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.recent > .mdTileList > .tileList > .tileListTitle ul li .pageBookmark {
  opacity: 1;
}
.leftNewMenuArea .tabArea > .tabContentArea > .contentList.Show {
  display: flex;
}
.leftNewMenuArea.EditMode .blindLeft {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  width: 40px;
  height: 100%;
  background-color: rgba(var(--InvertBgColor-rgb), 0.75);
  z-index: 101;
}
.leftNewMenuArea.EditMode .blindRight {
  display: flex;
  position: fixed;
  top: 0;
  right: 0;
  width: calc(100% - var(--LeftAreaWidth));
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  opacity: 1;
  z-index: 101;
}
.leftNewMenuArea.EditMode .tabArea > .topBtnArea .btn {
  display: none;
}
.leftNewMenuArea.EditMode .tabArea > .topBtnArea .btn.folder {
  display: flex;
  width: unset;
  padding: 0 16px;
}
.leftNewMenuArea.EditMode .tabArea > .topBtnArea .btn.folder > .newFolder {
  margin-right: 4px;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus {
  padding: 5px 8px;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Move, .leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Del {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Move:hover, .leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Move:focus {
  cursor: move;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Del:hover, .leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .btn.Del:focus {
  cursor: pointer;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderText {
  display: none;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .folderInput {
  display: unset;
  width: 100%;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle > .mdfolderPlus > .menuState {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li {
  padding: 6px 8px 6px 16px;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li > .moveMenu {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li > .moveMenu:hover, .leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li > .moveMenu:focus {
  cursor: move;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li > .listText, .leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li .pageBookmark {
  display: none;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li > .listInput {
  display: unset;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul li.liDragging {
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
  opacity: 1;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ui-droppable-hover {
  background-color: #d8dce5;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList > .tileListTitle ul.ulBookmark .bookmarkH {
  display: flex;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList:first-child .tooltipForEdit {
  top: unset;
  bottom: -25px;
  z-index: 1;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .mdTileList > .tileList:first-child .tooltipForEdit::after {
  bottom: unset;
  top: -4px;
  border-top: 4px solid transparent;
  border-right: 4px solid transparent;
  border-left: 4px solid rgba(var(--MainFontColor-rgb), 0.85);
  border-bottom: 4px solid rgba(var(--MainFontColor-rgb), 0.85);
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .editBtns > .btnEdit {
  display: none;
}
.leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .editBtns > .btnCancel, .leftNewMenuArea.EditMode .tabArea > .tabContentArea > .contentList.favorite > .editBtns .btnSave {
  display: flex;
}
.leftNewMenuArea:not(.styleOld).noneAS .moduleArea .bottomArea {
  height: 40px;
}
.leftNewMenuArea:not(.styleOld).noneAS ~ .btnAS {
  display: none;
}
.leftNewMenuArea.Show .contentWrap, .leftNewMenuArea.fixed .contentWrap {
  background-color: var(--LeftModuleMenuAreaHoverBgColor);
}
.leftNewMenuArea.Show .moduleArea > .moduleList, .leftNewMenuArea.fixed .moduleArea > .moduleList {
  background-color: var(--LeftModuleMenuAreaHoverBgColor);
}
.leftNewMenuArea.Show .moduleArea > .moduleList > ul > li.selected > a, .leftNewMenuArea.fixed .moduleArea > .moduleList > ul > li.selected > a {
  background-color: rgba(0, 0, 0, 0.3);
  box-shadow: 4px 0 0 var(--moduleIconColorSelectedSub) inset;
}
.leftNewMenuArea.Show .moduleArea > .moduleList > ul > li.selected > a > .iconBox .icoModule, .leftNewMenuArea.fixed .moduleArea > .moduleList > ul > li.selected > a > .iconBox .icoModule {
  background-color: var(--moduleIconColorSelectedSub);
}
.leftNewMenuArea.Show .moduleArea > .moduleList .iconBox .icoModule, .leftNewMenuArea.fixed .moduleArea > .moduleList .iconBox .icoModule {
  background-color: var(--moduleIconInvertColor);
}
.leftNewMenuArea.Show .moduleArea > .bottomArea, .leftNewMenuArea.fixed .moduleArea > .bottomArea {
  width: var(--LeftAreaWidth);
  background-color: var(--LeftModuleMenuAreaHoverBgColor);
}
.leftNewMenuArea.Show .moduleArea > .bottomArea .prcsMenuToggle > label, .leftNewMenuArea.fixed .moduleArea > .bottomArea .prcsMenuToggle > label {
  background-color: 1px solid rgba(255, 255, 255, 0.1);
}
.leftNewMenuArea.Show .moduleArea > .bottomArea .prcsMenuToggle > label .circle, .leftNewMenuArea.fixed .moduleArea > .bottomArea .prcsMenuToggle > label .circle {
  background-color: 1px solid rgba(255, 255, 255, 0.25);
}
.leftNewMenuArea.Show .moduleArea > .bottomArea .prcsMenuToggle > label .circle > i, .leftNewMenuArea.fixed .moduleArea > .bottomArea .prcsMenuToggle > label .circle > i {
  background-color: #444;
}
.leftNewMenuArea.Show .moduleArea > .bottomArea .prcsMenuToggle input[type=checkbox]:checked + label .circle, .leftNewMenuArea.fixed .moduleArea > .bottomArea .prcsMenuToggle input[type=checkbox]:checked + label .circle {
  background-color: var(--MainBgColor);
}
.leftNewMenuArea.Show .moduleArea > .bottomArea .prcsMenuToggle input[type=checkbox]:checked + label .circle > i, .leftNewMenuArea.fixed .moduleArea > .bottomArea .prcsMenuToggle input[type=checkbox]:checked + label .circle > i {
  background-color: var(--MainColor);
}
.leftNewMenuArea.Show .btnMenuModule, .leftNewMenuArea.fixed .btnMenuModule {
  background-color: var(--LeftModuleMenuAreaHoverBgColor);
}
.leftNewMenuArea.Show .btnMenuModule .lbModule, .leftNewMenuArea.fixed .btnMenuModule .lbModule {
  background-color: var(--InvertFontColor);
}
.leftNewMenuArea.Show .btnMenuModule.selected .lbModule, .leftNewMenuArea.fixed .btnMenuModule.selected .lbModule {
  background-color: var(--MainColor);
}
.leftNewMenuArea.Show {
  width: var(--LeftAreaWidth);
  z-index: 17;
  transition-delay: 0.35s;
}
.leftNewMenuArea.fixed {
  width: calc(var(--LeftAreaWidth) + 8px);
  background-color: var(--LeftModuleMenuAreaBgColor);
  box-shadow: unset;
}
.leftNewMenuArea.fixed .moduleArea.Show {
  width: var(--LeftAreaWidth);
  transition-delay: 0.35s;
}
.leftNewMenuArea.styleOld {
  width: 70px;
  box-shadow: none;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea {
  width: 70px;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .moduleList {
  width: 100%;
  overflow-y: auto;
  -ms-overflow-style: none;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .moduleList::-webkit-scrollbar {
  display: none;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .moduleList > ul > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 10px 0;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .moduleList > ul > li > a > .iconBox {
  width: 24px;
  height: 24px;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .moduleList > ul > li > a > .moduleName {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs13);
  color: var(--moduleIconColor);
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .moduleList > ul > li > a:hover {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .moduleList > ul > li.selected > a > .moduleName {
  color: var(--moduleNameColorSelected);
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .bottomArea {
  align-items: center;
  width: 70px;
  height: 106px;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .bottomArea .btnArrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .bottomArea .btnArrow > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 16px;
  border: 1px solid var(--leftMenuBtnArrowBorderColor);
  border-radius: 4px;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .bottomArea .btnArrow > a.btnMoveBottom > .icoLeftBarMask12 {
  transform: rotate(180deg);
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .bottomArea .btnArrow > a:hover {
  cursor: pointer;
}
.leftNewMenuArea.styleOld .contentWrap .moduleArea > .bottomArea .prcsMenuToggle {
  position: relative;
  top: unset;
  left: unset;
}
.leftNewMenuArea.styleOld .contentWrap .btnMenuModule {
  width: 70px;
}
.leftNewMenuArea.styleOld .contentWrap .tabArea {
  width: var(--LeftAreaWidth)30px;
  padding-left: 70px;
}
.leftNewMenuArea.styleOld ~ .btnAS {
  left: 20px;
  bottom: 12px;
}
.leftNewMenuArea.styleOld ~ .blindLayer > .listAs {
  left: 55px;
}
.leftNewMenuArea.styleOld.EditMode .contentWrap > .blindLeft {
  width: 70px;
}
.leftNewMenuArea.styleOld.EditMode .contentWrap > .blindRight {
  width: calc(100% - var(--LeftAreaWidth) - 30px);
}
.leftNewMenuArea.styleOld.Show {
  width: calc(var(--LeftAreaWidth) + 30px);
  transition-delay: unset;
}
.leftNewMenuArea.styleOld.Show .contentWrap > .moduleArea > .bottomArea {
  border-top: none;
}
.leftNewMenuArea.styleOld.Show .contentWrap > .blindRight {
  display: flex;
  position: fixed;
  top: 0;
  right: 0;
  width: calc(100% - var(--LeftAreaWidth) - 30px);
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  opacity: 1;
  z-index: 101;
  transition-delay: 0.1s;
}
.leftNewMenuArea.styleOld.fixed {
  width: calc(var(--LeftAreaWidth) + 30px + 8px);
}
.leftNewMenuArea.styleOld.Show .contentWrap .moduleArea > .moduleList > ul > li > a > .moduleName, .leftNewMenuArea.styleOld.fixed .contentWrap .moduleArea > .moduleList > ul > li > a > .moduleName {
  color: var(--InvertFontColor);
}
.leftNewMenuArea.styleOld.Show .contentWrap .moduleArea > .moduleList > ul > li > a:hover, .leftNewMenuArea.styleOld.fixed .contentWrap .moduleArea > .moduleList > ul > li > a:hover {
  background-color: rgba(0, 0, 0, 0.3);
}
.leftNewMenuArea.styleOld.Show .contentWrap .moduleArea > .moduleList > ul > li.selected > a > .moduleName, .leftNewMenuArea.styleOld.fixed .contentWrap .moduleArea > .moduleList > ul > li.selected > a > .moduleName {
  color: var(--moduleIconColorSelectedSub);
}
.leftNewMenuArea.styleOld.Show .contentWrap .moduleArea > .bottomArea, .leftNewMenuArea.styleOld.fixed .contentWrap .moduleArea > .bottomArea {
  align-items: center;
}
.leftNewMenuArea.styleOld.Show .contentWrap .moduleArea > .bottomArea .btnArrow > a, .leftNewMenuArea.styleOld.fixed .contentWrap .moduleArea > .bottomArea .btnArrow > a {
  border-color: rgba(var(--InvertFontColor-rgb), 0.25);
}
.leftNewMenuArea.styleOld.Show .contentWrap .moduleArea > .bottomArea .btnArrow > a > .lbMoveArrow, .leftNewMenuArea.styleOld.fixed .contentWrap .moduleArea > .bottomArea .btnArrow > a > .lbMoveArrow {
  background-color: rgba(var(--InvertFontColor-rgb), 0.6);
}
.leftNewMenuArea.styleOld.noneAS .contentWrap > .moduleArea .bottomArea {
  height: 40px;
}
.leftNewMenuArea.styleOld.noneAS ~ .btnAS {
  display: none;
}

.btnAS {
  position: fixed;
  bottom: 7px;
  left: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: var(--btnASColor);
  z-index: 999999;
}
.btnAS:hover {
  background-color: var(--btnAsColorHover);
}

.blindLayer {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999999;
}
.blindLayer > .listAs {
  position: absolute;
  bottom: 20px;
  left: 40px;
  display: flex;
  flex-direction: column;
  border-radius: 6px;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.16);
  overflow: hidden;
}
.blindLayer > .listAs > a {
  display: flex;
  align-items: center;
  padding: 8px 10px;
  background-color: var(--MainBgColor);
}
.blindLayer > .listAs > a > span {
  margin-left: 4px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
}
.blindLayer > .listAs > a:hover {
  background-color: #F0F3F6;
}
.blindLayer > .listAs > a + a {
  border-top: 1px solid #CFD8DC;
}
.blindLayer.Show {
  display: block;
  z-index: 10001;
}

.wrap.homeMode .CenterArea {
  background-color: var(--homeModeTopBarBgColor);
}
.wrap.homeMode .CenterArea .CenterHeaderArea {
  background-color: var(--homeModeTopBarBgColor);
}
.wrap.homeMode .CenterArea .CenterHeaderArea .btn:hover .tabWrap, .wrap.homeMode .CenterArea .CenterHeaderArea .btn:focus .tabWrap {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.wrap.homeMode .CenterArea .homeArea {
  height: calc(100% - 40px);
  padding: 0;
  border-radius: 32px 0 0 0;
  overflow: hidden;
}
.wrap.homeMode .leftNewMenuArea .contentWrap {
  background-color: var(--homeModeLeftMenuBgColor);
}
.wrap.homeMode .leftNewMenuArea.Show .contentWrap, .wrap.homeMode .leftNewMenuArea.fixed .contentWrap {
  background-color: var(--LeftModuleMenuAreaHoverBgColor);
}
.wrap.homeMode .leftNewMenuArea.fixed {
  background-color: var(--homeModeTopBarBgColor);
}

.pgmHomeWrap {
  display: flex;
  width: 100%;
  height: calc(100% - 40px);
  background-color: var(--PgmAreaBgColor);
  border-top-left-radius: 8px;
}
.pgmHomeWrap .pgmHomeArea {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  transition: width linear 0.3s;
}
.pgmHomeWrap .pgmHomeArea .pgmHomeTitleArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  padding: 0 16px;
  border-bottom: 1px solid var(--BorderGrey);
}
.pgmHomeWrap .pgmHomeArea .pgmHomeTitleArea > .title {
  display: flex;
  align-items: center;
}
.pgmHomeWrap .pgmHomeArea .pgmHomeTitleArea > .title > .txt {
  margin-left: 8px;
  font-size: var(--fs16);
  font-weight: 700;
}
.pgmHomeWrap .pgmHomeArea .pgmList {
  width: 100%;
  padding: 16px;
  overflow-y: auto;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .titleArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding-bottom: 10px;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .titleArea > i {
  margin-right: 4px;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .titleArea > .txt {
  font-size: var(--fs15);
  font-weight: 600;
  color: #424242;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea {
  width: 100%;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-top: -5px;
  margin-left: -5px;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li {
  position: relative;
  display: flex;
  align-items: center;
  margin: 5px;
  padding: 8px;
  width: 250px;
  height: 60px;
  border: 1px solid #E3E7EB;
  border-radius: 8px;
  background-color: var(--MainBgColor);
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li .iconBox {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  margin-right: 8px;
  border-radius: 10px;
  background-color: #F5F8FD;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li .txtBox {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  flex-shrink: 0;
  border-radius: 4px;
  background-color: #F5F8FD;
  font-size: var(--fs14);
  font-weight: 600;
  color: #424242;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li .pgmInfo {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 10px;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li .pgmInfo .pgmName {
  display: block;
  width: 100%;
  color: #424242;
  font-size: var(--fs14);
  max-width: 100%;
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li .btnFav {
  position: absolute;
  top: 6px;
  right: 6px;
  display: none;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li .btnFav:hover {
  background-color: rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li:hover {
  border-color: #B0BEC5;
  cursor: pointer;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li:hover .pgmInfo {
  width: calc(100% - 70px);
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea > ul > li:hover .btnFav {
  display: flex;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea.noData > ul {
  display: none;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea.noData .noDataArea {
  display: flex;
  align-items: center;
  justify-content: center;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap .listArea.noData .noDataArea .iconBox {
  width: 44px;
  height: 44px;
}
.pgmHomeWrap .pgmHomeArea .pgmList .listWrap + .listWrap {
  margin-top: 30px;
}
.pgmHomeWrap .pgmHomeArea .pgmList .noDataArea {
  display: none;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.pgmHomeWrap .pgmHomeArea .pgmList .noDataArea .iconBox {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  margin-bottom: 8px;
  border-radius: 10px;
  background-color: #E6EDEF;
}
.pgmHomeWrap .pgmHomeArea .pgmList .noDataArea .txt {
  color: #757575;
  font-size: var(--fs13);
}

.fullKbotArea {
  position: absolute;
  top: 40px;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: calc(100% - 40px);
  padding: 24px;
  border-top-left-radius: 30px;
  background-color: rgba(0, 0, 0, 0.7);
  overflow: hidden;
  z-index: 11;
}
.fullKbotArea .kbotWrap {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  background-color: var(--MainBgColor);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  overflow: hidden;
}
.fullKbotArea .kbotWrap .btnClose {
  right: 1rem;
}

.rightKbotArea {
  position: absolute;
  top: 40px;
  right: 0;
  width: 400px;
  height: calc(100% - 40px);
  padding: 0 0 0 8px;
  overflow: hidden;
}

.kbotWrap {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
  border-radius: 8px 0 0 0;
  overflow: hidden;
}
.kbotWrap .btnClose {
  position: absolute;
  top: 12px;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  z-index: 999;
  cursor: pointer;
}
.kbotWrap .iframeKbot {
  width: 100%;
  height: 100%;
}
.kbotWrap .iframeKbot iframe {
  border: 0;
}

.moveDataWrap {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 22;
  cursor: url("data:image/svg+xml,%3Csvg%20width%3D%2219%22%20height%3D%2221%22%20viewBox%3D%220%200%2019%2021%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M10.2717%2019.492L9.7967%2018.6693C9.47328%2018.1094%208.97761%2017.669%208.38355%2017.4136L2.75717%2014.9925C2.1087%2014.7133%201.46449%2014.2735%201.38297%2013.5723C1.24769%2012.438%202.01%2011.2103%204.14714%2011.794L6.38878%2012.4766L1.17028%203.43789C0.194907%201.6385%202.99536%20-0.0949661%204.19097%201.69389L7.16497%206.84501C8.35242%205.93773%2014.9198%203.35273%2016.2525%207.69512L16.4443%208.31532C16.7259%209.21506%2017.0194%2010.9393%2016.9178%2012.1054C16.8109%2013.3183%2017.521%2014.0561%2018.0625%2014.994%22%20fill%3D%22%23EAF4FF%22/%3E%3Cpath%20d%3D%22M10.2717%2019.492L9.7967%2018.6693C9.47328%2018.1094%208.97761%2017.669%208.38355%2017.4136L2.75717%2014.9925C2.1087%2014.7133%201.46449%2014.2735%201.38297%2013.5723C1.24769%2012.438%202.01%2011.2103%204.14714%2011.794L6.38878%2012.4766L1.17028%203.43789C0.194907%201.6385%202.99536%20-0.094966%204.19097%201.69389L7.16497%206.84501C8.35242%205.93773%2014.9198%203.35273%2016.2525%207.69512L16.4443%208.31532C16.7259%209.21506%2017.0194%2010.9393%2016.9178%2012.1054C16.8109%2013.3183%2017.521%2014.0561%2018.0625%2014.994%22%20stroke%3D%22%23007BFF%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E") 0 0, auto;
}
.moveDataWrap .movingInfo {
  display: flex;
  flex-direction: column;
  position: relative;
  width: fit-content;
  margin-left: 20px;
  padding: 10px 16px;
  border-radius: 6px;
  background-color: var(--MainBgColor);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
}
.moveDataWrap .movingInfo > .txt {
  font-size: var(--fs13);
  font-weight: 500;
}
.moveDataWrap .movingInfo > .dataBox {
  display: flex;
  align-items: center;
  margin-top: 8px;
}
.moveDataWrap .movingInfo > .dataBox > i {
  margin-right: 4px;
}
.moveDataWrap .movingInfo > .dataBox > .value {
  color: var(--FontColorGrey1);
  font-size: var(--fs13);
  font-weight: 500;
}
.moveDataWrap .btnCancel {
  position: absolute;
  bottom: 50px;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 12px 10px 16px;
  border-radius: 50px;
  background-color: #343739;
  color: var(--InvertFontColor);
  font-size: var(--fs14);
  font-weight: bold;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
  transform: translateX(-50%);
}
.moveDataWrap .btnCancel > i {
  margin-left: 10px;
}
.moveDataWrap .btnCancel:hover {
  background-color: #1c1d1e;
  cursor: pointer;
}

.loginWrap {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  min-width: 1024px;
  background-color: var(--MainBgColor);
  overflow: auto;
}
.loginWrap .loginInputArea {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 450px;
  height: 100%;
  padding: 0 60px;
  background: #fff;
  overflow-y: hidden;
  overflow: visible;
}
.loginWrap .loginInputArea .loginContent {
  width: 100%;
}
.loginWrap .loginInputArea .loginContent .loginHeader {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 16px;
  background-color: transparent;
}
.loginWrap .loginInputArea .loginContent .loginHeader .comboLanguage {
  position: relative;
}
.loginWrap .loginInputArea .loginContent .loginHeader .comboLanguage > .txtSelectedLanguage {
  display: inline-flex;
  align-items: center;
  height: 100%;
  font-size: var(--fs13);
}
.loginWrap .loginInputArea .loginContent .loginHeader .comboLanguage > .txtSelectedLanguage > .txt {
  padding: 0 2px;
  font-size: var(--fs13);
  color: #616161;
}
.loginWrap .loginInputArea .loginContent .loginHeader .comboLanguage > .txtSelectedLanguage:after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin: 2px 0 0 2px;
  border-top: 7px solid #616161;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
}
.loginWrap .loginInputArea .loginContent .loginHeader .comboLanguage > .txtSelectedLanguage:hover, .loginWrap .loginInputArea .loginContent .loginHeader .comboLanguage > .txtSelectedLanguage:focus {
  cursor: pointer;
}
.loginWrap .loginInputArea .loginContent .loginHeader .ulLoginLanguage {
  display: none;
  position: absolute;
  top: 24px;
  left: 0;
  padding: 2px 0;
  border: 1px solid #CFD8DC;
  border-radius: 4px;
  background-color: #fff;
  z-index: 1;
}
.loginWrap .loginInputArea .loginContent .loginHeader .ulLoginLanguage > li {
  height: 28px;
  padding: 2px 4px;
}
.loginWrap .loginInputArea .loginContent .loginHeader .ulLoginLanguage > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0px 8px;
  border-radius: 2px;
  font-size: var(--fs13);
  color: #424242;
}
.loginWrap .loginInputArea .loginContent .loginHeader .ulLoginLanguage > li > a.selected, .loginWrap .loginInputArea .loginContent .loginHeader .ulLoginLanguage > li > a:hover {
  background-color: #F0F3F6;
}
.loginWrap .loginInputArea .loginContent .loginBox {
  width: 100%;
  height: auto;
}
.loginWrap .loginInputArea .loginContent .loginBox h1 {
  margin: 0 0 20px 0;
  text-align: center;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox {
  position: relative;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .selectCompany {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 40px;
  padding: 5px 12px;
  border: 1px solid #CFD8DC;
  border-top: none;
  border-radius: 0 0 4px 4px;
  background-color: var(--MainBgColor);
  cursor: pointer;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .selectCompany > a {
  width: 100%;
  font-size: var(--fs14);
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .selectCompany > a:hover {
  color: inherit;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .selectCompany .arrow {
  display: inline-block;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  margin-left: 8px;
  border-top: 1.5px solid var(--MainFontColor);
  border-left: 1.5px solid var(--MainFontColor);
  border-right: 0;
  border-bottom: 0;
  transform: rotate(-135deg);
  cursor: pointer;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .selectCompany:hover {
  background-color: #F5F7F9;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  max-height: 400px;
  padding-bottom: 5px;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: 2px 3px 10px rgba(0, 0, 0, 0.15);
  border: 1px solid #E9E9E9;
  z-index: 999;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany .txtTitle {
  padding: 10px;
  color: #999;
  font-size: var(--fs11);
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany .scrollArea {
  max-height: 180px;
  overflow-x: hidden;
  overflow-y: auto;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany ul.corpSelect {
  position: relative;
  display: block;
  overflow: hidden;
  overflow-x: auto;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany ul.corpSelect li {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 35px;
  padding: 0 10px;
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany ul.corpSelect li > a:hover {
  color: inherit;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany ul.corpSelect li:hover, .loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany ul.corpSelect li:focus {
  background-color: #f6f7f9;
}
.loginWrap .loginInputArea .loginContent .loginBox .companyBox .divComboCompany ul.corpSelect li.selected {
  background-color: #f6f7f9;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox {
  position: relative;
  display: flex;
  width: 100%;
  height: 50px;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox.errorBox {
  border: 1px solid #ff0000;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox ~ .inputBox {
  margin-top: 10px;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input {
  position: relative;
  width: 100%;
  height: 50px;
  padding: 10px 12px;
  border: 1px solid #CFD8DC;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  font-size: var(--fs15);
  color: #333;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input::placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 13px;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input::-webkit-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 13px;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input::-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 13px;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input:-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 13px;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input:focus {
  border-color: #90A4AE;
  background-color: #F7F9FB;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input:valid {
  padding: 16px 12px 0;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input:valid + label {
  top: 8px;
  height: auto;
  opacity: 1;
  z-index: unset;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText input.showCompany {
  border-radius: 4px 4px 0 0;
}
.loginWrap .loginInputArea .loginContent .loginBox .inputBox > .inputLoginText label {
  position: absolute;
  top: 20px;
  left: 12px;
  display: flex;
  height: 100%;
  font-size: var(--fs13);
  color: #9E9E9E;
  z-index: -1;
  transition: 0.3s;
}
.loginWrap .loginInputArea .loginContent .loginBox .pwRuleInfo {
  margin-top: 15px;
}
.loginWrap .loginInputArea .loginContent .loginBox .pwRuleInfo .txtAccountMsg {
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.loginWrap .loginInputArea .loginContent .loginBox .pwRuleInfo::before {
  content: "!";
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-right: 7px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #CCCCCC;
  font-size: var(--fs11);
  color: #fff;
  margin-top: 2px;
}
.loginWrap .loginInputArea .loginContent .loginBox .loginErrorTxt {
  font-size: var(--fs13);
  color: var(--loginErrorTxtFontColor);
  margin: 10px 0 0 0;
}
.loginWrap .loginInputArea .loginContent .loginBox .devMode {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
  text-align: left;
  margin-top: 15px;
  padding: 15px 0;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.loginWrap .loginInputArea .loginContent .loginBox .devMode > p {
  display: inline-block;
  width: 49%;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.loginWrap .loginInputArea .loginContent .loginBox .btnLoginWrap {
  margin-top: 20px;
}
.loginWrap .loginInputArea .loginContent .loginBox .btnLoginWrap .btnLogin {
  width: 100%;
  height: 50px;
  padding: 0 20px;
  border: 0;
  border-radius: 4px;
  background-color: var(--MainColor);
  color: #fff;
  font-size: var(--fs16);
  text-align: center;
  cursor: pointer;
}
.loginWrap .loginInputArea .loginContent .loginBox .btnLoginWrap .btnLogin:hover, .loginWrap .loginInputArea .loginContent .loginBox .btnLoginWrap .btnLogin:focus {
  background-color: var(--ButtonDefaultColorHover);
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap {
  display: flex;
  align-items: flex-start;
  margin-top: 15px;
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .left .checkItem {
  margin-bottom: 10px;
  font-size: var(--fs14);
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .left .checkItem > .checkbox {
  display: flex;
  align-items: center;
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .left .checkItem > .checkbox > input[type=checkbox] {
  display: none;
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .left .checkItem > .checkbox > input[type=checkbox]:checked ~ label::before {
  border-color: var(--MainColor);
  background-color: var(--MainColor);
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .left .checkItem > .checkbox > input[type=checkbox]:checked ~ label::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 6px;
  width: 4px;
  height: 8px;
  border-width: 0 2px 2px 0;
  border-style: solid;
  border-color: var(--InvertFontColor);
  transform: rotate(45deg);
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .left .checkItem > .checkbox:focus-within {
  outline: 1px solid var(--MainFontColor);
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .left .checkItem > .checkbox > label {
  position: relative;
  display: flex;
  align-items: center;
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .left .checkItem > .checkbox > label::before {
  content: "";
  width: 16px;
  height: 16px;
  margin-right: 5px;
  border: 1px solid #CFD8DC;
  border-radius: 2px;
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .right {
  margin-left: auto;
}
.loginWrap .loginInputArea .loginContent .loginBox .featWrap .right .pwBtn {
  display: block;
  font-size: var(--fs14);
  color: #333;
  text-decoration: underline;
  cursor: pointer;
}
.loginWrap .loginInputArea .loginContent .loginBox .btnOIDCLoginWrap {
  position: relative;
  margin-top: 30px;
}
.loginWrap .loginInputArea .loginContent .loginBox .btnOIDCLoginWrap .orDvLine {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
  font-size: var(--fs14);
}
.loginWrap .loginInputArea .loginContent .loginBox .btnOIDCLoginWrap .btnOIDCLogin {
  width: 100%;
  height: 50px;
  padding: 0 20px;
  border: 0;
  border-radius: 4px;
  background-color: var(--SubColor2);
  color: #fff;
  font-size: var(--fs17);
  text-align: center;
  cursor: pointer;
}
.loginWrap .loginInputArea .loginContent .loginBox .btnOIDCLoginWrap .btnOIDCLogin:hover, .loginWrap .loginInputArea .loginContent .loginBox .btnOIDCLoginWrap .btnOIDCLogin:focus {
  background-color: #105cce;
  cursor: pointer;
}
.loginWrap .loginInputArea .loginContent .loginFooter {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  background-color: transparent;
}
.loginWrap .loginInputArea .loginContent .loginFooter .btnPersonal {
  display: none;
  padding: 4px 10px;
  margin-right: 10px;
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 2px;
}
.loginWrap .loginInputArea .loginContent .loginFooter .btnPersonal:hover {
  cursor: pointer;
  background-color: #f1f1f1;
}
.loginWrap .loginInputArea .loginContent .loginFooter .footerBox {
  position: relative;
  display: flex;
  justify-content: center;
  margin: 20px 50px;
}
.loginWrap .loginInputArea .loginContent .loginFooter .footerBox .logoYLW {
  position: absolute;
  bottom: 0;
  left: 0;
}
.loginWrap .loginInputArea .loginContent .loginFooter .webAccess {
  display: inline-flex;
  align-items: center;
  padding: 0 4px 0 8px;
  border-left: 1px solid var(--BorderGreyLight);
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
}
.loginWrap .loginInputArea .loginContent .loginFooter .webAccess > a {
  color: var(--FontColorGrey1);
}
.loginWrap .loginInputArea .loginContent .loginFooter .webAccess > a:hover {
  cursor: pointer;
  text-decoration: underline;
  color: var(--MainFontColor);
}
.loginWrap .loginInputArea .loginContent .loginFooter .webAccess .iconHelp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin-left: 4px;
  width: 18px;
  height: 18px;
  background-color: var(--btnIconHelpColor);
  border-radius: 50%;
}
.loginWrap .loginInputArea .loginContent .loginFooter .webAccess .iconHelp::before {
  content: "?";
}
.loginWrap .loginInputArea .loginContent .loginFooter .webAccess .iconHelp:hover, .loginWrap .loginInputArea .loginContent .loginFooter .webAccess .iconHelp:focus {
  text-decoration: none;
  background-color: var(--btnIconHelpColorHover);
}
.loginWrap .loginInputArea .loginContent .loginFooter .btnAdmin {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  padding: 0 8px 0 12px;
  border: 1px solid #CFD8DC;
  border-radius: 20px;
  font-size: var(--fs13);
  color: #757575;
  cursor: pointer;
}
.loginWrap .loginInputArea .loginContent .loginFooter .btnAdmin > i {
  margin-left: 2px;
}
.loginWrap .loginBg {
  position: absolute;
  top: 8px;
  left: 450px;
  display: flex;
  width: calc(100% - 458px);
  height: calc(100% - 16px);
  border-radius: 10px;
  overflow: hidden;
}
.loginWrap .loginBg .bgImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.loginWrap .loginBg .bgTitle {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 70px;
  font-size: var(--fs28);
  font-weight: bold;
}
.loginWrap .loginBg.FitBgImg .bgImg {
  object-fit: contain;
}
.loginWrap .loginBg.FitBgImg .bgTitle {
  top: 50%;
  transform: translateY(-50%);
}
.loginWrap.noBgImg {
  justify-content: center;
}
.loginWrap.noBgImg .loginBg {
  display: none;
}

.loginErrorTxt {
  margin: 10px 0 20px 0;
  font-size: var(--fs13);
  color: var(--errorColor);
  text-align: center;
}

.passwordWrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  background-color: var(--PgmAreaBgColor);
}
.passwordWrap .wrapper {
  width: 100%;
  min-width: 100%;
  max-height: 100%;
  overflow-y: auto;
}
.passwordWrap .wrapper .passwordArea {
  padding: 50px 0;
}
.passwordWrap .wrapper .passwordArea .iconPw {
  width: 150px;
  height: 150px;
  text-align: center;
  margin: 0 auto;
  margin-bottom: 20px;
}
.passwordWrap .wrapper .passwordArea .iconPw.forgot {
  background-position: -6px -6px;
}
.passwordWrap .wrapper .passwordArea .iconPw.email {
  background-position: -4px -173px;
}
.passwordWrap .wrapper .passwordArea .iconPw.newSet {
  background-position: -4px -336px;
}
.passwordWrap .wrapper .passwordArea .iconPw.newSetOk {
  background-position: -4px -505px;
}
.passwordWrap .wrapper .passwordArea .iconPw.errorPage {
  background-position: -4px -677px;
}
.passwordWrap .wrapper .passwordArea .iconPw.certification {
  background-position: -6px -843px;
}
.passwordWrap .wrapper .passwordArea .titleLine {
  border: 2px solid #363636;
  width: 50px;
  margin: 20px auto 20px auto;
  display: none;
}
.passwordWrap .wrapper .passwordArea .pwTitle {
  font-size: var(--fs27);
  color: var(--MainFontColor);
  font-weight: lighter;
  text-align: center;
  margin: 0;
}
.passwordWrap .wrapper .passwordArea .errorPageMsg {
  font-size: var(--fs15);
  color: var(--FontColorGrey1);
  font-weight: lighter;
  text-align: center;
  margin-top: 30px;
}
.passwordWrap .wrapper .passwordArea > .pwTxt {
  text-align: center;
  color: var(--MainFontColor);
}
.passwordWrap .wrapper .passwordArea .errorBtnArea > form {
  text-align: center;
}
.passwordWrap .wrapper .passwordArea .errorBtnArea .errorBtn {
  display: inline-block;
  width: 250px;
  height: 50px;
  color: #fff;
  background-color: #ff5d5d;
  border: 0px;
  margin-top: 20px;
  cursor: pointer;
  font-size: var(--fs15);
  text-align: center;
  padding: 14px;
}
.passwordWrap .wrapper .passwordArea form .pwTxt {
  font-size: var(--fs16);
  color: #666;
  font-weight: lighter;
  text-align: center;
  margin-top: 10px;
}
.passwordWrap .wrapper .passwordArea form .pwTxt input[type=checkbox] {
  margin-right: 5px;
}
.passwordWrap .wrapper .passwordArea form .pwInputBox {
  width: 320px;
  margin: 30px auto;
}
.passwordWrap .wrapper .passwordArea form .pwInputBox .inputTxt input {
  width: 320px;
  height: 50px;
  border: 1px solid #ccc;
  font-size: var(--fs15);
  color: var(--MainFontColor);
  background-color: var(--ControlBgColor);
  padding: 3px 10px 5px 10px;
}
.passwordWrap .wrapper .passwordArea form .pwInputBox .inputTxt input::placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 11px;
}
.passwordWrap .wrapper .passwordArea form .pwInputBox .inputTxt input::-webkit-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 11px;
}
.passwordWrap .wrapper .passwordArea form .pwInputBox .inputTxt input::-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 11px;
}
.passwordWrap .wrapper .passwordArea form .pwInputBox .inputTxt input:-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 11px;
}
.passwordWrap .wrapper .passwordArea form .pwInputTitle {
  display: block;
  font-size: var(--fs13);
  color: var(--MainFontColor);
  margin-bottom: 5px;
}
.passwordWrap .wrapper .passwordArea form .pwInfo {
  font-size: var(--fs14);
  color: #3f51b5;
  display: block;
  margin-bottom: 5px;
}
.passwordWrap .wrapper .passwordArea form .txtPwInputInfo {
  position: relative;
  display: block;
  margin: 0 auto;
  width: 320px;
  padding: 8px 0 0px 18px;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
  text-align: left;
}
.passwordWrap .wrapper .passwordArea form .txtPwInputInfo:before {
  content: "!";
  position: absolute;
  left: 0px;
  top: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 13px;
  height: 13px;
  padding: 0;
  border-radius: 50%;
  background-color: #e7e7e7;
  text-align: center;
}
.passwordWrap .wrapper .passwordArea form .txtPwInputForgot {
  position: absolute;
  top: 0;
  right: 0;
  font-size: var(--fs13);
  color: var(--MainColor);
}
.passwordWrap .wrapper .passwordArea form .txtPwInputForgot:hover {
  text-decoration: underline;
}
.passwordWrap .wrapper .passwordArea form .pwReset {
  position: relative;
  width: 320px;
  margin: 10px auto 15px auto;
}
.passwordWrap .wrapper .passwordArea form .pwReset:first-child {
  width: 320px;
  margin-top: 20px;
  font-size: var(--fs15);
  color: #555;
}
.passwordWrap .wrapper .passwordArea form .pwReset > .inputTxt input {
  width: 320px;
  height: 36px;
  font-size: var(--fs13);
  border: 1px solid #ccc;
  padding: 3px 10px 5px 10px;
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
}
.passwordWrap .wrapper .passwordArea form .pwReset > .inputTxt input::placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 11px;
}
.passwordWrap .wrapper .passwordArea form .pwReset > .inputTxt input::-webkit-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 11px;
}
.passwordWrap .wrapper .passwordArea form .pwReset > .inputTxt input::-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 11px;
}
.passwordWrap .wrapper .passwordArea form .pwReset > .inputTxt input:-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 11px;
}
.passwordWrap .wrapper .passwordArea form .pwReset > .inputTxt input:read-only, .passwordWrap .wrapper .passwordArea form .pwReset > .inputTxt input:disabled {
  background-color: #e7eaeb !important;
  border: 0;
  color: #777;
}
.passwordWrap .wrapper .passwordArea form .pwReset .timeRemain {
  position: absolute;
  top: 0;
  right: 0;
  font-size: var(--fs14);
}
.passwordWrap .wrapper .passwordArea form .pwBtnArea {
  width: 320px;
  margin: 0 auto;
}
.passwordWrap .wrapper .passwordArea form .passwordBtn {
  width: 100%;
  height: 45px;
  font-size: var(--fs17);
  color: #fff;
  background-color: var(--MainColor);
  border: 0px;
  border-radius: 5px;
  margin-top: 20px;
  cursor: pointer;
}
.passwordWrap .wrapper .passwordArea form .passwordBtn:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.passwordWrap .wrapper .passwordArea form .passwordBtn:active {
  background-color: var(--ButtonDefaultColorActive);
}
.passwordWrap .wrapper .passwordArea > .pwBtnArea {
  width: 250px;
  margin: 0 auto;
}
.passwordWrap .wrapper .passwordArea > .pwBtnArea > a.passwordBtn {
  display: block;
  width: 250px;
  height: 50px;
  color: var(--InvertFontColor);
  background-color: var(--MainColor);
  border: 0px;
  margin-top: 30px;
  cursor: pointer;
  font-size: var(--fs15);
  text-align: center;
  text-decoration-line: none;
  padding: 14px;
}
.passwordWrap .wrapper .passwordArea .caution {
  width: 320px;
  color: var(--FontColorGrey1);
  margin: 0 auto 20px auto;
  font-size: var(--fs13);
}
.passwordWrap .wrapper .passwordArea .caution .title {
  font-weight: bold;
  margin-bottom: 10px;
}
.passwordWrap .wrapper .passwordArea .caution ul li {
  padding-left: 9px;
  text-indent: -10px;
}
.passwordWrap .wrapper .passwordArea .passwordTab {
  display: flex;
  width: 430px;
  margin: 0 auto;
  margin-top: 20px;
  margin-bottom: 50px;
}
.passwordWrap .wrapper .passwordArea .passwordTab .tabItem {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 60px;
}
.passwordWrap .wrapper .passwordArea .passwordTab .tabItem input[type=radio] {
  border: 1px solid #ccc;
}
.passwordWrap .wrapper .passwordArea .passwordTab .tabItem input[type=radio] + label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: var(--fs19);
  color: #999;
  border-bottom: 2px solid #ccc;
  cursor: pointer;
}
.passwordWrap .wrapper .passwordArea .passwordTab .tabItem input[type=radio]:checked + label {
  color: var(--MainFontColor);
  border-color: var(--MainFontColor);
}
.passwordWrap .wrapper .passwordArea .passwordTab .tabItem input[type=radio]:focus-visible + label {
  outline: 1px solid var(--MainFontColor);
}
.passwordWrap .wrapper .passwordArea .passWordTitle {
  width: 430px;
  margin: 30px auto 0 auto;
  padding-bottom: 10px;
  text-align: center;
}
.passwordWrap .wrapper .passwordArea .passWordTitle .txtTitle {
  font-size: var(--fs21);
  margin-bottom: 10px;
}
.passwordWrap .wrapper .passwordArea .passWordTitle.expired {
  padding-bottom: 50px;
}
.passwordWrap .wrapper .passwordArea .passWordTitle.expired .txtExpired {
  font-size: var(--fs15);
  color: #999;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent {
  width: 450px;
  padding: 0 0 100px 0;
  text-align: center;
  margin: 0 auto;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .txt {
  margin-bottom: 20px;
  font-size: var(--fs16);
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .txtExpired {
  font-size: var(--fs16);
  font-weight: bold;
  margin-bottom: 40px;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .txt, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .txt {
  margin-bottom: 20px;
  font-size: var(--fs15);
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .txt .subTxt, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .txt .subTxt {
  display: block;
  margin-top: 5px;
  color: var(--MainFontColorLighter);
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent input[type=text], .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent input[type=text] {
  width: 320px;
  height: 50px;
  margin-bottom: 30px;
  border: 1px solid #ccc;
  padding: 0 10px;
  font-size: var(--fs15);
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent input[type=text]::placeholder, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent input[type=text]::placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 13px;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent input[type=text]::-webkit-input-placeholder, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent input[type=text]::-webkit-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 13px;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent input[type=text]::-ms-input-placeholder, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent input[type=text]::-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 13px;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent input[type=text]:-ms-input-placeholder, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent input[type=text]:-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: 13px;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent input[type=text]:focus-visible, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent input[type=text]:focus-visible {
  border-color: var(--MainColor);
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .btnOk, .passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .btnSecondary, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnOk, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnSecondary {
  width: 320px;
  height: 45px;
  color: #fff;
  background-color: var(--MainColor);
  font-size: var(--fs17);
  border: 0;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.3s;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .btnOk:hover, .passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .btnOk:focus-visible, .passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .btnSecondary:hover, .passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .btnSecondary:focus-visible, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnOk:hover, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnOk:focus-visible, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnSecondary:hover, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnSecondary:focus-visible {
  background-color: var(--ButtonDefaultColorHover);
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .btnOk:active, .passwordWrap .wrapper .passwordArea .passwordTabContent .changePwContent .btnSecondary:active, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnOk:active, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnSecondary:active {
  background-color: var(--ButtonDefaultColorActive);
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnSecondary {
  color: var(--MainColor);
  border: 1px solid var(--MainColor);
  background-color: #fff;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnSecondary:hover, .passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnSecondary:focus-visible {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.passwordWrap .wrapper .passwordArea .passwordTabContent .findPwContent .btnSecondary:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  cursor: pointer;
}
.passwordWrap .wrapper .passwordArea.tempPwSent .pwTxt {
  margin-top: 20px;
  font-size: var(--fs16);
}
.passwordWrap .wrapper .passwordArea.tempPwSent .subTxt {
  color: #999;
  font-size: var(--fs15);
  text-align: center;
  margin-top: 25px;
}

.popupLoginPage {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  z-index: 99;
}
.popupLoginPage .popupContent {
  position: relative;
  flex-shrink: 0;
  color: var(--MainFontColor);
  background-color: var(--MainBgColor);
  box-shadow: 3px 3px 6px 2px rgba(58, 58, 58, 0.5);
  font-size: var(--fs14);
  z-index: 0;
}
.popupLoginPage .popupContent .title {
  font-size: var(--fs17);
  font-weight: bold;
  margin-bottom: 30px;
}
.popupLoginPage .popupContent .msg {
  margin-bottom: 30px;
  font-size: var(--fs14);
}
.popupLoginPage .popupContent dl {
  margin-bottom: 20px;
}
.popupLoginPage .popupContent dl dt {
  display: inline-block;
  width: 60px;
  opacity: 0.5;
  margin-bottom: 10px;
}
.popupLoginPage .popupContent dl dd {
  display: inline-block;
  width: calc(100% - 70px);
}
.popupLoginPage .popupContent .info {
  font-size: var(--fs11);
  color: var(--popupLoginPageInfoFontColor);
}
.popupLoginPage .popupContent .info > p {
  position: relative;
  margin-bottom: 10px;
  padding-left: 8px;
}
.popupLoginPage .popupContent .info > p::before {
  content: ".";
  position: absolute;
  top: -4px;
  left: 0;
}
.popupLoginPage .popupContent .infoImages {
  display: inherit;
  cursor: pointer;
  min-width: 300px;
  min-height: 300px;
}
.popupLoginPage .popupContent .neverShow {
  display: flex;
  align-items: center;
  display: flex;
  align-items: center;
  width: 100%;
  height: 40px;
  background-color: #fff;
  padding: 0 10px;
  color: #999;
  font-size: var(--fs15);
}
.popupLoginPage .popupContent .neverShow input[type=checkbox] {
  margin-right: 5px;
}
.popupLoginPage .popupContent .neverShow input[type=checkbox] + label {
  margin-right: 20px;
}
.popupLoginPage .popupContent .neverShow .btnClose {
  margin-left: auto;
  padding: 5px 10px;
  font-size: var(--fs14);
}
.popupLoginPage .popupContent .neverShow .btnClose:hover {
  background-color: #efefef;
  border-radius: 5px;
  cursor: pointer;
}

.popupInspectionPage {
  height: 100%;
  z-index: 1;
}
.popupInspectionPage .inspectionHomeWrap {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #eae9e8;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox {
  width: 730px;
  height: 600px;
  text-align: left;
  top: 380px;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox > .inspectionTitle {
  text-align: center;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox > .inspectionTitle > .inspectionTitleImg {
  width: 106px;
  height: 133px;
  text-align: center;
  margin: 0 auto;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage {
  position: absolute;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 400px;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent {
  position: relative;
  flex-shrink: 0;
  width: 550px;
  color: var(--MainFontColor);
  background-color: var(--MainBgColor);
  box-shadow: 3px 3px 6px 2px rgba(58, 58, 58, 0.5);
  border: 1px solid var(--BorderGreyDark);
  padding: 25px;
  font-size: var(--fs14);
  z-index: 0;
  text-align: left;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent .title {
  font-size: var(--fs18);
  font-weight: bold;
  margin-bottom: 30px;
  text-align: center;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent .msg {
  margin-bottom: 30px;
  font-size: var(--fs15);
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent dl {
  margin-bottom: 20px;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent dl dt {
  display: inline-block;
  width: 60px;
  opacity: 0.5;
  margin-bottom: 10px;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent dl dd {
  display: inline-block;
  width: calc(100% - 70px);
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent .info {
  font-size: var(--fs13);
  color: var(--popupLoginPageInfoFontColor);
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent .info > p {
  position: relative;
  margin-bottom: 10px;
  padding-left: 8px;
}
.popupInspectionPage .inspectionHomeWrap .inspectionBox .popupInspectionPage .popupContent .info > p::before {
  content: ".";
  position: absolute;
  top: -4px;
  left: 0;
}

.SA_popup {
  width: 100%;
  height: 100%;
  padding: 20px;
  overflow: auto;
}
.SA_popup .title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.SA_popup .title h1 {
  font-size: var(--fs18);
}
.SA_popup .title .info {
  font-size: var(--fs13);
  color: #bbb;
}
.SA_popup .markWrap {
  margin: 30px 0;
}
.SA_popup .markWrap > img {
  margin-right: 30px;
}
.SA_popup .aboutSA {
  margin-bottom: 20px;
  font-size: var(--fs14);
  line-height: 20px;
}
.SA_popup table.shortcut {
  width: 100%;
  border-collapse: collapse;
}
.SA_popup table.shortcut thead tr th, .SA_popup table.shortcut tbody tr td {
  padding: 8px 10px;
  font-size: var(--fs14);
  text-align: left;
}
.SA_popup table.shortcut thead tr th {
  border-top: 2px solid #333;
  background-color: #EBEDF5;
}
.SA_popup table.shortcut tbody {
  border-bottom: 2px solid #333;
}
.SA_popup table.shortcut tbody tr td {
  border-bottom: 1px solid #DCDFE8;
  border-right: 1px solid #DCDFE8;
}
.SA_popup table.shortcut tbody tr td:last-child {
  border-right: 0;
}

.sendCodeStepFrameWrap {
  display: flex;
  height: 100%;
}
.sendCodeStepFrameWrap .msgBgArea {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: var(--BgColorGrey);
}
.sendCodeStepFrameWrap .msgBgArea .msgArea {
  display: inline-flex;
  flex-direction: column;
  width: 450px;
  padding: 0 40px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea > .titleArea {
  text-align: center;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea > .titleArea > .img {
  display: inline-block;
  width: 140px;
  height: 121px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea > .titleArea > .txtTitle {
  font-size: var(--fs32);
  margin: 10px 0;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea > .titleArea > .txtDescription {
  width: 100%;
  font-size: var(--fs14);
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  padding: 15px 20px;
  margin-top: 20px;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup {
  display: inline-flex;
  flex-shrink: 0;
  width: 100%;
  margin-bottom: 20px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 5px;
  overflow: hidden;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li {
  width: 100%;
  height: 30px;
  border-right: 1px solid var(--BorderGreyLight);
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon > input[type=radio] {
  display: none;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon > input[type=radio] + label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon > input[type=radio] + label:hover {
  cursor: pointer;
  background-color: #d8f2ff;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon > input[type=radio][checked=checked] + label {
  background-color: #2677DC;
  color: #fff;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon > input[type=radio] + label > .txtValue {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-size: var(--fs13);
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon > input[type=radio] + label > .txtValue:before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  margin-right: 5px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon.email > input[type=radio] + label > .txtValue:before {
  background-position: 1px 5px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon.SMS > input[type=radio] + label > .txtValue:before {
  background-position: 1px -30px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon.alarmTalk > input[type=radio] + label > .txtValue:before {
  background-position: 1px -65px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li.radioTypeIcon > input[type=radio][checked=checked] + label > .txtValue:before {
  background-position-x: -30px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .radioGroup > li:last-child {
  border-right: 0px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea dl {
  margin-bottom: 20px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea dl dt {
  font-size: var(--fs15);
  margin-bottom: 8px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea dl dd {
  position: relative;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea dl dd input {
  width: 100%;
  height: 50px;
  padding: 0 8px;
  border: 1px solid var(--BorderGrey);
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea dl dd input:focus {
  color: var(--MainColor);
  font-weight: bold;
  border: 2px solid var(--MainColor);
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea dl dd .btnSendCode {
  position: absolute;
  top: 2px;
  right: 2px;
  display: inline-block;
  height: calc(100% - 4px);
  padding: 0 6px;
  border: 0;
  color: var(--FontColorGrey1);
  font-size: var(--fs11);
  background-color: #EBEBEB;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea dl dd .btnSendCode:hover {
  cursor: pointer;
  color: var(--MainFontColor);
  background-color: #cccccc;
  cursor: pointer;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea .btnArea {
  display: flex;
  width: 100%;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea .btnArea > button {
  height: 50px;
  width: 100%;
  border: 0;
  color: var(--InvertFontColor);
  font-size: var(--fs17);
  background-color: var(--MainColor);
  opacity: 1;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea .btnArea > button:hover {
  cursor: pointer;
  box-shadow: rgba(0, 0, 0, 0.3) 5px 5px 5px;
}
.sendCodeStepFrameWrap .msgBgArea .msgArea .sendCodeStep2Wrap .inputArea .btnArea > button + button {
  margin-right: 10px;
}
.sendCodeStepFrameWrap .imgArea {
  flex-shrink: 0;
  width: calc(100% - 450px);
  background-color: var(--BgColorGrey);
  background-image: url(/Images/LoginbgAce.jpg?WBK21031002=1);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom center;
}
.sendCodeStepFrameWrap .imgArea.FitBgImg {
  background-size: contain;
  background-position: left center;
}

[kui-groupbox] [kui-gridfill].hasSheet {
  margin: 0 !important;
}

[kui-tab] [kui-tabitem] [kui-grid] [kui-gridfill].hasSheet {
  margin: 0 !important;
}

.btnSheetSetting {
  position: absolute;
  top: 1px;
  left: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 2px 0 0 0;
  background-color: var(--btnSheetSettingBgColor);
  border-bottom: 1px solid var(--colHeaderBorderColor);
}
.btnSheetSetting > i {
  width: 20px;
  height: 20px;
}
.btnSheetSetting:hover, .btnSheetSetting:focus {
  background-color: var(--btnSheetSettingBgColorHover);
  cursor: pointer;
}

.groupBoxSheet > .btnSheetSetting {
  position: absolute;
  top: 1px;
  left: 1px;
}

.sheetContext .dlgContextUI .contextMenu > li.line {
  width: 100%;
  height: 1px;
  margin: 4px 0;
  background-color: #E3E7EB;
}
.sheetContext .dlgContextUI .contextMenu > li.hasSub {
  display: flex;
  padding-right: 0;
}
.sheetContext .dlgContextUI .contextMenu > li.colConditionList.point .txt {
  display: flex;
  align-items: center;
}
.sheetContext .dlgContextUI .contextMenu > li.colConditionList.point .txt::after {
  content: "";
  width: 6px;
  height: 6px;
  margin-left: 4px;
  border-radius: 50%;
  background-color: #FC5757;
}
.sheetContext .dlgContextUI .contextMenu > li.hideCol > .item, .sheetContext .dlgContextUI .contextMenu > li.showCol > .item {
  display: flex;
  align-items: center;
}
.sheetContext .dlgContextUI .contextMenu > li.hideCol > .item::before {
  background-position-x: -128px;
}
.sheetContext .dlgContextUI .contextMenu > li.showCol > .item::before {
  background-position-x: -112px;
}
.sheetContext .dlgContextUI .contextMenu > li > .item.subArrow {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  padding-left: 15px;
}
.sheetContext .dlgContextUI .contextMenu > li > .item.subArrow > .arrow {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-right: 4px solid transparent;
  border-left: 4px solid var(--MainFontColor);
  background-image: none;
}
.sheetContext .dlgContextUI .contextMenu > li > .item.totalInfo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor), 0.5);
  height: 35px;
}
.sheetContext .dlgContextUI .contextMenu > li > .item.totalInfo label {
  margin-right: 10px;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.sheetContext .dlgContextUI .contextMenu > li > .item.totalInfo > div {
  border: 0;
  background-color: transparent;
  width: 110px;
  font-size: var(--fs13);
  text-align: right;
  color: var(--MainFontColorLighter);
  max-width: 110px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sheetContext .dlgContextUI .contextMenu > li > .item.mergeInfo {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  height: unset;
  padding: 8px 10px;
}
.sheetContext .dlgContextUI .contextMenu > li > .item.mergeInfo > .title {
  width: 100%;
  padding-bottom: 5px;
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.sheetContext .dlgContextUI .contextMenu > li > .item.mergeInfo > .value {
  width: 100%;
  max-width: 180px;
  font-size: var(--fs13);
}
.sheetContext .dlgContextUI .contextMenu > li > .item.mergeInfo:hover {
  background-color: transparent;
  cursor: default;
}
.sheetContext .dlgContextUI .contextMenu > li.lineBottom {
  border-bottom: 1px solid var(--BorderGrey);
}
.sheetContext .dlgContextUI .contextMenu > li.Checked {
  background-position: 0 -141px;
}
.sheetContext .dlgContextUI .contextMenu.countInfo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  padding: 10px 10px;
  font-size: var(--fs14);
  color: var(--MainFontColorLighter);
}
.sheetContext .dlgContextUI .contextMenu.countInfo > li {
  margin-top: 2px;
}
.sheetContext .dlgContextUI .contextMenu.countInfo > li > .item {
  min-height: unset;
}
.sheetContext .dlgContextUI .contextMenu.countInfo > li > .item dl {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.sheetContext .dlgContextUI .contextMenu.countInfo > li > .item dl > dt {
  font-size: var(--fs13);
}
.sheetContext .dlgContextUI .contextMenu.countInfo > li > .item dl > dd {
  margin-left: 60px;
  font-size: var(--fs13);
  text-align: right;
  color: var(--MainFontColorLighter);
  max-width: 110px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sheetContext .dlgContextUI .contextMenu.countInfo > li > .item:hover {
  background-color: transparent;
  color: unset;
  cursor: default;
}

.autoSumLayerWrap {
  position: absolute;
  top: 0px;
  left: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
  width: 100%;
  height: 100%;
  z-index: 30;
}
.autoSumLayerWrap .autoSumLayer {
  position: absolute;
  min-width: 220px;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
  font-size: var(--fs14);
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
  color: var(--MainFontColor);
}
.autoSumLayerWrap .autoSumLayer .titleWrap {
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 5px 0 10px;
  border-bottom: 1px solid var(--BorderGrey);
}
.autoSumLayerWrap .autoSumLayer .titleWrap > i {
  width: 9px;
  height: 13px;
  background-position: -30px -241px;
}
.autoSumLayerWrap .autoSumLayer .titleWrap .title {
  margin-left: 10px;
  font-weight: bold;
}
.autoSumLayerWrap .autoSumLayer .titleWrap .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-left: auto;
  border-radius: 50%;
}
.autoSumLayerWrap .autoSumLayer .titleWrap .btnClose > i {
  width: 11px;
  height: 11px;
  background-position: -49px -241px;
}
.autoSumLayerWrap .autoSumLayer .titleWrap .btnClose:hover {
  background-color: #f2f2f2;
  cursor: pointer;
}
.autoSumLayerWrap .autoSumLayer .content {
  padding: 10px;
}
.autoSumLayerWrap .autoSumLayer .content > ul > li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 5px 0;
}
.autoSumLayerWrap .autoSumLayer .content > ul > li > .label {
  flex-shrink: 0;
  width: 100px;
  padding: 2px 0;
  font-size: var(--fs13);
}
.autoSumLayerWrap .autoSumLayer .content > ul > li > .value {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 1;
  flex-shrink: 0;
  min-width: 110px;
  height: 25px;
  background-color: var(--BgColorGrey);
  border-radius: 3px;
  border: 0;
  font-size: var(--fs14);
  padding: 0 5px;
  color: var(--MainFontColor);
}
.autoSumLayerWrap .autoSumLayer .content > ul > li > .btnCopy {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
}
.autoSumLayerWrap .autoSumLayer .content > ul > li > .btnCopy:hover {
  cursor: pointer;
}

.sheetColumnMove {
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: transparent;
  display: none;
  z-index: 99999;
  position: absolute;
  opacity: 0.8;
}
.sheetColumnMove .sheetDropPosition {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 2px;
  background-color: var(--FontColorGrey);
  display: none;
}
.sheetColumnMove .sheetDropPosition > .sheetDropArea {
  position: absolute;
  left: -6px;
  display: inline-block;
  width: 13px;
  height: 8px;
}
.sheetColumnMove .sheetDropPosition > .sheetDropArea.Top {
  top: -1px;
  background-position: -68px -21px;
}
.sheetColumnMove .sheetDropPosition > .sheetDropArea.Bottom {
  bottom: -1px;
  background-position: -100px -21px;
}

.btnSheetSettingClose {
  position: absolute;
  top: 0;
  left: 5px;
  width: 35px;
  height: 34px;
  background-color: var(--MainColor);
  background-position: -115px 0;
  display: none;
}
.btnSheetSettingClose:hover {
  background-color: var(--InputDateFontColorHover);
  cursor: pointer;
}

.sheetFeatureWrap {
  position: absolute;
  display: none;
  top: 0;
  user-select: none;
  z-index: 20;
}
.sheetFeatureWrap.sheetSettingArea {
  width: 100%;
}
.sheetFeatureWrap .sheetFeature {
  padding: 5px 10px 5px 15px;
  background-color: var(--MainBgColor);
  border-radius: 8px;
  border: 1px solid #C4CFDD;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.01), 0px 0px 20px 0px rgba(0, 0, 0, 0.05), 0px 9px 24px 0px rgba(0, 0, 0, 0.25);
}
.sheetFeatureWrap .sheetFeature > .titleArea {
  display: flex;
  align-items: center;
  height: 30px;
}
.sheetFeatureWrap .sheetFeature > .titleArea .titleWrap {
  display: flex;
  align-items: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.sheetFeatureWrap .sheetFeature > .titleArea .titleWrap > i {
  margin-right: 5px;
}
.sheetFeatureWrap .sheetFeature > .titleArea .titleWrap .txtTitle {
  flex-shrink: 0;
  font-size: var(--fs13);
  font-weight: bold;
}
.sheetFeatureWrap .sheetFeature > .titleArea .titleWrap .txtSub {
  margin-left: 10px;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sheetFeatureWrap .sheetFeature > .titleArea .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  margin-left: auto;
}
.sheetFeatureWrap .sheetFeature > .titleArea .btnClose:hover {
  background-color: #E3E7EB;
}
.sheetFeatureWrap .sheetFeature.sheetSearch {
  max-width: 500px;
  width: 100%;
  padding: 5px 10px 10px 15px;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent {
  display: flex;
  align-items: center;
  margin-top: 10px;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .inputSearch {
  display: flex;
  align-items: center;
  width: 100%;
  height: 32px;
  border-radius: 4px;
  border: 1px solid #E2E2E2;
  padding: 0 8px;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .inputSearch .btnClear {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin: 0 10px;
  background-color: #BFC6D0;
  border-radius: 50%;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .inputSearch .btnClear:hover {
  background-color: #b0b9c5;
  cursor: pointer;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .inputSearch > input[type=text] {
  width: 100%;
  border: 0;
  font-size: var(--fs13);
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .inputSearch > input[type=text]:valid + .btnClear {
  display: flex;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .inputSearch .btnNextSearch {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-color: var(--MainColor);
  border-radius: 4px;
  cursor: pointer;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .inputSearch .btnNextSearch:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .inputSearch .btnNextSearch.Dis {
  background-color: #D2D2D2;
  cursor: default;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .searchTools {
  display: flex;
  align-items: center;
  border-left: 1px solid #CFD8DC;
  margin-left: 10px;
  padding: 0 0 0 10px;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .searchTools .ulAlterItem {
  display: flex;
  align-items: center;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .searchTools .ulAlterItem > li {
  margin-right: 10px;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .searchTools .ulAlterItem > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 4px;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .searchTools .ulAlterItem > li > a:hover {
  background-color: #E3E7EB;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .searchTools .ulAlterItem > li.selected > a {
  border: 1px solid #CED4DE;
  background-color: #E3E7EB;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .searchTools .btnMore {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  cursor: pointer;
}
.sheetFeatureWrap .sheetFeature.sheetSearch .searchContent .searchTools .btnMore:hover {
  background-color: #E3E7EB;
}
.sheetFeatureWrap .sheetFeature.sheetShowCol {
  position: absolute;
  max-width: 510px;
  min-width: 230px;
}
.sheetFeatureWrap .sheetFeature.sheetShowCol > .titleArea .btnClose {
  flex-shrink: 0;
  width: unset;
  padding: 0 5px;
  color: var(--MainColor);
  font-size: var(--fs14);
}
.sheetFeatureWrap .sheetFeature.sheetSort {
  position: absolute;
  min-width: 300px;
}
.sheetFeatureWrap .sheetFeature.sheetSort > .titleArea .btnWrap {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-left: auto;
}
.sheetFeatureWrap .sheetFeature.sheetSort > .titleArea .btnWrap > button {
  width: unset;
  padding: 5px 8px;
  margin-left: 5px;
  border-radius: 4px;
  font-size: var(--fs14);
  cursor: pointer;
}
.sheetFeatureWrap .sheetFeature.sheetSort > .titleArea .btnWrap > button:hover {
  background-color: #E3E7EB;
}
.sheetFeatureWrap .sheetFeature.sheetSort > .titleArea .btnWrap .btnSave {
  color: var(--MainColor);
}
.sheetFeatureWrap .sheetFeature.sheetSort > .titleArea .btnWrap .btnClose {
  color: var(--MainFontColorLighter);
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 40px;
  margin-top: 5px;
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent .txtPlaceholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 35px;
  padding: 0 10px;
  border-radius: 4px;
  border: 1px dashed #999;
  font-size: var(--fs13);
  color: #ccc;
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent .txtPlaceholder > .txt {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent > .ulSortList {
  display: flex;
  flex-wrap: wrap;
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent > .ulSortList li {
  margin: 0 4px 4px 0;
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent > .ulSortList li .item {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 8px 4px 8px 8px;
  border-radius: 4px;
  border: 1px solid #CFD8DC;
  background-color: #fff;
  cursor: pointer;
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent > .ulSortList li .item:hover {
  border-color: #333;
  box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.05);
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent > .ulSortList li .item .btnSort {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  border-radius: 4px;
  background-color: #e3e7eb;
  cursor: pointer;
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent > .ulSortList li .item .colTitle {
  font-size: var(--fs13);
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent > .ulSortList li .item .btnSortDel {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  cursor: pointer;
}
.sheetFeatureWrap .sheetFeature.sheetSort .sortContent > .ulSortList li.Descending .item .btnSort > i {
  transform: rotate(180deg);
}

.sheetMoveColumn {
  position: absolute;
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 8px;
  border-radius: 4px;
  border: 1px solid #333;
  background-color: #fff;
  box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.05);
  cursor: pointer;
  z-index: 9999;
}
.sheetMoveColumn .colTitle {
  font-size: var(--fs14);
}

.dlgContextUI.sheetSearchMore .group .contextMenu > li {
  display: flex;
  align-items: center;
  height: 30px;
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .checkboxUI {
  position: relative;
  display: flex;
  align-items: center;
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .checkboxUI > input[type=checkbox] {
  display: none;
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .checkboxUI > input[type=checkbox] + label {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  white-space: nowrap;
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .checkboxUI > input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  margin-right: 5px;
  width: 15px;
  height: 15px;
  border-radius: 3px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .checkboxUI > input[type=checkbox] + label.txt {
  font-size: var(--fs13);
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .checkboxUI > input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 7px;
  height: 4px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .checkboxUI > input[type=checkbox]:checked + label::before {
  border: 1px solid var(--MainColor);
  background-color: var(--MainColor);
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .radioButtonUI {
  position: relative;
  display: flex;
  align-items: center;
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .radioButtonUI > input[type=radio] {
  display: none;
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .radioButtonUI > input[type=radio] + label {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  white-space: nowrap;
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .radioButtonUI > input[type=radio] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  margin-right: 5px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .radioButtonUI > input[type=radio] + label.txt {
  font-size: var(--fs13);
}
.dlgContextUI.sheetSearchMore .group .contextMenu > li .radioButtonUI > input[type=radio]:checked + label::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--MainColor);
}

.shee1tSortArea {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 20;
}
.shee1tSortArea > .sheetSortListArea {
  display: none;
  position: absolute;
  left: 3px;
  width: 100%;
  min-height: 40px;
  padding: 0 10px;
  border-radius: 2px 2px 0 0;
  background-color: var(--MainColor);
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 9999;
}
.shee1tSortArea > .sheetSortListArea > .ulSortList {
  display: block;
  margin: 0;
  padding: 0;
  width: calc(100% - 70px);
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li {
  float: left;
  margin-right: 7px;
  margin: 5px 7px 5px 0;
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li > a {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 30px 0 20px;
  color: var(--ControlBgColorFocus);
  font-size: var(--fs13);
  line-height: 26px;
  border-radius: 14px;
  background-color: var(--btnAsColorHover);
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li > a:hover {
  cursor: pointer;
  background-color: var(--InputDateFontColorHover);
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li > a .icon {
  position: absolute;
  top: 4px;
  left: 0px;
  width: 20px;
  height: 20px;
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li > a p {
  color: #fff;
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li > a .btnSortDel {
  position: absolute;
  top: 4px;
  right: 5px;
  display: inline-block;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background-position: -99px 4px;
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li > a .btnSortDel:hover {
  cursor: pointer;
  background-color: var(--InputDateFontColorHover);
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li.Ascending > a .icon {
  background-position: -61px 3px;
}
.shee1tSortArea > .sheetSortListArea > .ulSortList li.Descending > a .icon {
  background-position: -75px 4px;
}
.shee1tSortArea > .sheetSortListArea .txtPlaceholder {
  font-size: var(--fs13);
  line-height: 26px;
  color: #fff;
  opacity: 0.5;
  width: calc(100% - 70px);
  overflow: hidden;
  white-space: nowrap;
  padding: 6px 5px;
}
.shee1tSortArea > .sheetSortListArea .btnArea {
  display: inline-flex;
  align-items: center;
  position: absolute;
  top: 0;
  right: 10px;
  height: 100%;
}
.shee1tSortArea > .sheetSortListArea .btnArea > button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-left: 5px;
  border-radius: 50%;
}
.shee1tSortArea > .sheetSortListArea .btnArea > button > i {
  display: inline-block;
  background-position: -40px -90px;
}
.shee1tSortArea > .sheetSortListArea .btnArea > button.btnSave > i {
  width: 15px;
  height: 13px;
  background-position: -66px -74px;
}
.shee1tSortArea > .sheetSortListArea .btnArea > button.btnDelete > i {
  width: 11px;
  height: 13px;
  background-position: -66px -98px;
}
.shee1tSortArea > .sheetSortListArea .btnArea > button:hover {
  cursor: pointer;
  background-color: var(--InputDateFontColorHover);
}
.shee1tSortArea > .sheetSortListArea.sheetSearch {
  display: flex !important;
  align-items: center;
  min-width: 360px;
  padding: 7px 10px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch select {
  margin: 0 15px;
  border: 0;
  background-color: transparent;
  color: var(--ControlBgColor);
  font-size: var(--fs13);
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .inputSearch {
  display: flex;
  align-items: center;
  border: 0;
  border-radius: 3px;
  width: 100%;
  min-width: 100px;
  max-width: 200px;
  height: 26px;
  background-color: var(--ControlBgColor);
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .inputSearch > input {
  border: 0;
  border-radius: 5px;
  width: calc(100% - 22px);
  height: 26px;
  padding-left: 5px;
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .inputSearch > .btnClear {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  background-color: transparent;
  border-radius: 50%;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .inputSearch > .btnClear > i {
  display: inline-block;
  width: 6px;
  height: 6px;
  background-position: -160px -23px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .inputSearch > .btnClear:hover {
  background-color: #d1d1d1;
  cursor: pointer;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .btnNextSearch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin: 0 15px 0 3px;
  width: 34px;
  height: 26px;
  background-color: var(--SubColor1);
  border-radius: 3px;
  cursor: pointer;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .btnNextSearch > i {
  display: inline-block;
  width: 22px;
  height: 13px;
  background-position: -160px 0;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .btnNextSearch:hover {
  background-color: #202325;
  cursor: pointer;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .btnNextSearch.Dis {
  opacity: 0.5;
  cursor: default;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem {
  display: inline-block;
  flex-shrink: 0;
  padding: 0;
  margin-right: 5px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li {
  display: inline-flex;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 22px;
  border-radius: 3px;
  padding: 0;
  margin-right: 5px;
  background-color: transparent;
  opacity: 0.5;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li > a i {
  display: inline-block;
  width: 16px;
  height: 11px;
  background-position: -160px -42px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li.selected > a {
  background-color: var(--ulCheckItemColorSelected);
  opacity: 1;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li.selected > a > i {
  display: inline-block;
  width: 16px;
  height: 11px;
  background-position: -160px -42px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li.Case > a > i {
  width: 16px;
  height: 11px;
  background-position: -160px -42px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulCheckItem li.CellContents > a > i {
  width: 16px;
  height: 12px;
  background-position: -160px -63px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem {
  display: flex;
  flex-shrink: 0;
  border-radius: 3px;
  height: 22px;
  margin-right: 10px;
  overflow: hidden;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li {
  display: inline-flex;
  margin-right: 10px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 100%;
  padding: 0;
  margin: 0;
  background-color: var(--ulAlterItemColor);
  border-radius: 0;
  text-align: center;
  font-size: var(--fs13);
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li > a > i {
  display: inline-block;
  width: 17px;
  height: 11px;
  background-position: -160px -106px;
  opacity: 0.3;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li > a:focus {
  border: 2px solid var(--MainFontColor);
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li > a:hover {
  cursor: pointer;
  background-color: var(--InputDateFontColorHover);
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li.selected > a {
  background-color: var(--ulCheckItemColorSelected);
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li.selected > a > i {
  opacity: 1;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li.Row > a > i {
  width: 16px;
  height: 11px;
  background-position: -160px -85px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li.Column > i {
  width: 17px;
  height: 11px;
  background-position: -310px -106px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li.FromFirst > a > i {
  width: 13px;
  height: 7px;
  background-position: -160px -127px;
}
.shee1tSortArea > .sheetSortListArea.sheetSearch .ulAlterItem li.Current > a > i {
  width: 10px;
  height: 13px;
  background-position: -160px -144px;
}
.shee1tSortArea .btnSheetSettingClose {
  display: inline-block;
  top: unset;
  bottom: -34px;
  left: 0px;
}

.gc-theme-version {
  position: absolute;
  z-index: 2007;
}

.gc-footer-corner {
  background-color: transparent;
}

.gc-grayArea {
  background-color: var(--MainBgColor);
}

.gc-rowHeaderFill {
  background-color: var(--MainBgColor);
}

.gc-colHeaderFill {
  background-color: var(--colHeaderBgColor);
  border-top: 5px solid #333;
}

.gc-selection {
  background-color: rgba(180, 180, 200, 0.2);
  border-color: var(--sheetMainColor);
  color: rgba(110, 110, 110, 0.5);
}

.gc-drag-indicator {
  border-color: var(--sheetMainColor);
}

.gc-gridlineColor {
  border-color: var(--gcgridlineColorBorderColor);
}

.gc-group {
  background-color: var(--gcgroupBgColor);
  color: #333;
}

.gc-group-box {
  background-color: var(--gcgroupboxBgColor);
  color: #000;
  border-color: gray;
}

.gc-tabStripBackground {
  background-color: var(--gctabStripBackgroundBgColor);
}

.gc-tabStripResizeBarOuter {
  background-color: var(--gctabStripResizeBarOuterBgColor);
}

.gc-tabStripResizeBarInner {
  background-color: var(--gctabStripResizeBarInnerBgColor);
  color: #688caf;
}

.gc-navButton-hover {
  color: #fff;
  background-color: var(--gcnavButtonhoverBgColor);
}

.gc-navButton-normal {
  color: #fff;
  background-color: var(--sheetMainColor);
}

.gc-columnHeader-normal {
  color: var(--colHeaderFontColor);
  background-color: var(--colHeaderBgColor);
  border-style: solid;
  border-left-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColor);
  border-top: 5px solid #333;
}

.gc-columnHeader-hover {
  color: var(--colHeaderFontColor);
  background-color: var(--gccolumnHeaderhoverBgColor);
  border-style: solid;
  border-top-color: var(--colHeaderBorderColor);
  border-left-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColorHover);
}

.gc-columnHeader-selected {
  color: var(--colHeaderFontColor);
  background-color: var(--gccolumnHeaderhoverBgColor);
  background-image: none;
  border-style: solid;
  border-width: 2px;
  border-top-color: var(--colHeaderBorderColor);
  border-left-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColorHover);
}

.gc-columnHeader-highlight {
  color: var(--colHeaderFontColor);
  font-weight: bold;
  background-color: var(--gccolumnHeaderhighlightBgColor);
  border-style: solid;
  border-top-color: var(--colHeaderBorderColor);
  border-left-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColorHover);
}

.gc-rowHeader-hover {
  color: var(--colHeaderFontColor);
  background-color: var(--gcRowHeaderHoverBgColor);
  background-image: none;
  border-style: solid;
  border-top-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
}

.gc-rowHeader-selected {
  color: var(--colHeaderFontColor);
  background-color: var(--gcrowHeaderselectedBgColor);
  background-image: none;
  border-style: solid;
  border-left-color: var(--colHeaderBorderColor);
  border-top-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
  z-index: 999;
}

.gc-rowHeader-highlight {
  color: var(--sheetMainColor);
  font-weight: bold;
  background-color: var(--gcrowHeaderhighlightBgColor);
  border-style: solid;
  border-top-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
}

.gc-rowHeader-normal {
  color: var(--colHeaderFontColor);
  background-color: var(--colHeaderBgColor);
  background-image: none;
  border-style: solid;
  border-top-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
}

.gc-corner-normal {
  background-color: var(--colHeaderBgColor);
}

.gc-corner-hover {
  background-color: #c4d0d3;
}

.gc-corner-selected {
  background-color: #c5ccce;
}

.gc-corner-triangle-normal {
  background-color: var(--colHeaderBorderColor);
  border-left-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
  border-top-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColor);
}

.gc-corner-triangle-hover {
  background-color: #c4d0d3;
  border-style: solid;
  border-left-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
  border-top-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColor);
}

.gc-corner-triangle-selected {
  background-color: #c5ccce;
  border-style: solid;
  border-left-color: var(--colHeaderBorderColor);
  border-right-color: var(--colHeaderBorderColor);
  border-top-color: var(--colHeaderBorderColor);
  border-bottom-color: var(--colHeaderBorderColor);
}

.gc-tab-normal {
  color: #000;
  background-color: #d9e7f9;
}

.gc-tab-hover {
  color: #000;
  background-color: #bcd5f6;
}

.gc-gradientButton {
  background-color: #DDDDDD;
  background-image: -webkit-linear-gradient(top, #F6FAFB, #D2DBEB);
  background-image: -moz-linear-gradient(top, #F6FAFB, #D2DBEB);
  background-image: -ms-linear-gradient(top, #F6FAFB, #D2DBEB);
  background-image: -o-linear-gradient(top, #F6FAFB, #D2DBEB);
  background-image: linear-gradient(to bottom, #F6FAFB, #D2DBEB);
}

.gc-sheetTabEditor::-ms-clear {
  display: none;
}

.gc-layout-table {
  font-size: var(--fs13);
  width: 100%;
  height: 100%;
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
}

.gc-layout-table-first-column {
  width: 5px;
  border-right: 1px solid #CCC;
  text-align: right;
  padding-top: 7px;
}

.gc-layout-table-last-column {
  width: 5px;
}

.gc-filter-sort-desc-container {
  border-bottom: 1px solid #CCC;
}

.gc-filter-item-wrapper .gc-filter-item {
  color: var(--MainFontColor);
}
.gc-filter-item-wrapper .gc-filter-item:has(.gc-filter-item-input:not([value=""])) {
  display: flex !important;
}

.gc-filter-dialog-style {
  background: var(--MainBgColor);
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
  font-size: var(--fs13);
  border: 1px solid #a7abb0;
}
.gc-filter-dialog-style.gc-popup.ui-widget.gc-no-user-select {
  height: 280px !important;
  padding: 5px !important;
}

.gc-search-outer-div {
  min-height: 70px;
  color: #333;
  font-weight: normal;
  border-radius: 3px;
}
.gc-search-outer-div > div:first-child {
  padding: 4px 0 !important;
}

div.gc-search-outer-div input::-ms-clear {
  display: none;
}

#gc-filterSearch {
  width: 100%;
  height: 33px;
  border: 0px;
  padding: 0;
  font-size: 1em;
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  float: none;
  padding: 0 5px;
  border: 1px solid var(--ControlBorderColor);
}

#gc-filterSearch:hover,
#gc-filterSearch:active {
  background-color: var(--ControlBgColor);
}

.gc-check-uncheck-all {
  float: left;
  width: 16px;
  height: 16px;
  display: inline-block;
}

.gc-filter-check-outerDiv .gc-check-image,
.gc-fill-type-item .gc-check-image {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAGxJREFUOE+ljsENgDAMAzsaQ3QMxP4/wAhXwTKhEY9TlZOdtK1b/4WVFaysYGUFKxMWdY/hA5T3+x0+BjJYJmOJBoF+87UMYhAwzFBaBnFwYZ1j/kKFltIycHLqMrHyhEvSMrCygpUVrJyntwPdKU02VXQw7gAAAABJRU5ErkJggg==);
}

.gc-filter-check-outerDiv .gc-uncheck-image,
.gc-fill-type-item .gc-uncheck-image {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAIJJREFUOE+lkssNgDAMQzsCw3UMxEocGKWDQSLVUj5GJeLwhPyI0x7a9qP/gsoKVFagskIUm3ALp3GKZvX63/q0QIcAlqAMXMcFIQ6z7DouTGLptawkMVmeDJi8BFsGQ0jzUcRyvEla4oLAhvVrveu4IOAdxJOwZPkOylBZgcrv9PYAV9tkcyJlS4sAAAAASUVORK5CYII=);
}

.gc-check-image,
.gc-uncheck-image {
  background-position: center;
}

.gc-filter-check-outerDiv {
  height: 18px;
  margin-top: 7px;
}

a.gc-filter-check-style {
  color: var(--MainFontColor);
  text-shadow: none;
}

a.gc-filter-check {
  text-decoration: none;
  margin: 3px 10px 0 0 !important;
}

a.gc-filter-check:hover {
  text-decoration: underline;
}

#gc-sortASC:hover,
#gc-sortASC:active {
  border-color: #e3e3e3;
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.gc-filter-sort {
  border: 1px solid transparent;
  font-weight: normal;
  color: #222222;
}

.gc-filter-hover {
  border-radius: 3px;
  outline: none;
}

.gc-filter-item {
  position: relative;
  cursor: default;
  font-weight: normal;
  border-style: solid;
  border-color: transparent;
}

.gc-filter-item-container {
  overflow: hidden;
  width: 100% !important;
  height: 160px !important;
  margin: 0;
}

.gc-filter-item-container > table {
  width: 100% !important;
  border: 1px solid #cbd6dd !important;
  border-radius: 3px;
}

.gc-filter-item-input {
  float: left;
  clear: left;
}

.gc-filter-item-text {
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
  font-size: var(--fs13);
  margin: 2px;
  white-space: nowrap;
  word-wrap: normal;
  float: left;
  clear: right;
}

.gc-filter-dialog-style .gc-layout-table tr:last-child td:nth-child(2) {
  display: flex;
  flex-direction: row-reverse;
  width: 100%;
}

.gc-filter-button {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 10px;
  min-width: 80px;
  height: 36px;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  border: 0;
  font-size: var(--fs14) !important;
  padding: 0 15px;
  transition: all 0.3s;
}

.gc-filter-button-disable {
  opacity: 0.35;
  background-image: none;
}

#gc-filterOK {
  background-color: var(--MainColor);
  color: #fff;
}
#gc-filterOK:hover {
  background-color: var(--ButtonDefaultColorHover);
}
#gc-filterOK:active {
  background-color: var(--ButtonDefaultColorActive);
}

#gc-filterCancel {
  background-color: transparent;
  border: 1px solid var(--BorderGreyLight);
  color: var(--MainColor);
}
#gc-filterCancel:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
#gc-filterCancel:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  border-color: rgba(var(--MainColor-rgb), 0.15);
  cursor: pointer;
}

.gc-smartMenu-item-default {
  border: 0;
  font-weight: normal;
  color: #fff;
  margin-right: 5px;
  cursor: pointer;
}

.gc-smart-tag-default {
  border: 1px solid #849dbd;
  background: #5c9ccc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAEsCAIAAAAO9ne5AAAACXBIWXMAAAsTAAALEwEAmpwYAAAKT2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoCMFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89+bN/rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZCFz/SMBAPh+PDwrIsAHvgABeNMLCADATZvAMByH/w/qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2LjAFAtAGAnf+bTAICd+Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5ANgtADBJV2ZIALC3AMDOEAuyAAgMADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA/g88wAAKCRFRHgg/P9eM4Ors7ONo62Dl8t6r8G/yJiYuP+5c+rcEAAAOF0ftH+LC+zGoA7BoBt/qIl7gRoXgugdfeLZrIPQLUAoOnaV/Nw+H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl/AV/1s+X48/Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o9H/LcL//wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s+wM+3zUAsGo+AXuRLahdYwP2SycQWHTA4vcAAPK7b8HUKAgDgGiD4c93/+8//UegJQCAZkmScQAAXkQkLlTKsz/HCAAARKCBKrBBG/TBGCzABhzBBdzBC/xgNoRCJMTCQhBCCmSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD/phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBKLJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaPYw2oefQq2gP2o8+Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8+xdwQSgUXACTYEd0IgYR5BSFhMWE7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR+cQYYjIxh1hILCPWEo8TLxB7iEPENyQSiUMyJ7mQAkmxpFTSEtJG0m5SI+ksqZs0SBojk8naZGuyBzmULCAryIXkneTD5DPkG+Qh8lsKnWJAcaT4U+IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr+h0uhHdlR5Ol9BX0svpR+iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK+YTKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI+pXlN9rkZVM1PjqQnUlqtVqp1Q61MbU2epO6iHqmeob1Q/pH5Z/YkGWcNMw09DpFGgsV/jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY/R27iz2qqaE5QzNKM1ezUvOUZj8H45hx+Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onXCdHZ4/OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up+6Ynr5egJ5Mb6feeb3n+hx9L/1U/W36p/VHDFgGswwkBtsMzhg8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83MzaLN1pk1mz0x1zLnm+eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw+6TvZN9un2N/T0HDYfZDqsdWh1+c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLpc+Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26/uNu5p7ofcn8w0nymeWTNz0MPIQ+BR5dE/C5+VMGvfrH5PQ0+BZ7XnIy9jL5FXrdewt6V3qvdh7xc+9j5yn+M+4zw33jLeWV/MN8C3yLfLT8Nvnl+F30N/I/9k/3r/0QCngCUBZwOJgUGBWwL7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQfujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo+qi5qPNo3ujS6P8YuZlnM1VidWElsSxw5LiquNm5svt/87fOH4p3iC+N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi/RNtGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z+pn5mZ2y6xlhbL+xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a/zYnKOZarnivN7cyzytuQN5zvn//tEsIS4ZK2pYZLVy0dWOa9rGo5sjxxedsK4xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1+1dT1gvWd+1YfqGnRs+FYmKrhTbF5cVf9go3HjlG4dvyr+Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql+aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO/PLi8ZafJzs07P1SkVPRU+lQ27tLdtWHX+G7R7ht7vPY07NXbW7z3/T7JvttVAVVN1WbVZftJ+7P3P66Jqun4lvttXa1ObXHtxwPSA/0HIw6217nU1R3SPVRSj9Yr60cOxx++/p3vdy0NNg1VjZzG4iNwRHnk6fcJ3/ceDTradox7rOEH0x92HWcdL2pCmvKaRptTmvtbYlu6T8w+0dbq3nr8R9sfD5w0PFl5SvNUyWna6YLTk2fyz4ydlZ19fi753GDborZ752PO32oPb++6EHTh0kX/i+c7vDvOXPK4dPKy2+UTV7hXmq86X23qdOo8/pPTT8e7nLuarrlca7nuer21e2b36RueN87d9L158Rb/1tWeOT3dvfN6b/fF9/XfFt1+cif9zsu72Xcn7q28T7xf9EDtQdlD3YfVP1v+3Njv3H9qwHeg89HcR/cGhYPP/pH1jw9DBY+Zj8uGDYbrnjg+OTniP3L96fynQ89kzyaeF/6i/suuFxYvfvjV69fO0ZjRoZfyl5O/bXyl/erA6xmv28bCxh6+yXgzMV70VvvtwXfcdx3vo98PT+R8IH8o/2j5sfVT0Kf7kxmTk/8EA5jz/GMzLdsAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAAAP1JREFUeNrs0sENgDAMBMGA6L9CCqACPhCHFvK8oHEFoz1v53W3vDuepyey3h7J6r0iWVVqTbOqjLh8raqh1jxrRNYaoSOG1hqVyTLi8i8fOmIiqrW9YWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYf2d9Q0AUbw7zW2De8kAAAAASUVORK5CYII=) top repeat-x;
  color: #1e395b;
  font-weight: normal;
  border-radius: 0;
}

.gc-smartMenu-item-hover,
.gc-smart-tag-hover,
.gc-filter-item-hover {
  background-color: #e1e8ec;
  color: #1d5987;
  font-weight: normal;
  text-shadow: none;
}

.gc-smart-tag-active {
  border: 1px solid #c28a30;
  background: #ffe475 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAEsCAIAAAAO9ne5AAAACXBIWXMAAAsTAAALEwEAmpwYAAAKT2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoCMFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89+bN/rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZCFz/SMBAPh+PDwrIsAHvgABeNMLCADATZvAMByH/w/qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2LjAFAtAGAnf+bTAICd+Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5ANgtADBJV2ZIALC3AMDOEAuyAAgMADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA/g88wAAKCRFRHgg/P9eM4Ors7ONo62Dl8t6r8G/yJiYuP+5c+rcEAAAOF0ftH+LC+zGoA7BoBt/qIl7gRoXgugdfeLZrIPQLUAoOnaV/Nw+H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl/AV/1s+X48/Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o9H/LcL//wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s+wM+3zUAsGo+AXuRLahdYwP2SycQWHTA4vcAAPK7b8HUKAgDgGiD4c93/+8//UegJQCAZkmScQAAXkQkLlTKsz/HCAAARKCBKrBBG/TBGCzABhzBBdzBC/xgNoRCJMTCQhBCCmSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD/phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBKLJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaPYw2oefQq2gP2o8+Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8+xdwQSgUXACTYEd0IgYR5BSFhMWE7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR+cQYYjIxh1hILCPWEo8TLxB7iEPENyQSiUMyJ7mQAkmxpFTSEtJG0m5SI+ksqZs0SBojk8naZGuyBzmULCAryIXkneTD5DPkG+Qh8lsKnWJAcaT4U+IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr+h0uhHdlR5Ol9BX0svpR+iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK+YTKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI+pXlN9rkZVM1PjqQnUlqtVqp1Q61MbU2epO6iHqmeob1Q/pH5Z/YkGWcNMw09DpFGgsV/jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY/R27iz2qqaE5QzNKM1ezUvOUZj8H45hx+Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onXCdHZ4/OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up+6Ynr5egJ5Mb6feeb3n+hx9L/1U/W36p/VHDFgGswwkBtsMzhg8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83MzaLN1pk1mz0x1zLnm+eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw+6TvZN9un2N/T0HDYfZDqsdWh1+c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLpc+Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26/uNu5p7ofcn8w0nymeWTNz0MPIQ+BR5dE/C5+VMGvfrH5PQ0+BZ7XnIy9jL5FXrdewt6V3qvdh7xc+9j5yn+M+4zw33jLeWV/MN8C3yLfLT8Nvnl+F30N/I/9k/3r/0QCngCUBZwOJgUGBWwL7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQfujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo+qi5qPNo3ujS6P8YuZlnM1VidWElsSxw5LiquNm5svt/87fOH4p3iC+N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi/RNtGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z+pn5mZ2y6xlhbL+xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a/zYnKOZarnivN7cyzytuQN5zvn//tEsIS4ZK2pYZLVy0dWOa9rGo5sjxxedsK4xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1+1dT1gvWd+1YfqGnRs+FYmKrhTbF5cVf9go3HjlG4dvyr+Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql+aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO/PLi8ZafJzs07P1SkVPRU+lQ27tLdtWHX+G7R7ht7vPY07NXbW7z3/T7JvttVAVVN1WbVZftJ+7P3P66Jqun4lvttXa1ObXHtxwPSA/0HIw6217nU1R3SPVRSj9Yr60cOxx++/p3vdy0NNg1VjZzG4iNwRHnk6fcJ3/ceDTradox7rOEH0x92HWcdL2pCmvKaRptTmvtbYlu6T8w+0dbq3nr8R9sfD5w0PFl5SvNUyWna6YLTk2fyz4ydlZ19fi753GDborZ752PO32oPb++6EHTh0kX/i+c7vDvOXPK4dPKy2+UTV7hXmq86X23qdOo8/pPTT8e7nLuarrlca7nuer21e2b36RueN87d9L158Rb/1tWeOT3dvfN6b/fF9/XfFt1+cif9zsu72Xcn7q28T7xf9EDtQdlD3YfVP1v+3Njv3H9qwHeg89HcR/cGhYPP/pH1jw9DBY+Zj8uGDYbrnjg+OTniP3L96fynQ89kzyaeF/6i/suuFxYvfvjV69fO0ZjRoZfyl5O/bXyl/erA6xmv28bCxh6+yXgzMV70VvvtwXfcdx3vo98PT+R8IH8o/2j5sfVT0Kf7kxmTk/8EA5jz/GMzLdsAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAAAiJJREFUeNrs3EFS6zAMAFCrkytzZM6Rv/gzUGzZKKSUMLwsGKap7WdJVtNNY399ade7bu2SFxYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFtb3X1vbRQsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwvrQtfWLvmDEBf9mYqt7aKltkTLSfxlXV7Ji9afipbnLUnUICRRbWmnooWFhYWFhYWFhYWFhYX1w19fI675rfrJ1xiFfby7tfjydLOpi0NWb9vODD4uSIemrGjPXK8crXimoBr1+5MYD0IcvBtnausrlFjOE8VopRMWNVHeyTBkUvLxiHhEeUsxD1vcsW5xoj4ie/s6HlHwfV7yR+sj3v/mb+s0kc6zlStgnbsY0Kmvc8TpaH2SiGy91dgYhvz/5/0k3g4W5joRMTmJnWYWrah0+XRPM/TbwoudjKx8iUm0+qljmHr0RbfjLF/to35IYuTtNB7BWqepC1I+8307XRyxSjajsPB9OcY6iWdYb4IxSLOzVo1WpbHvtQbxMRLRSiWfs9pivXTw+u7ixda7lw1ikcTJ1H129qHAY/jwTitv2vOKSTz3WH/8YaDYIFqWoEk77YO0TvE0Wkf71vgZEOWiHneSl/y/AQBmRiGyQdWs5AAAAABJRU5ErkJggg==) bottom repeat-x;
  font-weight: normal;
  color: #262626;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.gc-menu-item-input {
  width: 16px;
  height: 16px;
  margin: 1px;
  float: left;
  display: inline-block;
}

.gc-menu-item-text {
  font-size: var(--fs13);
  font-weight: normal;
  display: inline-block;
  float: left;
  padding-top: 2px;
  font-family: Arial;
}

.gc-fill-menu-container {
  box-shadow: rgba(0, 0, 0, 0.4) 1px 2px 5px;
  cursor: default;
}

.gc-toolstrip-default {
  background: white;
  border: 1px solid #aaaaaa;
}

.gc-toolstrip-button-style:active,
.gc-toolstrip-button-style {
  color: black;
  background: white;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.gc-tab-tip-span {
  background: #D6E6F9;
  color: black;
  border: 1px solid #D6E6F9;
  font-weight: normal;
}

.gc-spread-toolTip {
  border: 1px solid #a3b9d1;
  border-radius: 3px;
  background: #dae6f4 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAEsCAIAAAAO9ne5AAAACXBIWXMAAAsTAAALEwEAmpwYAAAKT2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoCMFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89+bN/rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZCFz/SMBAPh+PDwrIsAHvgABeNMLCADATZvAMByH/w/qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2LjAFAtAGAnf+bTAICd+Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5ANgtADBJV2ZIALC3AMDOEAuyAAgMADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA/g88wAAKCRFRHgg/P9eM4Ors7ONo62Dl8t6r8G/yJiYuP+5c+rcEAAAOF0ftH+LC+zGoA7BoBt/qIl7gRoXgugdfeLZrIPQLUAoOnaV/Nw+H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl/AV/1s+X48/Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o9H/LcL//wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s+wM+3zUAsGo+AXuRLahdYwP2SycQWHTA4vcAAPK7b8HUKAgDgGiD4c93/+8//UegJQCAZkmScQAAXkQkLlTKsz/HCAAARKCBKrBBG/TBGCzABhzBBdzBC/xgNoRCJMTCQhBCCmSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD/phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBKLJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaPYw2oefQq2gP2o8+Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8+xdwQSgUXACTYEd0IgYR5BSFhMWE7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR+cQYYjIxh1hILCPWEo8TLxB7iEPENyQSiUMyJ7mQAkmxpFTSEtJG0m5SI+ksqZs0SBojk8naZGuyBzmULCAryIXkneTD5DPkG+Qh8lsKnWJAcaT4U+IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr+h0uhHdlR5Ol9BX0svpR+iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK+YTKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI+pXlN9rkZVM1PjqQnUlqtVqp1Q61MbU2epO6iHqmeob1Q/pH5Z/YkGWcNMw09DpFGgsV/jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY/R27iz2qqaE5QzNKM1ezUvOUZj8H45hx+Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onXCdHZ4/OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up+6Ynr5egJ5Mb6feeb3n+hx9L/1U/W36p/VHDFgGswwkBtsMzhg8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83MzaLN1pk1mz0x1zLnm+eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw+6TvZN9un2N/T0HDYfZDqsdWh1+c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLpc+Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26/uNu5p7ofcn8w0nymeWTNz0MPIQ+BR5dE/C5+VMGvfrH5PQ0+BZ7XnIy9jL5FXrdewt6V3qvdh7xc+9j5yn+M+4zw33jLeWV/MN8C3yLfLT8Nvnl+F30N/I/9k/3r/0QCngCUBZwOJgUGBWwL7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQfujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo+qi5qPNo3ujS6P8YuZlnM1VidWElsSxw5LiquNm5svt/87fOH4p3iC+N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi/RNtGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z+pn5mZ2y6xlhbL+xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a/zYnKOZarnivN7cyzytuQN5zvn//tEsIS4ZK2pYZLVy0dWOa9rGo5sjxxedsK4xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1+1dT1gvWd+1YfqGnRs+FYmKrhTbF5cVf9go3HjlG4dvyr+Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql+aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO/PLi8ZafJzs07P1SkVPRU+lQ27tLdtWHX+G7R7ht7vPY07NXbW7z3/T7JvttVAVVN1WbVZftJ+7P3P66Jqun4lvttXa1ObXHtxwPSA/0HIw6217nU1R3SPVRSj9Yr60cOxx++/p3vdy0NNg1VjZzG4iNwRHnk6fcJ3/ceDTradox7rOEH0x92HWcdL2pCmvKaRptTmvtbYlu6T8w+0dbq3nr8R9sfD5w0PFl5SvNUyWna6YLTk2fyz4ydlZ19fi753GDborZ752PO32oPb++6EHTh0kX/i+c7vDvOXPK4dPKy2+UTV7hXmq86X23qdOo8/pPTT8e7nLuarrlca7nuer21e2b36RueN87d9L158Rb/1tWeOT3dvfN6b/fF9/XfFt1+cif9zsu72Xcn7q28T7xf9EDtQdlD3YfVP1v+3Njv3H9qwHeg89HcR/cGhYPP/pH1jw9DBY+Zj8uGDYbrnjg+OTniP3L96fynQ89kzyaeF/6i/suuFxYvfvjV69fO0ZjRoZfyl5O/bXyl/erA6xmv28bCxh6+yXgzMV70VvvtwXfcdx3vo98PT+R8IH8o/2j5sfVT0Kf7kxmTk/8EA5jz/GMzLdsAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAACmpJREFUeNrsXdmOG0kOZAj5/3+6j/u2yNiH5BGs7oF7pi2p2kMDHkt1KZJHMMgsYPCf//7P7vfnYbf881RY/JvHnwhLfxJ/cQ1eDwsTW7eHxXvCwjhxYA2sO8Hiu2Dxe0zB76zh8TSKwnceNSE/sAbWwBpYA2tgvREW3wLrl7+Kt8DCxNbA+jos3hMWxokDa2D9fFh8HqzvUNcTm31MbA2s18DiPWFhnHhjJ/KeTsS7FOkXnYgfEVu8J6ypiQNrYA2sgTWwBtYtYPGesDBOfDUsfvOWJ8HCN28ZghhYA+uFpPBVWHwtKXwVFia2BtZrYPGesDBOvK8TeU8n1tj2nk7Ez4gt3hPW1MSBNbAG1sAaWAPrDn94T1gYJ74cFp93y+O3hMJvv2Via2A9q1/6LbAwTvxDYfGesL711twLnIh/DovGsy6akb5G0khfLM14zpB2ucf8HFlfPzWUn/ej53JeHU8zs8X4GdZzYDSDwW8D4zDMCIAkAAgynLvBDgaxCpjRYHAYJAzwz2i4zhXrGFkuQKL2Bzbz0My2AbRd15/DiIvqSD5j8zwXVFudJ3TTwmC0ZUYeK/iy4yuMB1OaKO4G6L8ScYPCHJY7txU4uNlR2I1pQpzziXYxXOAhBfcgzQ7C8xxfLmqhBocCs21xNuIFDoUSMtjpzVh8C0ZG6BiX+L6MizAszo1o8Wh1JdoxCWCW+xkP35ZLkeNg3ZunVz3ueAxmFqGgQXwC/dgZBuJcSzu3kPUpFgnJW39C440wEdL7293DVeGa7i575fL9kQSNANUGRkK9W6aPHKOZRaie5ZkZiAjkhI74gnWO7BPs7vkIvGQInAvSGYS4FWDlIg3xOzufALPNE4Kx+ronsrPow4hFpaz8cO7K1GXZxu3EHmNKfXKOvFKi0Tq38XLiuPfBXYzr/zplM9Mq2f9A31UD6CjYgUn+kFk2WLWCUU7k+bkkksvMdhhDaYWWHkVUFyTPKtWdaM/Aiijgh5ICelKRzcbneqevTQJRfBgR4b9oUv2YaZllKaBnGJowCiHVGeJXB5xZZJ7bLO48kXisFeTeQgQSbUifCAmiRZEJCdVlELJzFFmkgiC3lM4MyMfudsmV7TIZN22fPCIZCbVLZpQ02KU7SLNN2/GUfdZOO8czjFpkRxSvvuZwSRYwSkFhhEHUOvZ62DhIEtv/2egkn1JAC4jfv/IxRc3MAsrmU1gTFWzCBVED2WqZRHWXTu05UrDO18fxB2lbcpTk9vR3a25J/B0fGUdJ20buxlzBBoxb4tHmP1YyM4/HrcvT2+MK1oSXhHpGelY/Yeq0E8hTkLfI5ag1QWCEVHqec6lsTwStHfkDqeNZqk2k5eEEf9gu0UpjSBYSH4QGvLptlKYojus6I6XFKnPj8+rQapOW88M5pVsRcc3Sj1ERpfiFqSArIOugmdHSiS0AoeLBVKGzjiCXkk9ItyZnSTGESOaSiF3zRxVYqZUU0+4UmRQSaowAKkBzSdCiEMsNYXPCLuUYS+ibmg6ki+bwTdSTlDOZbgiv7CJsv1pCil7CiuGZ6n3zKnG3pY4PGj1BCzOuTYabWsUycIugJEPcIj6Vy6pZkHZFIhJOviHeWqfJaPH8o/F0PpX/pdriDqZTUWFdeURrPMAsV0IvKk40JFCEzGpH/OwSwhbVxl6BW8RH/ySsYtplofqJiDpI/4jWFlLFZfVIS3uAyAhUCDd1XhjxQfFaWRy8epDRd6Yy//TZlUCLEajSA3MfBonGOTKTEqRmMOw6k3pFrQmIOoDH1xb6gdlGBW/esjJLuIN26/mGHU00PN+8+Yn0C9lo2CcXUG2Iw2hyKrOdupJqXxzx2trkCRsew2zJKW0vvWrASCivZXGB1I6UHVuLp2hALZBBp1ui6ZjFTNseLUDbiS8Wth2cyKjM2kZS7qHKXB7NCEmJAk1bbVQkrW7OhqytBtZmXNgyGXDPSdaizwGgfYpVM+4yW8quEMS1/dMFWnTDpfqygl4GZ2x1rtSHtD8w+1T+VfFd7eGsiRFCF/mQLapBawxaSb4MJVkzm9a+6cRM8NQYwGC2ok/x9N9tjOXPOTAsU5Wtl0SlFaQb9LhHVrrtdYc6oSNEnbo24RkkuVndIqqJ/POuvq4NeDqbHbKIwhtTLK0JMqfyXN+l9P3yA2DtiGyQSh5WcdxQmoYGZMmVnSYhRAbRWYgR713wYU6QXQ1sRWZBRozYl/65jVTNeJWGNQ8T5UQiGiJmF4yoJzlpDHqDERn9i9qtSCt9nWFLlNKuytLaQEImytW1WBijpk0EmwNFUC7p+LTXuc4fyy8hC5VI+qiSTXZvu6gjzwEinOadrQtKGGsuT5wKbTlVLXnobtt9GCFkwD60S/JMuYMsapCo3Gc82Obt/mWFjyOi3bxIDjj4pT1I9ZOMJjPLHG5C5o7i9JJh0T5oCYJxH5a3tGQOdURMnv6quoawIEN4sA0bUG3VFpVrjc83nf52THCKeCJBFptiZI3m2QcZn8xtm6NzhF9dhnc80kXq3JZV4SBBd65ctXORZo8yU3WXKkSPmjnKw3WndKltj6TGWAiZlc+JMTqDh1Hthi0XGLJLU1tMbZCrErXaiOq1KFVXG4SaevaZ+iVvWDM2hoIQwixplvN7Ru2pQUNNMWEXFqMSbTb9YNcKKp6287AYYRWjbdljcoEvWodRn2jiEKV1uItybKt6poUvSrASQEDOQb5hlb4FdjWbUROyb66dA6cNw+kOVND12XywSPohKpozEIOLm0SjwbiszxV1vNjp6jJ81MEO/3LfPGd2uOwb8BoALfxOqUaUatF9IUhzGwWhCnt5jOILgyhrHdQHd/YNIZmi1KZkqqPVtpVqrOYOpPaYHp/om0xK4rULU2MSF56mNmq7ZGxDikNriyp4EKtKAk+J6jSTs95QppD5M0Qi1bDDmFwDtCBJXU8hOtfyua0WuyxRvODzItOBFIuzaW2nL8mM1rbVKeKRHwVK/qXOWR7JZfy4L9YDl7VZVcN+jZMPQkBcxNrMkgKo7xyUQHI6DYueDhk6Xz2kkmnuRHq+src90OxCKJ0PEyDmQAJoW6rOhufz0m2bi0Q0HZ6ppb1aodE2eRmC6mZP/vfTje0Y21bpWzVEa7uzKger9pgW4CBV6C4VmNWz3qpwm1dCqBCNSYefOYLoEeqPrXK2ga31kIoRTdQpI9K7+soFnXCY440+bYO8QGO1CW25s3/p8u2yfdHHd52sL68ZkJ+/LaW5lgWC1xd16u6XvFb291+Vegks3BPWvBs4sO7xhu5vgYVx4sAaWANrYAks3hMWxokDa2ANrH8FLN4TFsaJA2tgPRMW7wkL48SBNbAG1sAaWANrYP1zWG9ROPwlrLcoHExsDaynjQUeL4viceLAGlg/H9bzajO/A+t5tRkTWwPrBsX7fbAwTryxE3lPJ/6O/0Pr411BfZvY4j1hTU0cWANrYA2sgTWwbgGL94SFceLLYfE90fMrWHhP9Exs/Ztg8Z6wME78Q2HxnrDwHnxfdiImtgbWwPpzYfGesDBOHFgDa2D9bFi8J6xg1/8PABXAJDp2K3ozAAAAAElFTkSuQmCC) 50% 50% repeat-x;
  font-weight: normal;
  color: #1e395b;
}

.gc-no-user-select {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
}

.gcsj-func-ac-popup {
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  font-size: var(--fs13);
  line-height: 22px;
  position: absolute;
  width: 300px;
  z-index: 2001;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.gcsj-func-ac-row {
  margin: 0;
  cursor: default;
  padding: 2px 10px;
  color: #666666;
}

.gcsj-func-ac-row-name {
  color: #222;
  font-size: var(--fs14);
  font-family: inconsolata, monospace, arial, sans, sans-serif;
  margin: -2px 0;
}

.gcsj-func-ac-row-description {
  color: #666;
  display: none;
  font-size: 11px;
  margin: -2px 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gcsj-ac-row-active {
  background-color: #f5f5f5;
  color: #000;
  border-top: 1px solid #ebebeb;
  border-bottom: 1px solid #ebebeb;
  padding: 1px 10px;
}

.gcsj-ac-row-active .gcsj-func-ac-row-description {
  display: block;
}

.gcsj-func-help-popup {
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  color: #222;
  font-size: 11px;
  word-wrap: break-word;
  position: absolute;
  width: 320px;
  z-index: 2001;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.gcsj-func-help-title {
  background-color: #f5f5f5;
  color: #222;
  font-size: var(--fs14);
  padding: 1px 0 1px 10px;
}

.gcsj-func-help-body {
  border-top: 1px solid #ebebeb;
  font-family: arial, sans-serif;
  overflow: hidden;
}

.gcsj-func-help-content {
  padding-bottom: 2px;
}

.gcsj-func-help-section {
  padding: 5px 10px;
}

.gcsj-func-help-section-title {
  font-size: 11px;
  color: #666;
}

.gcsj-func-help-section-content {
  font-size: 11px;
}

.gcsj-func-help-formula {
  font-family: inconsolata, monospace, arial, sans, sans-serif;
  padding: 1px 0;
}

.gcsj-func-help-paramter {
  padding-left: 1px;
}

.gcsj-func-help-paramter-active {
  background-color: #feb;
}

.gcsj-func-color-content {
  white-space: pre-wrap;
}

.gc-floatingobject-selected {
  border: 1px solid #939393;
}

.gc-floatingobject-unselected {
  background-color: transparent;
  border: 1px solid transparent;
}

.gc-floatingobject-container {
  position: absolute;
  overflow: hidden;
  box-sizing: content-box;
}

.gc-floatingobject-background-cover {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.gc-floatingobject-moving-container {
  position: absolute;
  overflow: hidden;
}

.gc-floatingobject-moving-div {
  position: absolute;
  border: 1px solid black;
}

.gc-floatingobject-resize-indicator {
  box-sizing: content-box;
}

.gc-floatingobject-resize-indicator-select {
  background-color: white;
  border-radius: 2px;
  -moz-border-radius: 1px;
  border: 1px solid #939393;
  z-index: 100;
}

.gc-floatingobject-resize-indicator-unSelect {
  display: none;
}

.gc-floatingobject-absolute {
  position: absolute;
}

.gc-floatingobject-content-container {
  box-sizing: content-box;
}

.gc-scroll-container {
  background-color: transparent;
  -moz-box-shadow: inset 3px 3px 10px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset 3px 3px 10px rgba(0, 0, 0, 0.1);
  box-shadow: inset 3px 3px 10px rgba(0, 0, 0, 0.1);
}

.gc-scroll-arrow {
  border: 1px solid transparent;
}

.gc-scroll-arrow .gc-scroll-arrowUp {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAFZJREFUOE+lzEEKgDAMAME+w4f1GdL/3zRIczFr6eJhKGyatHP0XzAaGA2MBkYDo4FxOsI1X5o/MIZcTp9HKL6Xl0dKCLScyv8SLIwGRgOjgdHAuK+3G1/tPpDiOzNYAAAAAElFTkSuQmCC);
  background-position: center;
}

.gc-scroll-arrow .gc-scroll-arrowDown {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAFhJREFUOE+lzLENgDAMAMGMwWAZA7F/B3ERKXZeiBfFFX7ZbufVf8FoYDQwGhgNjAbG4X6RdtOwOAY6jp5201DUJ9tx2EIxn+BxwGhgNDAaGA2MBsbvensACJQ+kE+RguMAAAAASUVORK5CYII=);
  background-position: center;
}

.gc-scroll-arrow .gc-scroll-arrowLeft {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAFNJREFUOE+l0bsJACAMRVHHcDDHEPfv/IBClFv4kuI0FxKCptpKCEYFRgVGBUYFRiNP/WkXjNsZdi2ww64Fdti1IHzBEnqDI/QLXzAqMCow/itpALcjPpCLrH+nAAAAAElFTkSuQmCC);
  background-position: center;
}

.gc-scroll-arrow .gc-scroll-arrowRight {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAFhJREFUOE+90UEKwCAMRFGP0YPlGNL772wDKRT7sRkCLt7mI4No66eVYFRgVGBUYFRgDON2TO0DY/CB3xGM4RlYjmAM7wFHZ/bcoPQGpV9IwajAqMCYZ+0CwpM+kB2Qf1kAAAAASUVORK5CYII=);
  background-position: center;
}

.gc-scroll-bar .gc-scrollbar-vertical {
  background-repeat: no-repeat;
}

.gc-scrollbar-vertical {
  background-position: center;
}

.gc-scroll-bar .gc-scrollbar-horizontal {
  text-indent: 0;
  background-repeat: no-repeat;
}

.gc-scrollbar-horizontal {
  background-position: center;
}

.gc-scrollbar-wrapper {
  background-color: transparent;
}

.gc-scroll-bar {
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

.gc-scroll-arrow-hover,
.gc-scrollbar-stateHover {
  border-color: #aaa;
}

.gc-scrollbar-stateActive {
  background-color: #ddd;
}

/*********************************************************************
    환경설정
**********************************************************************/
.settingWrap {
  height: 100%;
  overflow: auto;
  /* 20220221 김주현 환경설정 수정 (구조변경) */
}
.settingWrap.newSetting {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: var(--MainBgColor);
}
.settingWrap.newSetting .Setting {
  display: flex;
  width: 100%;
  height: 100%;
  padding: 0;
  border-top: 1px solid var(--BorderGreyLight);
  color: var(--MainFontColor);
  overflow: hidden;
}
.settingWrap.newSetting .Setting .settingLeftMenu {
  flex-shrink: 0;
  width: 200px;
  height: 100%;
  padding: 20px 0;
  background-color: var(--BgColorGrey);
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuTitle {
  padding-left: 25px;
  margin-bottom: 10px;
  color: var(--FontColorGrey);
  font-size: var(--fs13);
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li {
  font-size: var(--fs15);
  display: block;
  height: 44px;
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li input[type=radio] {
  display: none;
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li input[type=radio] + label {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 10px 20px 10px 25px;
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li input[type=radio] + label:hover {
  background-color: #eef0f5;
  cursor: pointer;
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li input[type=radio]:checked + label {
  background-color: #fff;
  color: var(--MainColor);
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li input[type=radio]:checked + label:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background-color: var(--MainColor);
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li input[type=radio]:checked + label:hover {
  background-color: #fff;
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li:focus-visible {
  cursor: pointer;
  outline: 1px solid var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingLeftMenu .menuList li:last-child {
  margin-bottom: 30px;
}
.settingWrap.newSetting .Setting .settingContent {
  width: 100%;
  padding: 20px 30px;
  overflow: auto;
}
.settingWrap.newSetting .Setting .settingContent > section {
  display: none;
  max-width: 700px;
  margin-bottom: 30px;
}
.settingWrap.newSetting .Setting .settingContent > section:first-child {
  display: block;
}
.settingWrap.newSetting .Setting .settingContent > section h2 {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--BorderGreyLight);
  font-size: var(--fs17);
  font-weight: 600;
}
.settingWrap.newSetting .Setting .settingContent > section h2.txtRight {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.settingWrap.newSetting .Setting .settingContent > section h2.txtRight .txtLastLogin {
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.settingWrap.newSetting .Setting .settingContent > section .box {
  padding: 0 0 20px;
  font-size: var(--fs14);
  border: none;
  background-color: transparent;
}
.settingWrap.newSetting .Setting .settingContent > section .box h3 {
  font-size: var(--fs14);
  font-weight: normal;
  margin: 0 0 15px 0;
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn {
  display: inline-block;
  border-radius: 5px;
  background-color: transparent;
  padding: 8px 16px;
  color: var(--MainFontColor);
  text-decoration: none;
  text-align: center;
  cursor: pointer;
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.primary {
  border-color: transparent;
  background-color: rgba(var(--MainColor-rgb), 0.1);
  color: var(--MainColor);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.primary:hover {
  background-color: rgba(var(--MainColor-rgb), 0.2);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.primary:active {
  background-color: rgba(var(--MainColor-rgb), 0.3);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.grey {
  border-color: transparent;
  background-color: rgba(var(--MainFontColorLighter-rgb), 0.1);
  color: var(--MainFontColorLighter);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.grey:hover {
  background-color: rgba(var(--MainFontColorLighter-rgb), 0.2);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.grey:active {
  background-color: rgba(var(--MainFontColorLighter-rgb), 0.3);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.outline {
  border: 1px solid var(--MainColor);
  background-color: var(--MainBgColor);
  color: var(--MainColor);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.outline:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.outline:active {
  background-color: rgba(var(--MainColor-rgb), 0.2);
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.w130 {
  min-width: 130px;
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.childBold span {
  display: inline-block;
  font-weight: bold;
  max-width: 200px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  margin-left: 5px;
}
.settingWrap.newSetting .Setting .settingContent > section .box .btn.dis {
  cursor: not-allowed;
  border: 1px solid var(--ControlBorderColorDis) !important;
  background-color: #b6b6b6 !important;
  color: var(--ControlFontColorDis) !important;
}
.settingWrap.newSetting .Setting .settingContent > section .box.borderBottom {
  margin-bottom: 20px;
  border-bottom: 1px solid var(--BorderGreyLight);
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap {
  position: relative;
  display: flex;
  padding: 10px 0 40px;
  gap: 20px;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .userPic {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .userPic > img {
  background-size: contain;
  height: 100%;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .firstText {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  margin-right: 20px;
  border-radius: 10px;
  background-color: var(--BgColorGrey);
  color: var(--InvertFontColor);
  font-size: var(--fs40);
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople {
  width: 100%;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople .topArea {
  display: flex;
  align-items: center;
  margin-bottom: 4px;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople .topArea .userInfoName {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--fs17);
  font-weight: bold;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople .topArea .mainAlarmTalkArea {
  display: flex;
  flex-shrink: 0;
  margin-left: auto;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople .topArea .mainAlarmTalkArea > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-left: 10px;
  border-radius: 5px;
  background-color: var(--BgColorGrey);
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople .topArea .mainAlarmTalkArea > a:hover {
  background-color: #ccd2e3;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople .topArea .mainAlarmTalkArea > a:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople .topArea .mainAlarmTalkArea > a.iconFax:before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background-position: 0 -88px;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople > p {
  display: flex;
  font-size: var(--fs13);
  margin-bottom: 6px;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople > p .userInfoDeptName {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--FontColorGrey);
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople > p .userInfoDeptName:after {
  content: "";
  width: 1px;
  height: 9px;
  background-color: var(--MainFontColorLighter);
  margin: 0 8px;
}
.settingWrap.newSetting .Setting .settingContent > section .InfoWrap .infoPeople > p .userInfoCompanyName {
  color: var(--FontColorGrey);
}
.settingWrap.newSetting .Setting .settingContent .settingItem {
  margin-bottom: 20px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtTitle {
  margin-bottom: 8px;
  color: var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  color: var(--MainFontColorLighter);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription .info {
  padding-right: 16px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription img {
  height: 30px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription.red {
  color: var(--errorColor);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription.currentStartPage span {
  display: inline-block;
  padding: 2px 5px;
  border-radius: 3px;
  color: var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription.sideBtn {
  display: inline-flex;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription.required {
  color: var(--ControlBgColorSelected);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .txtDescription .iconInfo {
  display: inline-block;
  width: 15px;
  height: 15px;
  background-position: 0 -143px;
  margin-right: 5px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem #setStartPgm {
  display: inline-flex;
  margin-right: 10px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem:last-child {
  margin-bottom: 0;
}
.settingWrap.newSetting .Setting .settingContent .settingItem.Dis .txtTitle {
  color: var(--MainFontColorLighter);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .txtWrap {
  margin-right: 10px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .txtWrap .title {
  display: block;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .txtWrap .title .status {
  margin-left: 4px;
  color: var(--ControlBgColorSelected);
  font-weight: bold;
  font-style: normal;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .txtWrap .title .status.off {
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .txtWrap .info {
  display: block;
  margin-top: 8px;
  color: var(--MainFontColorLighter);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .txtWrap .iconNewPage {
  position: absolute;
  top: calc(50% - 15px);
  left: 25px;
  display: flex;
  width: 36px;
  height: 30px;
  background-position: -48px 0;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .txtWrap .iconNewPage.window {
  background-position-y: -42px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .switch {
  position: relative;
  display: inline-block;
  width: 35px;
  height: 20px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .switch input {
  position: absolute;
  top: 0;
  left: 10px;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .switch input ~ .slider {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #bbb;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 24px;
  cursor: pointer;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .switch input ~ .slider:before {
  content: "";
  position: absolute;
  bottom: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  background-color: var(--MainBgColor);
  transition: 0.4s;
  border-radius: 50%;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .switch input:checked ~ .slider {
  background-color: var(--ControlBgColorSelected);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .switch input:checked ~ .slider:before {
  transform: translateX(15px);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .switch input:disabled ~ .slider {
  opacity: 0.35;
  cursor: default;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .switch input:focus-visible ~ .slider {
  outline: 1px solid var(--MainFontColor);
  outline-offset: 3px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap + .checkItemWrap {
  margin-top: 20px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap + .checkItemWrap .checkItem {
  margin-bottom: 0;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .fontWeightSlider {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 225px;
  gap: 16px;
  padding-top: 5px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .fontWeightSlider .slider {
  width: 180px;
  appearance: none;
  height: 4px;
  background: #ddd;
  border-radius: 2px;
  outline: none;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .fontWeightSlider .slider::-webkit-slider-thumb {
  appearance: none;
  width: 18px;
  height: 18px;
  background-color: var(--MainColor);
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid #fff;
  box-shadow: 0 3px 6px 0px rgba(0, 0, 0, 0.2);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .fontWeightSlider .slider::-moz-range-thumb {
  width: 18px;
  height: 18px;
  background-color: var(--MainColor);
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid #fff;
  box-shadow: 0 3px 6px 0px rgba(0, 0, 0, 0.2);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .fontWeightSlider .labels {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .fontWeightSlider .labels .txt {
  width: 60px;
  text-align: center;
  word-break: break-all;
  font-size: var(--fs13);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .fontWeightSlider .labels .txt.semibold {
  font-weight: 600;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .horizontalWrap .fontWeightSlider .labels .txt.bold {
  font-weight: 700;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap {
  display: inline-flex;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem input[type=radio] + label {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 100px;
  height: 36px;
  padding: 0 25px;
  background-color: var(--BgColorGrey);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem input[type=radio] + label:hover {
  background-color: #ccd2e3;
  cursor: pointer;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem input[type=radio] + label:before {
  display: none;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem input[type=radio]:checked + label {
  background-color: var(--ControlBgColorSelected);
  color: var(--InvertFontColor);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem input[type=radio]:checked + label:hover {
  background-color: var(--ControlBgColorSelected);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem input[type=radio]:focus-visible + label {
  outline: 1px solid var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem:first-child label {
  border-radius: 5px 0 0 5px;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem:last-child label {
  border-radius: 0 5px 5px 0;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .radioWrap .radioItem.Dis input[type=radio] + label {
  background-color: #ddd !important;
  color: #a9a9a9 !important;
  cursor: not-allowed !important;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .layoutControl {
  position: relative;
}
.settingWrap.newSetting .Setting .settingContent .settingItem .layoutControl > input {
  width: 100px;
  height: 26px;
  margin: 0;
}
.settingWrap.newSetting .Setting .settingContent .settingItem.greyBox {
  position: relative;
  padding: 20px 25px 20px 80px;
  border-radius: 5px;
  background-color: var(--BgColorGrey);
}
.settingWrap.newSetting .Setting .settingContent .checkItem {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin: 0 30px 10px 0;
}
.settingWrap.newSetting .Setting .settingContent .checkItem input[type=checkbox] {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 1px;
  height: 1px;
}
.settingWrap.newSetting .Setting .settingContent .checkItem input[type=checkbox] + label {
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.settingWrap.newSetting .Setting .settingContent .checkItem input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  margin: 0 10px 0 0;
  vertical-align: middle;
  background-color: var(--ControlBgColor);
  border: 1px solid var(--ControlBorderColor);
  cursor: pointer;
}
.settingWrap.newSetting .Setting .settingContent .checkItem input[type=checkbox]:checked + label::before {
  background-color: var(--ControlBgColorSelected);
  border-color: var(--ControlBgColorSelected);
}
.settingWrap.newSetting .Setting .settingContent .checkItem input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 6px;
  width: 5px;
  height: 10px;
  border-right: 2px solid var(--ControlFontColorSelected);
  border-bottom: 2px solid var(--ControlFontColorSelected);
  transform: rotate(45deg);
}
.settingWrap.newSetting .Setting .settingContent .checkItem input[type=checkbox]:focus-visible + label {
  outline: 1px solid var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingContent .selectBox {
  min-width: 125px;
  height: 36px;
  padding-left: 10px;
  border-color: var(--BorderGrey);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  color: var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingContent .selectBox option {
  padding: 0 5px;
}
.settingWrap.newSetting .Setting .settingContent .selectBox:focus {
  border: 2px solid var(--ControlBgColorSelected);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect {
  display: flex;
  gap: 12px;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio] {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 1px;
  height: 1px;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio] + label {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 32px;
  height: 32px;
  border-radius: 4px;
  cursor: pointer;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio] + label .bg01, .settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio] + label .bg02 {
  width: 100%;
  height: 16px;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio] + label .bg01 {
  border-radius: 3px 3px 0 0;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio] + label .bg02 {
  border-radius: 0 0 3px 3px;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio]:checked + label {
  border: 2px solid var(--MainColor);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio]:checked + label::before {
  content: "";
  position: absolute;
  top: -8px;
  right: -8px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: var(--MainColor);
  border: 1px solid var(--MainBgColor);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio]:checked + label::after {
  content: "";
  position: absolute;
  top: -5px;
  right: -2px;
  width: 3px;
  height: 6px;
  border-right: 2px solid var(--MainBgColor);
  border-bottom: 2px solid var(--MainBgColor);
  transform: rotate(45deg);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem input[type=radio]:focus-visible + label {
  outline: 1px solid var(--MainFontColor);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeLight input[type=radio] + label .bg01 {
  background-color: #D1D6DE;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeLight input[type=radio] + label .bg02 {
  background-color: #F8FAFF;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeRose input[type=radio] + label .bg01 {
  background-color: #FDD9E3;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeRose input[type=radio] + label .bg02 {
  background-color: #FFF1F5;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeOat input[type=radio] + label .bg01 {
  background-color: #E6E6CC;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeOat input[type=radio] + label .bg02 {
  background-color: #F6F6F2;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeGreen input[type=radio] + label .bg01 {
  background-color: #BDE0DC;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeGreen input[type=radio] + label .bg02 {
  background-color: #E7F5F2;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeSkyblue input[type=radio] + label .bg01 {
  background-color: #C4E1F1;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeSkyblue input[type=radio] + label .bg02 {
  background-color: #E9F7FF;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeLilac input[type=radio] + label .bg01 {
  background-color: #E4DBF6;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeLilac input[type=radio] + label .bg02 {
  background-color: #F9F5FF;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeDark input[type=radio] + label .bg01 {
  background-color: #3B3D3F;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeDark input[type=radio] + label .bg02 {
  background-color: #EAEDF3;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpRed input[type=radio] + label .bg01 {
  background-color: #92272E;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpRed input[type=radio] + label .bg02 {
  background-color: rgba(146, 39, 46, 0.1);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpBlue input[type=radio] + label .bg01 {
  background-color: #1971C1;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpBlue input[type=radio] + label .bg02 {
  background-color: rgba(25, 113, 193, 0.1);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpGreen input[type=radio] + label .bg01 {
  background-color: #228142;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpGreen input[type=radio] + label .bg02 {
  background-color: rgba(34, 129, 66, 0.1);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpPurple input[type=radio] + label .bg01 {
  background-color: #6544A7;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpPurple input[type=radio] + label .bg02 {
  background-color: rgba(101, 68, 167, 0.1);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpMint input[type=radio] + label .bg01 {
  background-color: #278883;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpMint input[type=radio] + label .bg02 {
  background-color: rgba(39, 136, 131, 0.1);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpSand input[type=radio] + label .bg01 {
  background-color: #A9631D;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeCpSand input[type=radio] .bg02 {
  background-color: rgba(169, 99, 29, 0.1);
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeSystemEver input[type=radio] + label .bg01 {
  background-color: #3F51B5;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeSystemEver input[type=radio] + label .bg02 {
  background-color: #EDEFFF;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeSCF input[type=radio] + label .bg01 {
  background-color: #288BAE;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeSCF input[type=radio] + label .bg02 {
  background-color: #E7F9FF;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeMetatime input[type=radio] + label .bg01 {
  background-color: #6859F8;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeMetatime input[type=radio] + label .bg02 {
  background-color: #EEEDFF;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeSamil input[type=radio] + label .bg01 {
  background-color: #92272E;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeSamil input[type=radio] + label .bg02 {
  background-color: #FFEDEF;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeKotra input[type=radio] + label .bg01 {
  background-color: #02693C;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themeKotra input[type=radio] + label .bg02 {
  background-color: #EDFFF7;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themePratama input[type=radio] + label .bg01 {
  background-color: #FF5A00;
}
.settingWrap.newSetting .Setting .settingContent .themeSelect .themeCheckItem.themePratama input[type=radio] + label .bg02 {
  background-color: #FFF3EC;
}
.settingWrap.newSetting .Setting .settingContent input#setStartPageOn ~ .txtDescription {
  display: none;
}
.settingWrap.newSetting .Setting .settingContent input#setStartPageOn:checked ~ .txtDescription {
  display: block;
}

.msgWrap.popupInSettingWrap {
  z-index: 1;
}
.msgWrap.popupInSettingWrap .msgBox {
  width: 340px;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item {
  margin-bottom: 20px;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item label {
  display: block;
  margin-bottom: 7px;
  font-size: var(--fs13);
  font-weight: bold;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap {
  position: relative;
  width: 100%;
  height: 36px;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap:hover .btnDelTxt {
  opacity: 1;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap input[type=password], .msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap input[type=text] {
  width: 100%;
  height: 36px;
  padding: 0 55px 0 8px;
  border-radius: 5px;
  border: 1px solid #e6e6e6;
  transition: border-color 0.3s;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap input[type=password]:focus, .msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap input[type=text]:focus {
  border-color: var(--ControlBgColorSelected);
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap input[type=password]:focus + .btnDelTxt, .msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap input[type=text]:focus + .btnDelTxt {
  opacity: 1;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .btnDelTxt {
  opacity: 0;
  position: absolute;
  top: 9px;
  right: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #c4c4c4;
  cursor: pointer;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .btnDelTxt > i {
  width: 7px;
  height: 7px;
  background-position: 0 -192px;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .btnDelTxt:hover {
  background-color: #aaa;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .btnDelTxt:focus-visible {
  opacity: 1;
  outline: 1px solid var(--MainFontColor);
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .showPw {
  position: absolute;
  top: 6px;
  right: 7px;
  width: 21px;
  height: 21px;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .showPw input[type=checkbox] {
  position: absolute;
  top: 0;
  left: 10px;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .showPw input[type=checkbox] + label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  opacity: 0.8;
  cursor: pointer;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .showPw input[type=checkbox] + label > i {
  width: 18px;
  height: 17px;
  background-position: -27px -166px;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .showPw input[type=checkbox] + label:hover {
  opacity: 1;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .showPw input[type=checkbox]:checked + label > i {
  width: 18px;
  height: 12px;
  background-position: 0 -168px;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item .inputWrap .showPw input[type=checkbox]:focus-visible + label {
  opacity: 1;
  outline: 1px solid var(--MainFontColor);
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .item:last-child {
  margin-bottom: 0;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .infoWrap {
  display: flex;
  margin: 5px 0;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .infoWrap > i {
  display: inline-block;
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  background-position: 0 -143px;
  margin-right: 5px;
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .infoWrap .txt {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.msgWrap.popupInSettingWrap .msgBox .msgContent .errorTxt {
  font-size: var(--fs13);
  margin-top: 8px;
  color: var(--errorColor);
}
.boardWrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--DimColor);
  display: flex;
  width: 100%;
  height: 100%;
  overflow: auto;
  z-index: 20;
}
.boardWrap::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.boardWrap::-webkit-scrollbar-track {
  background-color: transparent;
}
.boardWrap::-webkit-scrollbar-track:hover {
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.boardWrap::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.4);
}
.boardWrap::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.25);
}
.boardWrap::-webkit-scrollbar-thumb:active {
  background-color: rgba(0, 0, 0, 0.4);
}
.boardWrap::-webkit-scrollbar-corner {
  background-color: transparent;
}
.boardWrap::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  background-color: transparent;
}
.boardWrap {
  scrollbar-face-color: transparent;
  scrollbar-track-color: transparent;
  scrollbar-3dlight-color: transparent;
  scrollbar-highlight-color: transparent;
  scrollbar-darkshadow-color: transparent;
  scrollbar-shadow-color: transparent;
  scrollbar-arrow-color: transparent;
}
.boardWrap::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255, 255, 255, 0.6);
}
.boardWrap::-webkit-scrollbar-thumb:active {
  background-color: rgba(255, 255, 255, 0.8);
}
.boardWrap.preview > .boardArea > .titleArea > .btnRight > .checkArea {
  display: none;
}
.boardWrap.preview > .boardArea > .contentArea > .listArea {
  display: none;
}
.boardWrap.preview > .boardArea > .contentArea > .listArea > .btnList {
  display: none;
}
.boardWrap.listHidden > .boardArea > .contentArea > .listArea {
  width: 54px;
  border-right: 1px solid #eee;
  background-color: var(--PopupBgColor);
}
.boardWrap.listHidden > .boardArea > .contentArea > .listArea .tabArea, .boardWrap.listHidden > .boardArea > .contentArea > .listArea .searchArea, .boardWrap.listHidden > .boardArea > .contentArea > .listArea .ulBoard {
  display: none;
}
.boardWrap.listHidden > .boardArea > .contentArea > .detailArea .contentsWrap > .titleArea > .btnArea {
  display: flex;
  flex-wrap: nowrap;
}
.boardWrap.listShow > .boardArea > .contentArea > .listArea {
  width: var(--boardListWidth);
}
.boardWrap > .boardArea {
  display: flex;
  flex-direction: column;
  margin: auto;
  width: 1000px;
  height: 660px;
  border-radius: 10px;
  background-color: var(--MainBgColor);
  box-shadow: 0 4px 44px rgba(0, 0, 0, 0.15);
  overflow: hidden;
}
.boardWrap > .boardArea > .titleArea {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  padding: 0 16px 0 24px;
  border-bottom: 1px solid var(--BorderGreyLight);
}
.boardWrap > .boardArea > .titleArea .title {
  flex-shrink: 0;
  color: var(--MainFontColor);
  font-size: var(--fs20);
  font-weight: 700;
}
.boardWrap > .boardArea > .titleArea .btnRight {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
}
.boardWrap > .boardArea > .titleArea .btnRight > .checkArea {
  display: inline-flex;
  align-items: center;
  height: 26px;
  margin-right: 16px;
  border-radius: 13px;
}
.boardWrap > .boardArea > .titleArea .btnRight > .checkArea > input[type=checkbox] + label {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-size: var(--fs13);
}
.boardWrap > .boardArea > .titleArea .btnRight > .checkArea > input[type=checkbox] + label:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 2px;
  background-color: var(--MainBgColor);
}
.boardWrap > .boardArea > .titleArea .btnRight > .checkArea > input[type=checkbox] + label:hover {
  cursor: pointer;
}
.boardWrap > .boardArea > .titleArea .btnRight > .checkArea > input[type=checkbox]:checked + label:before {
  border-color: var(--MainColor);
  background-color: var(--MainColor);
}
.boardWrap > .boardArea > .titleArea .btnRight > .checkArea > input[type=checkbox]:checked + label:after {
  content: "";
  position: absolute;
  left: 4px;
  top: 4px;
  display: inline-block;
  width: 8px;
  height: 4px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(134deg);
}
.boardWrap > .boardArea > .titleArea .btnRight > .checkArea + .checkArea {
  margin-left: 10px;
}
.boardWrap > .boardArea > .titleArea .btnRight > .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
}
.boardWrap > .boardArea > .titleArea .btnRight > .btnClose:hover {
  background-color: rgba(var(--MainFontColor-rgb), 0.1);
  cursor: pointer;
}
.boardWrap > .boardArea > .contentArea {
  display: flex;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.boardWrap > .boardArea > .contentArea > .listArea {
  position: relative;
  display: flex;
  flex-flow: column;
  flex-shrink: 0;
  width: var(--boardListWidth);
  height: 100%;
  background-color: #F7F8F9;
  overflow: hidden;
  transition: 0.3s;
}
.boardWrap > .boardArea > .contentArea > .listArea > .btnList {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  marign-left: auto;
  border-radius: 50%;
}
.boardWrap > .boardArea > .contentArea > .listArea > .btnList:hover {
  background-color: rgba(var(--MainFontColor-rgb), 0.1);
  cursor: pointer;
}
.boardWrap > .boardArea > .contentArea > .listArea > .btnList.newNoti:after {
  content: "";
  position: absolute;
  top: 4px;
  right: 2px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #F53A5D;
}
.boardWrap > .boardArea > .contentArea > .listArea > .tabArea {
  display: flex;
  flex-shrink: 0;
  width: 100%;
  min-width: var(--boardListWidth);
  padding: 10px 16px 0;
  gap: 8px;
  overflow-x: hidden;
}
.boardWrap > .boardArea > .contentArea > .listArea > .tabArea > span {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 40px;
  color: rgba(var(--MainFontColor-rgb), 0.6);
  font-size: var(--fs14);
  font-weight: 700;
}
.boardWrap > .boardArea > .contentArea > .listArea > .tabArea > span:hover {
  color: var(--MainFontColor);
  cursor: pointer;
}
.boardWrap > .boardArea > .contentArea > .listArea > .tabArea > span.newNoti:after {
  content: "";
  position: absolute;
  top: 4px;
  right: 2px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #F53A5D;
}
.boardWrap > .boardArea > .contentArea > .listArea > .tabArea > span.active {
  color: rgba(var(--InvertFontColor-rgb));
  background-color: #41494D;
}
.boardWrap > .boardArea > .contentArea > .listArea > .searchArea {
  flex-shrink: 0;
  min-width: var(--boardListWidth);
  padding: 10px 16px;
  overflow: hidden;
}
.boardWrap > .boardArea > .contentArea > .listArea > .searchArea .inputBox {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px 0 10px;
  border: 1px solid transparent;
  border-radius: 4px;
  background-color: #E8EBED;
}
.boardWrap > .boardArea > .contentArea > .listArea > .searchArea .inputBox > i {
  flex-shrink: 0;
}
.boardWrap > .boardArea > .contentArea > .listArea > .searchArea .inputBox > input[type=text] {
  width: 100%;
  height: 32px;
  padding: 0 4px;
  border: none;
  background-color: transparent;
  font-size: var(--fs14);
}
.boardWrap > .boardArea > .contentArea > .listArea > .searchArea .inputBox > input[type=text]:valid + .btnDelSearch {
  display: flex;
  align-items: center;
  justify-content: center;
}
.boardWrap > .boardArea > .contentArea > .listArea > .searchArea .inputBox .btnDelSearch {
  display: none;
  position: relative;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  cursor: pointer;
}
.boardWrap > .boardArea > .contentArea > .listArea > .searchArea .inputBox:focus-within {
  border-color: var(--BorderColor);
  background-color: var(--MainBgColor);
}
.boardWrap > .boardArea > .contentArea > .listArea > .searchArea .inputBox:has(input[type=text]:not(:placeholder-shown)) {
  border-color: var(--BorderColor);
  background-color: var(--MainBgColor);
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard {
  display: flex;
  flex-direction: column;
  min-width: var(--boardListWidth);
  height: 100%;
  padding: 0 16px 10px;
  gap: 6px;
  overflow-y: auto;
  overflow-x: hidden;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li {
  position: relative;
  padding: 14px 16px;
  border: 1px solid #EAEAEA;
  border-radius: 6px;
  background-color: var(--MainBgColor);
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li > .labelArea {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 4px;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li > .labelArea > .label {
  padding: 2px 4px;
  border-radius: 2px;
  background-color: #EDEFF4;
  color: var(--FontColorGrey1);
  font-size: var(--fs12);
  font-weight: 600;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li > .labelArea > .label.system {
  background-color: #E5F1FF;
  color: #3980D7;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li > .labelArea > .new {
  display: none;
  color: #F53A5D;
  font-size: var(--fs13);
  font-weight: 600;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li > .txtTitle {
  font-size: var(--fs13);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-wrap: break-word;
  line-height: 15px;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li .txtDate {
  padding-top: 6px;
  color: var(--FontColorGrey);
  font-size: var(--fs12);
  font-weight: 500;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li:hover {
  border-color: #9e9e9e;
  cursor: pointer;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li.selected {
  border-color: var(--MainColor);
  background-color: rgba(var(--MainColor), 0.05);
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li.selected > .txtTitle {
  font-weight: 700;
}
.boardWrap > .boardArea > .contentArea > .listArea > .ulBoard > li.newNoti > .labelArea .new {
  display: block;
}
.boardWrap > .boardArea > .contentArea > .listArea > .noData {
  display: flex;
  align-items: center;
  flex-direction: column;
  height: 100%;
  padding-top: 150px;
  gap: 10px;
}
.boardWrap > .boardArea > .contentArea > .listArea > .noData > .txt {
  color: var(--FontColorGrey1);
  font-size: var(--fs13);
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea {
  flex-shrink: 0;
  position: relative;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border-radius: 50%;
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .btn:hover, .boardWrap > .boardArea > .contentArea > .listArea .pageArea > .btn:focus {
  background-color: #dedede;
  cursor: pointer;
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .btn.Prev::before, .boardWrap > .boardArea > .contentArea > .listArea .pageArea > .btn.Next::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-width: 0px 0 1px 1px;
  border-style: solid;
  border-color: var(--MainFontColor);
  transform: rotate(45deg);
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .btn.Next::before {
  transform: rotate(-135deg);
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .btn.Dis {
  opacity: 0.3;
  cursor: default;
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .btn.Dis:hover {
  background-color: transparent;
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .ulPage {
  display: flex;
  align-items: center;
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .ulPage > li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  margin: 0 1px;
  color: var(--ulPageLi);
  font-size: var(--fs13);
  border-radius: 50%;
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .ulPage > li.Selected {
  font-weight: bold;
  color: var(--MainColor);
}
.boardWrap > .boardArea > .contentArea > .listArea .pageArea > .ulPage > li:hover, .boardWrap > .boardArea > .contentArea > .listArea .pageArea > .ulPage > li:focus {
  background-color: #dedede;
  cursor: pointer;
}
.boardWrap > .boardArea > .contentArea > .listArea.hiddenTab > .tabArea {
  display: none;
}
.boardWrap > .boardArea > .contentArea > .listArea.hiddenTab > .searchArea {
  padding-right: 50px;
}
.boardWrap > .boardArea > .contentArea > .detailArea {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  margin: 0 16px;
  padding: 16px 8px;
  border-bottom: 1px solid var(--BorderGreyLight);
  gap: 6px;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .txtLabel {
  display: flex;
  align-items: center;
  gap: 6px;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .txtLabel > .label {
  color: var(--FontColorGrey1);
  font-size: var(--fs15);
  font-weight: 500;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .txtLabel > .new {
  color: #F53A5D;
  font-size: var(--fs13);
  font-weight: 600;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .txtTitle {
  flex-shrink: 0;
  font-size: var(--fs18);
  font-weight: 700;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .txtDescription {
  display: flex;
  align-items: center;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .txtDescription > span {
  display: block;
  padding-right: 8px;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .txtDescription > span + span {
  display: flex;
  align-items: center;
  justify-content: center;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .txtDescription > span + span::before {
  content: "";
  width: 1px;
  height: 13px;
  margin-right: 8px;
  background-color: var(--BorderGrey);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .btnArea {
  position: absolute;
  top: 34px;
  right: 24px;
  display: none;
  gap: 10px;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .btnArea > .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 50%;
  background-color: var(--MainBgColor);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .btnArea > .btn:not(.Dis):hover {
  border-color: #ccc;
  cursor: pointer;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .titleArea > .btnArea > .btn.Dis > i {
  opacity: 0.4;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content {
  width: 100%;
  height: 100%;
  padding: var(--boardPaddingV) var(--boardPaddingH);
  background-color: var(--PopupBgColor);
  overflow: auto;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox {
  width: 100%;
  font-size: var(--fs13);
  word-break: break-all;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox ul, .boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox ol, .boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox li, .boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox table {
  all: revert;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox table {
  width: 100%;
  margin: 0 0 1em;
  border-spacing: 0;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox table, .boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox table td {
  border: 1px dotted #ccc;
  outline: 0;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox table td {
  min-width: 1px;
  padding: 0.2em 0.3em;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox img {
  display: block;
  max-width: 100%;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox a {
  display: inline-flex;
  width: 100%;
  margin: 5px 0;
  padding: 6px 16px 6px 10px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 3px;
  font-size: var(--fs13);
  font-weight: 500;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .content .contBox a::before {
  content: "";
  width: 16px;
  height: 16px;
  margin-right: 4px;
  background-position: -64px -22px;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea {
  flex-shrink: 0;
  min-height: 60px;
  color: var(--MainFontColor);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul .item {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  font-size: var(--fs13);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul .item > .icon {
  display: inline-flex;
  padding: 2px 8px;
  border-radius: 10px;
  margin-right: 4px;
  background-color: var(--colorGrey);
  color: var(--colorWhite);
  font-style: normal;
  font-size: var(--fs11);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul .item > .icon.Img {
  background-color: var(--FileUploadTypeImgBg);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul .item > .icon.Text {
  background-color: var(--FileUploadTypeTextBg);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul .item > .icon.Etc {
  background-color: var(--FileUploadTypeEtcBg);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul .item > .name {
  font-weight: bold;
  margin-right: 4px;
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul .item > .size {
  color: var(--colorGrey);
}
.boardWrap > .boardArea > .contentArea > .detailArea > .contentsWrap > .attachFileArea ul .item:Hover {
  background-color: #eaeaea;
  cursor: pointer;
  border-radius: 4px;
}

.notiAreaWrap {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 20;
}
.notiAreaWrap:before {
  content: "";
  position: fixed;
  top: 0;
  width: calc(100% - 200px);
  height: 50px;
  z-index: 20;
}
.notiAreaWrap .notiArea {
  position: fixed;
  top: 43px;
  right: 3px;
  display: flex;
  flex-direction: column;
  width: 350px;
  height: calc(100% - 200px);
  padding: 0;
  border-radius: 10px;
  border: 1px solid #F1F4F6;
  background-color: var(--MainBgColor);
  font-size: var(--fs14);
  box-shadow: var(--rightPanelBoxShadow);
}
.notiAreaWrap .notiArea .noticeArea {
  flex-shrink: 0;
  max-height: 50px;
  border-bottom: 1px solid #DBDBDB;
  overflow: hidden;
  transition: max-height 0.3s;
}
.notiAreaWrap .notiArea .noticeArea.Expand {
  max-height: 500px;
}
.notiAreaWrap .notiArea .noticeArea.Expand > .titleWrap > .titleExpandArea .btnExpander > i::before {
  transform: rotate(45deg);
}
.notiAreaWrap .notiArea .noticeArea.Expand > .titleWrap > .titleExpandArea .btnExpander > i::after {
  transform: rotate(-45deg);
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap {
  width: 100%;
  height: 50px;
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea {
  display: flex;
  align-items: center;
  width: 100%;
  height: 50px;
  padding: 0 0 0 20px;
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .title {
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: var(--fs15);
  color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .title > i {
  margin-right: 4px;
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .title > .btnRefresh {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  opacity: 0.5;
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .title > .btnRefresh:hover {
  opacity: 1;
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .btnExpander {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  width: 50px;
  height: 50px;
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .btnExpander > i {
  position: relative;
  transition: all 0.3s;
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .btnExpander > i::before, .notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .btnExpander > i::after {
  content: "";
  width: 9px;
  height: 1px;
  background-color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .btnExpander > i::before {
  position: absolute;
  top: 0;
  left: -6px;
  transform: rotate(135deg);
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea .btnExpander > i::after {
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-135deg);
}
.notiAreaWrap .notiArea .noticeArea > .titleWrap > .titleExpandArea:hover {
  background-color: rgba(var(--InvertBgColor-rgb), 0.1);
  color: inherit;
}
.notiAreaWrap .notiArea .noticeArea .noticeList {
  margin-top: 5px;
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a {
  position: relative;
  display: block;
  width: 100%;
  padding: 10px 20px;
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a:hover {
  background-color: rgba(var(--InvertBgColor-rgb), 0.1);
  color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a .titleWrap {
  display: flex;
  align-items: flex-start;
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a .titleWrap .txtNb {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 14px;
  padding: 0 7px;
  background-color: #c9d0dd;
  border-radius: 10px;
  font-size: var(--fs11);
  color: #fff;
  line-height: 12px;
  margin-right: 5px;
  margin-top: 2px;
  display: none;
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a .titleWrap .txtTitle {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a .infoWrap {
  font-size: var(--fs13);
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a .infoWrap > span {
  position: relative;
  color: var(--MainFontColorLighter);
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a .infoWrap > span:last-child {
  padding-left: 10px;
}
.notiAreaWrap .notiArea .noticeArea .noticeList .item > a .infoWrap > span:last-child::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 0;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background-color: var(--MainFontColorLighter);
}
.notiAreaWrap .notiArea .noticeArea .footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  height: 50px;
  padding: 0 15px;
  z-index: 10;
}
.notiAreaWrap .notiArea .noticeArea .footer .btnNotice {
  display: flex;
  align-items: center;
  height: 100%;
  font-size: var(--fs13);
  color: #3466FF;
}
.notiAreaWrap .notiArea .noticeArea .footer .btnNotice:hover {
  color: #002cb4;
}
.notiAreaWrap .notiArea .noticeArea .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  margin: 0 0 20px 0;
}
.notiAreaWrap .notiArea .noticeArea .noData > i {
  margin-bottom: 10px;
}
.notiAreaWrap .notiArea .noticeArea .noData .txt {
  color: #999;
  font-size: var(--fs13);
}
.notiAreaWrap .notiArea .msgArea {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0;
  overflow: hidden;
}
.notiAreaWrap .notiArea .msgArea > .titleWrap {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  padding: 0 15px;
}
.notiAreaWrap .notiArea .msgArea > .titleWrap .title {
  display: flex;
  align-items: center;
  color: var(--MainFontColor);
  font-size: var(--fs15);
  font-weight: bold;
}
.notiAreaWrap .notiArea .msgArea > .titleWrap .title > i {
  margin-right: 4px;
}
.notiAreaWrap .notiArea .msgArea > .titleWrap .title > .btnRefresh {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  opacity: 0.5;
}
.notiAreaWrap .notiArea .msgArea > .titleWrap .title > .btnRefresh:hover {
  opacity: 1;
}
.notiAreaWrap .notiArea .msgArea > .titleWrap .btnWrap {
  display: flex;
  margin-left: auto;
}
.notiAreaWrap .notiArea .msgArea > .titleWrap .btnWrap > a {
  display: flex;
  align-items: center;
  font-size: var(--fs12);
  color: var(--MainFontColorLighter);
}
.notiAreaWrap .notiArea .msgArea > .titleWrap .btnWrap > a:last-child::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  background-color: #ccc;
  margin: 0 8px;
}
.notiAreaWrap .notiArea .msgArea > .titleWrap .btnWrap > a:hover {
  color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .msgArea .sortTab {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  height: 20px;
  margin-bottom: 15px;
  padding: 0 25px;
}
.notiAreaWrap .notiArea .msgArea .sortTab > a {
  color: var(--MainFontColorLighter);
  margin-right: 15px;
  font-size: var(--fs13);
}
.notiAreaWrap .notiArea .msgArea .sortTab > a .count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 16px;
  line-height: 12px;
  margin-left: 4px;
  color: var(--MainFontColorLighter);
}
.notiAreaWrap .notiArea .msgArea .sortTab > a:hover {
  color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .msgArea .sortTab > a.On {
  font-weight: bold;
  color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .msgArea .sortTab > a.On .count {
  color: var(--MainColor);
}
.notiAreaWrap .notiArea .msgArea .msgList {
  height: 100%;
  overflow-y: scroll;
  padding-bottom: 50px;
}
.notiAreaWrap .notiArea .msgArea .msgList ul {
  padding: 3px 20px;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap {
  position: relative;
  display: flex;
  min-height: 80px;
  margin-bottom: 10px;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.New .timeline .dot {
  background-color: var(--MainColor);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.New .item .titleWrap .title {
  font-weight: bold;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand .item {
  max-height: 1000px;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand .item .titleWrap .title {
  height: auto;
  -webkit-line-clamp: inherit;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand .item .titleWrap .btnWrap .btnExpander > i {
  position: relative;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand .item .titleWrap .btnWrap .btnExpander > i::before, .notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand .item .titleWrap .btnWrap .btnExpander > i::after {
  content: "";
  width: 7px;
  height: 1.5px;
  background-color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand .item .titleWrap .btnWrap .btnExpander > i::before {
  position: absolute;
  top: 0;
  left: -4px;
  transform: rotate(45deg);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand .item .titleWrap .btnWrap .btnExpander > i::after {
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-45deg);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand .item .msgContentWrap {
  display: block;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap.Expand:hover .item {
  background-color: transparent;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap:last-child {
  margin-bottom: 0;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap:hover .item {
  background-color: rgba(var(--InvertBgColor-rgb), 0.1);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap:hover .item .titleWrap .btnWrap .btnClear {
  display: flex;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .timeline {
  position: absolute;
  top: 20px;
  left: 12px;
  width: 6px;
  height: 6px;
  flex-shrink: 0;
  z-index: 9;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .timeline .dot {
  display: flex;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: transparent;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item {
  position: relative;
  width: 100%;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  overflow: hidden;
  transition: all 0.3s;
  cursor: pointer;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap {
  min-height: 80px;
  padding: 12px 35px 12px 28px;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .title {
  display: -webkit-box;
  height: 34px;
  margin-bottom: 5px;
  font-size: var(--fs14);
  overflow: hidden;
  -webkit-line-clamp: 2;
  word-break: break-all;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .txtDate {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap {
  position: absolute;
  top: 8px;
  right: 10px;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnExpander {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-bottom: 5px;
  opacity: 0.3;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnExpander > i {
  position: relative;
  transition: all 0.3s;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnExpander > i::before, .notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnExpander > i::after {
  content: "";
  width: 7px;
  height: 1.5px;
  background-color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnExpander > i::before {
  position: absolute;
  top: 0;
  left: -4px;
  transform: rotate(135deg);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnExpander > i::after {
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-135deg);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnExpander:hover {
  opacity: 1;
  cursor: pointer;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnClear {
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
  width: 30px;
  height: 30px;
  opacity: 0.7;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .titleWrap .btnWrap .btnClear:hover {
  opacity: 1;
  cursor: pointer;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap {
  display: none;
  padding: 5px 16px 12px 24px;
  cursor: auto;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .msgContent {
  margin-left: 4px;
  padding: 0;
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm {
  display: flex;
  align-items: center;
  width: 100%;
  height: 34px;
  border-radius: 8px;
  background-color: #E9F8FF;
  padding: 5px;
  margin-top: 15px;
  transition: all 0.2s;
  cursor: pointer;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm:hover {
  background-color: #D9F3FF;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm .iconPgm {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  margin-right: 10px;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm .txtTitle {
  font-weight: bold;
  font-size: var(--fs13);
  color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm .iconGoToPgmArrow {
  position: relative;
  width: 8px;
  height: 12px;
  margin-left: auto;
  margin-right: 5px;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm .iconGoToPgmArrow::before, .notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm .iconGoToPgmArrow::after {
  content: "";
  width: 7px;
  height: 1.5px;
  background-color: #3084E4;
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm .iconGoToPgmArrow::before {
  position: absolute;
  top: 7px;
  right: 0;
  transform: rotate(-45deg);
}
.notiAreaWrap .notiArea .msgArea .msgList ul .itemWrap .item .msgContentWrap .btnGoToPgm .iconGoToPgmArrow::after {
  position: absolute;
  top: 3px;
  right: 0;
  transform: rotate(45deg);
}
.notiAreaWrap .notiArea .msgArea .msgList .moreItem {
  position: relative;
  display: flex;
  margin: 10px 20px;
}
.notiAreaWrap .notiArea .msgArea .msgList .moreItem .timeline {
  display: none;
}
.notiAreaWrap .notiArea .msgArea .msgList .moreItem .btnMore {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 40px;
  color: var(--MainColor);
  font-size: var(--fs13);
  font-weight: bold;
  transition: all 0.3s;
  cursor: pointer;
}
.notiAreaWrap .notiArea .msgArea .msgList .moreItem .btnMore:hover {
  text-decoration: underline;
}
.notiAreaWrap .notiArea .msgArea .msgList .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.notiAreaWrap .notiArea .msgArea .msgList .noData > i {
  margin-bottom: 10px;
}
.notiAreaWrap .notiArea .msgArea .msgList .noData .txt {
  color: #999;
  font-size: var(--fs13);
}
.notiAreaWrap .notiArea .msgArea .footer {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 100%;
  height: 35px;
  border-radius: 0 0 10px 10px;
  background-color: #e5e5eb;
}
.notiAreaWrap .notiArea .msgArea .footer .msgInfo {
  color: var(--MainFontColorLighter);
  font-size: var(--fs12);
  margin-left: 4px;
}
.notiAreaWrap .notiArea .contentsWrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 10px 20px;
  overflow: hidden;
}
.notiAreaWrap .notiArea .contentsWrap > .titleArea {
  flex-shrink: 0;
  padding-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--fs17);
}
.notiAreaWrap .notiArea .contentsWrap > .titleArea > .txtTitle {
  display: flex;
  align-items: center;
}
.notiAreaWrap .notiArea .contentsWrap > .titleArea > .txtTitle > .ico_main {
  width: 20px;
  height: 20px;
  margin-right: 5px;
}
.notiAreaWrap .notiArea .contentsWrap > .titleArea > .btn.Del {
  padding: 3px 8px;
  color: var(--MainFontColor);
  font-size: var(--fs11);
}
.notiAreaWrap .notiArea .contentsWrap > .titleArea > .btn.Del:hover, .notiAreaWrap .notiArea .contentsWrap > .titleArea > .btn.Del :focus {
  color: var(--colorRed);
  background-color: #d1d1d1;
  cursor: pointer;
}
.notiAreaWrap .notiArea .contentsWrap > .titleArea > .btn.More {
  padding: 3px 8px;
  color: var(--MainBgColor);
  font-size: var(--fs11);
  border-radius: 2px;
  background-color: var(--MainFontColor);
}
.notiAreaWrap .notiArea .contentsWrap > .titleArea > .btn.More:hover, .notiAreaWrap .notiArea .contentsWrap > .titleArea > .btn.More :focus {
  background-color: var(--MainFontColorLighter);
  cursor: pointer;
}
.notiAreaWrap .notiArea .contentsWrap .txtTitle {
  font-size: var(--fs15);
}
.notiAreaWrap .notiArea .contentsWrap .txtDescription {
  font-size: var(--fs13);
  opacity: 0.7;
}
.notiAreaWrap .notiArea .contentsWrap ul > li.New .txtTitle:before {
  flex-shrink: 0;
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 5px;
  border-radius: 50%;
  background-color: var(--PointColor);
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li {
  position: relative;
  padding: 10px 30px 10px 50px;
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li .icon {
  position: absolute;
  top: 5px;
  left: 0px;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #E1F2E7;
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li .icon > .ico_main {
  width: 13px;
  height: 12px;
  background-position: -221px -384px;
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li .contentsArea {
  display: none;
  font-size: var(--fs13);
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li .btnExpander {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 25px;
  height: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li .btnExpander > i {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-left: 1px solid var(--BorderGreyDark);
  border-bottom: 1px solid var(--BorderGreyDark);
  transform: rotate(-45deg);
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li .btnExpander:hover {
  background-color: #d1d1d1;
  cursor: pointer;
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li.Expand .contentsArea {
  display: inline-block;
  overflow: hidden;
}
.notiAreaWrap .notiArea .contentsWrap .alarmListArea .ulAlarm > li.Expand .contentsArea .btnExpander > i {
  transform: rotate(135deg);
}
.notiAreaWrap .notiArea .contentsWrap .boardListArea {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}
.notiAreaWrap .notiArea .contentsWrap .boardListArea > .ulBoard > li {
  padding: 10px 0;
}
.notiAreaWrap .notiArea .contentsWrap .boardListArea > .ulBoard > li .txtTitle {
  margin-bottom: 8px;
}

.notiToastWrap {
  position: absolute;
  right: 40px;
  bottom: 40px;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.3s cubic-bezier(0.25, 1.3, 0.5, 1);
}
.notiToastWrap.Show {
  opacity: 1;
  transform: translateY(0);
}
.notiToastWrap.Hide {
  opacity: 0;
  transform: translateY(20px);
}
.notiToastWrap .notiToastContent {
  display: flex;
  flex-direction: column;
  min-width: 400px;
  max-width: 420px;
  padding: 20px;
  border: 1px solid #81D6B2;
  border-radius: 16px;
  background: linear-gradient(125deg, #FFF 13.47%, #F8F8FF 73.5%);
  box-shadow: 3px 7px 20px 0px rgba(0, 0, 0, 0.13);
}
.notiToastWrap .notiToastContent .header {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  padding-right: 40px;
  gap: 8px;
}
.notiToastWrap .notiToastContent .header .icoWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: linear-gradient(135deg, #EAFAEE 15.63%, #CCF2D6 100%);
}
.notiToastWrap .notiToastContent .header .title {
  color: var(--MainFontColor);
  font-size: var(--fs16);
  font-weight: bold;
}
.notiToastWrap .notiToastContent .header .btnClose {
  position: absolute;
  top: 12px;
  right: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}
.notiToastWrap .notiToastContent .header .btnClose:hover {
  background-color: #EDF0F5;
  cursor: pointer;
}
.notiToastWrap .notiToastContent .notiList {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}
.notiToastWrap .notiToastContent .notiList::before {
  content: "";
  position: absolute;
  top: 10px;
  width: 2px;
  height: calc(100% - 20px);
  background-color: var(--MainColor);
  border-radius: 3px;
}
.notiToastWrap .notiToastContent .notiList .item {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-left: 8px;
  padding: 8px;
  border-radius: 8px;
  gap: 8px;
}
.notiToastWrap .notiToastContent .notiList .item .date {
  color: #999;
  font-size: var(--fs13);
}
.notiToastWrap .notiToastContent .notiList .item .msg {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.notiToastWrap .notiToastContent .notiList .item .msg .title {
  font-size: var(--fs14);
  font-weight: bold;
}
.notiToastWrap .notiToastContent .notiList .item .msg .txt {
  display: -webkit-box;
  font-size: var(--fs14);
  -webkit-line-clamp: 4;
  overflow: hidden;
  -webkit-box-orient: vertical;
}
.notiToastWrap .notiToastContent .notiList .item:hover {
  background-color: #EDF0F5;
}
.notiToastWrap .notiToastContent .footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.notiToastWrap .notiToastContent .footer .more {
  font-size: var(--fs14);
}
.notiToastWrap .notiToastContent .footer .more:hover {
  text-decoration: underline;
}
.notiToastWrap .notiToastContent .footer .btnSetting {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
  padding: 6px 8px;
  border-radius: 4px;
  color: #999;
  font-size: var(--fs14);
}
.notiToastWrap .notiToastContent .footer .btnSetting:hover {
  background-color: #EDF0F5;
  cursor: pointer;
}

.sendMessageArea {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--DimColor);
}
.sendMessageArea .divInformation {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 320px);
  height: calc(100% - 65px);
  display: none;
  justify-content: center;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.5);
  z-index: 1;
}
.sendMessageArea > .popupArea {
  position: relative;
  width: 100%;
  height: 100%;
  border: 1px solid var(--PopupBorderColor);
  background-color: var(--PopupBgColor);
}
.sendMessageArea > .popupArea i * {
  display: inline-block;
}
.sendMessageArea > .popupArea > .bodyArea {
  height: 100%;
  display: flex;
}
.sendMessageArea > .popupArea > .bodyArea .searchArea {
  flex-shrink: 0;
  display: block;
  position: relative;
  height: 30px;
  margin: 0 10px 10px 10px;
}
.sendMessageArea > .popupArea > .bodyArea .searchArea > input {
  width: 100%;
  height: 100%;
  padding: 8px 30px 8px 8px;
  font-size: var(--fs14);
  border: 1px solid var(--KUMSBorderColor);
  background-color: transparent;
}
.sendMessageArea > .popupArea > .bodyArea .searchArea > input:focus {
  border-color: var(--MainColor);
}
.sendMessageArea > .popupArea > .bodyArea .searchArea > .btnQuery {
  position: absolute;
  top: 4px;
  right: 1px;
  display: inline-flex;
  width: 30px;
  height: 30px;
}
.sendMessageArea > .popupArea > .bodyArea .searchArea > .btnQuery > i {
  position: absolute;
  top: 5px;
  left: 6px;
  width: 14px;
  height: 13px;
  background-position: -12px -83px;
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList {
  position: relative;
  display: none;
  flex-direction: column;
  width: 230px;
  flex-shrink: 0;
  height: 100%;
  border-right: 1px solid var(--BorderGreyLight);
  background-color: var(--MainBgColor);
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .txtMent {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 30px;
  font-size: var(--fs13);
  font-weight: bold;
  background-color: #f7f7f7;
  border-bottom: 1px solid #e6e6e6;
  padding: 0 10px;
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .txtMent:before, .sendMessageArea > .popupArea > .bodyArea .multiDataList > .txtMent:after {
  content: "";
  position: absolute;
  left: -17px;
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .txtMent > .point {
  color: var(--MainColor);
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .dataArea {
  height: 100%;
  overflow-y: auto;
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .dataArea .ulData > li {
  position: relative;
  min-height: 55px;
  border-bottom: 1px solid var(--KUMSListBorderColor);
  cursor: pointer;
  padding: 10px;
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .dataArea .ulData > li > .txtTitle {
  position: relative;
  font-size: var(--fs14);
  font-weight: bold;
  margin-bottom: 4px;
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .dataArea .ulData > li > .txtDescription {
  font-size: var(--fs13);
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .dataArea .ulData > li:hover {
  background-color: #f5f5f5;
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .dataArea .ulData > li.Selected {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.sendMessageArea > .popupArea > .bodyArea .multiDataList > .dataArea .ulData > li.Selected::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 2px 0px 0px 0px inset var(--MainColor);
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress {
  display: none;
  position: absolute;
  left: 230px;
  top: 0px;
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnOpen, .sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnClose {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 25px;
  padding: 0 6px 0 23px;
  margin: 6px 0 0 10px;
  font-size: var(--fs11);
  background-color: #f3f3f3;
  border: 1px solid #ddd;
  border-radius: 3px;
  color: var(--MainFontColorLighter);
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnOpen:hover, .sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnClose:hover {
  color: var(--MainFontColor);
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnOpen::before, .sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnOpen::after {
  content: "";
  position: absolute;
  top: 9px;
  left: 5px;
  width: 5px;
  height: 5px;
  border-right: 1px currentColor solid;
  border-top: 1px currentColor solid;
  transform: rotate(45deg);
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnOpen::after {
  position: absolute;
  top: 9px;
  left: 10px;
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnClose {
  display: none;
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnClose::before, .sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnClose::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 8px;
  width: 5px;
  height: 5px;
  border-left: 1px currentColor solid;
  border-top: 1px currentColor solid;
  transform: rotate(-45deg);
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress > .btnClose::after {
  position: absolute;
  top: 8px;
  left: 13px;
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress input[type=checkbox]:checked + .btnOpen {
  display: none;
}
.sendMessageArea > .popupArea > .bodyArea .tbtnAddress input[type=checkbox]:checked + .btnOpen + .btnClose {
  display: flex;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 230px;
  flex-shrink: 0;
  height: 100%;
  border-right: 1px solid var(--BorderGreyLight);
  background-color: var(--MainBgColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulTabArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 34px;
  margin-bottom: 10px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulTabArea > li {
  width: 100%;
  height: 100%;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulTabArea > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0px 0px;
  font-size: var(--fs13);
  border-right: 1px solid var(--BorderGreyLight);
  background-color: #F4F4F4;
  color: var(--MainFontColorLighter);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulTabArea > li > a:hover {
  background-color: #eee;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulTabArea > li:last-child > a {
  border-right: 0;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulTabArea > li.Selected > a {
  color: var(--MainFontColor);
  box-shadow: 0px 2px 0 inset #333;
  background-color: var(--MainBgColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulTabArea > li.Selected > a:hover {
  background-color: var(--MainBgColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .divAddressEmpty {
  width: 100%;
  height: 100%;
  display: none;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .divAddressEmpty > section {
  margin: 0 20px;
  display: inline-block;
  text-align: center;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .divAddressEmpty > section > i {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #ddd;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .divAddressEmpty > section > i:before, .sendMessageArea > .popupArea > .bodyArea > .leftArea .divAddressEmpty > section > i:after {
  content: "";
  position: absolute;
  left: 23px;
  width: 4px;
  border-radius: 2px;
  background-color: var(--MainBgColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .divAddressEmpty > section > i:before {
  top: 12px;
  height: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .divAddressEmpty > section > i:after {
  top: 22px;
  height: 18px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .divAddressEmpty > section > p {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  margin-top: 10px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li {
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
  min-height: 55px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--KUMSListBorderColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li > .txtTitle {
  font-size: var(--fs14);
  color: var(--MainFontColorLighter);
  margin-bottom: 4px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li .txtInfo {
  display: flex;
  overflow: hidden;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li .txtInfo > p {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li .txtInfo > .txtDescription {
  display: inline-block;
  flex-shrink: 0;
  margin-right: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li .txtInfo > .txtDescription1 {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li .txtInfo > .txtDescription1::before {
  content: "";
  display: inline-block;
  margin-right: 5px;
  width: 1px;
  height: 10px;
  background-color: #ccc;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li[onmouseout*=mouseOutSelected].Selected, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li[onmouseout*=mouseOutSelected]:hover {
  background-color: #f5f5f5;
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList > li[onmouseout*=mouseOutSelected] > .txtTitle {
  color: var(--MainFontColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100%;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult {
  display: flex;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList {
  width: 100%;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList .divTree, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList .divTree {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList .divTree .tree, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList .divTree .tree {
  height: 100%;
  border: 0;
  padding: 0 5px;
  overflow-y: scroll;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList .divTree .tree .ulTreeDepth li, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList .divTree .tree .ulTreeDepth li {
  position: relative;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList .divTree .tree .ulTreeDepth li > .collapseIcon, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList .divTree .tree .ulTreeDepth li > .collapseIcon {
  vertical-align: initial;
  margin-left: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList .divTree .tree .ulTreeDepth li .treeItem, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList .divTree .tree .ulTreeDepth li .treeItem {
  display: inline-flex;
  align-items: flex-start;
  margin-left: -5px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList .divTree .tree .ulTreeDepth li .treeItem .txtName, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList .divTree .tree .ulTreeDepth li .treeItem .txtName {
  word-break: break-all;
  white-space: normal;
  margin-top: 3px;
  margin-bottom: 3px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList .divTree .tree .ulTreeDepth li .treeItem:hover, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList .divTree .tree .ulTreeDepth li .treeItem:hover {
  background-color: #f5f5f5;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgListWrap .orgList .divTree .tree .ulTreeDepth li .treeItem.selected, .sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .orgSearchResult .orgList .divTree .tree .ulTreeDepth li .treeItem.selected {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap {
  flex-shrink: 0;
  height: 50%;
  border-top: 1px solid var(--KUMSListBorderColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList {
  height: 100%;
  overflow-y: auto;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList li a {
  display: flex;
  justify-content: center;
  flex-direction: column;
  min-height: 55px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--KUMSListBorderColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList li a .txtName {
  color: var(--MainFontColor);
  font-size: var(--fs14);
  margin-bottom: 4px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList li a .txtDept {
  color: var(--MainFontColorLighter);
  font-size: var(--fs11);
  margin-bottom: 4px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList li a .txtNb {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList li a:hover {
  background-color: #f5f5f5;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList li.Dis a {
  cursor: default;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList li.Dis a * {
  color: var(--MainFontColorLighter);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .empListWrap .empList li.Dis a:hover {
  background-color: transparent;
  color: inherit;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  font-size: var(--fs14);
  opacity: 0.5;
  color: var(--MainFontColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea > .ulList .orgWrap .treeEmpWrap .noData .iconNoEmpData {
  width: 25px;
  height: 27px;
  margin-bottom: 10px;
  background-position: -35px -344px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .addrBottom {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  border-top: 1px solid var(--KUMSListBorderColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .addrBottom .btnAddressEdit {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 200px;
  height: 30px;
  font-size: var(--fs13);
  font-weight: bold;
  background-color: #f5f5f5;
  border: 1px solid #e5e5e5;
  color: var(--MainFontColor);
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .addrBottom .btnAddressEdit > i {
  width: 15px;
  height: 14px;
  margin-right: 5px;
  background-position: -10px -344px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .addrBottom .btnAddressEdit:hover {
  background-color: #e8e8e8;
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .btnReceiveListAdd {
  position: absolute;
  top: calc(50% - 10px);
  right: 5px;
  width: 19px;
  height: 19px;
  border-radius: 50%;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .btnReceiveListAdd::before, .sendMessageArea > .popupArea > .bodyArea > .leftArea .btnReceiveListAdd::after {
  position: absolute;
  content: "";
  background-color: transparent;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .btnReceiveListAdd:before {
  left: 4px;
  top: 9px;
  height: 1px;
  width: 11px;
}
.sendMessageArea > .popupArea > .bodyArea > .leftArea .btnReceiveListAdd:after {
  left: 9px;
  top: 4px;
  height: 11px;
  width: 1px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  color: var(--MainFontColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .txtDis {
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .txtData {
  padding-left: 4px;
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
  font-weight: normal;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .txtSubTitle {
  font-size: var(--fs14);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .txtSubDescription {
  margin-bottom: 10px;
  font-size: var(--fs11);
  color: var(--FontColorGrey1);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea textarea {
  margin: 0;
  width: 100%;
  padding: 8px;
  font-size: var(--fs13);
  border: 0px;
  color: var(--MainFontColor);
  resize: none;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea textarea:focus {
  outline: 0;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .toggleControl {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 60px;
  height: 30px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .toggleControl > .bar {
  height: 10px;
  width: 100%;
  border-radius: 5px;
  background-color: var(--BgColorGrey);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .toggleControl > .icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  border: 1px solid var(--BgColorGrey);
  border-radius: 50%;
  box-shadow: rgba(0, 0, 0, 0.2) 3px 3px 3px;
  background-color: var(--MainBgColor);
  transition: ease-in 1s;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .toggleControl.Selected > .bar {
  background-color: var(--MainColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .toggleControl.Selected > .icon {
  left: auto;
  right: 0;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0 0px 10px 10px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea > .divFileUpload {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 105px;
  flex-shrink: 0;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea > .divFileUpload > .fileArea {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  height: 100%;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea > .divFileUpload > .fileArea > .fileTitle {
  padding-left: 4px;
  padding-bottom: 8px;
  font-size: var(--fs13);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea > .divFileUpload > .fileArea > .fileBox {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 0;
  overflow: hidden;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .divResvDate {
  position: relative;
  height: 30px;
  z-index: 9;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-y: scroll;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item {
  display: flex;
  align-items: center;
  padding: 2px 0;
  font-size: var(--fs13);
  min-height: 55px;
  padding: 8px 0;
  border-bottom: 1px solid var(--KUMSListBorderColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .receiver {
  display: flex;
  flex-direction: column;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .receiver .name {
  font-weight: bold;
  font-size: var(--fs14);
  margin-bottom: 4px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .receiver .txtData {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  padding: 0;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  margin-left: auto;
  font-style: normal;
  padding: 3px 4px;
  flex-wrap: wrap;
  font-size: var(--fs14);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap i.iconFavorite {
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border-radius: 3px;
  height: 23px;
  color: var(--MainFontColorLighter);
  font-size: var(--fs11);
  font-style: normal;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap i.iconFavorite.Add {
  display: none;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap i.iconFavorite:hover {
  color: var(--MainColor);
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap > .btnDel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--MainFontColor);
  border-radius: 50%;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap > .btnDel:before, .sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap > .btnDel:after {
  content: "";
  position: absolute;
  width: 11px;
  height: 1px;
  background-color: currentColor;
  transform: rotate(45deg);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap > .btnDel:after {
  transform: rotate(135deg);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item > .btnWrap > .btnDel:hover {
  background-color: #eaeaea;
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .item.System > em {
  color: var(--FontColorGrey1);
  border: 1px solid var(--BorderGreyLight);
  background-color: var(--BgColorGrey) 1;
  border-radius: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .noReceiver {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  flex-direction: column;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .noReceiver > i {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #ddd;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .noReceiver > i:before, .sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .noReceiver > i:after {
  content: "";
  position: absolute;
  left: 23px;
  width: 4px;
  border-radius: 2px;
  background-color: var(--MainBgColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .noReceiver > i:before {
  top: 12px;
  height: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .noReceiver > i:after {
  top: 22px;
  height: 18px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .receiveBox .noReceiver .txt {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  margin-top: 10px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation {
  flex-shrink: 0;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 40px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .title {
  flex-shrink: 0;
  color: var(--MainFontColor);
  font-size: var(--fs14);
  font-weight: bold;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .title::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 11px;
  margin-right: 4px;
  background-position: -10px -109px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .txtCount {
  flex-shrink: 0;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
  margin-left: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .btnWrap {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .btnWrap .btnRecentRecvList {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  padding: 0 6px;
  height: 25px;
  margin-left: 5px;
  line-height: 17px;
  color: var(--MainFontColor);
  font-size: var(--fs13);
  border-radius: 3px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .btnWrap .btnRecentRecvList > i {
  display: inline-block;
  width: 13px;
  height: 13px;
  background-position: -30px -109px;
  margin-right: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .btnWrap .btnRecentRecvList:hover {
  background-color: #efefef;
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .btnWrap .btnRecentRecvList.Del > i {
  width: 9px;
  height: 9px;
  background-position: -53px -110px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .btnWrap .btnRecentRecvList.Del:hover {
  background-color: rgba(var(--colorRed-rgb), 0.1);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.Half {
  width: 50%;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor {
  display: flex;
  align-items: center;
  position: relative;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor > input[type=text] {
  width: 100%;
  height: 32px;
  background-color: #F7F7F7;
  border-radius: 3px 0 0 3px;
  border: 1px solid var(--KUMSBorderColor);
  border-right: 0;
  padding: 0 10px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor > input[type=text]:focus {
  color: var(--MainColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .btn {
  flex-shrink: 0;
  height: 32px;
  color: var(--MainColor);
  font-size: var(--fs13);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .btn.Add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border-radius: 0 3px 3px 0;
  border: 1px solid rgba(var(--MainColor-rgb), 0.2);
  padding: 0 10px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .btn.Add > i {
  width: 11px;
  margin-right: 7px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .btn.Add > i:before, .sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .btn.Add > i:after {
  position: absolute;
  content: "";
  width: 11px;
  height: 1px;
  background-color: currentColor;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .btn.Add > i:after {
  transform: rotate(90deg);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .btn.Add:hover {
  background-color: rgba(var(--MainColor-rgb), 0.2);
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .ulComboQuery {
  position: absolute;
  top: 47px;
  left: 0px;
  border: 1px solid var(--BorderGreyDark);
  background-color: var(--MainBgColor);
  z-index: 9;
  width: calc(100% - 60px);
  max-height: 300px;
  overflow-y: auto;
  box-shadow: rgba(0, 0, 0, 0.2) 0 0 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .ulComboQuery > li {
  position: relative;
  padding: 4px 8px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .ulComboQuery > li > em {
  font-style: normal;
  font-size: var(--fs14);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .ulComboQuery > li > em > span {
  margin-right: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .ulComboQuery > li > .btnAdd {
  position: absolute;
  top: 4px;
  right: 5px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  color: var(--MainFontColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .ulComboQuery > li > .btnAdd::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 5px;
  width: 10px;
  height: 2px;
  background-color: currentColor;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .ulComboQuery > li > .btnAdd::after {
  content: "";
  position: absolute;
  top: 5px;
  left: 9px;
  width: 2px;
  height: 10px;
  background-color: currentColor;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li.receiveRegistor .ulComboQuery > li > .btnAdd:hover {
  cursor: pointer;
  background-color: var(--ButtonBgColor);
  color: var(--ButtonFontColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .messageArea .ulInformation > li .layoutControl > .labelCaption {
  text-align: left !important;
  padding-left: 5px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .btnArea {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  background-color: var(--MainBgColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .btnArea > .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 8px 16px;
  min-width: 150px;
  color: #fff;
  font-size: var(--fs16);
  border: 0px;
  border-radius: 5px;
  background-color: var(--MainColor);
  padding: 0 15px;
  transition: all 0.3s;
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .btnArea > .btn:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .btnArea > .btn:active {
  background-color: var(--ButtonDefaultColorActive);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .btnArea > .btn.btnLine {
  border: 1px solid var(--BorderGreyLight);
  background-color: #fff;
  color: var(--MainColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .btnArea > .btn.btnLine:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .btnArea > .btn.btnLine:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  border-color: rgba(var(--MainColor-rgb), 0.15);
  cursor: pointer;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea .btnArea > .btn.Sub {
  background-color: var(--colorGrey);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile {
  display: inline-block;
  text-align: center;
  width: 300px;
  flex-shrink: 0;
  height: calc(100% - 20px);
  padding: 10px;
  margin: 10px;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 20px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 16px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile > .topShape {
  display: inline-block;
  width: 50px;
  height: 6px;
  border-radius: 3px;
  background-color: var(--BorderGreyLight);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .txtTitle {
  font-size: var(--fs14);
  font-weight: bold;
  color: var(--MainFontColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .txtDescription {
  font-size: var(--fs11);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea {
  position: relative;
  padding: 10px 10px 0 10px;
  width: calc(100% - 0px);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea .alarmTalkArea {
  position: relative;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea .alarmTalkArea > .txtTitle {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 35px;
  background-color: #fbe300;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea .alarmTalkArea > .txtTitle > i {
  display: inline-block;
  width: 80px;
  height: 18px;
  background-position: -6px -200px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea .alarmTalkArea .logoKaKao {
  position: absolute;
  top: -10px;
  right: -5px;
  width: 26px;
  height: 26px;
  overflow: hidden;
  border-radius: 50%;
  background-color: #391e11;
  background-position: -87px -192px;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea > .imgLogo {
  position: absolute;
  top: 0px;
  left: -35px;
  width: 28px;
  height: 28px;
  overflow: hidden;
  border-radius: 50%;
  background-color: var(--MainBgColor);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea > .txtName {
  font-size: var(--fs11);
  padding: 4px 0;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea .alarmTalkMsg .txtMessageTemplate {
  padding: 8px;
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .talkArea .alarmTalkMsg .btnAddMessage {
  display: block;
  padding: 4px 8px;
  margin-top: -1px;
  color: var(--SubColor1);
  font-size: var(--fs13);
  border: 1px solid var(--BorderGreyLight);
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .messageInputArea {
  flex-shrink: 0;
  width: 100%;
  padding: 0 10px 6px 10px;
  background-color: var(--kkoTempBg);
  overflow: hidden;
}
.sendMessageArea > .popupArea > .bodyArea > .rightArea > .mobile .messageInputArea > textarea {
  height: 100px;
}
.sendMessageArea.KakaoTalk > .popupArea > .bodyArea > .rightArea > .mobile .messageInputArea .btnMsgPreview {
  display: none;
}
.sendMessageArea.KakaoTalk .kkoTemp {
  display: flex;
  flex-direction: column;
  padding-top: 15px;
  margin-top: 10px;
  height: calc(100% - 35px);
  border-radius: 5px;
  background-color: var(--kkoTempBg);
  border-bottom: 10px solid var(--kkoTempBg);
}
.sendMessageArea.KakaoTalk .kkoTemp > header {
  flex-shrink: 0;
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox {
  display: none;
  justify-content: flex-end;
  align-items: center;
  padding: 0 10px;
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox > .txtCaption {
  margin-right: 5px;
  font-size: var(--fs13);
  opacity: 0.5;
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox > .checkSwitch {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 30px;
  cursor: pointer;
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox > .checkSwitch::before, .sendMessageArea.KakaoTalk .kkoTemp > .checkbox > .checkSwitch:after {
  content: "";
  display: inline-block;
  position: absolute;
  left: 0;
  transition: 0.3s;
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox > .checkSwitch:before {
  top: 7px;
  width: 100%;
  height: 6px;
  border-radius: 3px;
  background-color: rgba(var(--MainFontColor), 0.3);
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox > .checkSwitch:after {
  top: 1px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
  box-shadow: 0 0px 3px 0px rgba(0, 0, 0, 0.1);
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox > input[type=checkbox]:checked + .txtCaption {
  opacity: 1;
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox > input[type=checkbox]:checked + .txtCaption + .checkSwitch:before {
  background-color: var(--MainColor);
}
.sendMessageArea.KakaoTalk .kkoTemp > .checkbox > input[type=checkbox]:checked + .txtCaption + .checkSwitch:after {
  left: 15px;
}
.sendMessageArea.KakaoTalk .kakaoMessge {
  height: 275px;
}
.sendMessageArea.SMS > .popupArea > .bodyArea > .rightArea .btnArea, .sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .btnArea {
  justify-content: normal;
}
.sendMessageArea.SMS > .popupArea > .bodyArea > .rightArea .btnArea .sender, .sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .btnArea .sender {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 240px;
  height: 40px;
  padding: 0 3px 0 10px;
  background-color: #F7F7F7;
  cursor: default;
}
.sendMessageArea.SMS > .popupArea > .bodyArea > .rightArea .btnArea .sender > label, .sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .btnArea .sender > label {
  flex-shrink: 0;
  margin-right: 15px;
  font-size: var(--fs14);
  font-weight: bold;
}
.sendMessageArea.SMS > .popupArea > .bodyArea > .rightArea .btnArea .sender > input, .sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .btnArea .sender > input {
  background-color: #fff;
  padding: 0 10px;
  height: 34px;
  width: 100%;
  border: 0;
}
.sendMessageArea.SMS > .popupArea > .bodyArea > .rightArea .btnArea .sender > input:read-only, .sendMessageArea.SMS > .popupArea > .bodyArea > .rightArea .btnArea .sender > input:disabled, .sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .btnArea .sender > input:read-only, .sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .btnArea .sender > input:disabled {
  background-color: transparent;
  cursor: default;
}
.sendMessageArea.SMS > .popupArea > .bodyArea > .rightArea .btnArea .btn.Send, .sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .btnArea .btn.Send {
  width: 100%;
  margin: 0 0 0 10px;
}
.sendMessageArea.SMS .smsArea {
  padding: 5px;
  height: 92%;
  border-radius: 5px;
  background-color: var(--BgColorGrey);
  margin-top: 10px;
}
.sendMessageArea.SMS .smsArea > .smsMsgArea {
  position: relative;
  display: block;
  padding: 5px 5px 10px 5px;
  border-radius: 5px;
}
.sendMessageArea.SMS .smsArea > .smsMsgArea textarea {
  width: 100%;
  height: 200px;
  border: 1px solid var(--MainBgColor);
}
.sendMessageArea.SMS .smsArea > .smsMsgArea > .txtCount {
  font-size: var(--fs11);
  color: var(--FontColorGrey);
}
.sendMessageArea.SMS .smsMobileButton {
  margin: 5px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--BorderGreyLight);
}
.sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .fax {
  position: relative;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  width: 320px;
  padding: 10px;
  margin-left: 10px;
  border-left: 1px solid var(--BorderGreyLight);
}
.sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .fax > input[type=text] {
  padding: 8px 0 8px 4px;
  border: 0px;
  border-bottom: 1px solid var(--BorderDarkKUMS);
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .fax > input[type=text]:focus {
  border-color: var(--MainColor);
}
.sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .fax > .txtDescription {
  display: flex;
  align-items: center;
  margin: 10px 0;
  font-size: var(--fs11);
  color: var(--FontColorGrey1);
}
.sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .fax > .txtDescription:before {
  content: "!";
  width: 14px;
  height: 14px;
  margin-right: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: var(--colorRed);
  border-radius: 50%;
  border: 1px solid var(--colorRed);
}
.sendMessageArea.Fax > .popupArea > .bodyArea > .rightArea .fax > .DevLayout {
  position: relative;
  left: auto;
  top: auto;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea {
  padding: 10px;
  overflow-y: auto;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation {
  flex-shrink: 0;
  margin-bottom: 10px;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li {
  position: relative;
  display: inline-flex;
  align-items: flex-start;
  width: 100%;
  min-height: 41px;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > label {
  flex-shrink: 0;
  height: 100%;
  padding-top: 12px;
  padding-left: 4px;
  width: 80px;
  font-size: var(--fs13);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > input[type=text] {
  height: 100%;
  min-height: 40px;
  width: 100% !important;
  padding: 8px 0;
  border: 0px;
  background-color: var(--ControlBgColor);
  box-shadow: 0 -1px 0px inset var(--BorderGreyLight);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > input[type=text]:focus {
  box-shadow: 0 -1px 0px inset var(--MainColor);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > input[type=text]:read-only, .sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > input[type=text]:disabled {
  box-shadow: none;
  color: var(--MainFontColorLighter);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > input[type=text]:read-only:hover, .sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > input[type=text]:read-only:focus, .sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > input[type=text]:disabled:hover, .sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li > input[type=text]:disabled:focus {
  box-shadow: none;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.sender > input {
  width: calc(100% - 210px) !important;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver {
  align-items: flex-start;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea {
  position: relative;
  display: flex;
  align-items: center;
  width: 100% !important;
  height: 100%;
  min-height: 40px;
  padding: 0;
  box-shadow: 0 -1px 0px inset var(--BorderGreyLight);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea.Selected {
  box-shadow: 0 -1px 0px inset var(--MainColor);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea > .txtName {
  padding-left: 5px;
  font-size: var(--fs13);
  color: var(--BorderGreyLight);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .receiveMsg {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  width: 100%;
  min-height: 40px;
  padding-top: 9px;
  margin: 0;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .receiveMsg > textarea {
  width: 100%;
  padding: 2px 0;
  border: none;
  background-color: transparent;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .receiveMsg .item {
  position: relative;
  margin: 0 5px 5px 0;
  display: inline-flex;
  align-items: center;
  padding-left: 5px;
  height: 22px;
  border: 1px solid var(--MainColor);
  border-radius: 3px;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .receiveMsg .item * {
  font-size: var(--fs11);
  color: var(--MainColor);
  font-style: normal;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .receiveMsg .item > .btnDel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--MainColor);
  border-radius: 50%;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .receiveMsg .item > .btnDel:before, .sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .receiveMsg .item > .btnDel:after {
  content: "";
  position: absolute;
  width: 11px;
  height: 1px;
  background-color: currentColor;
  transform: rotate(45deg);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .receiveMsg .item > .btnDel:after {
  transform: rotate(135deg);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .individualCheckArea {
  display: flex;
  justify-content: flex-end;
  align-self: flex-start;
  flex-shrink: 0;
  padding-top: 12px;
  padding-left: 10px;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .individualCheckArea > input[type=checkbox] {
  display: none;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .individualCheckArea > input[type=checkbox] + label {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  font-size: var(--fs11);
  white-space: nowrap;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .individualCheckArea > input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  margin-right: 5px;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .individualCheckArea > input[type=checkbox]:focus + label {
  outline: 1px solid var(--ControlBorderColorFocus);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .individualCheckArea > input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  width: 7px;
  height: 4px;
  border-left: 2px solid var(--ControlBgColor) Selected;
  border-bottom: 2px solid var(--ControlBgColor) Selected;
  transform: rotate(-45deg);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailInformation > li.receiver > .inputArea .individualCheckArea > input[type=checkbox]:checked + label::before {
  border: 1px solid var(--ControlBgColor) Selected;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailContent {
  padding-bottom: 20px;
  font-size: var(--fs13);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .mailContent .k-content.wide table.k-editor-widget {
  width: calc(100% - 2px) !important;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .btnArea {
  position: fixed;
  top: 15px;
  right: 18px;
  width: 100px;
  height: 40px;
  background-color: transparent;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .btnArea > .btn {
  min-width: 100px;
  cursor: pointer;
  box-shadow: 2px 2px 7px 0px rgba(0, 0, 0, 0.2);
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .btnArea > .btn:hover, .sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .btnArea > .btn:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.sendMessageArea.Mail > .popupArea > .bodyArea > .rightArea .btnArea > .btn:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.sendMessageArea.Multi .kkoTemp > .checkbox {
  display: flex;
}
.sendMessageArea.Multi > .popupArea > .bodyArea .multiDataList {
  display: flex;
}
.sendMessageArea.Multi > .popupArea > .bodyArea > .rightArea .kakaoMessge {
  height: 255px;
}
.sendMessageArea.Multi > .popupArea > .bodyArea > .rightArea .messageArea {
  padding-top: 35px;
}
.sendMessageArea.Multi > .popupArea > .bodyArea .tbtnAddress {
  display: inline-flex;
  z-index: 1;
}
.sendMessageArea.Multi > .popupArea > .bodyArea > .leftArea {
  position: absolute;
  left: -230px;
  top: 0;
  z-index: 1;
  opacity: 0;
  transition: 0.3s;
}
.sendMessageArea.Multi .divInformation .msgArea {
  padding: 20px;
  border-radius: 10px;
  background-color: rgba(217, 217, 217, 0.4);
  text-align: center;
  font-size: var(--fs14);
}
.sendMessageArea.Multi .divInformation .msgArea > i {
  display: inline-block;
  margin-bottom: 10px;
  width: 51px;
  height: 46px;
  background-position: 0px -380px;
}
.sendMessageArea.Multi.AllEditMode .divInformation {
  display: flex;
}
.sendMessageArea.Multi.AllEditMode .divInformation .msgArea.icon_info_alt {
  width: 50px;
  height: 50px;
  background-position: 0 0;
}
.sendMessageArea.Multi.AllEditMode .tbtnAddress {
  display: none;
}
.sendMessageArea.Multi.AllEditMode > .popupArea > .bodyArea > .leftArea {
  left: -230px !important;
}
.sendMessageArea.Multi.AddressOpen > .popupArea > .bodyArea > .leftArea {
  left: 0;
  opacity: 1;
  box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.15);
}
.sendMessageArea.AppNoti .popupArea > .bodyArea .searchArea {
  margin: 0 0 10px 0;
}
.sendMessageArea.AppNoti .popupArea > .bodyArea .searchArea > input {
  border-width: 0 0 1px 0;
}
.sendMessageArea.AppNoti .popupArea > .bodyArea .rightArea > .mobile {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 20px 10px;
}
.sendMessageArea.AppNoti .popupArea > .bodyArea .rightArea > .mobile .topShape {
  display: flex;
  flex-shrink: 0;
  margin-bottom: 15px;
}
.sendMessageArea.AppNoti .popupArea > .bodyArea .rightArea > .mobile .notiArea {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: 10px;
  background-color: var(--BgColorGrey);
}
.sendMessageArea.AppNoti .popupArea > .bodyArea .rightArea > .mobile .notiArea .notiTitle {
  flex-shrink: 0;
  width: 100%;
  height: 30px;
  margin-bottom: 4px;
  padding: 8px;
  border: 0;
  background-color: var(--MainBgColor);
  color: var(--MainFontColor);
  font-size: var(--fs13);
}
.sendMessageArea.AppNoti .popupArea > .bodyArea .rightArea > .mobile .notiArea .notiContent {
  height: 100%;
}

.bgAddressArea {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--DimColor);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fade-in 0.5s forwards;
  z-index: 1;
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.bgAddressArea .AddressArea {
  display: flex;
  flex-direction: column;
  position: relative;
  width: 760px;
  height: 90%;
  padding: 0 15px;
  background-color: var(--MainBgColor);
  border-radius: 5px;
  box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 9px 24px;
  animation: fade-in 0.5s forwards;
  z-index: 7;
}
.bgAddressArea .AddressArea > h1 {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  font-size: var(--fs15);
  font-weight: bold;
  height: 45px;
}
.bgAddressArea .AddressArea > .btnClose {
  position: absolute;
  top: 5px;
  right: 5px;
  border-radius: 50%;
  width: 35px;
  height: 35px;
  background-position: -2px -30px;
}
.bgAddressArea .AddressArea > .btnClose:hover {
  background-color: var(--btnModalDlgHover);
}
.bgAddressArea .AddressArea > .addAddressArea {
  display: flex;
  align-items: center;
  height: 30px;
  width: 100%;
  margin-bottom: 10px;
}
.bgAddressArea .AddressArea > .addAddressArea > .txtCaption {
  display: inline-block;
  font-size: var(--fs14);
  margin-right: 8px;
}
.bgAddressArea .AddressArea > .addAddressArea > input[type=text] {
  width: 110px;
  height: 30px;
  margin-right: 5px;
  padding: 4px 6px;
  font-size: var(--fs13);
  color: var(--ControlFontColor);
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
}
.bgAddressArea .AddressArea > .addAddressArea > input[type=text]:focus {
  color: var(--ControlFontColorFocus);
  border-color: var(--ControlBorderColorFocus);
}
.bgAddressArea .AddressArea > .addAddressArea > input[type=text].Email {
  width: 145px;
}
.bgAddressArea .AddressArea > .addAddressArea > input[type=text].Remark {
  width: 260px;
}
.bgAddressArea .AddressArea > .addAddressArea > input[type=button] {
  height: 30px;
  padding: 4px 15px;
  margin-left: auto;
  font-size: var(--fs14);
  color: var(--ButtonFontColor);
  border: 0;
  background-color: var(--ButtonBgColor);
  cursor: pointer;
}
.bgAddressArea .AddressArea > .addAddressArea > input[type=button]:hover {
  background-color: var(--btnAddAddressColorHover);
}
.bgAddressArea .AddressArea > .addressListArea {
  display: flex;
  flex-direction: column;
  height: calc(100% - 120px);
  margin-bottom: 20px;
  width: 100%;
}
.bgAddressArea .AddressArea > .addressListArea table {
  width: 100%;
  border-spacing: 0;
  border-collapse: collapse;
}
.bgAddressArea .AddressArea > .addressListArea table tr {
  position: relative;
}
.bgAddressArea .AddressArea > .addressListArea table tr.EditMode td > input[type=text], .bgAddressArea .AddressArea > .addressListArea table tr.EditMode td > input[type=button] {
  display: inline-block;
}
.bgAddressArea .AddressArea > .addressListArea table tr.EditMode td > span, .bgAddressArea .AddressArea > .addressListArea table tr.EditMode td > a > i {
  display: none;
}
.bgAddressArea .AddressArea > .addressListArea table th {
  position: sticky;
  top: 0px;
  padding: 6px 3px;
  font-size: var(--fs13);
  font-weight: bold;
  text-align: center;
  background-color: #eee;
  border-right: 1px solid #d7d7d7;
  z-index: 1;
}
.bgAddressArea .AddressArea > .addressListArea table th.Edit, .bgAddressArea .AddressArea > .addressListArea table th.Del {
  font-weight: normal;
}
.bgAddressArea .AddressArea > .addressListArea table th:last-child {
  border-right: 0;
}
.bgAddressArea .AddressArea > .addressListArea table td {
  padding: 6px 10px;
  border-bottom: 1px solid var(--BorderGreyLight);
}
.bgAddressArea .AddressArea > .addressListArea table td > span {
  display: inline-block;
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
  word-break: break-all;
}
.bgAddressArea .AddressArea > .addressListArea table td > input[type=text] {
  display: none;
  margin-left: -5px;
  width: calc(100% + 11px);
  height: 100%;
  padding: 2px 4px;
  font-size: var(--fs13);
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
}
.bgAddressArea .AddressArea > .addressListArea table td > input[type=text]:focus {
  color: var(--ControlCaptionFontColorFocus);
  border: 1px solid var(--ControlFontColorFocus);
}
.bgAddressArea .AddressArea > .addressListArea table td > input[type=button] {
  display: none;
  padding: 2px 8px;
  font-size: var(--fs11);
  color: var(--MainColor);
  border: 0px;
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border: 1px solid rgba(var(--MainColor-rgb), 0.2);
}
.bgAddressArea .AddressArea > .addressListArea table td > input[type=button]:hover {
  background-color: rgba(var(--MainColor-rgb), 0.3);
  cursor: pointer;
}
.bgAddressArea .AddressArea > .addressListArea table td > a > i {
  display: inline-block;
}
.bgAddressArea .AddressArea > .addressListArea table td.Del > a > i {
  width: 15px;
  height: 13px;
  background-position: -38px -299px;
}
.bgAddressArea .AddressArea > .addressListArea table td.Edit > a > i {
  width: 11px;
  height: 13px;
  background-position: -12px -299px;
}
.bgAddressArea .AddressArea > .addressListArea table .Name {
  width: 200px;
  color: var(--MainFontColor);
}
.bgAddressArea .AddressArea > .addressListArea table .Mobile {
  width: 170px;
}
.bgAddressArea .AddressArea > .addressListArea table .Email {
  width: 230px;
}
.bgAddressArea .AddressArea > .addressListArea table .Remark {
  width: 260px;
}
.bgAddressArea .AddressArea > .addressListArea table .Remark > span {
  font-size: var(--fs11);
}
.bgAddressArea .AddressArea > .addressListArea table .Edit, .bgAddressArea .AddressArea > .addressListArea table .Del {
  width: 60px;
  text-align: center;
}
.bgAddressArea .AddressArea > .addressListArea .addrListHeader {
  flex-shrink: 0;
  height: 28px;
}
.bgAddressArea .AddressArea > .addressListArea .addrListHeader > ul {
  display: flex;
}
.bgAddressArea .AddressArea > .addressListArea .addrListHeader > ul li {
  padding: 6px 3px;
  border-right: 1px solid #d7d7d7;
  background-color: #eee;
  font-size: var(--fs13);
  font-weight: bold;
  text-align: center;
  z-index: 1;
}
.bgAddressArea .AddressArea > .addressListArea .addrListHeader > ul li.Del {
  border-right: 0;
}
.bgAddressArea .AddressArea > .addressListArea .addrListHeader > ul li.empty {
  width: 8px;
  border-right: 0;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item {
  display: flex;
  flex-wrap: wrap;
  min-height: 30px;
  border-bottom: 1px solid var(--BorderGreyLight);
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li {
  flex-shrink: 0;
  padding: 6px 10px;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li span {
  display: inline-block;
  font-size: var(--fs13);
  word-break: break-all;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li input[type=text] {
  display: none;
  margin-left: -5px;
  width: calc(100% + 11px);
  height: 100%;
  padding: 2px 4px;
  font-size: var(--fs13);
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li input[type=text]:focus {
  border: 1px solid var(--ControlFontColorFocus);
  color: var(--ControlCaptionFontColorFocus);
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li input[type=button] {
  display: none;
  height: 23px;
  padding: 2px 8px;
  font-size: var(--fs11);
  color: var(--MainColor);
  border: 1px solid rgba(var(--MainColor-rgb), 0.2);
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li input[type=button]:hover {
  background-color: rgba(var(--MainColor-rgb), 0.3);
  cursor: pointer;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Name span {
  color: var(--MainFontColor);
  font-weight: bold;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Remark {
  display: none;
  align-items: center;
  flex-basis: 100%;
  padding: 2px 10px 6px 10px;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Remark .remarkBox {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 25px;
  padding: 3px 10px;
  background-color: #F8F8F8;
  color: #999;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Remark .remarkBox::before {
  content: "!";
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #c4c4c4;
  display: inline-flex;
  font-size: var(--fs11);
  font-weight: bold;
  align-items: center;
  justify-content: center;
  color: #fff;
  margin-right: 5px;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Remark .remarkBox > span {
  color: #999;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Edit, .bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Del {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Edit > a, .bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Del > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border-radius: 50%;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Edit > a > i, .bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Del > a > i {
  display: inline-block;
  width: 15px;
  height: 13px;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Edit > a:hover, .bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Del > a:hover {
  background-color: #eee;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Del > a > i {
  width: 15px;
  height: 13px;
  background-position: -38px -299px;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item li.Edit > a > i {
  width: 11px;
  height: 13px;
  background-position: -12px -299px;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li > input[type=text], .bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li > input[type=button] {
  display: inline-block;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li > span, .bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li > a {
  display: none;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li.Remark {
  display: flex;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li.Remark .remarkBox {
  padding: 0;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li.Remark .remarkBox span, .bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li.Remark .remarkBox::before {
  display: none;
}
.bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li.Remark .remarkBox input[type=text], .bgAddressArea .AddressArea > .addressListArea .addrListContent .item.EditMode li.Remark .remarkBox > input[type=button] {
  display: inline-block;
}
.bgAddressArea .AddressArea > .addressListArea .Name {
  width: 200px;
}
.bgAddressArea .AddressArea > .addressListArea .Mobile {
  width: 170px;
}
.bgAddressArea .AddressArea > .addressListArea .Email {
  width: 230px;
}
.bgAddressArea .AddressArea > .addressListArea .Remark {
  width: 260px;
}
.bgAddressArea .AddressArea > .addressListArea .Edit, .bgAddressArea .AddressArea > .addressListArea .Del {
  width: 60px;
}

.Main.KakaoTalk .alarmTalkMsg {
  height: 0;
}
.Main.KakaoTalk > .popupArea > .bodyArea > .rightArea .kakaoMessge {
  height: 0;
  padding: 0;
}
.Main.KakaoTalk > .popupArea > .bodyArea > .rightArea .messageInputArea > textarea {
  height: 380px;
}

.controlShareMessge {
  display: none;
  position: absolute;
  top: 50px;
  left: 500px;
  min-width: 100px;
  padding-top: 26px;
}
.controlShareMessge > .btnMessageShare {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 26px;
  height: 26px;
  border-radius: 3px;
  background-color: var(--MainBgColor);
  background-position: -31px -165px;
  border: 1px solid var(--BorderGrey);
  transition: ease-in 0.3s;
}
.controlShareMessge > .btnMessageShare:hover {
  cursor: pointer;
  background-color: var(--SubColor1);
  background-position: -9px -165px;
  box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 3px;
}
.controlShareMessge > .ulMedia {
  display: none;
  overflow: hidden;
  border: 1px solid var(--MainColor);
  border-radius: 3px;
  background-color: var(--MainBgColor);
}
.controlShareMessge > .ulMedia > li {
  display: flex;
  align-items: center;
  padding: 6px 8px;
}
.controlShareMessge > .ulMedia > li > i {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -11px -133px;
}
.controlShareMessge > .ulMedia > li:hover {
  background-color: #d1d1d1;
  cursor: pointer;
}
.controlShareMessge > .ulMedia > li.Mail > i {
  background-position: -11px -133px;
}
.controlShareMessge > .ulMedia > li.SMS > i {
  background-position: -44px -133px;
}
.controlShareMessge > .ulMedia > li.Fax > i {
  background-position: -76px -133px;
}
.controlShareMessge > .ulMedia > li.KakaoTalk > i {
  background-position: -110px -133px;
}
.controlShareMessge > .ulMedia > li > span {
  display: inline-block;
  padding: 0 0 0 5px;
  font-size: var(--fs13);
}
.controlShareMessge.Show > .ulMedia {
  display: block;
}

.pgmGuideBottom {
  position: absolute;
  bottom: 0;
  width: 100%;
  min-height: 40px;
}
.pgmGuideBottom .pgmGuideContent {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 40px;
  background-color: var(--MainBgColor);
  border-top: 1px solid var(--BorderGreyDark1);
  padding: 8px 10px;
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.pgmGuideBottom .pgmGuideContent .guideTitle {
  position: absolute;
  top: 9px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border: 1px solid var(--BorderGreyDark1);
  border-radius: 20px;
  background-color: var(--BgColorGrey);
  margin-right: 10px;
  font-size: var(--fs11);
}
.pgmGuideBottom .pgmGuideContent .guideTitle .iconPgmGuide {
  display: inline-block;
  width: 14px;
  height: 14px;
  background-position: 0 0;
  margin-right: 5px;
}
.pgmGuideBottom .pgmGuideContent .guideText {
  display: inline-block;
  margin-left: 105px;
  margin-right: 70px;
  word-break: break-all;
}
.pgmGuideBottom .pgmGuideContent .guideText .highlight {
  color: var(--PointColor);
}
.pgmGuideBottom .pgmGuideContent .guideText .pgmLink {
  background-color: var(--MainColor);
  color: var(--MainBgColor);
  padding: 3px 8px;
  border-radius: 5px;
}
.pgmGuideBottom .pgmGuideContent .guideText .pgmLink:hover, .pgmGuideBottom .pgmGuideContent .guideText .pgmLink:active {
  background-color: var(--pgmLinkColorHover);
  cursor: pointer;
}
.pgmGuideBottom .pgmGuideContent .btnClose {
  position: absolute;
  top: 10px;
  right: 10px;
  display: inline-flex;
  align-items: center;
  background-color: var(--BgColorGrey);
  padding: 3px 10px;
  font-size: var(--fs11);
  border-radius: 20px;
}
.pgmGuideBottom .pgmGuideContent .btnClose .iconPgmGuideClose {
  display: inline-block;
  width: 10px;
  height: 10px;
  background-position: 0 -24px;
  margin-right: 6px;
}
.pgmGuideBottom .pgmGuideContent .btnClose:hover {
  background-color: #bcc3da;
  cursor: pointer;
}

.processHomeWrap {
  display: flex;
  width: 100%;
  height: calc(100% - 40px);
  background-color: var(--PgmAreaBgColor);
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.processHomeWrap .processHomeArea {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.processHomeWrap .processHomeArea .prcsHomeTitleArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  padding: 0 16px;
  border-bottom: 1px solid var(--BorderGrey);
}
.processHomeWrap .processHomeArea .prcsHomeTitleArea > .title {
  display: flex;
  align-items: center;
}
.processHomeWrap .processHomeArea .prcsHomeTitleArea > .title > .txt {
  margin-left: 8px;
  font-size: var(--fs16);
  font-weight: 700;
}
.processHomeWrap .processHomeArea .prcsList {
  width: 100%;
  padding: 16px;
  overflow-y: auto;
}
.processHomeWrap .processHomeArea .prcsList .listWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .titleArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding-bottom: 10px;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .titleArea > .icoProcessMenu16 {
  margin-right: 4px;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .titleArea > .txt {
  font-size: var(--fs15);
  font-weight: 600;
  color: #424242;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .titleArea .btnCollapse {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-left: auto;
  border-radius: 4px;
  cursor: pointer;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .titleArea .btnCollapse:hover {
  background-color: #E3E7EB;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea {
  width: 100%;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-top: -5px;
  margin-left: -5px;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li {
  position: relative;
  display: flex;
  align-items: center;
  margin: 5px;
  padding: 5px;
  width: 250px;
  height: 80px;
  border: 1px solid #E3E7EB;
  border-radius: 8px;
  background-color: var(--MainBgColor);
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li .imgBox {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 55px;
  flex-shrink: 0;
  padding: 4px;
  border-radius: 4px;
  background-color: var(--PgmAreaBgColor);
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li .imgBox > img {
  width: 100%;
  height: 100%;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li .txtBox {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 45px;
  flex-shrink: 0;
  border-radius: 4px;
  background-color: var(--PgmAreaBgColor);
  font-size: var(--fs16);
  font-weight: 600;
  color: #424242;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li .prcsInfo {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 10px;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li .prcsInfo .prcsName {
  display: block;
  width: 100%;
  color: #424242;
  font-size: var(--fs14);
  max-width: 100%;
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li .btnFav {
  position: absolute;
  top: 6px;
  right: 6px;
  display: none;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li .btnFav:hover {
  background-color: rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li:hover {
  border-color: #B0BEC5;
  cursor: pointer;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea > ul > li:hover .btnFav {
  display: flex;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea.noData > ul {
  display: none;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea.noData .noDataArea {
  display: flex;
  align-items: center;
  justify-content: center;
}
.processHomeWrap .processHomeArea .prcsList .listWrap .listArea.noData .noDataArea .iconBox {
  width: 44px;
  height: 44px;
}
.processHomeWrap .processHomeArea .prcsList .listWrap + .listWrap {
  margin-top: 30px;
}
.processHomeWrap .processHomeArea .prcsList .noDataArea {
  display: none;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.processHomeWrap .processHomeArea .prcsList .noDataArea .iconBox {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  margin-bottom: 8px;
  border-radius: 10px;
  background-color: #E6EDEF;
}
.processHomeWrap .processHomeArea .prcsList .noDataArea .txt {
  color: #757575;
  font-size: var(--fs13);
}
.processHomeWrap .processImgArea {
  display: none;
  width: 100%;
  height: 100%;
}
.processHomeWrap.prcsImgOpen .processHomeArea {
  flex-shrink: 0;
  width: 280px;
  border-right: 1px solid var(--BorderGrey);
  overflow: hidden;
}
.processHomeWrap.prcsImgOpen .processHomeArea .prcsHomeTitleArea {
  display: none;
}
.processHomeWrap.prcsImgOpen .processHomeArea .prcsList {
  width: 280px;
  padding: 10px 16px 16px 16px;
}
.processHomeWrap.prcsImgOpen .processHomeArea .prcsList .listWrap .listArea > ul {
  flex-direction: column;
  flex-wrap: nowrap;
}
.processHomeWrap.prcsImgOpen .processHomeArea .prcsList .listWrap .listArea > ul > li {
  width: 100%;
  margin: 5px 0;
}
.processHomeWrap.prcsImgOpen .processHomeArea .prcsList .listWrap .listArea > ul > li .prcsInfo .prcsName {
  font-size: var(--fs13);
}
.processHomeWrap.prcsImgOpen .processImgArea {
  display: block;
}
.processHomeWrap.prcsImgOpen.imgExpand .processHomeArea {
  width: 0;
  border-right: 0;
}
.processHomeWrap.prcsImgOpen.imgExpand .processHomeArea .prcsList {
  overflow: hidden;
}
.processHomeWrap.prcsImgOpen.imgExpand .processImgArea {
  border-top-left-radius: 8px;
  overflow: hidden;
}

.msgWrap.popupVideo .msgBox {
  width: 1050px;
  border-radius: 10px;
  overflow: hidden;
  transition: width 0.3s;
}
.msgWrap.popupVideo .msgBox .msgTitle {
  height: 44px;
  padding: 0 15px;
  justify-content: space-between;
}
.msgWrap.popupVideo .msgBox .msgTitle .leftTitle {
  display: flex;
  align-items: center;
}
.msgWrap.popupVideo .msgBox .msgTitle .leftTitle > i {
  margin-right: 4px;
}
.msgWrap.popupVideo .msgBox .msgTitle .rightTitle {
  display: flex;
  align-items: center;
  gap: 5px;
}
.msgWrap.popupVideo .msgBox .msgTitle .rightTitle .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}
.msgWrap.popupVideo .msgBox .msgTitle .rightTitle .btn:hover, .msgWrap.popupVideo .msgBox .msgTitle .rightTitle .btn.On {
  background-color: #E3E7EB;
  cursor: pointer;
}
.msgWrap.popupVideo .msgBox .msgContent {
  display: flex;
  flex-direction: column;
  padding: 0;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea {
  display: flex;
  align-items: center;
  height: 590px;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea iframe {
  width: 100%;
  height: 100%;
  border: 0;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 200px;
  height: 100%;
  border-top: 1px solid #ddd;
  border-left: 1px solid #ddd;
  background-color: #F5F8FD;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter .titleArea {
  padding: 15px 10px;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter .titleArea .txt {
  font-size: var(--fs13);
  font-weight: bold;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter .list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: auto;
  padding: 0 10px 20px 10px;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter .list > li > .item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding: 10px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  cursor: pointer;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter .list > li > .item .timestamp {
  font-size: var(--fs14);
  color: var(--MainColor);
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter .list > li > .item .txt {
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter .list > li > .item:hover {
  border: 1px solid #6bd485;
}
.msgWrap.popupVideo .msgBox .msgContent .videoArea .chapter .list > li > .item.On {
  border: 1px solid #6bd485;
  background-color: #f2fff8;
}
.msgWrap.popupVideo .msgBox .msgContent .infoArea {
  display: flex;
  align-items: center;
  width: 100%;
  height: 28px;
  gap: 4px;
  padding: 0 8px;
  border-top: 1px solid #eee;
}
.msgWrap.popupVideo .msgBox .msgContent .infoArea .txt {
  color: var(--MainFontColor) Lighter;
  font-size: var(--fs13);
}
.msgWrap.popupVideo .msgBox.rightOpen {
  width: 1250px;
}

.processMenuArea {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 0;
}
.processMenuArea .processMenuContentsArea {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: #fff;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  padding: 0 15px;
  background-color: var(--PgmAreaBgColor);
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .btnLeftList {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  margin-right: 4px;
  border-radius: 4px;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .btnLeftList:hover, .processMenuArea .processMenuContentsArea > .prcsTopArea .btnLeftList.On {
  background-color: #E3E7EB;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .currentPrcs {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 5px;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .currentPrcs .currentTitle {
  font-size: var(--fs16);
  font-weight: bold;
  color: var(--MainFontColor);
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .currentPrcs .btnVideo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  margin: 0 5px;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .btnWrap {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 4px;
  margin-left: auto;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .btnWrap .btnFavorite {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .btnWrap .btnPrcsInfo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 28px;
  gap: 4px;
  padding: 0 10px;
  background-color: #D6F4DD;
  border: 1px solid transparent;
  border-radius: 4px;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .btnWrap .btnPrcsInfo .txt {
  font-size: var(--fs12);
  font-weight: bold;
}
.processMenuArea .processMenuContentsArea > .prcsTopArea .btnWrap .btnPrcsInfo:hover, .processMenuArea .processMenuContentsArea > .prcsTopArea .btnWrap .btnPrcsInfo.On {
  border: 1px solid #5BDA7B;
}
.processMenuArea .processMenuContentsArea > .titleArea {
  position: relative;
  flex-shrink: 0;
  width: 100%;
  height: 30px;
  display: flex;
  align-items: center;
  padding: 0 15px;
  border-top: 1px solid var(--BorderGrey);
  border-bottom: 1px solid var(--BorderGrey);
  background-color: #EAF0F9;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path {
  display: flex;
  justify-content: flex-start;
  height: 100%;
  width: 100%;
  padding-right: 50px;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.exex {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  height: 100%;
  white-space: nowrap;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.exex > a {
  display: inline-block;
  font-size: var(--fs13);
  height: auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.exex > a.txtTitle:hover, .processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.exex > a.txtTitle:focus {
  text-decoration: underline;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.exex::after {
  content: ">";
  margin: 0 5px;
  color: var(--MainFontColor);
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.exex:last-child {
  flex-shrink: 0;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.exex:last-child > a.txtTitle {
  font-size: var(--fs17);
  color: var(--BorderGreyDark1);
  font-weight: bold;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.exex:last-child::after {
  display: none;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li {
  display: flex;
  align-items: center;
  padding: 0 5px;
  overflow: hidden;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li > .prcs {
  display: flex;
  align-items: center;
  height: 100%;
  background-color: #EAF0F9;
  z-index: 2;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li > .prcs > i.prcs, .processMenuArea .processMenuContentsArea > .titleArea > ul.path > li > .prcs > i.prcsOn {
  margin-right: 4px;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li > .prcs .txtTitle {
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: var(--fs12);
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li > .prcs .txtTitle:hover {
  color: inherit;
  text-decoration: underline;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li .arrow {
  border-top: 15px solid #EAF0F9;
  border-bottom: 15px solid transparent;
  border-left: 15px solid #EAF0F9;
  border-right: 15px solid #EAF0F9;
  background-color: #EAF0F9;
  box-shadow: 4px 0px 8px rgba(0, 0, 0, 0.1);
  transform: rotate(45deg) translate(-15px, 0px);
  transform-origin: left center;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li:last-child .arrow {
  display: none;
}
.processMenuArea .processMenuContentsArea > .titleArea > ul.path > li.On > .prcs .txtTitle {
  font-weight: bold;
}
.processMenuArea .processMenuContentsArea .prcsContent {
  display: flex;
  height: 100%;
  overflow: hidden;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #fff;
  overflow: auto;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .imgArea {
  position: relative;
  height: 100%;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .devProcessMenuSetImg {
  -webkit-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap > .btnEdit {
  position: fixed;
  display: inline-block;
  bottom: 20px;
  right: 20px;
  width: 60px;
  height: 60px;
  background-color: rgba(77, 85, 104, 0.9);
  background-position: 4px -350px;
  border-radius: 50%;
  z-index: 99999;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap > .btnEdit:hover {
  cursor: pointer;
  background-color: var(--colorRed);
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  background-color: rgba(255, 255, 255, 0);
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .divBadgeArea {
  position: absolute;
  top: -20px;
  left: 0;
  display: flex;
  align-items: center;
  gap: 2px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .divBadgeArea > .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 3px;
  background-color: #f6f9fd;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .divBadgeArea .txtCount {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 10px;
  background-color: #F74B53;
  color: #fff;
  font-size: var(--fs11);
  font-weight: 700;
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .divBadgeArea .txtCount.mini {
  width: 10px;
  height: 10px;
  min-width: unset;
  padding: 0;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .divBadgeArea .txtCount[count="0"] {
  background-color: #c2c2c2;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .icon {
  display: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #dae2ec;
  background-position: -10px -899px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .icon.AuthView {
  display: inline-block;
  background-position: -10px -899px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .icon.AuthLicense {
  display: inline-block;
  background-color: #ffe3de;
  background-position: -9px -938px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .icon.AuthSetting {
  display: inline-block;
  background-color: #D5E3ED;
  background-position: -12px -1006px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .txtPgmDefault {
  text-align: center;
  font-size: var(--fs17);
  letter-spacing: -1px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Dis > .icon {
  flex-shrink: 0;
  display: inline-block;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type01, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type04, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type08 {
  flex-wrap: nowrap;
  justify-content: flex-start;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type01 > .txtPgmDefault, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type04 > .txtPgmDefault, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type08 > .txtPgmDefault {
  text-align: left;
  font-size: var(--fs17);
  letter-spacing: -0.8px;
  margin-left: 8px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type06 {
  width: 96px !important;
  height: 100px !important;
  border: 1px solid var(--BorderGreyDark1);
  border-radius: 50%;
  padding: 3px 0 20px 0;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type06 > .txtPgmDefault, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type10 > .txtPgmDefault, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type11 > .txtPgmDefault, .processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type12 > .txtPgmDefault {
  font-size: var(--fs14);
  letter-spacing: -0.8px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > i {
  display: none;
  width: 78px;
  height: 64px;
  background-position: center;
  background-repeat: no-repeat;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type01 > i {
  display: inline-block;
  width: 42px;
  height: 42px;
  background-position: 0px -430px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type02 > i {
  display: inline-block;
  width: 78px;
  height: 64px;
  background-position: 0px -360px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type03 > i {
  display: inline-block;
  width: 78px;
  height: 64px;
  background-position: 0px -290px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type04 > i {
  display: inline-block;
  width: 42px;
  height: 42px;
  background-position: 0px -50px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type05 > i {
  display: inline-block;
  width: 78px;
  height: 64px;
  background-position: 0px -100px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type06 > i {
  display: inline-block;
  width: 39px;
  height: 40px;
  background-position: 0px -170px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type07 > i {
  display: inline-block;
  width: 78px;
  height: 64px;
  background-position: 0px -220px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type08 > i {
  display: inline-block;
  width: 42px;
  height: 42px;
  background-position: 0px 0px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type09 > i {
  display: inline-block;
  background-position: 0px 0px;
  background-image: url("../../Images/Module/ProcessMenuModule/DefaultIMG/Default009.png?webk20201106");
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type10 > i {
  display: inline-block;
  width: 78px;
  height: 64px;
  background-position: 0px -480px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type11 > i {
  display: inline-block;
  width: 78px;
  height: 64px;
  background-position: 0px -550px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea.Type12 > i {
  display: inline-block;
  width: 45px;
  height: 47px;
  background-position: 0px -624px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea > .mouseHover {
  position: absolute;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  opacity: 0;
  background-image: radial-gradient(circle, transparent, transparent 30%, rgba(255, 20, 0, 0.2) 44%, rgba(255, 100, 0, 0.4) 45%, rgba(255, 0, 0, 0) 80%, transparent 100%);
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programArea:hover > .mouseHover {
  animation: processMenuHover 1.5s infinite ease-out;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo {
  min-width: 100px;
  max-width: 300px;
  text-align: center;
  position: absolute;
  display: flex;
  flex-direction: column;
  padding: 16px;
  border: 1px solid #ddd;
  border-radius: 10px;
  background-color: var(--MainBgColor);
  box-shadow: 3px 3px 6px rgba(218, 221, 224, 0.5);
  gap: 12px;
  z-index: 9;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo .titleArea {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo .titleArea > .txtProgramName {
  display: flex;
  align-items: center;
  font-size: var(--fs15);
  font-weight: 700;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo .titleArea > .txtProgramName > i {
  margin-right: 4px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo .titleArea > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-left: 10px;
  border-radius: 50%;
  background-color: #ccc;
  color: #586074;
  font-size: var(--fs13);
  font-weight: bold;
  font-style: normal;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo .titleArea > a:hover {
  background-color: #3585F3;
  color: #fff;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo > .labelRed {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 4px 6px;
  border-radius: 2px;
  background-color: #FEEBEC;
  color: #EB343C;
  font-size: var(--fs12);
  font-weight: 500;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo > .labelRed > i {
  padding-right: 2px;
  padding-left: 4px;
  font-size: var(--fs13);
  font-weight: 700;
  font-style: normal;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo > .txtDescription {
  color: #6C6C6C;
  font-size: var(--fs13);
  text-align: left;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo > .badgeArea {
  display: flex;
  align-items: center;
  margin-top: 12px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo > .badgeArea > li {
  display: flex;
  align-items: center;
  padding-right: 10px;
  color: #6B6F82;
  font-size: var(--fs12);
  font-weight: 500;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap .programInfo > .badgeArea > li + li::before {
  content: "";
  width: 1px;
  height: 10px;
  margin-right: 10px;
  background-color: #b4b4b4;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap > .noProcessMessage {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -150px 0 0 -250px;
  display: inline-block;
  width: 500px;
  height: 300px;
  text-align: center;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap > .noProcessMessage > .img {
  display: inline-block;
  width: 120px;
  height: 150px;
  background-position: -50px 0;
}
.processMenuArea .processMenuContentsArea .prcsContent > .prcsWrap > .noProcessMessage > p {
  font-size: var(--fs22);
  color: #586074;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea {
  display: flex;
  flex-shrink: 0;
  width: 300px;
  height: 100%;
  background-color: var(--MainBgColor);
  box-shadow: -10px 0 10px 0 rgba(0, 0, 0, 0.05);
  overflow: hidden;
  z-index: 1;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap {
  display: flex;
  flex-direction: column;
  width: 300px;
  height: 100%;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap > header {
  display: flex;
  align-items: center;
  width: 300px;
  height: 30px;
  padding: 0 15px 0 20px;
  border-bottom: 1px solid #eee;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap > header .txt {
  font-size: var(--fs12);
  color: var(--MainFontColor) Lighter;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-left: auto;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent {
  display: flex;
  flex-direction: column;
  width: 300px;
  height: 100%;
  overflow: hidden;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent > .titleArea {
  display: flex;
  align-items: flex-start;
  flex-shrink: 0;
  padding: 20px 20px 10px 20px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent > .titleArea > i {
  margin-right: 5px;
  margin-top: 2px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent > .titleArea .txtTitle {
  padding-top: 3px;
  font-size: var(--fs16);
  font-weight: bold;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent > .titleArea .btnFavorite {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  margin-left: auto;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow-y: auto;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .infoItemWrap {
  padding: 20px 20px 0 20px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .infoItemWrap .infoItem {
  margin-bottom: 20px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .infoItemWrap .infoItem > .txtTitle {
  font-size: var(--fs14);
  font-weight: bold;
  color: var(--MainFontColor);
  margin-bottom: 10px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .infoItemWrap .infoItem > .txtDescription {
  margin-bottom: 16px;
  font-size: var(--fs14);
  line-height: 140%;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: #F5F8FD;
  overflow: hidden;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap {
  padding: 20px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .titleArea {
  display: flex;
  align-items: center;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .titleArea .txtTitle {
  font-size: var(--fs14);
  font-weight: bold;
  color: var(--MainFontColor);
  margin-bottom: 10px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .titleArea .btnExpand {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  margin-left: auto;
  border-radius: 4px;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .titleArea .btnExpand:hover {
  background-color: #E3E7EB;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .titleArea .btnExpand.Collapse > i {
  transform: rotate(180deg);
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .btnArea {
  flex-shrink: 0;
  overflow: hidden;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .btnArea .btnVideo {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 76px;
  padding: 0 15px;
  border-radius: 6px;
  border: 1px solid #9CE4AE;
  background-color: #FBFFF9;
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .btnArea .btnVideo .txtWrap {
  display: flex;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .btnArea .btnVideo .txtWrap > i {
  margin-right: 10px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .btnArea .btnVideo .txtWrap .txt {
  font-size: var(--fs14);
  font-weight: bold;
  text-align: left;
  line-height: 130%;
  color: var(--MainFontColor);
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .topWrap .btnArea .btnVideo > i.bnrImg {
  position: absolute;
  right: -2px;
  bottom: -4px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .chapter {
  height: 100%;
  overflow-y: auto;
  padding: 0 20px 20px 20px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .chapter .list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .chapter .list > li > .item {
  display: flex;
  gap: 10px;
  width: 100%;
  padding: 10px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  cursor: pointer;
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .chapter .list > li > .item .timestamp {
  font-size: var(--fs14);
  color: var(--MainColor);
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .chapter .list > li > .item .txt {
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.processMenuArea .processMenuContentsArea .prcsContent > .processMenuInfoArea .rightInfoWrap .infoContent .contentWrap .videoWrap .chapter .list > li > .item:hover {
  border: 1px solid #6bd485;
}
.processMenuArea .processMenuContentsArea .prcsContent > .btnEdit {
  position: fixed;
  display: inline-block;
  bottom: 10px;
  right: 20px;
  width: 60px;
  height: 60px;
  background-color: rgba(77, 85, 104, 0.9);
  background-position: 4px -410px;
  border-radius: 50%;
  z-index: 99999;
}
.processMenuArea .processMenuContentsArea .prcsContent > .btnEdit:hover {
  cursor: pointer;
  background-color: #ff4889;
}
@keyframes processMenuHover {
  0% {
    opacity: 0;
  }
  60% {
    transform: scale(1.5);
    opacity: 1;
  }
  100% {
    transform: scale(3);
    opacity: 0;
  }
}
.processMenuArea.ExpanderMode .processMenuContentsArea .prcsTopArea .btnPrcsInfo {
  border: 1px solid transparent;
}
.processMenuArea.ExpanderMode .processMenuContentsArea .prcsTopArea .btnPrcsInfo:hover {
  border: 1px solid #5BDA7B;
}
.processMenuArea.ExpanderMode .processMenuContentsArea .processMenuInfoArea {
  width: 0;
  padding: 0;
  box-shadow: none;
}

.toolbarWrap {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 50px;
  width: 100%;
}
.toolbarWrap .processToolbarArea {
  display: inline-flex;
  align-items: center;
  padding: 0;
  height: 36px;
  border-radius: 5px;
  background-color: #000;
}
.toolbarWrap .processToolbarArea > .btn {
  display: inline-flex;
  align-items: center;
  height: 30px;
  padding: 0 8px 0 32px;
  margin: 0 5px;
  font-size: var(--fs13);
  color: #fff;
  background-position: 0px 350px;
  background-color: transparent;
  border: 0px;
  border-radius: 3px;
}
.toolbarWrap .processToolbarArea > .btn:hover {
  background-color: #4a4c52;
  cursor: pointer;
}
.toolbarWrap .processToolbarArea > .btn.Save {
  background-position: -6px -832px;
}
.toolbarWrap .processToolbarArea > .btn.Upload {
  background-position: -9px -480px;
}
.toolbarWrap .processToolbarArea > .btn.ReLoad {
  background-position: -7px -531px;
}
.toolbarWrap .processToolbarArea > .btn.Replace {
  background-position: -7px -630px;
}
.toolbarWrap .processToolbarArea > .btn.Temp {
  background-position: -2px -665px;
}
.toolbarWrap .processToolbarArea > .btn.ItemSave {
  background-position: -8px -798px;
  background-color: #D24A28;
  border-radius: 3px 0 0 3px;
  margin-right: 0;
}
.toolbarWrap .processToolbarArea > .btn.ItemSave:hover {
  background-color: #bd4224;
  cursor: pointer;
}
.toolbarWrap .processToolbarArea > .btn.ItemAllSave {
  background-position: -4px -968px;
  background-color: #8d280f;
  border-radius: 0 3px 3px 0;
  margin-left: 0;
}
.toolbarWrap .processToolbarArea > .btn.ItemAllSave:hover {
  background-color: #76210d;
  cursor: pointer;
}

.ProcessMenuEdit {
  position: absolute;
  top: 50px;
  left: 0;
  width: 100%;
  height: calc(100% - 50px);
  overflow: auto;
}

.devProcessEditorTitle {
  color: #fff;
}

.templateListWrap {
  position: fixed;
  top: 50px;
  right: 0;
  width: 250px;
  height: calc(-50px + 100%);
  display: flex;
  flex-direction: column;
  border-left: 1px solid #ebebeb;
  background-color: #fff;
  transition: 0.3s;
  color: var(--MainFontColor);
}
.templateListWrap > .titleArea {
  display: flex;
  align-items: center;
  padding: 20px 10px;
  flex-shrink: 0;
}
.templateListWrap > .titleArea > .btnExpander {
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  margin-right: 5px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #313131;
  color: #fff;
}
.templateListWrap > .titleArea > .btnExpander > i {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-left: -3px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-135deg);
}
.templateListWrap > .titleArea > span {
  display: inline-block;
  font-size: var(--fs14);
  font-weight: bold;
}
.templateListWrap > .templateListArea {
  height: 100%;
  overflow-y: auto;
}
.templateListWrap > .templateListArea > ul > li {
  display: flex;
  align-items: center;
  padding: 8px 10px;
  font-size: var(--fs14);
}
.templateListWrap > .templateListArea > ul > li:hover {
  cursor: pointer;
  background-color: #ebebeb;
}
.templateListWrap > .templateListArea > ul > li > .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  margin-right: 5px;
  border-radius: 50%;
  background-color: #f1f1f1;
  color: #313131;
  font-size: var(--fs11);
}
.templateListWrap > .templateListArea > ul > li > .icon.type1 {
  background-color: #dfd3ec;
  color: #764fa2;
}
.templateListWrap > .templateListArea > ul > li > .icon.type2 {
  background-color: #c5e7c5;
  color: #3f8c3d;
}
.templateListWrap > .templateListArea > ul > li > .icon.type3 {
  background-color: #e5e5f1;
  color: #192655;
}
.templateListWrap > .pluginDownArea {
  padding: 20px;
  flex-shrink: 0;
  background-color: #f1f4f6;
}
.templateListWrap > .pluginDownArea > .txtTitle {
  font-size: var(--fs17);
}
.templateListWrap > .pluginDownArea > .txtDescription {
  font-size: var(--fs13);
  opacity: 0.5;
}
.templateListWrap > .pluginDownArea > .btnDown {
  display: flex;
  justify-content: center;
  padding: 8px;
  margin-top: 10px;
  font-size: var(--fs13);
  color: var(--MainColor);
  border: 1px solid var(--MainColor);
}
.templateListWrap > .pluginDownArea > .btnDown:hover {
  cursor: pointer;
  background-color: var(--MainColor);
  color: #fff;
}
.templateListWrap > .btnTemplate {
  display: none;
  align-items: center;
  justify-content: flex-start;
  padding-left: 15px;
  width: 100%;
  height: 50px;
}
.templateListWrap > .btnTemplate > i {
  width: 20px;
  height: 20px;
  display: inline-block;
  background-position: -15px -867px;
}
.templateListWrap > .btnTemplate:hover {
  background-color: #eaeaea;
  cursor: pointer;
}
.templateListWrap.Close {
  right: -200px;
}
.templateListWrap.Close .titleArea > .btnExpander {
  background-color: #fff;
  color: var(--MainFontColor);
}
.templateListWrap.Close .titleArea > .btnExpander > i {
  margin-left: 3px;
  transform: rotate(45deg);
}
.templateListWrap.Close .titleArea > span {
  opacity: 0;
}
.templateListWrap.Close > .btnTemplate {
  display: flex;
  flex-shrink: 0;
}
.templateListWrap.Close .templateListArea > ul > li > .txtFileName,
.templateListWrap.Close > .pluginDownArea {
  opacity: 0;
}

.apprAdminIndicator {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
  width: 100%;
  height: 36px;
  padding: 0 25px 0 10px;
  background-color: #2677dc;
  color: #fff;
  font-size: var(--fs13);
  z-index: 1;
}
.apprAdminIndicator .title {
  font-size: var(--fs14);
  font-weight: bold;
}
.apprAdminIndicator .userInfo .username {
  font-weight: bold;
  color: #fffc94;
}
.apprAdminIndicator .btnUserMode {
  padding: 4px 10px;
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  border-radius: 5px;
  margin-left: 10px;
  cursor: pointer;
}
.apprAdminIndicator .btnUserMode:hover {
  background-color: #034392;
}
.apprAdminIndicator.Show {
  display: flex;
}
.apprAdminIndicator.Show + .apprDocViewWrapper {
  padding-top: 36px;
}
.apprAdminIndicator.Show + .apprHomeWrap {
  padding-top: 36px;
}
.apprAdminIndicator.Show + .apprHomeWrap::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  border: 5px solid #2777dc;
}
.apprAdminIndicator.Show + .apprHomeWrap .apprSidebar {
  left: 5px;
  height: calc(100% - 41px);
}
.apprAdminIndicator.Show + .apprHomeWrap .apprContents {
  height: calc(100% - 5px);
  width: calc(100% - 205px);
}
.apprAdminIndicator.Show + .apprHomeWrap.collapseSidebar .apprSidebar {
  top: 86px;
  left: -200px;
  height: 80%;
}
.apprAdminIndicator.Show + .apprHomeWrap.collapseSidebar .apprSidebar:hover, .apprAdminIndicator.Show + .apprHomeWrap.collapseSidebar .apprSidebar.floating {
  left: 0;
  box-shadow: 2px 2px 15px rgba(0, 0, 0, 0.2);
}
.apprAdminIndicator.Show + .apprHomeWrap .apprSidebar > header {
  display: none;
}
.apprAdminIndicator.Show + .apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu:first-child, .apprAdminIndicator.Show + .apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.dept {
  display: none;
}
.apprAdminIndicator.Show + .apprHomeWrap .apprContents .apprListView .apprSearch {
  display: none;
}
.apprAdminIndicator.Show + .apprHomeWrap.collapseSidebar .apprContents {
  width: calc(100% - 5px);
}

.apprHomeWrap .btnPrimary, .apprDocView .btnPrimary, .apprWriteContents .btnPrimary, .apprDocRef .btnPrimary {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--MainColor);
  color: #fff;
  cursor: pointer;
}
.apprHomeWrap .btnPrimary:hover, .apprHomeWrap .btnPrimary:focus, .apprDocView .btnPrimary:hover, .apprDocView .btnPrimary:focus, .apprWriteContents .btnPrimary:hover, .apprWriteContents .btnPrimary:focus, .apprDocRef .btnPrimary:hover, .apprDocRef .btnPrimary:focus {
  background-color: var(--ButtonDefaultColorHover);
}
.apprHomeWrap .btnDefault, .apprDocView .btnDefault, .apprWriteContents .btnDefault, .apprDocRef .btnDefault {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
  color: var(--FontColorGrey);
  cursor: pointer;
}
.apprHomeWrap .statusBlue, .apprDocView .statusBlue, .apprWriteContents .statusBlue, .apprDocRef .statusBlue {
  background-color: rgba(57, 170, 250, 0.1);
  color: var(--apprStatusColorBlue);
}
.apprHomeWrap .statusGreen, .apprDocView .statusGreen, .apprWriteContents .statusGreen, .apprDocRef .statusGreen {
  background-color: rgba(21, 176, 101, 0.1);
  color: var(--apprStatusColorGreen);
}
.apprHomeWrap .statusRed, .apprDocView .statusRed, .apprWriteContents .statusRed, .apprDocRef .statusRed {
  background-color: rgba(255, 77, 44, 0.1);
  color: var(--apprStatusColorRed);
}
.apprHomeWrap .statusYellow, .apprDocView .statusYellow, .apprWriteContents .statusYellow, .apprDocRef .statusYellow {
  background-color: rgba(253, 171, 52, 0.1);
  color: var(--apprStatusColorYellow);
}
.apprHomeWrap .statusGrey, .apprDocView .statusGrey, .apprWriteContents .statusGrey, .apprDocRef .statusGrey {
  background-color: rgba(153, 153, 153, 0.1);
  color: var(--apprStatusColorGrey);
}
.apprHomeWrap a:hover, .apprDocView a:hover, .apprWriteContents a:hover, .apprDocRef a:hover {
  color: unset;
}
.apprHomeWrap .iconApprBtnReject,
.apprHomeWrap .iconApprBtnHold,
.apprHomeWrap .iconApprBtnApproval,
.apprHomeWrap .iconApprBtnDelete, .apprDocView .iconApprBtnReject,
.apprDocView .iconApprBtnHold,
.apprDocView .iconApprBtnApproval,
.apprDocView .iconApprBtnDelete, .apprWriteContents .iconApprBtnReject,
.apprWriteContents .iconApprBtnHold,
.apprWriteContents .iconApprBtnApproval,
.apprWriteContents .iconApprBtnDelete, .apprDocRef .iconApprBtnReject,
.apprDocRef .iconApprBtnHold,
.apprDocRef .iconApprBtnApproval,
.apprDocRef .iconApprBtnDelete {
  width: 17px;
  height: 17px;
}
.apprHomeWrap .iconApprBtnReject, .apprDocView .iconApprBtnReject, .apprWriteContents .iconApprBtnReject, .apprDocRef .iconApprBtnReject {
  background-position: -52px -242px;
}
.apprHomeWrap .iconApprBtnHold, .apprDocView .iconApprBtnHold, .apprWriteContents .iconApprBtnHold, .apprDocRef .iconApprBtnHold {
  background-position: -26px -242px;
}
.apprHomeWrap .iconApprBtnApproval, .apprDocView .iconApprBtnApproval, .apprWriteContents .iconApprBtnApproval, .apprDocRef .iconApprBtnApproval {
  background-position: 0 -242px;
}
.apprHomeWrap .iconApprBtnDelete, .apprDocView .iconApprBtnDelete, .apprWriteContents .iconApprBtnDelete, .apprDocRef .iconApprBtnDelete {
  background-position: -78px -242px;
}

.apprToastMsg {
  position: absolute;
  top: calc(50% - 100px);
  left: calc(50% - 100px);
  z-index: 17;
}
.apprToastMsg .toastContent {
  background-color: #464646;
  padding: 10px 20px;
  color: var(--InvertFontColor);
  border-radius: 5px;
  font-size: var(--fs15);
}

.apprHomeWrap {
  display: flex;
  width: 100%;
  height: 100%;
  transform: translateX(0px);
  transition: all 0.3s;
}
.apprHomeWrap .apprSidebar {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: var(--apprSideBarWidth);
  height: 100%;
  border-right: 1px solid var(--apprHomeWrapBorderColor);
  background-color: var(--PgmAreaBgColor);
  transition: left 0.3s, height 0.3s;
  z-index: 1;
}
.apprHomeWrap .apprSidebar .sidebarHoverArea {
  position: absolute;
  top: 0;
  right: -14px;
  width: 14px;
  height: 100%;
  cursor: pointer;
  z-index: 1;
}
.apprHomeWrap .apprSidebar .sidebarTopHoverArea {
  position: absolute;
  top: -50px;
  left: 0;
  width: 100%;
  height: 50px;
}
.apprHomeWrap .apprSidebar > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  flex-wrap: wrap;
  padding: 5px 10px 20px 10px;
}
.apprHomeWrap .apprSidebar > header > h2 {
  font-size: var(--fs17);
}
.apprHomeWrap .apprSidebar > header .btnNewApprWrap {
  flex-basis: 100%;
}
.apprHomeWrap .apprSidebar > header .btnNewApprWrap .btnNewAppr {
  width: 100%;
  height: 40px;
  font-size: var(--fs15);
  border-radius: 5px;
}
.apprHomeWrap .apprSidebar > header .apprBriefing {
  display: flex;
  justify-content: space-between;
  flex-basis: 100%;
  margin-bottom: 10px;
}
.apprHomeWrap .apprSidebar > header .apprBriefing li {
  display: inline-flex;
}
.apprHomeWrap .apprSidebar > header .apprBriefing li > a {
  padding: 5px;
  text-align: center;
  border-radius: 3px;
}
.apprHomeWrap .apprSidebar > header .apprBriefing li > a:hover {
  background-color: var(--BgColorGrey);
  color: var(--InvertBgColor);
}
.apprHomeWrap .apprSidebar > header .apprBriefing li > a .count {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 30px;
  margin: 0 auto;
  font-size: var(--fs19);
}
.apprHomeWrap .apprSidebar > header .apprBriefing li > a .count .iconApprovedList {
  width: 21px;
  height: 21px;
  background-position: 0 -166px;
}
.apprHomeWrap .apprSidebar > header .apprBriefing li > a .title {
  font-size: var(--fs13);
}
.apprHomeWrap .apprSidebar .apprMenuWrap {
  width: 100%;
  height: 100%;
  overflow: auto;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu {
  width: 100%;
  border-top: 1px solid #d4dfe4;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .count {
  margin-left: auto;
  color: var(--MainColor);
  font-size: var(--fs15);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .count + .iconArrow {
  margin-left: 10px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .iconArrow {
  width: 4px;
  height: 7px;
  background-position: 0 -604px;
  margin-left: auto;
  opacity: 0.5;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuCtgr {
  display: flex;
  align-items: center;
  height: 38px;
  font-weight: bold;
  font-size: var(--fs14);
  padding: 0 10px;
  color: var(--MainFontColor);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuCtgr .iconWrap {
  display: flex;
  align-items: center;
  width: 20px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuCtgr .iconWrap > i {
  display: inline-block;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuCtgr .iconWrap > i.iconSent {
  width: 16px;
  height: 16px;
  background-position: -82px -166px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuCtgr .iconWrap > i.iconRecieved {
  width: 18px;
  height: 13px;
  background-position: -31px -166px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuCtgr .iconWrap > i.iconDeptDoc {
  width: 15px;
  height: 13px;
  background-position: -58px -166px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuCtgr .iconWrap > i.iconShareDoc {
  width: 13px;
  height: 14px;
  background-position: -108px -166px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuList {
  padding: 0 4px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuList li {
  width: 100%;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuList li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 34px;
  padding: 0 10px 0 26px;
  border-radius: 4px;
  font-size: var(--fs14);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuList li > a > i {
  flex-shrink: 0;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuList li > a:hover {
  background-color: #e8ecf2;
  color: var(--MainFontColor);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu .apprMenuList li > a.selected {
  font-weight: bold;
  color: var(--MainFontColor);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.draft {
  padding: 4px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.draft .apprMenuCtgr {
  height: 34px;
  padding: 0 10px 0 4px;
  border-radius: 4px;
  color: var(--MainFontColor);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.draft .apprMenuCtgr:hover {
  background-color: #e8ecf2;
  color: var(--MainFontColor);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.draft .apprMenuCtgr.selected {
  font-weight: bold;
  color: var(--MainFontColor);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.dept .apprMenuList > li .deptName {
  display: flex;
  align-items: center;
  height: 26px;
  padding: 0 15px 0 30px;
  font-size: var(--fs13);
  color: #999;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.setting {
  margin-top: 20px;
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.setting .apprMenuList li > a {
  font-size: var(--fs14);
}
.apprHomeWrap .apprSidebar .apprMenuWrap .apprMenu.setting .apprMenuList li > a .iconApprSetting {
  width: 16px;
  height: 16px;
  margin-right: 8px;
  background-position: 0 -197px;
}
.apprHomeWrap.collapseSidebar .btnMenuCollapse,
.apprHomeWrap.collapseSidebar .apprSidebar.floating .sidebarHoverArea {
  display: none;
}
.apprHomeWrap.collapseSidebar .apprSidebar {
  top: 50px;
  left: -var(--apprSideBarWidth);
  display: flex;
  flex-direction: column;
  height: 80%;
  border: 1px solid var(--apprHomeWrapBorderColor);
  border-left: 0;
  box-shadow: 2px 2px 15px rgba(0, 0, 0, 0);
  transition: left 0.3s, height 0.3s, box-shadow 0.3s;
  z-index: 1;
}
.apprHomeWrap.collapseSidebar .apprSidebar:hover, .apprHomeWrap.collapseSidebar .apprSidebar.floating {
  left: 0;
  box-shadow: 2px 2px 15px rgba(0, 0, 0, 0.2);
}
.apprHomeWrap.collapseSidebar .apprContents {
  margin-left: 0;
  width: 100%;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView .listWrap > header .btnShowSidebar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 20px;
  cursor: pointer;
  z-index: 2;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView .listWrap > header .btnShowSidebar > i {
  flex-shrink: 0;
  width: 15px;
  height: 13px;
  background-position: 0 -427px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView .listWrap > header .btnShowSidebar:hover {
  width: 24px;
  height: 26px;
  background-color: rgba(51, 51, 51, 0.1);
  border-radius: 3px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView .listWrap > header .btnShowSidebar:hover > i {
  width: 12px;
  height: 12px;
  background-position: 0 -449px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView .apprListScrollWrap {
  padding: 10px 15px 10px 40px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView .listWrap > .apprSearchHeader {
  padding-left: 40px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView.searchResult .searchDetail {
  padding-left: 40px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView.searchResult .searchDetail .periodSelectOption {
  left: 40px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView.searchResult .advancedSearch {
  padding-left: 40px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView.searchResult .listWrap > header {
  position: absolute;
  top: 19px;
  left: 0;
  display: flex;
  height: 30px;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView.searchResult .listWrap > header h3 {
  display: none;
}
.apprHomeWrap.collapseSidebar .apprContents .apprListView .apprListTabWrap, .apprHomeWrap.collapseSidebar .apprContents .apprListView .listWrap .checkAll {
  padding-left: 40px;
}

.btnMenuCollapse {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 26px;
  border-radius: 3px;
  cursor: pointer;
}
.btnMenuCollapse > i {
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-position: 0 -449px;
  transform: rotate(180deg);
}
.btnMenuCollapse:hover {
  background-color: rgba(51, 51, 51, 0.1);
}
.btnMenuCollapse:hover > i {
  opacity: 1;
}

.apprContents {
  display: flex;
  width: calc(100% - var(--apprSideBarWidth));
  height: 100%;
  margin-left: var(--apprSideBarWidth);
  transition: all 0.3s;
  overflow: auto;
}
.apprContents .apprListView {
  position: relative;
  width: var(--apprListViewWidth);
  height: 100%;
  border-right: 1px solid var(--apprHomeWrapBorderColor);
  overflow: auto;
}
.apprContents .apprListView .listWrap {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  transition: height 0.3s;
  min-width: var(--apprSearchResultMinWidth);
}
.apprContents .apprListView .listWrap header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 50px;
  padding: 0 10px;
}
.apprContents .apprListView .listWrap header .btnShowSidebar {
  display: none;
}
.apprContents .apprListView .listWrap header h3 {
  display: inline-flex;
  padding: 0;
  font-size: var(--fs17);
  margin-left: 5px;
  color: var(--MainFontColor);
}
.apprContents .apprListView .listWrap header .btnRefresh {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-left: 7px;
  border-radius: 3px;
  cursor: pointer;
}
.apprContents .apprListView .listWrap header .btnRefresh > i {
  display: inline-block;
  width: 11px;
  height: 11px;
  background-position: -21px -44px;
  opacity: 0.5;
}
.apprContents .apprListView .listWrap header .btnRefresh:hover {
  background-color: rgba(51, 51, 51, 0.1);
}
.apprContents .apprListView .listWrap header .btnRefresh:hover > i {
  opacity: 1;
}
.apprContents .apprListView .listWrap .checkAll {
  position: relative;
  display: flex;
  padding: 5px 15px;
  min-width: 360px;
  min-height: 38px;
}
.apprContents .apprListView .listWrap .checkAll .checkArea {
  display: inline-flex;
  width: auto;
  flex-shrink: 0;
}
.apprContents .apprListView .listWrap .checkAll .checkArea input[type=checkbox] {
  left: 12px;
  top: 11px;
}
.apprContents .apprListView .listWrap .checkAll .checkArea input[type=checkbox] + label {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--MainFontColor);
}
.apprContents .apprListView .listWrap .checkAll .checkArea input[type=checkbox] + label span {
  display: block;
  font-size: var(--fs14);
  margin-left: 8px;
}
.apprContents .apprListView .listWrap .checkAll .checkArea input[type=checkbox] + label::before {
  width: 15px;
  height: 15px;
  border-radius: 3px;
}
.apprContents .apprListView .listWrap .checkAll .checkArea input[type=checkbox] + label::after {
  top: 2px;
  left: 5px;
  width: 5px;
  height: 7px;
}
.apprContents .apprListView .listWrap .checkAll.On .apprBatchArea {
  display: flex;
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea {
  display: flex;
  align-items: center;
  margin-left: 15px;
  color: var(--InvertFontColor);
  display: none;
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .itemCount {
  flex-shrink: 0;
  margin-right: 5px;
  color: var(--FontColorGrey);
  font-size: var(--fs13);
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .itemCount::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  background-color: #ccc;
  margin-right: 7px;
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap {
  display: flex;
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch {
  display: inline-flex;
  align-items: center;
  height: 28px;
  flex-shrink: 0;
  background-color: var(--MainBgColor);
  border: 1px solid var(--BorderGreyDark1);
  padding: 0 10px;
  margin-left: 5px;
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  cursor: pointer;
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch .iconWrap {
  display: inline-flex;
  margin-right: 5px;
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch.btnActionReject {
  border-color: var(--apprStatusColorRed);
  color: var(--apprStatusColorRed);
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch.btnActionReject:hover {
  background-color: rgba(var(--apprStatusColorRed), 0.1);
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch.btnActionHold {
  border-color: var(--apprStatusColorYellow);
  color: var(--apprStatusColorYellow);
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch.btnActionHold:hover {
  background-color: rgba(var(--apprStatusColorYellow), 0.1);
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch.btnActionApproval {
  border-color: var(--apprStatusColorBlue);
  color: var(--apprStatusColorBlue);
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch.btnActionApproval:hover {
  background-color: rgba(var(--apprStatusColorBlue-rgb), 0.1);
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch.btnActionDelete {
  border-color: #434a4e;
  color: var(--MainFontColor);
}
.apprContents .apprListView .listWrap .checkAll .apprBatchArea .btnWrap .btnApprBatch.btnActionDelete:hover {
  background-color: rgba(67, 74, 78, 0.1);
}
.apprContents .apprListView .listWrap .apprSearchHeader .apprSearch {
  position: absolute;
  top: 10px;
  right: 15px;
  display: flex;
  width: 230px;
  height: 30px;
  border: 1px solid var(--apprHomeWrapBorderColor);
  overflow: hidden;
}
.apprContents .apprListView .listWrap .apprSearchHeader .apprSearch input {
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0 40px 0 10px;
  color: var(--MainFontColor);
}
.apprContents .apprListView .listWrap .apprSearchHeader .apprSearch input:focus {
  outline: none;
}
.apprContents .apprListView .listWrap .apprSearchHeader .apprSearch input::placeholder, .apprContents .apprListView .listWrap .apprSearchHeader .apprSearch input:-ms-input-placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.apprContents .apprListView .listWrap .apprSearchHeader .apprSearch .btnApprSearch {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  cursor: pointer;
}
.apprContents .apprListView .listWrap .apprSearchHeader .apprSearch .btnApprSearch > i {
  width: 14px;
  height: 14px;
  background-position: 0 0;
}
.apprContents .apprListView .listWrap .apprSearchHeader .apprSearch .btnApprSearch:hover {
  background-color: #e6e6e6;
  cursor: pointer;
}
.apprContents .apprListView .listWrap .apprSearchHeader .btnAdvanced {
  display: none;
}
.apprContents .apprListView .listWrap .apprListTabWrap {
  display: inline-flex;
  width: 100%;
  padding: 0 15px;
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab {
  display: inline-flex;
  padding: 0 0 10px 0;
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li {
  display: inline-flex;
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li > a {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  height: 34px;
  padding: 0 1px;
  margin: 0 10px;
  border-bottom: 2px solid transparent;
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li::after {
  content: "";
  width: 1px;
  height: 18px;
  background-color: var(--apprHomeWrapBorderColor);
  margin: auto;
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li:last-child::after {
  display: none;
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li:first-child > a {
  margin-left: 0;
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li > a:hover {
  font-weight: bold;
  color: var(--MainFontColor);
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li > a.selected {
  font-weight: bold;
  border-color: var(--MainColor);
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li > a.selected .count {
  color: var(--MainColor);
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li > a .title {
  margin-right: 6px;
  font-size: var(--fs14);
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab li > a .count {
  font-weight: bold;
  font-size: var(--fs14);
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab.noCountTab li > a .title {
  margin-right: 0;
}
.apprContents .apprListView .listWrap .apprListTabWrap .apprListTab.noCountTab li > a .count {
  display: none;
}
.apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelect {
  display: inline-flex;
  align-items: center;
  min-width: 120px;
  height: 30px;
  padding: 0 10px;
  border: 1px solid #d6d6d6;
  background-color: var(--ControlBgColor);
}
.apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelect .selectedTxt {
  font-size: var(--fs14);
  margin-right: 10px;
}
.apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelect .iconArrow {
  width: 8px;
  height: 5px;
  background-position: 0 -394px;
  margin-left: auto;
}
.apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelectOption {
  position: absolute;
  top: 29px;
  left: 15px;
  width: 120px;
  background-color: var(--ControlBgColor);
  font-size: var(--fs14);
  border: 1px solid #d6d6d6;
  z-index: 1;
}
.apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelectOption .selectList {
  border-bottom: 1px solid #d6d6d6;
}
.apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelectOption .selectList li > a {
  display: flex;
  align-items: center;
  height: 30px;
  padding: 0 10px;
  font-size: var(--fs13);
}
.apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelectOption .selectList li > a:hover {
  background-color: #EDEFF5;
}
.apprContents .apprListView .listWrap .apprListTabWrap .ctgrSelectOption .selectList li > a.selected {
  font-weight: bold;
  color: var(--MainColor);
}
.apprContents .apprListView .listWrap .apprListTabWrap > .apprListFilter {
  padding: 3px 0 0 0;
  margin-left: 5px;
}
.apprContents .apprListView .listWrap .apprListFilter {
  position: relative;
  display: flex;
  z-index: 1;
  padding: 5px 15px;
}
.apprContents .apprListView .listWrap .apprListFilter .btnFilter {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  height: 28px;
  background-color: #fff;
  padding: 0 10px;
  border: 1px solid #dbe1e6;
}
.apprContents .apprListView .listWrap .apprListFilter .btnFilter .iconFilterAlign {
  width: 15px;
  height: 11px;
  background-position: -22px -620px;
  margin-right: 5px;
}
.apprContents .apprListView .listWrap .apprListFilter .btnFilter .txt {
  font-size: var(--fs13);
  margin-right: 5px;
}
.apprContents .apprListView .listWrap .apprListFilter .btnFilter .txt.hasCondition::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 4px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: var(--colorOrange);
}
.apprContents .apprListView .listWrap .apprListFilter .btnFilter .iconArrow {
  width: 8px;
  height: 5px;
  background-position: 0 -394px;
  margin-left: auto;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption {
  position: absolute;
  top: 30px;
  left: 0px;
  max-width: 210px;
  border: 1px solid #d6d6d6;
  background-color: var(--MainBgColor);
  z-index: 1;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .optionWrap {
  min-width: 100px;
  background-color: var(--ControlBgColor);
  font-size: var(--fs14);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .optionWrap + .optionWrap {
  border-top: 1px solid #d6d6d6;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .filterTitle {
  position: relative;
  display: flex;
  align-items: center;
  height: 34px;
  padding: 0 15px;
  font-size: var(--fs13);
  font-weight: bold;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .statusWrap {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  min-width: 220px;
  padding: 0 15px 10px;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .statusWrap > input[type=checkbox] {
  display: none;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .statusWrap > input[type=checkbox]:checked + label > i {
  border-color: var(--MainColor);
  background-color: var(--MainColor);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .statusWrap > input[type=checkbox]:checked + label > i:before {
  content: "";
  width: 4px;
  height: 8px;
  margin-bottom: 3px;
  border-right: 2px solid var(--InvertFontColor);
  border-bottom: 2px solid var(--InvertFontColor);
  transform: rotate(45deg);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .statusWrap > label {
  display: flex;
  align-items: center;
  width: 50%;
  padding: 5px 5px 0 0;
  font-size: var(--fs12);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .statusWrap > label > i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-right: 4px;
  border: 1px solid var(--BorderGrey);
  border-radius: 2px;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .alignWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-bottom: 5px;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .alignWrap > input[type=radio] {
  display: none;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .alignWrap > input[type=radio]:checked + label {
  color: var(--MainColor);
  font-weight: bold;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .alignWrap > label {
  display: flex;
  align-items: center;
  height: 28px;
  padding: 0 15px;
  font-size: var(--fs12);
  white-space: nowrap;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .alignWrap > label:hover {
  background-color: #EDEFF5;
  cursor: pointer;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 0 15px 10px;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .periodSelect {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 26px;
  margin-bottom: 5px;
  padding: 0 5px;
  border: 1px solid #d6d6d6;
  background-color: var(--ControlBgColor);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .periodSelect .selectedTxt {
  font-size: var(--fs13);
  margin-right: 10px;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .periodSelect .iconArrow {
  flex-shrink: 0;
  width: 8px;
  height: 5px;
  background-position: 0 -394px;
  margin-left: auto;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .periodSelectOption {
  position: absolute;
  top: 25px;
  left: 15px;
  width: calc(100% - 30px);
  background-color: var(--ControlBgColor);
  font-size: var(--fs13);
  border: 1px solid #d6d6d6;
  z-index: 1;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .periodSelectOption .selectList li > a {
  display: flex;
  align-items: center;
  height: 30px;
  padding: 0 10px;
  font-size: var(--fs13);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .periodSelectOption .selectList li > a:hover {
  background-color: #EDEFF5;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .periodSelectOption .selectList li > a.selected {
  font-weight: bold;
  color: var(--MainColor);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .inputPeriod {
  display: flex;
  align-items: center;
  height: 26px;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .inputPeriod > .layoutControl {
  position: relative;
  flex-direction: column;
  align-items: flex-start;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .inputPeriod label {
  display: block;
  margin-bottom: 5px;
  font-size: var(--fs13);
  text-align: left;
  color: var(--FontColorGrey);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .inputPeriod input {
  width: 100%;
  height: 26px;
  border: 1px solid #d6d6d6;
  margin-left: 0;
  transition: border-color 0.3s;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .inputPeriod input:focus {
  border-color: var(--MainColor);
  box-shadow: none;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .inputPeriod > .txt {
  margin: 0 4px;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .layoutControl {
  width: auto !important;
  height: auto !important;
  position: relative;
  display: inline-flex;
  padding: 0;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .layoutControl label {
  display: none;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .periodWrap .layoutControl input {
  width: 80px !important;
  height: 26px !important;
  border-radius: 0;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .selectList {
  max-height: 140px;
  overflow-y: auto;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .selectList li > a {
  display: flex;
  align-items: center;
  height: 28px;
  padding: 0 15px;
  font-size: var(--fs13);
  white-space: nowrap;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .selectList li > a:hover {
  background-color: #EDEFF5;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .selectList li > a.selected {
  font-weight: bold;
  color: var(--MainColor);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  padding: 0 5px 10px;
  background-color: var(--ControlBgColor);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea > button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  padding: 0 10px;
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor-rgb), 0.7);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea > button.btnDateOk {
  display: none;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea > button.btnFilterReset > .iconReset {
  width: 13px;
  height: 14px;
  margin-right: 5px;
  background-position: 0 -45px;
  opacity: 0.5;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea > button.btnFilterReset:hover {
  color: var(--MainFontColor);
  cursor: pointer;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea > button.btnFilterReset:hover > .iconReset {
  opacity: 1;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea.showBtnDate {
  justify-content: space-between;
  padding: 0 5px 10px 15px;
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea.showBtnDate .btnDateOk {
  display: flex;
  border: 1px solid var(--MainColor);
  color: var(--MainColor);
  font-size: var(--fs13);
}
.apprContents .apprListView .listWrap .apprListFilter .selectOption .btnArea.showBtnDate .btnDateOk:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.apprContents .apprListView .listWrap > .apprListFilter .selectOption {
  left: 15px;
  top: 32px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap {
  position: relative;
  display: flex;
  flex-direction: column;
  height: calc(100% - 50px);
  padding: 10px 15px 10px 15px;
  overflow-y: auto;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec {
  height: 100%;
  padding-bottom: 20px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .listTitleWrap {
  display: flex;
  align-items: center;
  font-size: var(--fs15);
  margin-bottom: 15px;
  color: var(--MainFontColor);
  font-weight: bold;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .listTitleWrap .count {
  margin-left: 10px;
  color: var(--MainColor);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp {
  min-height: 300px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listTitle {
  display: flex;
  align-items: center;
  width: 100%;
  height: 24px;
  margin-bottom: 10px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listTitle .title {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem {
  display: inline-block;
  width: 100%;
  margin-bottom: 10px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li {
  display: flex;
  width: 100%;
  margin-bottom: 10px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 80px;
  padding: 0 10px;
  background-color: var(--MainBgColor);
  box-shadow: 0 1px 3px #dfdfdf;
  overflow: hidden;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a.selected {
  border: 1px solid var(--MainColor);
  background-color: var(--apprListItemSelectedBgColor);
  color: var(--MainFontColor);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .apprStatus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 53px;
  height: 53px;
  border-radius: 50%;
  font-size: var(--fs11);
  margin-right: 10px;
  text-align: center;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap .urgent {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 20px;
  font-size: var(--fs13);
  margin-right: 3px;
  border-radius: 5px;
  font-weight: normal;
  padding: 0 5px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap .docTitle {
  display: block;
  margin-bottom: 5px;
  font-size: var(--fs16);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .tiny {
  display: flex;
  align-items: center;
  width: 100%;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .tiny .docType {
  display: block;
  height: 19px;
  margin-right: 5px;
  padding: 0px 5px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  line-height: 19px;
  border-radius: 5px;
  background-color: var(--BgColorGrey);
  max-width: 50%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .tiny .docID {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  max-width: 50%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .drafter {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-direction: column;
  height: 65px;
  margin-left: auto;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  overflow: hidden;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .drafter .name {
  color: var(--MainFontColor);
  margin-bottom: 3px;
  font-size: var(--fs14);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  width: 100%;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .drafter .dept {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
  text-align: right;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .drafter .docDate {
  width: 100%;
  min-width: 170px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .listItem li .checkArea + a {
  width: calc(100% - 30px);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .btnMoreRequest {
  width: 100%;
  height: 40px;
  border: 1px solid var(--BorderGreyLight);
  background-color: var(--BgColorGrey);
  color: var(--MainFontColor);
  cursor: pointer;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprListTemp .btnMoreRequest .count {
  font-weight: bold;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap {
  display: inline-flex;
  justify-content: center;
  width: 100%;
  margin: 20px 0 40px 0;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination {
  display: inline-flex;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li {
  border: 1px solid var(--BorderGreyLight);
  border-right: 0;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li:last-child {
  border-right: 1px solid var(--BorderGreyLight);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 25px;
  height: 25px;
  font-size: var(--fs13);
  background-color: var(--MainBgColor);
  color: var(--MainFontColor);
  font-weight: bold;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a:hover {
  background-color: var(--apprPaginationBtnColorHover);
  cursor: pointer;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.on {
  color: var(--MainColor);
  background-color: var(--BgColorGrey);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn {
  cursor: default;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn > i {
  width: 4px;
  height: 8px;
  opacity: 0.3;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn.prev > i {
  width: 4px;
  background-position: 0 -375px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn.next > i {
  width: 4px;
  background-position: 0 -375px;
  transform: rotate(180deg);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn.first > i {
  width: 9px;
  background-position: -16px -375px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn.last > i {
  width: 9px;
  background-position: -16px -375px;
  transform: rotate(180deg);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn:hover {
  background-color: #fff;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn.on {
  background-color: var(--MainBgColor);
  color: var(--MainFontColor);
  cursor: pointer;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn.on > i {
  opacity: 1;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .apprPaginationWrap .apprPagination li a.btn.on:hover {
  background-color: var(--apprPaginationBtnColorHover);
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .noData {
  width: 100%;
  min-width: auto;
  min-height: 300px;
  background-color: transparent;
}
.apprContents .apprListView .listWrap .apprListScrollWrap .apprListSec .noData .text {
  padding-bottom: 70px;
}
.apprContents .apprListView .listWrap .apprListScrollWrap.newRequest .apprListSec {
  height: auto;
}
.apprContents .apprListView .listWrap.Min .apprSearchHeader .apprSearch {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 0;
  transition: width 0.3s;
  border: 1px solid transparent;
}
.apprContents .apprListView .listWrap.Min .apprSearchHeader .apprSearch input {
  width: 0%;
  background-color: transparent;
}
.apprContents .apprListView .listWrap.Min .apprSearchHeader .apprSearch:hover {
  width: calc(100% - 53px);
  min-width: 230px;
  max-width: 230px;
  border: 1px solid var(--apprHomeWrapBorderColor);
}
.apprContents .apprListView .listWrap.Min .apprSearchHeader .apprSearch:hover input {
  width: 100%;
  background-color: var(--MainBgColor);
}
.apprContents .apprListView .listWrap.Min .checkAll .checkArea input[type=checkbox] + label span {
  display: none;
}
.apprContents .apprListView .listWrap.Min .checkAll .apprBatchArea {
  margin-left: 5px;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .apprStatus {
  display: none;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap {
  position: absolute;
  top: 16px;
  left: 10px;
  width: calc(100% - 20px);
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap .urgent + .docTitle {
  width: calc(100% - 130px);
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap .docTitle {
  width: 100%;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap .tiny {
  max-width: 50%;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap .tiny .docID {
  display: none;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .titleWrap .tiny .docType {
  max-width: 100%;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .drafter {
  position: absolute;
  top: 44px;
  right: 10px;
  display: flex;
  justify-content: flex-end;
  width: 40%;
  height: 20px;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .drafter .dept {
  display: none;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .drafter .name {
  width: 100%;
  padding-bottom: 8px;
  text-align: right;
}
.apprContents .apprListView .listWrap.Min .apprListScrollWrap .apprListSec .apprListTemp .listItem li > a .drafter .docDate {
  display: none;
}
.apprContents .apprListView .checkArea {
  position: relative;
  display: flex;
  align-items: center;
  width: 30px;
}
.apprContents .apprListView .checkArea input[type=checkbox] {
  position: absolute;
  top: 50%;
  left: 9px;
  width: 1px;
  height: 1px;
}
.apprContents .apprListView .checkArea input[type=checkbox] + label {
  position: relative;
  cursor: pointer;
}
.apprContents .apprListView .checkArea input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
}
.apprContents .apprListView .checkArea input[type=checkbox]:checked + label::before {
  border-color: var(--MainColor);
  background-color: var(--MainColor);
}
.apprContents .apprListView .checkArea input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 6px;
  width: 5px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}
.apprContents .apprListView .checkArea input[type=checkbox]:focus + label {
  border-color: var(--BorderGreyDark1);
}
.apprContents .apprListView .checkArea input[type=checkbox]:disabled + label {
  cursor: default;
}
.apprContents .apprListView .checkArea input[type=checkbox]:disabled + label::before {
  background-color: #eaeaea;
}
.apprContents .apprListView.searchResult .listWrap header {
  position: absolute;
  top: 19px;
  left: 0;
  height: 30px;
}
.apprContents .apprListView.searchResult .listWrap header h3 {
  display: none;
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader {
  display: flex;
  max-width: var(--apprSearchResultMaxWidth);
  padding: 15px 15px 15px 40px;
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .apprSearch {
  position: relative;
  top: 0;
  right: 0;
  width: 100%;
  height: 40px;
  box-shadow: 0 1px 7px 0px rgba(199, 204, 208, 0.4);
  overflow: hidden;
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .apprSearch input {
  width: 100%;
  font-size: var(--fs16);
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .apprSearch .btnApprSearch {
  width: 40px;
  height: 40px;
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .apprSearch:hover {
  max-width: 100%;
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .btnAdvanced {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 70px;
  height: 40px;
  padding: 0 10px;
  background-color: var(--MainBgColor);
  border: 1px solid #D6D6D6;
  margin-left: 10px;
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .btnAdvanced .txt {
  font-size: var(--fs14);
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .btnAdvanced .iconArrow {
  width: 8px;
  height: 5px;
  background-position: 0 -394px;
  margin-left: 10px;
  transform: rotate(180deg);
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .btnAdvanced:hover {
  background-color: #EDEFF5;
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .btnAdvanced.on {
  background-color: #EDEFF5;
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader .btnAdvanced.on .iconArrow {
  transform: rotate(0deg);
}
.apprContents .apprListView.searchResult .listWrap .apprSearchHeader.Min {
  width: 100%;
  min-width: auto;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch {
  display: flex;
  flex-shrink: 0;
  width: var(--apprSearchResultMaxWidth);
  max-width: var(--apprSearchResultMaxWidth);
  padding: 0px 15px;
  margin: 0 0 15px 0;
  color: var(--MainFontColor);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap {
  display: flex;
  flex-wrap: wrap;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-size: var(--fs14);
  margin-bottom: 5px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item label {
  display: inline-flex;
  align-items: center;
  width: 80px;
  margin-right: 5px;
  font-size: var(--fs13);
  font-weight: bold;
  word-break: break-all;
  line-height: 11px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item input {
  height: 26px;
  padding: 0 3px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  font-size: var(--fs13);
  transition: border-color 0.3s;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item input:focus {
  border-color: var(--MainColor);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item:nth-child(2), .apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item:nth-child(4) {
  margin: 0 0 5px 0;
  margin-left: auto;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item:nth-child(2) input, .apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item:nth-child(4) input {
  width: 140px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item:nth-child(3) input {
  width: 266px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item:nth-child(5) input, .apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item:nth-child(6) input {
  width: 505px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap {
  position: relative;
  display: flex;
  width: 257px;
  margin: 0;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelect {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  width: 80px;
  height: 26px;
  padding: 0 5px;
  border: 1px solid #d6d6d6;
  background-color: var(--ControlBgColor);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelect .selectedTxt {
  font-size: var(--fs13);
  margin-right: 10px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelect .iconArrow {
  flex-shrink: 0;
  width: 8px;
  height: 5px;
  background-position: 0 -394px;
  margin-left: auto;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelectOption {
  position: absolute;
  top: 25px;
  left: 0;
  width: 80px;
  background-color: var(--ControlBgColor);
  font-size: var(--fs13);
  border: 1px solid #d6d6d6;
  z-index: 1;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelectOption .selectList {
  border-bottom: 1px solid #d6d6d6;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelectOption .selectList li > a {
  display: flex;
  align-items: center;
  height: 30px;
  padding: 0 10px;
  font-size: var(--fs13);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelectOption .selectList li > a:hover {
  background-color: #EDEFF5;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .periodSelectOption .selectList li > a.selected {
  font-weight: bold;
  color: var(--MainColor);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .inputPeriod {
  display: flex;
  align-items: center;
  padding: 0 0 0 10px;
  height: 26px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .inputPeriod > .layoutControl {
  position: relative;
  flex-direction: column;
  align-items: flex-start;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .inputPeriod label {
  display: block;
  margin-bottom: 5px;
  font-size: var(--fs13);
  text-align: left;
  color: var(--FontColorGrey);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .inputPeriod input {
  width: 100%;
  height: 26px;
  border: 1px solid #d6d6d6;
  margin-left: 0;
  transition: border-color 0.3s;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .inputPeriod input:focus {
  border-color: var(--MainColor);
  box-shadow: none;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .inputPeriod > .txt {
  margin: 0 4px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .layoutControl {
  width: auto !important;
  height: auto !important;
  position: relative;
  display: inline-flex;
  padding: 0;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .layoutControl label {
  display: none;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .item .periodWrap .layoutControl input {
  width: 80px !important;
  height: 26px !important;
  border-radius: 0;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap {
  display: flex;
  align-items: center;
  width: 100%;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .checkItem {
  position: relative;
  display: flex;
  align-items: center;
  font-size: var(--fs13);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .checkItem input[type=checkbox] {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 1px;
  height: 1px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .checkItem input[type=checkbox] + label {
  position: relative;
  cursor: pointer;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .checkItem input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  margin: 0 5px 0 0;
  vertical-align: middle;
  background-color: var(--ControlBgColor);
  border: 1px solid var(--ControlBorderColor);
  cursor: pointer;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .checkItem input[type=checkbox]:checked + label::before {
  background-color: var(--ControlBgColorSelected);
  border-color: var(--ControlBgColorSelected);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .checkItem input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 4px;
  height: 6px;
  border-right: 2px solid var(--ControlFontColorSelected);
  border-bottom: 2px solid var(--ControlFontColorSelected);
  transform: rotate(45deg);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .btnResetCondition {
  display: flex;
  align-items: center;
  height: 26px;
  margin-left: auto;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  cursor: pointer;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .btnResetCondition .iconReset {
  width: 13px;
  height: 14px;
  margin-right: 5px;
  background-position: 0 -45px;
  opacity: 0.5;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .btnResetCondition:hover {
  color: var(--MainFontColor);
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .itemWrap .setWrap .btnResetCondition:hover > i {
  opacity: 1;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .btnSearchAdvanced {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 70px;
  height: 88px;
  padding: 0 10px;
  margin-left: 10px;
  color: var(--MainColor);
  border: 1px solid var(--MainColor);
  background-color: var(--apprListItemSelectedBgColor);
  font-size: var(--fs14);
  cursor: pointer;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch .btnSearchAdvanced > i {
  display: inline-block;
  width: 14px;
  height: 13px;
  background-position: 0 0;
  margin-left: 8px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch.Min {
  flex-direction: column;
  width: 100%;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch.Min .itemWrap .item {
  width: 100%;
  margin-left: 0;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch.Min .itemWrap .item label {
  width: 60px;
  flex-shrink: 0;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch.Min .itemWrap .item input {
  width: 100%;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch.Min .itemWrap .item .periodWrap {
  width: 100%;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch.Min .itemWrap .item .periodWrap .inputPeriod {
  width: 100%;
  display: flex;
  flex-shrink: 0;
  padding: 0 0 0 5px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch.Min .itemWrap .item .periodWrap .inputPeriod .txt {
  margin: 0 3px;
}
.apprContents .apprListView.searchResult .listWrap .advancedSearch.Min .btnSearchAdvanced {
  width: 100%;
  height: 33px;
  margin: 5px 0 0 0;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  min-width: var(--apprSearchResultMinWidth);
  min-height: 40px;
  padding: 5px 15px;
  background-color: #EAEDEF;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .resultInfo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-right: 10px;
  font-size: var(--fs13);
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .resultInfo .mainKey {
  display: inline-block;
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: bold;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .resultInfo .count {
  color: var(--MainColor);
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 1px 0 5px;
  background-color: rgba(var(--MainBgColor-rgb), 0.7);
  border: 1px solid rgba(230, 230, 230, 0.7);
  border-radius: 5px;
  margin-bottom: 2px;
  margin-right: 2px;
  cursor: default;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword .txt {
  max-width: 111px;
  padding-right: 1px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--fs13);
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword .btnDelete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  margin-left: 2px;
  cursor: pointer;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword .btnDelete > i {
  width: 7px;
  height: 7px;
  background-position: 0 -68px;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword .btnDelete:hover {
  background-color: #eee;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword:hover {
  background-color: rgba(var(--MainBgColor-rgb), 1);
  border: 1px solid #e6e6e6;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword.default {
  padding: 0 5px;
}
.apprContents .apprListView.searchResult .listWrap .searchDetail .detailKeyWrap .keyword.default .btnDelete {
  display: none;
}
.apprContents .apprListView.searchResult .listWrap .apprListTabWrap .apprListTab, .apprContents .apprListView.searchResult .listWrap .apprListTabWrap .apprListFilter {
  margin-top: 20px;
}
.apprContents .apprListView.searchResult .listWrap.Min .apprSearchHeader .apprSearch {
  width: 100%;
  min-width: unset;
  height: 40px;
  background-color: transparent;
  border: 1px solid #d6d6d6;
}
.apprContents .apprListView.searchResult .listWrap.Min .apprSearchHeader .apprSearch input {
  background-color: #fff;
}
.apprContents .apprListView.searchResult .listWrap.Min .apprSearchHeader:hover {
  max-width: 600px;
}
.apprContents .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex-shrink: 1;
  flex-grow: 1;
  width: var(--apprDocViewAreaWidth);
  min-width: 460px;
  height: 100%;
  background-color: var(--MainBgColor);
  color: var(--MainFontColor);
}
.apprContents .noData .iconNoApprData {
  width: 32px;
  height: 31px;
  background-position: 0 -129px;
  margin-bottom: 20px;
  opacity: 0.5;
}
.apprContents .noData .text {
  font-size: var(--fs15);
  opacity: 0.5;
}
.apprContents.noSelectedDoc .apprDocViewArea {
  display: none;
}
.apprContents.noSelectedDoc .apprListView {
  width: 100%;
  max-width: 100%;
}
.apprContents.noSelectedDoc > .noData {
  display: none !important;
}
.apprContents.tempDocList .apprListView {
  width: 100%;
  max-width: 100%;
  min-width: 100%;
}
.apprContents.tempDocList .apprListView .listWrap.Min .apprListTemp .listItem li > a .apprStatus {
  display: inline-flex;
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem {
  display: flex;
  flex-wrap: wrap;
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem li {
  width: auto;
  margin-right: 20px;
  margin-bottom: 20px;
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem li > a {
  position: relative;
  flex-direction: column;
  align-items: flex-start;
  width: 300px;
  height: 170px;
  padding: 10px;
  border: 1px solid #ddd;
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .apprStatus {
  width: 62px;
  height: 62px;
  margin-bottom: 12px;
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .apprStatus > i {
  width: 33px;
  height: 32px;
  background-position: -41px -128px;
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .docTitle {
  left: 10px;
  top: 110px;
  width: calc(100% - 15px);
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .docType {
  position: absolute;
  left: 10px;
  top: 86px;
  max-width: calc(100% - 15px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .docDate, .apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .docID, .apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .drafter, .apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .docType::after {
  display: none;
}
.apprContents.tempDocList .apprListView .apprListTemp .listItem li > a .lastUpdated {
  position: absolute;
  top: 140px;
  left: 10px;
  font-size: var(--fs13);
}
.apprContents.tempDocList .apprDocView {
  display: none;
}
.apprContents.docFull {
  position: fixed;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100%;
  z-index: 2;
}

.apprDocViewArea {
  position: relative;
  width: var(--apprDocViewAreaWidth);
  overflow: auto;
}
.apprDocViewArea > iframe {
  width: 100%;
  min-width: 500px;
}
.apprDocViewArea.docFull {
  position: fixed;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100%;
  z-index: 1;
}

.contentsArea.apprDocViewFrame {
  height: 100% !important;
  padding: 0;
}
.contentsArea.apprDocViewFrame > form {
  padding: 0 !important;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper {
  display: flex;
  width: 100%;
  height: 100%;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView {
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 300px;
  background-color: var(--MainBgColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .noData .iconErrorData {
  width: 31px;
  height: 27px;
  margin-bottom: 15px;
  background-position: 0 -566px;
  opacity: 0.5;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .noData .text {
  font-size: var(--fs15);
  opacity: 0.5;
  text-align: center;
  line-height: 20px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 300px;
  background-color: var(--MainBgColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .noData .iconNoApprData {
  width: 32px;
  height: 31px;
  margin-bottom: 20px;
  background-position: 0 -129px;
  opacity: 0.5;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .noData .text {
  font-size: var(--fs15);
  opacity: 0.5;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader {
  flex-shrink: 0;
  position: relative;
  padding: 10px 15px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocScrollWrap {
  display: flex;
  flex-direction: column;
  padding: 0 15px 35px 15px;
  overflow: auto;
  height: 100%;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader {
  position: relative;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docInfo {
  margin-bottom: 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docInfo .docType {
  display: inline-flex;
  align-items: center;
  height: 19px;
  line-height: 19px;
  padding: 0 5px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  border-radius: 5px;
  background-color: var(--BgColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docTitle {
  display: flex;
  width: 100%;
  margin-bottom: 15px;
  padding-right: 120px;
  font-size: var(--fs17);
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docTitle .urgent {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 34px;
  height: 18px;
  font-size: var(--fs13);
  margin-top: 3px;
  margin-right: 5px;
  border-radius: 5px;
  padding: 0 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docID {
  display: block;
  position: absolute;
  top: 12px;
  right: 20px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader > .btnShareArea {
  position: absolute;
  top: 34px;
  right: 20px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader > .btnShareArea > .btnShare {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 4px 10px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader > .btnShareArea > .btnShare > i {
  display: block;
  width: 10px;
  height: 12px;
  margin-right: 5px;
  background-position: 0 -641px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader > .btnShareArea > .btnShare:hover {
  background-color: rgba(var(--InvertBgColor-rgb), 0.05);
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader > .btnShareArea > .btnShare.Active {
  border: 1px solid var(--BorderGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader > .btnShareArea > .btnShare.history > i {
  width: 20px;
  height: 14px;
  background-position: -61px -639px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .draftInfo {
  display: none;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docBtnWrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docBtnWrap .txtNoPowerCoo {
  margin-right: auto;
  font-size: var(--fs13);
  color: #bbb;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docBtnWrap .actionBtnWrap {
  display: inline-flex;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docBtnWrap button {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  height: 28px;
  padding: 0 10px;
  margin-left: 5px;
  border: 1px solid var(--BorderGrey);
  font-size: var(--fs13);
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .docBtnWrap button > i {
  margin-right: 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .defaultBtnWrap {
  display: flex;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .defaultBtnWrap .btnDefault {
  border-color: var(--BorderGrey);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .defaultBtnWrap .btnDefault:hover {
  border-color: var(--BorderGreyDark1);
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .actionBtnWrap .btnActionReject {
  border-color: var(--apprStatusColorRed);
  color: var(--apprStatusColorRed);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .actionBtnWrap .btnActionReject:hover {
  background-color: rgba(var(--apprStatusColorRed-rgb), 0.1);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .actionBtnWrap .btnActionHold {
  border-color: var(--apprStatusColorYellow);
  color: var(--apprStatusColorYellow);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .actionBtnWrap .btnActionHold:hover {
  background-color: rgba(var(--apprStatusColorYellow-rgb), 0.1);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .actionBtnWrap .btnActionApproval {
  border-color: var(--apprStatusColorBlue);
  color: var(--apprStatusColorBlue);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .actionBtnWrap .btnActionApproval:hover {
  background-color: rgba(var(--apprStatusColorBlue-rgb), 0.1);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .actionBtnWrap .btnActionDelete {
  border-color: var(--BorderGreyDark1);
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .actionBtnWrap .btnActionDelete:hover {
  background-color: rgba(var(--MainFontColor-rbg), 0.1);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineWrap {
  margin-bottom: 5px;
}
.devHideApprLine {
  display: none !important;
}

.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList {
  display: flex;
  flex-wrap: wrap;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li {
  display: inline-flex;
  flex-shrink: 0;
  margin-bottom: 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li:last-child .apprLineItem::before, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li:last-child .apprLineItem::after {
  display: none;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.groupCoo .apprLineItem .apprStatus .iconCoop {
  display: flex;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.powerCoo .apprLineItem .apprStatus .iconCoop {
  display: flex;
  background-color: var(--apprStatusColorBlue);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.groupCoo .apprLineItem::after, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.powerCoo .apprLineItem::after {
  width: 9px;
  height: 5px;
  background-position: -17px -291px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.groupCoo.lastCoo .apprLineItem::after, .contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li.powerCoo.lastCoo .apprLineItem::after {
  width: 6px;
  height: 12px;
  background-position: 0 -291px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem {
  position: relative;
  display: flex;
  padding-right: 25px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .apprStatus {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  max-width: 65px;
  min-height: 30px;
  border-radius: 15px;
  margin-right: 5px;
  font-size: var(--fs13);
  text-align: center;
  padding: 0 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .apprStatus .iconApprStatusCurrent {
  flex-shrink: 0;
  width: 14px;
  height: 13px;
  background-position: 0 -269px;
}
.iconCoop {
  position: absolute;
  right: -2px;
  bottom: -1px;
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
  width: 16px;
  height: 9px;
  border-radius: 20px;
  background-color: #ccc;
  z-index: 1;
}
.iconCoop > i {
  width: 11px;
  height: 5px;
  background-position: -36px -293px;
}

.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .apprStatus.statusYellow + .empInfo .date {
  color: #FF9E00;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo {
  display: flex;
  justify-content: center;
  flex-direction: column;
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo .date {
  font-size: var(--fs11);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo .name {
  font-size: var(--fs14);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo .adminInfo {
  display: inline-flex;
  align-items: center;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo .adminInfo .iconAdmin {
  width: 9px;
  height: 11px;
  background-position: -34px -337px;
  margin-right: 3px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo .adminInfo .txt {
  font-size: var(--fs11);
  color: #FDAB34;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo.current .date {
  color: var(--apprStatusColorBlue);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem .empInfo.current .name {
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprDocHeader .apprLineList li .apprLineItem::after {
  content: "";
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 10px;
  right: 9px;
  width: 6px;
  height: 12px;
  background-position: 0 -291px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .docViewerArea {
  width: 100%;
  height: 100%;
  min-height: 500px;
  border: 1px solid var(--BorderGreyLight);
  margin-bottom: 20px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .docViewerArea .docViewer {
  position: relative;
  width: 100%;
  height: 100%;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .docViewerArea .docViewer.Full {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .docViewerArea .docViewer .btnDocFull {
  position: absolute;
  top: 40px;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: var(--MainBgColor);
  border-radius: 50%;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.16);
  border: 1px solid var(--BorderGrey);
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .docViewerArea .docViewer .btnDocFull:hover {
  background-color: var(--BgColorGrey1);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .docViewerArea .docViewer .btnDocFull > i {
  display: inline-block;
  width: 14px;
  height: 14px;
  background-position: 0 -471px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .docViewerArea .docViewer .btnDocFull.Exit > i {
  width: 15px;
  height: 15px;
  background-position: -24px -471px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap {
  margin-bottom: 20px;
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine {
  display: flex;
  border: 1px solid var(--BorderGreyLight);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine:last-child {
  margin-top: -1px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dt {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background-color: var(--apprPaginationBtnColorHover);
  min-width: 36px;
  padding: 0 5px;
  font-size: var(--fs14);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd {
  display: flex;
  padding: 5px 5px 0 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd .rcvItem {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd .rcvItem li {
  display: inline-flex;
  justify-content: center;
  flex-direction: column;
  padding: 5px;
  height: 41px;
  border-radius: 3px;
  background-color: var(--apprPaginationBtnColorHover);
  margin: 0 5px 5px 0;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd .rcvItem li .date {
  color: var(--FontColorGrey);
  font-size: var(--fs11);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd .rcvItem li .name {
  font-size: var(--fs14);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd .rcvItem li.btnMore {
  background-color: transparent;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd .rcvItem li.btnMore .name {
  color: var(--MainFontColorLighter);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd .rcvItem li.btnMore:hover {
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .apprRcvLineWrap .apprRcvLine dd .rcvItem li.btnMore:hover .name {
  text-decoration: underline;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload {
  margin-bottom: 20px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 {
  display: flex;
  align-items: center;
  font-size: var(--fs14);
  margin-bottom: 10px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 > .count {
  font-weight: normal;
  color: var(--MainColor);
  margin-left: 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 .btnAddFile {
  display: flex;
  align-items: center;
  margin-left: 10px;
  font-size: var(--fs11);
  padding: 4px 6px;
  color: var(--FontColorGrey);
  border: 1px solid var(--BorderGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 .btnAddFile > i {
  width: 6px;
  height: 6px;
  background-position: -53px -220px;
  margin-right: 3px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 .btnAddFile:hover {
  border-color: var(--BorderGreyDark1);
  color: var(--MainFontColor);
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 .btn-preview {
  display: flex;
  align-items: center;
  font-size: var(--fs11);
  padding: 4px 6px;
  margin-left: auto;
  background-color: #eee;
  border-radius: 3px;
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 .btn-preview > i {
  width: 18px;
  height: 18px;
  background-position: -192px -74px;
  margin-right: 2px;
  transform: scale(0.7);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload h4 .btn-preview:hover {
  background-color: #e1e1e1;
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload {
  position: relative;
  max-height: 110px;
  height: auto;
  border: 1px solid var(--BorderGreyLight);
  border-radius: 0;
  overflow: auto;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList {
  height: unset !important;
  margin: 0;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .txtSize > span {
  display: inline-block;
  margin-right: 5px;
  font-size: var(--fs11);
  color: var(--FontColorGrey);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .added {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 18px;
  padding: 0 5px;
  margin-left: 5px;
  background-color: #F0F0F0;
  border-radius: 3px;
  font-size: var(--fs11);
  color: #aaa;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .txtDate {
  display: none;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .preview {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 23px;
  border-radius: 3px;
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .preview > i {
  flex-shrink: 0;
  width: 18px;
  height: 12px;
  background-position: 0px -220px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .preview:hover {
  background-color: #eeeeee;
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .btnDelete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .btnDelete > i {
  flex-shrink: 0;
  width: 16px;
  height: 14px;
  background-position: -27px -220px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li .right .btnDelete:hover {
  background-color: #eeeeee;
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .uploadFileList > li:last-child {
  border: 0;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .fileUpload .upload .btnAddFile {
  display: none;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs {
  width: 100%;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs header h4 {
  display: flex;
  align-items: center;
  font-size: var(--fs14);
  margin-bottom: 10px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs header h4 > .count {
  margin-left: 5px;
  color: var(--MainColor);
  font-weight: 400;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs header h4 .btnAddFile {
  display: flex;
  align-items: center;
  margin-left: 10px;
  font-size: var(--fs11);
  padding: 4px 6px;
  color: var(--FontColorGrey);
  border: 1px solid var(--BorderGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs header h4 .btnAddFile > i {
  width: 6px;
  height: 6px;
  background-position: -53px -220px;
  margin-right: 3px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs header h4 .btnAddFile:hover {
  border-color: var(--BorderGreyDark1);
  color: var(--MainFontColor);
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList {
  margin-bottom: 20px;
  max-height: 123px;
  overflow-y: auto;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li {
  margin-top: -1px;
  border: 1px solid var(--BorderGreyLight);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li:first-child {
  margin-top: 0;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 60px;
  padding: 0 10px 0 0;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .linkedDocNo {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 100%;
  font-size: var(--fs13);
  background-color: #f4f4f4;
  margin-right: 10px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .apprStatus {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 45px;
  height: 45px;
  margin-right: 10px;
  border-radius: 50%;
  font-size: var(--fs11);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .left {
  width: 100%;
  overflow: hidden;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .left .docTitle {
  max-width: calc(100% - 70px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--fs14);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .left .docType {
  background-color: var(--BgColorGrey);
  padding: 2px 3px;
  border-radius: 3px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .left .docID {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .left .added {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 0 8px;
  margin-left: 8px;
  font-size: 11px;
  color: #aaa;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .left .added:before {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 8px;
  background-color: #ddd;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .right {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 200px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .right > .title {
  margin-bottom: 4px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .right > .value {
  font-size: var(--fs14);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .drafter {
  position: absolute;
  top: 12px;
  right: 10px;
  display: flex;
  flex-shrink: 0;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  font-size: var(--fs13);
  margin-left: auto;
  text-align: right;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .drafter .dept {
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .drafter .name {
  margin-bottom: 4px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a .docDate {
  position: absolute;
  right: 10px;
  bottom: 10px;
  margin-left: 10px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .linkedDocs .linkedDocList > li > a:hover {
  background-color: #f9f9f9;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea {
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea h4 {
  display: inline-flex;
  font-size: var(--fs14);
  margin-bottom: 10px;
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .txtInfo {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBoxWrap {
  width: 100%;
  background-color: var(--BgColorGrey1);
  border: 1px solid var(--BorderGreyLight);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .noComment {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 40px;
  font-size: var(--fs14);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox {
  width: 100%;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .btnCommentSend {
  width: 50px;
  height: 64px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--MainColor);
  color: var(--MainColor);
  margin-left: 10px;
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .btnCommentSend:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentWrite {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentWrite textarea {
  width: 100%;
  height: 64px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--BorderGreyLight);
  padding: 5px 10px;
  color: var(--MainFontColor);
  resize: none;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap {
  padding: 13px 15px 10px 15px;
  border-bottom: 1px solid var(--BorderGreyLight);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap:last-child {
  border-bottom: 0;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap.typeHold {
  background-color: #fff6ea;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap.typeHold .userInfo .name .actionName {
  color: var(--apprStatusColorYellow);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap.typeReject {
  background-color: #ffede9;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap.typeReject .userInfo .name .actionName {
  color: var(--apprStatusColorRed);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo {
  display: flex;
  margin-bottom: 10px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .name {
  display: flex;
  align-items: center;
  font-size: var(--fs14);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .name .actionName {
  font-weight: normal;
  font-size: var(--fs13);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .name .txtAddedComment {
  font-size: var(--fs13);
  font-weight: normal;
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .name .adminInfo {
  display: inline-flex;
  align-items: center;
  margin-left: 5px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .name .adminInfo .iconAdmin {
  width: 9px;
  height: 11px;
  background-position: -34px -337px;
  margin-right: 3px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .name .adminInfo .txt {
  font-size: var(--fs11);
  color: #FDAB34;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .name .drafter {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  margin-left: 6px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .userInfo .date {
  margin-left: auto;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView {
  display: flex;
  align-items: center;
  min-height: 28px;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView .comment {
  font-size: var(--fs14);
  line-height: 18px;
  word-break: break-all;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView input {
  width: 100%;
  height: 32px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--BorderGreyLight);
  padding: 0 10px;
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView .btnWrap {
  display: flex;
  flex-shrink: 0;
  height: 26px;
  margin-left: auto;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView .btnWrap button {
  padding: 5px 8px;
  margin-left: 5px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--BorderGrey);
  font-size: var(--fs13);
  color: var(--MainFontColor);
  cursor: pointer;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView .btnWrap button:hover {
  border-color: var(--BorderGreyDark1);
  color: var(--MainFontColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView .view {
  display: flex;
  align-items: center;
  width: 100%;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView .edit {
  display: none;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView .edit .btnWrap button.btnCommentSend {
  border-color: var(--MainColor);
  color: var(--MainColor);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView .edit .btnWrap button.btnCommentSend:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView.editMode .view {
  display: none;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentView.editMode .edit {
  display: flex;
  align-items: center;
  width: 100%;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea .commentBox .commentViewWrap .commentWrite {
  padding: 0;
}
.contentsArea.apprDocViewFrame .apprDocViewWrapper .apprDocView .apprDocViewWrap .commentArea.memo {
  margin-top: 20px;
}
.contentsArea.apprDocViewFrame.popupDoc {
  border-top: 1px solid var(--apprHomeWrapBorderColor);
}

.msgWrap.popupAppr {
  z-index: 30;
}
.msgWrap.popupAppr .msgBox {
  width: 350px;
  height: 400px;
  transform: none;
}
.msgWrap.popupAppr .msgBox > header {
  display: flex;
  align-items: center;
  height: 50px;
  padding: 0 10px 0 15px;
}
.msgWrap.popupAppr .msgBox > header h3 {
  font-size: var(--fs16);
}
.msgWrap.popupAppr .msgBox > header .check-switch {
  position: relative;
  display: inline-block;
  width: 63px;
  height: 18px;
  margin-left: 5px;
}
.msgWrap.popupAppr .msgBox > header .check-switch input {
  position: absolute;
  top: 0;
  left: 10px;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.msgWrap.popupAppr .msgBox > header .check-switch input + label {
  position: absolute;
  top: 1px;
  left: 0;
  width: 63px;
  height: 16px;
  line-height: 16px;
  color: rgba(255, 255, 255, 0.5);
  padding: 0 5px;
  font-size: var(--fs11);
  text-align: right;
  z-index: 1;
  cursor: pointer;
}
.msgWrap.popupAppr .msgBox > header .check-switch input ~ .slider {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #bbb;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 24px;
  cursor: pointer;
}
.msgWrap.popupAppr .msgBox > header .check-switch input ~ .slider:before {
  content: "";
  position: absolute;
  bottom: 4px;
  left: 5px;
  width: 10px;
  height: 10px;
  background-color: var(--MainBgColor);
  transition: 0.4s;
  border-radius: 50%;
}
.msgWrap.popupAppr .msgBox > header .check-switch input:checked + label {
  color: var(--InvertFontColor);
  text-align: left;
}
.msgWrap.popupAppr .msgBox > header .check-switch input:checked ~ .slider {
  background-color: var(--MainColor);
}
.msgWrap.popupAppr .msgBox > header .check-switch input:checked ~ .slider:before {
  transform: translateX(44px);
}
.msgWrap.popupAppr .msgBox > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin-left: auto;
  cursor: pointer;
}
.msgWrap.popupAppr .msgBox > header .btnClose > i {
  width: 13px;
  height: 13px;
  background-position: 0 -314px;
}
.msgWrap.popupAppr .msgBox > header .btnClose:hover {
  background-color: #efefef;
}
.msgWrap.popupAppr .msgBox > header .apprSearch {
  position: relative;
  display: flex;
  margin-left: auto;
  width: 180px;
  height: 28px;
  background-color: var(--ControlBgColor);
  border: 1px solid var(--BorderGreyLight);
}
.msgWrap.popupAppr .msgBox > header .apprSearch.result .btnBackTree {
  display: inline-flex;
}
.msgWrap.popupAppr .msgBox > header .apprSearch.result > input {
  padding-left: 30px;
}
.msgWrap.popupAppr .msgBox > header .apprSearch .btnBackTree {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  display: none;
  width: 28px;
  height: 100%;
  cursor: pointer;
}
.msgWrap.popupAppr .msgBox > header .apprSearch .btnBackTree > i {
  width: 12px;
  height: 10px;
  background-position: 0 -408px;
}
.msgWrap.popupAppr .msgBox > header .apprSearch input {
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0 10px;
  color: var(--MainFontColor);
}
.msgWrap.popupAppr .msgBox > header .apprSearch input::placeholder, .msgWrap.popupAppr .msgBox > header .apprSearch input::-ms-input-placeholder {
  opacity: 0.8;
}
.msgWrap.popupAppr .msgBox > header .apprSearch .btnApprSearch {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 30px;
  height: 100%;
  cursor: pointer;
}
.msgWrap.popupAppr .msgBox > header .apprSearch .btnApprSearch > i {
  width: 14px;
  height: 13px;
  background-position: 0 0;
}
.msgWrap.popupAppr .msgBox .contentArea {
  height: calc(100% - 50px);
  overflow-y: auto;
  border-top: 1px solid var(--apprHomeWrapBorderColor);
}
.msgWrap.popupAppr .msgBox .contentArea .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--FontColorGrey);
  font-size: var(--fs14);
}
.msgWrap.popupAppr > iframe {
  border: 0;
}
.msgWrap.popupAppr.selectApprTemp.inIframe {
  background-color: transparent;
}
.msgWrap.popupAppr.selectApprTemp .msgBox {
  width: 350px;
  height: unset;
}
.msgWrap.popupAppr.selectApprTemp .msgBox > header h3 {
  flex-shrink: 0;
  margin-right: 10px;
}
.msgWrap.popupAppr.selectApprTemp .msgBox > header .apprSearch {
  margin-left: auto;
}
.msgWrap.popupAppr.selectApprTemp .msgBox .contentArea {
  height: 300px;
  border-top: 1px solid var(--BorderGreyLight);
}
.msgWrap.popupAppr.selectApprTemp .msgBox .contentArea .tree {
  border: 0;
}
.msgWrap.popupAppr.fullApprLine {
  z-index: 50;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li {
  height: 60px;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem {
  display: flex;
  align-items: center;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .apprType {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  font-size: var(--fs14);
  word-break: break-all;
  line-height: 13px;
  text-align: center;
  padding: 6px 5px;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .apprType::before {
  content: "";
  position: absolute;
  top: -15px;
  left: 0;
  border-top: 15px solid transparent;
  border-left: 20px solid #e8f7fe;
  border-bottom: 15px solid transparent;
  border-right: 20px solid #e8f7fe;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .apprType::after {
  content: "";
  position: absolute;
  top: 40px;
  left: 0;
  border-top: 15px solid #e8f7fe;
  border-left: 20px solid transparent;
  border-bottom: 15px solid transparent;
  border-right: 20px solid transparent;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusGreen .apprType {
  height: 50px;
  background-color: rgba(var(--apprStatusColorGreen-rgb), 0.1);
  color: var(--apprStatusColorGreen);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusGreen .apprType::before {
  display: none;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusGreen .apprType::after {
  top: 50px;
  border-top-color: #e7f7e7;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusBlue .apprType {
  background-color: rgba(var(--apprStatusColorBlue-rgb), 0.1);
  color: var(--apprStatusColorBlue);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusBlue .apprType::before {
  border-left-color: #e8f8fe;
  border-right-color: #e8f8fe;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusBlue .apprType::after {
  border-top-color: #e8f8fe;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusGrey .apprType {
  background-color: #f5f5f5;
  color: var(--apprStatusColorGrey);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusGrey .apprType::before {
  border-left-color: #f5f5f5;
  border-right-color: #f5f5f5;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusGrey .apprType::after {
  border-top-color: #f5f5f5;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusBlue, .msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusGreen, .msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem.statusGrey {
  background-color: transparent;
  color: initial;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .apprOrder {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin: 0 5px;
  font-size: var(--fs11);
  border-radius: 50%;
  background-color: rgba(153, 153, 153, 0.1);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .empInfo {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding-right: 10px;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .name {
  display: flex;
  font-size: var(--fs14);
  margin-right: 10px;
  color: var(--MainFontColor);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .name .powerCoo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 16px;
  padding: 0 5px;
  margin-left: 5px;
  background-color: var(--BgColorGrey);
  border-radius: 10px;
  font-size: var(--fs11);
  font-weight: normal;
  color: var(--FontColorGrey);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .date {
  margin-left: auto;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .empDept {
  flex-basis: 100%;
  width: 100%;
  margin-top: 4px;
  margin-left: 8px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li:first-child {
  height: 70px;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li:first-child .apprLineItem .apprType {
  height: 50px;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li:first-child .apprLineItem .apprType::after {
  top: 50px;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li:first-child .apprLineItem .empInfo {
  padding-top: 5px;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li:last-child .apprLineItem .apprType::after {
  top: 40px;
  width: 100%;
  height: 10px;
  background-color: #f5f5f5;
  border: 0;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li:last-child .apprLineItem.statusGrey .apprType::after {
  background-color: #f5f5f5;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li:last-child .apprLineItem.statusBlue .apprType::after {
  background-color: rgba(29, 176, 246, 0.1);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li:last-child .apprLineItem.statusGreen .apprType::after {
  background-color: rgba(21, 176, 101, 0.1);
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li.groupCoo .apprLineItem .apprType .iconCoop {
  display: flex;
}
.msgWrap.popupAppr.fullApprLine .msgBox .contentArea .apprLineList li.powerCoo .apprLineItem .apprType .iconCoop {
  display: flex;
  background-color: var(--apprStatusColorBlue);
}
.msgWrap.popupAppr.apprHistory {
  z-index: 50;
}
.msgWrap.popupAppr.apprHistory .msgBox {
  width: unset;
  min-width: 350px;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li {
  height: 60px;
  padding: 0 10px;
  border-bottom: 1px solid #efefef;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem {
  display: flex;
  align-items: center;
  height: 100%;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .status {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 45px;
  height: 45px;
  padding: 0 4px;
  margin-right: 10px;
  border-radius: 50%;
  font-size: var(--fs14);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .status .txt {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  font-size: var(--fs13);
  text-align: center;
  word-break: break-all;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .status .txt .actionType {
  line-height: 14px;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .statusBlue {
  background-color: rgba(57, 170, 250, 0.1);
  color: var(--apprStatusColorBlue);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .statusGreen {
  background-color: rgba(21, 176, 101, 0.1);
  color: var(--apprStatusColorGreen);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .statusRed {
  background-color: rgba(255, 77, 44, 0.1);
  color: var(--apprStatusColorRed);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .statusYellow {
  background-color: rgba(253, 171, 52, 0.1);
  color: var(--apprStatusColorYellow);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .statusGrey {
  background-color: rgba(153, 153, 153, 0.1);
  color: var(--apprStatusColorGrey);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .statusGrey .txt .actionName {
  display: none;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo {
  width: 100%;
  font-size: var(--fs14);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .infoWrap {
  display: flex;
  align-items: center;
  margin-bottom: 3px;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .infoWrap .name {
  flex-shrink: 0;
  color: var(--MainFontColor);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .infoWrap .powerCoo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 16px;
  padding: 0 5px;
  margin-left: 5px;
  background-color: var(--BgColorGrey);
  border-radius: 10px;
  font-size: var(--fs11);
  color: var(--FontColorGrey);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .infoWrap .adminInfo {
  display: inline-flex;
  align-items: center;
  margin-left: 5px;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .infoWrap .adminInfo .iconAdmin {
  width: 9px;
  height: 11px;
  background-position: -34px -337px;
  margin-right: 3px;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .infoWrap .adminInfo .txt {
  font-size: var(--fs11);
  color: #FDAB34;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .infoWrap .date {
  flex-shrink: 0;
  margin-left: auto;
  padding-left: 20px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .empDept {
  flex-shrink: 0;
  flex-basis: 100%;
  color: var(--FontColorGrey);
  font-size: var(--fs13);
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li.groupCoo .apprLineItem .status .iconCoop {
  display: flex;
}
.msgWrap.popupAppr.apprHistory .msgBox .contentArea .apprLineList li.powerCoo .apprLineItem .status .iconCoop {
  display: flex;
  background-color: var(--apprStatusColorBlue);
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li {
  height: 80px;
  padding: 0 15px;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo {
  position: relative;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .date {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 20px;
  background-color: rgba(var(--InvertBgColor-rgb), 0.05);
  color: var(--FontColorGrey);
  font-size: var(--fs13);
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo > i {
  display: block;
  width: 10px;
  height: 12px;
  margin-right: 5px;
  background-position: 0 -641px;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo:before, .msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo:after {
  display: none;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo:before {
  content: "";
  position: absolute;
  right: 30px;
  bottom: 22px;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 9px solid #f4f4f4;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo:after {
  content: attr(data-tooltip);
  position: absolute;
  right: 0;
  bottom: 30px;
  padding: 4px 10px;
  background-color: #f4f4f4;
  white-space: nowrap;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo:hover:before, .msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea .apprLineList li .apprLineItem .empInfo .shareInfo:hover:after {
  display: block;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea > .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea > .noData > .iconNoData {
  display: block;
  width: 32px;
  height: 44px;
  background-position: -80px -561px;
}
.msgWrap.popupAppr.apprHistory.appShare .msgBox .contentArea > .noData > span {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs13);
}
.msgWrap.popupAppr.appDocShare .msgBox {
  width: 500px;
  height: 520px;
}
.msgWrap.popupAppr.appDocShare .msgBox > header {
  position: relative;
  display: flex;
  align-items: center;
}
.msgWrap.popupAppr.appDocShare .msgBox > header > i {
  flex-shrink: 0;
  display: block;
  width: 30px;
  height: 30px;
  background-position: -24px 6px;
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .appSearch {
  width: 100%;
  height: 50px;
  border: none;
  font-size: var(--fs16);
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .appSearch:focus {
  color: var(--MainColor);
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .appSearch:valid + .btnDelShareSearch {
  display: flex;
  align-items: center;
  justify-content: center;
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .btnDelShareSearch {
  display: none;
  position: relative;
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  margin-right: 15px;
  margin-left: 15px;
  border-radius: 50%;
  background-color: rgba(var(--InvertBgColor-rgb), 0.3);
  background-position: -18px -64px;
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .btnDelShareSearch:hover, .msgWrap.popupAppr.appDocShare .msgBox > header > .btnDelShareSearch:focus {
  background-color: rgba(var(--InvertBgColor-rgb), 0.5);
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .btnDelShareSearch:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .btnShareList {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 100%;
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .btnShareList:before {
  content: "";
  width: 20px;
  height: 20px;
  background-position: -127px -636px;
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .txtShareList {
  position: absolute;
  top: 45px;
  right: 5px;
  padding: 12px 20px;
  border-radius: 5px;
  background-color: #EFF1F5;
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor-rgb), 0.8);
  box-shadow: rgba(15, 15, 15, 0.2) 0px 3px 6px;
  opacity: 1;
  transition: opacity 0.3s linear;
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .txtShareList:before {
  position: absolute;
  top: -9px;
  right: 10px;
  content: "";
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 10px solid #EFF1F5;
}
.msgWrap.popupAppr.appDocShare .msgBox > header > .txtShareList.hide {
  width: 0;
  height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.3s linear;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList {
  flex-shrink: 0;
  width: 270px;
  height: 100%;
  overflow-y: auto;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul {
  width: 100%;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupTitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 40px;
  padding: 0 10px 0 15px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupTitle > span {
  font-size: var(--fs14);
  color: var(--FontColorGrey1);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupTitle > span > strong {
  font-size: var(--fs15);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupTitle > p {
  display: flex;
  align-items: center;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupTitle > p > .btnSelectAll {
  margin-right: 10px;
  padding: 3px 6px;
  border-radius: 3px;
  background-color: rgba(var(--InvertBgColor-rgb), 0.05);
  font-size: var(--fs11);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupTitle > p > .iconArrow {
  display: block;
  width: 10px;
  height: 6px;
  background-position: -37px -548px;
  transform: rotate(180deg);
  transition: all 0.5s linear;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupTitle:hover {
  cursor: pointer;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupContent {
  max-height: 0;
  overflow: hidden;
  transition: all 0.3s linear;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupContent > li {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 30px;
  padding: 5px 10px 5px 30px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupContent > li > .iconUser {
  position: absolute;
  top: 5px;
  left: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 12px;
  height: 12px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupContent > li > .name {
  font-size: var(--fs14);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupContent > li > .empDept {
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupContent > li:hover {
  background-color: rgba(var(--InvertBgColor-rgb), 0.05);
  cursor: pointer;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupContent > li.Selected > .iconUser:before {
  content: "";
  width: 4px;
  height: 7px;
  border-bottom: 2px solid var(--MainColor);
  border-right: 2px solid var(--MainColor);
  transform: rotate(45deg);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li > .groupContent > li.Selected:hover {
  background-color: transparent;
  cursor: default;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li + li {
  border-top: 1px solid var(--apprHomeWrapBorderColor);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li.groupOpen > .groupTitle > p .iconArrow {
  transform: rotate(0deg);
  transition: all 0.5s linear;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .leftList > ul > li.groupOpen > .groupContent {
  max-height: 3000em;
  transition: all 0.3s linear;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  border-left: 1px solid var(--apprHomeWrapBorderColor);
  overflow: hidden;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  width: 100%;
  height: 40px;
  padding: 0 10px 0 15px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .title > span {
  font-size: var(--fs14);
  color: var(--FontColorGrey1);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .title > .btnDelAll {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .title > .btnDelAll:before {
  content: "";
  width: 15px;
  height: 13px;
  background-position: -86px -640px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .title > .btnDelAll:hover {
  background-color: rgba(var(--InvertBgColor-rgb), 0.05);
  cursor: pointer;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList {
  display: flex;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList > ul {
  width: 100%;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList > ul > li {
  min-height: 50px;
  padding: 5px 15px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList > ul > li > .nameArea {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--fs14);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList > ul > li > .nameArea .btnDel {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border: 1px solid var(--colorRed);
  border-radius: 50%;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList > ul > li > .nameArea .btnDel:before {
  content: "";
  width: 9px;
  height: 2px;
  background-color: var(--colorRed);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList > ul > li > .nameArea .btnDel:hover {
  background-color: var(--colorRed);
  cursor: pointer;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList > ul > li > .nameArea .btnDel:hover:before {
  background-color: var(--colorWhite);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea > .rightList > .selectUserList > ul > li > .empDept {
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea .noData {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea .noData > i {
  display: block;
  width: 32px;
  height: 44px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea .noData > i.iconSearch {
  background-position: -40px -561px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea .noData > i.iconNoData {
  background-position: -80px -561px;
}
.msgWrap.popupAppr.appDocShare .msgBox > .contentArea .noData > span {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs14);
}
.msgWrap.popupAppr.appDocShare .shareListWrap {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 0;
  height: 520px;
  background-color: #E4E5EB;
  border-radius: 5px;
  box-shadow: rgba(15, 15, 15, 0.2) 9px 9px 15px;
  opacity: 0;
  overflow: hidden;
  transition: all 0.3s linear;
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section > .title {
  flex-shrink: 0;
  padding: 20px 15px 10px;
  color: rgba(var(--MainFontColor-rgb), 0.7);
  font-size: var(--fs11);
  font-weight: bold;
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section > ul {
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section > ul > li {
  display: flex;
  flex-direction: column;
  min-height: 50px;
  padding: 5px 15px;
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section > ul > li > .name, .msgWrap.popupAppr.appDocShare .shareListWrap > section > ul > li > .empDept {
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section > .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section > .noData > .iconNoData {
  display: block;
  width: 32px;
  height: 44px;
  background-position: -80px -561px;
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section > .noData > span {
  padding: 0 16px;
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs13);
  text-align: center;
}
.msgWrap.popupAppr.appDocShare .shareListWrap > section + section {
  border-top: 1px solid #bbb;
}
.msgWrap.popupAppr.appDocShare.shareListOpen .msgBox > header .btnShareList:before {
  background-position-x: -156px;
}
.msgWrap.popupAppr.appDocShare.shareListOpen .shareListWrap {
  width: 200px;
  opacity: 1;
  transition: all 0.3s linear;
}
.msgWrap.popupAppr.apprAddFile.inIframe {
  background-color: transparent;
}
.msgWrap.popupAppr.apprAddFile .msgBox {
  width: 550px;
  height: auto;
}
.msgWrap.popupAppr.apprAddFile .msgContent {
  position: relative;
  height: 130px;
  padding: 0;
}
.msgWrap.popupAppr.apprAddFile .msgContent .upload {
  border-radius: 0;
  border-bottom: 0;
  border-top-color: var(--ControlBorderColor);
}
.msgWrap.popupAppr.apprAddFile .msgContent .upload .uploadNoFile {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.msgWrap.popupAppr.apprAddFile .msgContent .upload .uploadFileTooltip .uploadContentBox .inputText {
  height: 100%;
  min-height: 30px;
  font-size: var(--fs14);
}
.msgWrap.popupAppr.apprDocRef .msgBox {
  width: 800px;
  height: 580px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea {
  display: flex;
  width: 100%;
  margin-left: unset;
  border-top: none;
  overflow: hidden;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  border-right: 1px solid var(--apprHomeWrapBorderColor);
  background-color: #F5F8FD;
  overflow: hidden;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  border-bottom: 1px solid var(--apprHomeWrapBorderColor);
  background-color: var(--MainBgColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .iconSearch {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 50px;
  height: 50px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .iconSearch:before {
  content: "";
  width: 16px;
  height: 16px;
  background-position: -24px 0;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .btnBack {
  display: none;
  flex-shrink: 0;
  width: 50px;
  height: 50px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .btnBack:before {
  content: "";
  width: 12px;
  height: 10px;
  background-position: 0 -408px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .apprSearch {
  width: 100%;
  height: 50px;
  border: none;
  font-size: var(--fs16);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .apprSearch:focus {
  color: var(--MainColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .apprSearch:valid + .btnDelSearch {
  display: flex;
  align-items: center;
  justify-content: center;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .btnDelSearch {
  display: none;
  position: relative;
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  margin-right: 15px;
  margin-left: 15px;
  border-radius: 50%;
  background-color: rgba(var(--InvertBgColor-rgb), 0.3);
  background-position: -18px -64px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .btnDelSearch:hover, .msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .btnDelSearch:focus {
  background-color: rgba(var(--InvertBgColor-rgb), 0.5);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchArea > .btnDelSearch:focus-visible {
  outline: 1px solid var(--MainFontColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchResult {
  display: none;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 40px;
  padding: 0 15px;
  background-color: #eaedef;
  font-size: var(--fs13);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchResult > span {
  color: var(--MainFontColor);
  font-size: var(--fs13);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchResult > span.keyword {
  padding-right: 5px;
  font-weight: bold;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .searchResult > span.num {
  padding-left: 8px;
  padding-right: 2px;
  color: var(--MainColor);
  font-weight: bold;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  padding: 0 15px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea > .tabItem {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  padding: 0 12px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea > .tabItem + .tabItem:before {
  content: "";
  position: absolute;
  top: 9px;
  left: 0;
  width: 1px;
  height: 12px;
  background-color: var(--BorderGrey);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea > .tabItem > input[type=radio] {
  display: none;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea > .tabItem > input[type=radio]:checked + label {
  font-weight: bold;
  border-bottom: 2px solid var(--MainColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea > .tabItem > label {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: var(--fs14);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea > .tabItem > label:hover {
  font-weight: bold;
  cursor: pointer;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter {
  position: relative;
  display: flex;
  z-index: 1;
  padding: 5px 15px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .btnFilter {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  height: 28px;
  background-color: #fff;
  padding: 0 10px;
  border: 1px solid #dbe1e6;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .btnFilter .iconFilter {
  width: 12px;
  height: 11px;
  background-position: 0 -620px;
  margin-right: 5px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .btnFilter .txt {
  font-size: var(--fs13);
  margin-right: 5px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .btnFilter .txt.hasCondition::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 4px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: var(--colorOrange);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .btnFilter .iconArrow {
  width: 8px;
  height: 5px;
  background-position: 0 -394px;
  margin-left: auto;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption {
  position: absolute;
  top: 30px;
  left: 0px;
  max-width: 210px;
  border: 1px solid #d6d6d6;
  background-color: var(--ControlBgColor);
  z-index: 1;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .optionWrap {
  min-width: 100px;
  border-top: 1px solid #d6d6d6;
  font-size: var(--fs14);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .filterTitle {
  position: relative;
  display: flex;
  align-items: center;
  height: 34px;
  padding: 15px;
  font-size: var(--fs13);
  font-weight: bold;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .filterTitle.main {
  justify-content: space-between;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .filterTitle.main > span {
  font-size: var(--fs15);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .filterTitle.main > .btnReset {
  display: flex;
  align-items: center;
  color: rgba(var(--MainFontColor-rgb), 0.7);
  font-weight: normal;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .filterTitle.main > .btnReset > i {
  width: 13px;
  height: 14px;
  margin-right: 5px;
  background-position: 0 -45px;
  opacity: 0.5;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .filterTitle.main > .btnReset:hover {
  color: var(--MainFontColor);
  cursor: pointer;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .filterTitle.main > .btnReset:hover > i {
  opacity: 1;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-bottom: 8px;
  background-color: var(--ControlBgColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea {
  position: relative;
  display: flex;
  align-items: center;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox] {
  display: none;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox] + label {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 4px 15px;
  font-size: var(--fs13);
  cursor: pointer;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  border-radius: 5px;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox] + label > .count {
  padding-left: 5px;
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs11);
  font-style: normal;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox]:checked + label::before {
  border-color: var(--MainColor);
  background-color: var(--MainColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox]:checked + label::after {
  content: "";
  position: absolute;
  top: 6px;
  left: 21px;
  width: 5px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox]:focus + label {
  border-color: var(--BorderGreyDark1);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox]:disabled + label {
  cursor: default;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .docStatusArea .checkArea input[type=checkbox]:disabled + label::before {
  background-color: #eaeaea;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .toggleArea {
  width: 100%;
  padding: 12px 15px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .toggleArea input[type=checkbox] {
  display: none;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .toggleArea input[type=checkbox] + label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--fs13);
  font-weight: bold;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .toggleArea input[type=checkbox] + label > i {
  position: relative;
  width: 30px;
  height: 16px;
  border-radius: 20px;
  background-color: var(--styleCheckToggleBgColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .toggleArea input[type=checkbox] + label > i:before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #fff;
  transition: left 0.2s;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .toggleArea input[type=checkbox]:checked + label {
  color: currentColor;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .toggleArea input[type=checkbox]:checked + label > i {
  background-color: var(--ControlBgColorSelected);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .toggleArea input[type=checkbox]:checked + label > i:before {
  left: 17px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 0 15px 10px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .selectBox {
  width: 100%;
  margin: 0 0 4px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .inputPeriod {
  display: flex;
  align-items: center;
  height: 26px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .inputPeriod > .layoutControl {
  position: relative;
  flex-direction: column;
  align-items: flex-start;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .inputPeriod label {
  display: block;
  margin-bottom: 5px;
  font-size: var(--fs13);
  text-align: left;
  color: var(--FontColorGrey);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .inputPeriod input {
  width: 100%;
  height: 26px;
  border: 1px solid #d6d6d6;
  margin-left: 0;
  transition: border-color 0.3s;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .inputPeriod input:focus {
  border-color: var(--MainColor);
  box-shadow: none;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .inputPeriod > .txt {
  margin: 0 4px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .layoutControl {
  width: auto !important;
  height: auto !important;
  position: relative;
  display: inline-flex;
  padding: 0;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .layoutControl label {
  display: none;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .periodWrap .layoutControl input {
  width: 80px !important;
  height: 26px !important;
  border-radius: 0;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .selectBox {
  width: calc(100% - 30px);
  height: 30px;
  margin: 0 15px 12px;
  border-color: var(--ControlBorderColor);
  border-radius: 3px;
  font-size: var(--fs13);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .selectBox:focus-visible {
  border: 2px solid var(--MainColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  padding: 0 5px 10px;
  background-color: var(--ControlBgColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea > button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  padding: 0 10px;
  font-size: var(--fs13);
  color: rgba(var(--MainFontColor-rgb), 0.7);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea > button.btnDateOk {
  display: none;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea > button.btnFilterReset > .iconReset {
  width: 13px;
  height: 14px;
  margin-right: 5px;
  background-position: 0 -45px;
  opacity: 0.5;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea > button.btnFilterReset:hover {
  color: var(--MainFontColor);
  cursor: pointer;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea > button.btnFilterReset:hover > .iconReset {
  opacity: 1;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea.showBtnDate {
  justify-content: space-between;
  padding: 0 5px 10px 15px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea.showBtnDate .btnDateOk {
  display: flex;
  border: 1px solid var(--MainColor);
  color: var(--MainColor);
  font-size: var(--fs13);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .tabArea .apprListFilter .selectOption .btnArea.showBtnDate .btnDateOk:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView {
  width: 100%;
  padding: 5px 15px;
  border: none;
  background-color: unset;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem {
  display: inline-block;
  width: 100%;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li {
  display: flex;
  width: 100%;
  margin-bottom: 10px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 80px;
  padding: 0 10px;
  background-color: var(--MainBgColor);
  box-shadow: 0 1px 3px #c7ccd0;
  overflow: hidden;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a.selected {
  border: 1px solid var(--MainColor);
  background-color: var(--apprListItemSelectedBgColor);
  color: var(--MainFontColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .apprStatus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  font-size: var(--fs11);
  margin-right: 10px;
  text-align: center;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .titleWrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .titleWrap .urgent {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 20px;
  font-size: var(--fs13);
  margin-right: 3px;
  border-radius: 5px;
  font-weight: normal;
  padding: 0 5px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .titleWrap .docTitle {
  display: block;
  margin-bottom: 5px;
  font-size: var(--fs14);
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow: hidden;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .tiny {
  display: flex;
  align-items: center;
  width: 100%;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .tiny .docType {
  display: block;
  height: 19px;
  margin-right: 5px;
  padding: 0px 5px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  line-height: 19px;
  border-radius: 5px;
  background-color: var(--BgColorGrey);
  max-width: 50%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .tiny .docID {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  max-width: 50%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .drafter {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-direction: column;
  min-width: 100px;
  height: 65px;
  margin-left: auto;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  overflow: hidden;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .drafter .name {
  color: var(--MainFontColor);
  margin-bottom: 3px;
  font-size: var(--fs14);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  width: 100%;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li > a .drafter .dept {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
  text-align: right;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .apprListView > .listItem li .checkArea + a {
  width: calc(100% - 30px);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: transparent;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .noData > .iconNoData {
  display: block;
  width: 32px;
  height: 32px;
  margin-bottom: 10px;
  background-position: 0 -129px;
  opacity: 0.3;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList > .noData > span {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs14);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList.Keyword > .searchArea > .btnBack {
  display: flex;
  align-items: center;
  justify-content: center;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList.Keyword > .searchArea > .iconSearch {
  display: none;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .leftList.Keyword > .searchResult {
  display: inline-flex;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 290px;
  height: 100%;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 50px;
  padding: 0 15px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .title > span {
  font-size: var(--fs14);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .title > .btnDelAll {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .title > .btnDelAll:before {
  content: "";
  width: 15px;
  height: 13px;
  background-position: -86px -640px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .title > .btnDelAll:hover {
  background-color: rgba(var(--InvertBgColor-rgb), 0.05);
  cursor: pointer;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: 10px 15px;
  overflow-y: hidden;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul {
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 30px;
  border: 1px dashed var(--BorderGreyDark);
  border-radius: 3px;
  padding: 5px 8px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li > .order {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  border-radius: 5px;
  background-color: #f3f3f3;
  font-size: var(--fs13);
  font-weight: bold;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li > .info {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li > .info > .doc {
  flex-shrink: 0;
  margin-right: 10px;
  font-size: var(--fs13);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li > .info > .num {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--fs11);
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li > .btnDel {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-left: 10px;
  border: 1px solid var(--colorRed);
  border-radius: 50%;
  background-color: var(--MainBgColor);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li > .btnDel:before {
  content: "";
  width: 9px;
  height: 2px;
  background-color: var(--colorRed);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li > .btnDel:hover {
  background-color: var(--colorRed);
  cursor: pointer;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li > .btnDel:hover:before {
  background-color: var(--colorWhite);
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > ul > li + li {
  margin-top: 5px;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > .noData {
  display: flex;
  align-items: center;
  flex-direction: column;
  min-width: unset;
}
.msgWrap.popupAppr.apprDocRef .msgBox .contentArea > .rightList > .selectDocList > .noData > span {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs14);
}

.docShareListWrap {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 30;
}
.docShareListWrap .docShareList {
  position: absolute;
  top: 102px;
  right: 20px;
  border: 1px solid var(--BorderGrey);
  background-color: var(--MainBgColor);
  box-shadow: 0px 3px 6px rgba(var(--InvertBgColor-rgb), 0.1);
}
.docShareListWrap .docShareList > li {
  width: fit-content;
}
.docShareListWrap .docShareList > li > button {
  display: flex;
  align-items: center;
  width: 180px;
  height: 28px;
  padding: 4px 10px;
  font-size: var(--fs13);
  color: var(--MainFontColor);
}
.docShareListWrap .docShareList > li > button > i {
  display: block;
  margin-right: 5px;
}
.docShareListWrap .docShareList > li > button.btnShare2 > i {
  width: 20px;
  height: 14px;
  background-position: -37px -639px;
}
.docShareListWrap .docShareList > li > button.btnShareHistory > i {
  width: 20px;
  height: 14px;
  background-position: -61px -639px;
}
.docShareListWrap .docShareList > li > button:hover {
  background-color: rgba(var(--InvertBgColor-rgb), 0.05);
  cursor: pointer;
}

.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap {
  width: 100%;
  padding: 10px;
  margin-top: 20px;
  border: 1px solid var(--apprHomeWrapBorderColor);
  background-color: var(--BgColorGrey1);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .titleArea {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: var(--fs14);
  margin-bottom: 10px;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .titleArea .title {
  font-weight: bold;
  color: var(--MainFontColor);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .titleArea .title .optTxt {
  color: var(--FontColorGrey);
  font-weight: normal;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .titleArea .title .optTxt.required {
  color: #FE8739;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .titleArea .info {
  margin-left: auto;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  margin-left: 10px;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .commentWrite {
  width: 100%;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .commentWrite > input {
  width: 100%;
  height: 32px;
  background-color: var(--ControlBgColor);
  border: 1px solid var(--apprHomeWrapBorderColor);
  padding: 0 10px;
  font-size: var(--fs14);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .commentWrite > input:hover {
  border-color: var(--MainColor);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .requiredTxt {
  display: flex;
  align-items: center;
  margin: 10px 0 0px 0;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .requiredTxt .iconTinyInfo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #FE8739;
  color: #fff;
  font-size: var(--fs11);
  font-weight: bold;
  font-style: normal;
  margin-right: 5px;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .requiredTxt .txt {
  color: #FE8739;
  font-size: var(--fs13);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap .requiredTxt .iconTinyInfo::after {
  content: "!";
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap + .divBtnArea {
  display: flex;
  justify-content: center;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap + .divBtnArea > .btnLineWhite {
  width: 130px;
  height: 45px;
  margin: 0 5px;
  padding: 0;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprCommentWrap + .divBtnArea > .btnLineWhite#msgBtnCancelAsync {
  background-color: transparent;
  border: 1px solid var(--MainColor);
  color: var(--MainColor);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap {
  width: 100%;
  max-width: 400px;
  min-height: 70px;
  max-height: 170px;
  margin-top: 20px;
  padding: 10px;
  border: 1px solid var(--apprHomeWrapBorderColor);
  background-color: var(--BgColorGrey1);
  color: var(--MainFontColor);
  overflow-y: auto;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item {
  margin-bottom: 15px;
  text-align: left;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item .titleWrap {
  display: inline-block;
  width: 100%;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: var(--MainFontColor);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item .titleWrap .drafter {
  font-size: var(--fs14);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item .titleWrap .drafter::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: 0 7px;
  background-color: #ccc;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item .titleWrap .docTitle {
  font-weight: bold;
  font-size: var(--fs14);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item .detailWrap {
  display: flex;
  align-items: center;
  margin: 5px 0 0px 0;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item .detailWrap .iconTinyInfo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #FE8739;
  color: #fff;
  font-size: var(--fs11);
  font-weight: bold;
  font-style: normal;
  margin-right: 5px;
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item .detailWrap .txt {
  color: #FE8739;
  text-align: left;
  font-size: var(--fs13);
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap .item .detailWrap .iconTinyInfo::after {
  content: "!";
}
.popupBox > .divMessageBgBox > .divMessageBox .apprFailedWrap + .divBtnArea input [type=button] {
  max-width: 180px;
}

.apprWriteWrap {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 16;
}
.apprWriteWrap .apprWriteIframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.apprWriteContents {
  display: flex;
  width: 100%;
  height: 100%;
  border-top: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .splitter.Horizontal {
  width: 7px;
  height: 100%;
  background-image: none;
  background-repeat: no-repeat;
  background-position: center;
}
.apprWriteContents .splitter.Horizontal:hover {
  cursor: col-resize;
  background-color: rgba(21, 176, 101, 0.3);
  border: 0;
  box-shadow: none;
  opacity: 1;
}
.apprWriteContents .docViewerArea {
  width: 60%;
  height: 100%;
  background-color: var(--MainBgColor);
}
.apprWriteContents .docViewerArea .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: calc(100% - 100px);
  flex-direction: column;
  font-size: var(--fs15);
  opacity: 0.5;
}
.apprWriteContents .docViewerArea .noData .iconNoApprData {
  width: 32px;
  height: 30px;
  margin-bottom: 20px;
  background-position: 0 -129px;
}
.apprWriteContents .approvalInfoArea {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 40%;
  min-width: 440px;
  height: 100%;
  background-color: var(--MainBgColor);
  border-left: 1px solid var(--apprHomeWrapBorderColor);
  color: var(--MainFontColor);
}
.apprWriteContents .approvalInfoArea .docTitle {
  width: 100%;
  padding: 0 15px;
  margin-top: 10px;
}
.apprWriteContents .approvalInfoArea .docTitle .tempTitleWrap {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}
.apprWriteContents .approvalInfoArea .docTitle .tempTitleWrap > i {
  width: 19px;
  height: 18px;
  margin-right: 5px;
  background-position: -83px -128px;
}
.apprWriteContents .approvalInfoArea .docTitle .tempTitleWrap .tempTitle {
  font-size: var(--fs13);
  font-weight: bold;
}
.apprWriteContents .approvalInfoArea .docTitle .userTitle {
  width: 100%;
  height: 38px;
  border: 1px solid var(--apprHomeWrapBorderColor);
  font-size: var(--fs16);
  padding: 10px 5px;
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
}
.apprWriteContents .approvalInfoArea .docTitle .userTitle:hover {
  border-color: var(--MainColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap {
  width: 100%;
  height: 100%;
  margin-top: 5px;
  padding: 0 15px 10px 15px;
  overflow-y: auto;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap {
  display: flex;
  flex-direction: column;
  height: 70%;
  overflow: hidden;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 40px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap > .title {
  font-size: var(--fs14);
  font-weight: bold;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap > .btnWrap {
  flex-shrink: 0;
  margin-left: auto;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap .btn {
  display: inline-flex;
  align-items: center;
  margin-bottom: 5px;
  padding: 5px 7px;
  border-radius: 5px;
  color: var(--MainFontColor);
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap .btn:hover {
  background-color: var(--apprPaginationBtnColorHover);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap .btn .iconAddLine {
  width: 12px;
  height: 14px;
  margin-right: 5px;
  background-position: 0 -21px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .titleWrap .btn .iconReset {
  width: 13px;
  height: 14px;
  margin-right: 5px;
  background-position: 0 -45px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap {
  position: relative;
  display: flex;
  height: calc(100% - 40px);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 250px;
  height: 100%;
  margin-right: 10px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--apprHomeWrapBorderColor);
  border-top: 0;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .tabApprovalLine {
  display: flex;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .tabApprovalLine li {
  display: flex;
  width: 50%;
  height: 34px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .tabApprovalLine li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-align: center;
  padding: 0 10px;
  font-size: var(--fs13);
  font-weight: bold;
  background-color: var(--apprPaginationBtnColorHover);
  color: var(--FontColorGrey);
  box-shadow: 0 1px 0 inset var(--apprHomeWrapBorderColor);
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .tabApprovalLine li > a[aria-selected=true] {
  background-color: var(--MainBgColor);
  box-shadow: 0px 3px 0 inset var(--BorderGreyDark1);
  color: var(--MainFontColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap {
  flex-shrink: 0;
  width: 100%;
  height: 50px;
  padding: 10px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  border: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch.result .btnBackTree {
  display: inline-flex;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch.result > input {
  padding-left: 30px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch .btnBackTree {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  display: none;
  width: 28px;
  height: 100%;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch .btnBackTree > i {
  width: 12px;
  height: 10px;
  background-position: 0 -408px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch > input {
  width: 100%;
  height: 100%;
  padding: 0 10px;
  border: 0;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch .btnSearch {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appSearchWrap .appSearch .btnSearch .iconSearch {
  width: 14px;
  height: 13px;
  background-position: 0 0;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100%;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .appSearchResult {
  display: flex;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgListWrap {
  display: flex;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList {
  width: 100%;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList .divTree {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList .divTree .tree {
  height: 100%;
  border: 0;
  padding: 0 5px;
  overflow-y: scroll;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList .divTree .tree .ulTreeDepth li {
  position: relative;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList .divTree .tree .ulTreeDepth li > .collapseIcon {
  vertical-align: initial;
  margin-left: 5px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList .divTree .tree .ulTreeDepth li .treeItem {
  display: inline-flex;
  align-items: flex-start;
  margin-left: -5px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList .divTree .tree .ulTreeDepth li .treeItem .txtName {
  word-break: break-all;
  white-space: normal;
  margin-top: 3px;
  margin-bottom: 3px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList .divTree .tree .ulTreeDepth li .treeItem:hover {
  background-color: var(--apprDraftEmpListBgColorHover);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .orgList .divTree .tree .ulTreeDepth li .treeItem.selected {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .empListWrap {
  flex-shrink: 0;
  height: 40%;
  border-top: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .empListWrap .empList {
  height: 100%;
  overflow-y: auto;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .empListWrap .empList li a {
  display: flex;
  align-items: center;
  height: 30px;
  padding: 0 7px 0 5px;
  font-size: var(--fs13);
  color: var(--MainFontColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .empListWrap .empList li a .txtName {
  max-width: 60%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .empListWrap .empList li a .txtInfo {
  color: #999;
  font-size: var(--fs11);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .empListWrap .empList li a .txtDept {
  margin-left: auto;
  color: #999;
  font-size: var(--fs11);
  max-width: 40%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .empListWrap .empList li a:hover {
  background-color: var(--apprDraftEmpListBgColorHover);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .empListWrap .empList li a.selected {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .noData {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  font-size: var(--fs14);
  opacity: 0.5;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .orgWrap .treeEmpWrap .noData .iconNoEmpData {
  width: 25px;
  height: 27px;
  margin-bottom: 10px;
  background-position: 0 -337px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0;
  overflow: hidden;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap {
  overflow-y: auto;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup {
  padding: 5px 0;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup:last-child {
  border-bottom: 0;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineTitle {
  display: flex;
  align-items: center;
  padding: 6px 0;
  margin: 0 10px;
  border-bottom: 1px solid var(--BorderGreyLight);
  font-size: var(--fs13);
  font-weight: bold;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineTitle:hover {
  color: var(--MainFontColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineTitle .iconUnfold {
  margin-left: auto;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineList > li {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0 10px 0 0;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineList > li:hover {
  background-color: var(--apprPaginationBtnColorHover);
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineList > li > .name {
  display: block;
  width: 100%;
  padding: 6px 10px;
  font-size: var(--fs14);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineList > li > .name .date {
  display: block;
  font-size: var(--fs11);
  color: var(--FontColorGrey);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineList > li > .btnDeleteItem {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineList > li > .btnDeleteItem > i {
  width: 7px;
  height: 7px;
  background-position: 0 -68px;
  opacity: 0.5;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .list .appLineTemplate .lineGroupWrap .lineGroup .appLineList > li > .btnDeleteItem:hover > i {
  opacity: 1;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .popupAddMyAppLine {
  display: none;
  position: absolute;
  top: 100px;
  left: 100px;
  z-index: 2;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .popupAddMyAppLine .AddMyAppLine {
  width: 300px;
  padding: 10px;
  background-color: var(--MainBgColor);
  box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 9px 24px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .popupAddMyAppLine .AddMyAppLine > .title {
  font-size: var(--fs14);
  font-weight: bold;
  margin-bottom: 15px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .popupAddMyAppLine .AddMyAppLine > input {
  width: 100%;
  height: 32px;
  border: 1px solid var(--apprHomeWrapBorderColor);
  background-color: var(--ControlBgColor);
  margin-bottom: 10px;
  padding: 0 10px;
  color: var(--MainFontColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .popupAddMyAppLine .AddMyAppLine .btnWrap {
  text-align: right;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .popupAddMyAppLine .AddMyAppLine .btnWrap button {
  display: inline-block;
  min-width: 50px;
  cursor: pointer;
  font-size: var(--fs13);
  padding: 7px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .popupAddMyAppLine .AddMyAppLine .btnWrap button.btnPrimary {
  border: 1px solid var(--MainColor);
  color: #fff;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .popupAddMyAppLine .AddMyAppLine .btnWrap button.btnDefault {
  border: 1px solid var(--apprHomeWrapBorderColor);
  background-color: var(--MainBgColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine {
  height: 100%;
  overflow-y: scroll;
  background-color: var(--MainBgColor);
  border: 1px solid var(--apprHomeWrapBorderColor);
  width: 100%;
  border-collapse: collapse;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType:first-child .itemList .itemWrap {
  min-height: 250px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType:last-child {
  border-bottom: 0;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .typeTitle {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 27px;
  padding: 0 10px;
  font-size: var(--fs14);
  background-color: var(--apprPaginationBtnColorHover);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .typeTitle > .iconLock {
  width: 12px;
  height: 14px;
  margin-right: 7px;
  background-position: 0 -495px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType:first-child .itemList {
  position: relative;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList {
  min-height: 100px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
  min-height: 110px;
  padding: 5px;
  padding-bottom: 30px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap li {
  margin-bottom: 5px;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap li .apprLineDragitem {
  min-width: 200px;
  overflow: hidden;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap li.ui-draggable-dragging .apprLineDragitem {
  min-width: 70px !important;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap > li.guide {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: var(--fs13);
  color: #ccc;
  margin: 0;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap > li > ul.CpGroup {
  min-width: 200px;
  padding: 5px 5px 0 5px;
  border-radius: 3px;
  background-color: var(--cpGroupBgColor);
  border: 1px dashed #999;
  cursor: move;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap > li > ul.CpGroup:hover {
  background-color: #c1ddff;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap > li > ul.CpGroup > li .apprLineDragitem {
  min-width: 190px;
  border: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .apprInfoWrap .apprLineWrap .approvalLineListWrap .approvalLine .approvalType .itemList .itemWrap > li > ul.CpGroup > li .apprLineDragitem:hover {
  background-color: var(--MainBgColor);
}
.apprWriteContents .approvalInfoArea .title .iconUnfold {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  width: 13px;
  height: 13px;
}
.apprWriteContents .approvalInfoArea .title .iconUnfold > i {
  width: 8px;
  height: 4px;
  background-position: 0 -111px;
}
.apprWriteContents .approvalInfoArea .title.Fold .iconUnfold > i {
  transform: rotate(270deg);
}
.apprWriteContents .approvalInfoArea .linkedDocs {
  width: 100%;
  margin-top: 20px;
}
.apprWriteContents .approvalInfoArea .linkedDocs .titleWrap {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.apprWriteContents .approvalInfoArea .linkedDocs .titleWrap .title {
  display: inline-flex;
  align-items: center;
  font-size: var(--fs14);
  font-weight: bold;
}
.apprWriteContents .approvalInfoArea .linkedDocs .titleWrap .btnAddFile {
  display: flex;
  align-items: center;
  margin-left: 10px;
  font-size: var(--fs11);
  padding: 4px 6px;
  color: var(--FontColorGrey);
  border: 1px solid var(--BorderGrey);
}
.apprWriteContents .approvalInfoArea .linkedDocs .titleWrap .btnAddFile > i {
  width: 6px;
  height: 6px;
  background-position: -53px -220px;
  margin-right: 3px;
}
.apprWriteContents .approvalInfoArea .linkedDocs .titleWrap .btnAddFile:hover {
  border-color: var(--BorderGreyDark1);
  color: var(--MainFontColor);
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList {
  margin-bottom: 20px;
  max-height: 123px;
  overflow-y: auto;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li {
  margin-top: -1px;
  border: 1px solid var(--BorderGreyLight);
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li:first-child {
  margin-top: 0;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 60px;
  padding: 0 10px 0 0;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a:hover {
  background-color: #f3fff9;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .linkedDocNo {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 100%;
  font-size: var(--fs13);
  background-color: #f4f4f4;
  margin-right: 10px;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .apprStatus {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 45px;
  height: 45px;
  margin-right: 10px;
  border-radius: 50%;
  font-size: var(--fs11);
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .left {
  width: calc(100% - 80px);
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .left .docTitle {
  max-width: calc(100% - 70px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--fs14);
  padding: 0;
  margin: 0;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .left .docType {
  padding: 2px 3px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  border-radius: 3px;
  background-color: var(--BgColorGrey);
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .left .docID {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .right {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 200px;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .right > .title {
  margin-bottom: 4px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .right > .value {
  font-size: var(--fs14);
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .drafter {
  position: absolute;
  top: 12px;
  right: 10px;
  display: flex;
  font-size: var(--fs13);
  flex-shrink: 0;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  margin-left: auto;
  text-align: right;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .drafter .dept {
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: var(--FontColorGrey);
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .drafter .name {
  margin-left: 4px;
}
.apprWriteContents .approvalInfoArea .linkedDocs .linkedDocList > li > a .docDate {
  position: absolute;
  right: 10px;
  bottom: 10px;
  margin-left: 10px;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.apprWriteContents .approvalInfoArea .fileUpload {
  position: relative;
  width: 100%;
  margin-top: 20px;
}
.apprWriteContents .approvalInfoArea .fileUpload .title {
  display: inline-flex;
  align-items: center;
  width: 100%;
  font-size: var(--fs14);
  font-weight: bold;
  margin-bottom: 10px;
}
.apprWriteContents .approvalInfoArea .fileUpload .title .btn-preview {
  font-size: var(--fs11);
  padding: 4px 6px;
  margin-left: auto;
  background-color: #eee;
  border-radius: 3px;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .fileUpload .title .btn-preview:hover {
  background-color: #e1e1e1;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .fileUpload .title .btn-preview > i {
  width: 18px;
  height: 12px;
  background-position: 0px -220px;
  margin-right: 5px;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload {
  position: relative;
  width: 100%;
  height: 75px;
  border: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea {
  position: absolute;
  top: 0;
  left: 0;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList {
  margin: 0;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .left {
  max-width: calc(100% - 220px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .left .txtSize > span {
  display: inline-block;
  margin-right: 5px;
  font-size: var(--fs11);
  color: var(--FontColorGrey);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 5px;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .txtDate {
  display: none;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .preview {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 23px;
  border-radius: 3px;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .preview > i {
  flex-shrink: 0;
  width: 18px;
  height: 12px;
  background-position: 0px -220px;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .preview:hover {
  background-color: #eeeeee;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .btnDelete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .btnDelete > i {
  flex-shrink: 0;
  width: 16px;
  height: 14px;
  background-position: -27px -220px;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li .right .btnDelete:hover {
  background-color: #eeeeee;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileList > li:last-child {
  border: 0;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileTooltip {
  top: 30px;
  left: 70px;
  box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 20px;
  min-width: 300px;
}
.apprWriteContents .approvalInfoArea .fileUpload .upload > .scrollArea .uploadFileTooltip .uploadContentBox .inputText {
  min-height: auto;
  font-size: var(--fs13);
}
.apprWriteContents .approvalInfoArea .comment {
  margin-top: 20px;
}
.apprWriteContents .approvalInfoArea .comment > .title {
  display: inline-block;
  margin-bottom: 10px;
  font-size: var(--fs14);
  font-weight: bold;
}
.apprWriteContents .approvalInfoArea .comment .commentWrite {
  display: flex;
  height: 80px;
  padding: 8px;
  margin-bottom: 10px;
  background-color: var(--BgColorGrey1);
  border: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .comment .commentWrite .commentInput {
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
  border: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .comment .commentWrite .commentInput > textarea {
  width: 100%;
  height: 100%;
  font-size: var(--fs13);
  border: 0;
  padding: 5px 10px;
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
}
.apprWriteContents .approvalInfoArea .comment .commentWrite .commentInput:hover {
  border-color: var(--MainColor);
}
.apprWriteContents .approvalInfoArea .comment .commentWrite .btnPrimary {
  margin-left: 10px;
  flex-shrink: 0;
}
.apprWriteContents .approvalInfoArea .comment .commentList {
  padding: 10px 10px 5px 10px;
  border: 1px solid var(--apprHomeWrapBorderColor);
  background-color: var(--BgColorGrey1);
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem {
  position: relative;
  padding: 8px 0;
  border-bottom: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem:first-child {
  padding-top: 0;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .info {
  display: flex;
  margin-bottom: 8px;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .info .username {
  font-size: var(--fs14);
  font-weight: bold;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .info .username .drafter {
  font-size: var(--fs13);
  color: var(--FontColorGrey);
  font-weight: normal;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .info .timestamp {
  margin-left: auto;
  font-size: var(--fs13);
  color: var(--FontColorGrey);
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .commentContent {
  display: flex;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .commentContent .commentText {
  display: flex;
  align-items: center;
  font-size: var(--fs14);
  min-height: 32px;
  width: 100%;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .commentContent .btnWrap {
  display: flex;
  align-items: center;
  margin-left: auto;
  flex-shrink: 0;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .commentContent .btnWrap .btnEdit {
  padding: 5px 8px;
  margin-left: 5px;
  background-color: var(--MainBgColor);
  border: 1px solid var(--apprHomeWrapBorderColor);
  font-size: var(--fs13);
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .commentContent .btnWrap .btnEdit:hover {
  border-color: var(--BorderGreyDark1);
  color: var(--MainFontColor);
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .commentContent.Edit .commentText {
  background-color: var(--MainBgColor);
  border: 1px solid var(--apprHomeWrapBorderColor);
  font-size: var(--fs14);
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .commentContent.Edit .commentText > input {
  border: 0;
  width: 100%;
  height: 100%;
  padding: 0 10px;
}
.apprWriteContents .approvalInfoArea .comment .commentList .commentItem .commentContent.Edit .btnPrimary {
  margin-left: 10px;
  flex-shrink: 0;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea {
  display: flex;
  align-items: center;
  width: 100%;
  height: 60px;
  background-color: var(--MainBgColor);
  z-index: 0;
  border-top: 1px solid var(--apprHomeWrapBorderColor);
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 20%;
  min-width: 130px;
  padding: 0 20px;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem .txt {
  flex-shrink: 0;
  margin-left: 5px;
  font-size: var(--fs13);
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem .check-switch {
  position: relative;
  width: 30px;
  height: 16px;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem .check-switch input {
  position: absolute;
  top: 50%;
  left: 10px;
  width: 1px;
  height: 1px;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem .check-switch input ~ .slider {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #bbb;
  transition: 0.4s;
  border-radius: 24px;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem .check-switch input ~ .slider:before {
  content: "";
  position: absolute;
  bottom: 3px;
  left: 5px;
  width: 10px;
  height: 10px;
  background-color: #fff;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem .check-switch input:checked ~ .slider {
  background-color: var(--MainColor);
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem .check-switch input:checked ~ .slider:before {
  transform: translateX(12px);
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .checkItem .info {
  font-size: var(--fs11);
  color: #999;
  margin-left: 3px;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .btnWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 5px 20px;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .btnWrap button {
  width: 80px;
  border-radius: 5px;
  height: 36px;
  font-size: var(--fs15);
  border: 0;
  transition: all 0.3s;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .btnWrap button.btnDefault {
  width: 100%;
  height: 100%;
  background-color: var(--MainColor);
  padding: 7px;
  color: #fff;
  min-width: 50px;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .btnWrap button.btnDefault:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .btnWrap button.btnDefault:active {
  background-color: var(--ButtonDefaultColorActive);
}
.apprWriteContents .approvalInfoArea .bottomBtnArea .btnWrap button.btnLine {
  border: 1px solid #dfdfdf;
  background-color: var(--MainBgColor);
  font-size: var(--fs13);
  padding: 7px;
  min-width: 50px;
  cursor: pointer;
}
.apprWriteContents .approvalInfoArea .dropArea {
  position: absolute;
  top: 5px;
  left: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  background-color: #F6F6F6;
  border: 1px dashed #999999;
  border-radius: 5px;
  z-index: 2;
}
.apprWriteContents .approvalInfoArea .dropArea .icon {
  position: relative;
  width: 57px;
  height: 57px;
  border-radius: 50%;
  background-color: #fff;
  border: 1px dashed #777;
}
.apprWriteContents .approvalInfoArea .dropArea .icon::before {
  content: "";
  position: absolute;
  top: 17px;
  left: calc(50% - 1px);
  width: 2px;
  height: 20px;
  background-color: #333;
}
.apprWriteContents .approvalInfoArea .dropArea .icon::after {
  content: "";
  position: absolute;
  top: 17px;
  left: calc(50% - 1px);
  width: 2px;
  height: 20px;
  background-color: #333;
  transform: rotate(90deg);
}

.apprLineDragitem {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 5px;
  min-height: 32px;
  border: 1px dashed var(--BorderGreyDark);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  cursor: move;
}
.apprLineDragitem:hover {
  background-color: #e4fff2;
}
.apprLineDragitem.point {
  animation: itemPoint 0.7s;
  animation-iteration-count: 2;
}
.apprLineDragitem .order {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 19px;
  max-width: 23px;
  height: 18px;
  background-color: var(--BgColorGrey);
  border-radius: 5px;
  font-weight: bold;
  font-size: var(--fs13);
  margin-right: 5px;
}
.apprLineDragitem .iconFixed {
  display: none;
  flex-shrink: 0;
  width: 14px;
  height: 17px;
  margin: 0 2px 0 7px;
  background-position: 0px -495px;
}
.apprLineDragitem .deleteItem {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 17px;
  height: 17px;
  background-color: transparent;
  border-radius: 50%;
  margin-left: 7px;
  cursor: pointer;
  z-index: 1;
}
.apprLineDragitem .deleteItem .iconDelete {
  flex-shrink: 0;
  width: 17px;
  height: 17px;
  background-position: 0px -521px;
}
.apprLineDragitem .personInfo {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.apprLineDragitem .personInfo .name {
  display: block;
  flex-shrink: 0;
  font-size: var(--fs15);
  max-width: 70%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.apprLineDragitem .personInfo .info {
  display: inline-flex;
  overflow: hidden;
  font-size: var(--fs11);
  text-align: center;
  word-break: break-all;
  margin: 0 5px;
}
.apprLineDragitem .personInfo .info .position {
  display: inline-block;
  height: 14px;
}
.apprLineDragitem .personInfo .info .dep {
  height: 14px;
  color: var(--FontColorGrey);
  margin-left: 5px;
}
.apprLineDragitem .personInfo .fixedType {
  display: none;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 20px;
  margin-bottom: 5px;
  border-radius: 3px;
  color: #fff;
  font-size: var(--fs13);
}
.apprLineDragitem .personInfo .fixedType.type01 {
  background-color: #15B065;
}
.apprLineDragitem .personInfo .fixedType.type02 {
  background-color: #2677DC;
}
.apprLineDragitem .personInfo .apprTypeRadio {
  position: relative;
  display: inline-block;
  width: 70px;
  height: 20px;
  margin-left: auto;
  margin-right: 10px;
}
.apprLineDragitem .personInfo .apprTypeRadio input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.apprLineDragitem .personInfo .apprTypeRadio input + label {
  position: absolute;
  top: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 20px;
  color: #999;
  padding: 0 5px;
  font-size: var(--fs13);
  transition: all 0.3s;
  z-index: 1;
  cursor: pointer;
}
.apprLineDragitem .personInfo .apprTypeRadio input.apprType01 {
  top: 0;
  left: 0;
}
.apprLineDragitem .personInfo .apprTypeRadio input.apprType01 + label {
  top: 0;
  left: 0;
}
.apprLineDragitem .personInfo .apprTypeRadio input.apprType02 {
  top: 0;
  left: 35px;
}
.apprLineDragitem .personInfo .apprTypeRadio input.apprType02 + label {
  top: 0;
  left: 35px;
}
.apprLineDragitem .personInfo .apprTypeRadio .slider {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #F2F2F2;
  border-radius: 3px;
  transition: 0.4s;
  cursor: pointer;
}
.apprLineDragitem .personInfo .apprTypeRadio .slider::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0px;
  width: 35px;
  height: 20px;
  background-color: #15B065;
  border-radius: 3px;
  transition: 0.4s;
}
.apprLineDragitem .personInfo .apprTypeRadio input[type=radio]:checked + label {
  color: #fff;
}
.apprLineDragitem .personInfo .apprTypeRadio input.apprType02:checked ~ .slider::before {
  transform: translateX(35px);
  background-color: #2677DC;
}
.apprLineDragitem .iconCoop {
  position: relative;
  display: flex;
  flex-shrink: 0;
  right: unset;
  bottom: unset;
  margin-right: 5px;
}
.apprLineDragitem .iconCoop.powerCoo {
  background-color: var(--apprStatusColorBlue);
}
.apprLineDragitem .apprTypeSelect {
  margin-left: auto;
}
.apprLineDragitem .apprTypeSelect select {
  display: flex;
  align-items: center;
  min-width: 30px;
  height: 20px;
  padding-left: 5px;
  background-color: var(--apprStatusColorGreen);
  border: 0;
  border-radius: 5px;
  color: #fff;
  font-size: var(--fs13);
  cursor: pointer;
}
.apprLineDragitem .apprTypeSelect option {
  background-color: var(--MainBgColor);
  color: var(--MainFontColor);
}
.apprLineDragitem .apprTypeSelect select.type02 {
  background-color: var(--apprTypeCpBgColor);
}
.apprLineDragitem .apprTypeSelect.dis {
  display: none;
}
.apprLineDragitem .apprTypeSelect select:disabled {
  background-color: #EDEDED;
  color: #666;
  cursor: default;
}
.apprLineDragitem.fixed .deleteItem, .apprLineDragitem.fixed .apprTypeSelect {
  display: none;
}
.apprLineDragitem.fixed .iconFixed, .apprLineDragitem.fixed .apprTypeSelect.dis {
  display: flex;
}

@keyframes itemPoint {
  0% {
    background-color: transparent;
  }
  50% {
    background-color: #e4fbff;
  }
  100% {
    background-color: transparent;
  }
}
.ui-draggable-dragging {
  display: flex;
}

.ui-draggable-dragging .apprLineDragitem {
  min-width: 70px !important;
  padding: 7px;
  flex-shrink: 0;
}

.ui-draggable-dragging .apprLineDragitem .order,
.ui-draggable-dragging .apprLineDragitem .deleteItem,
.ui-draggable-dragging .apprLineDragitem .personInfo .info {
  display: none;
}

.zipcodeArea {
  position: fixed;
  overflow: hidden;
  z-index: 9999999;
  -webkit-overflow-scrolling: touch;
  background-color: var(--MainBgColor);
  border-top: 1px solid var(--BgColorGrey);
  border-radius: 0 0 5px 5px;
}
.zipcodeArea > div {
  height: 100% !important;
}
.zipcodeArea > .btnClose {
  position: absolute;
  top: 0px;
  right: -5px;
  display: inline-block;
  width: 30px;
  height: 30px;
  background-position: 0px -109px;
}
.zipcodeArea > .btnClose:hover {
  cursor: pointer;
  transform: rotate(360deg);
  transition: ease 0.2s;
}
.zipcodeArea .inputZipcode {
  position: absolute;
  right: 0px;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 50%;
  border-left: 1px solid var(--ControlBorderColor);
  overflow: auto;
}
.zipcodeArea .inputZipcode .scrollArea {
  overflow-y: auto;
  height: 100%;
  padding: 20px 25px;
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem {
  margin-top: 10px;
}
.zipcodeArea .inputZipcode .scrollArea .divKor, .zipcodeArea .inputZipcode .scrollArea .divEng {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-bottom: 30px;
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressItem, .zipcodeArea .inputZipcode .scrollArea .divEng .addressItem {
  margin-bottom: 10px;
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressItem dt, .zipcodeArea .inputZipcode .scrollArea .divEng .addressItem dt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 45px;
  height: 23px;
  padding: 0 5px;
  background-color: #F0F5F7;
  border-radius: 4px;
  font-size: var(--fs13);
  color: #999;
  margin-bottom: 5px;
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressItem dd, .zipcodeArea .inputZipcode .scrollArea .divEng .addressItem dd {
  font-size: var(--fs14);
  color: var(--MainFontColor);
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressItem.zipcode dt, .zipcodeArea .inputZipcode .scrollArea .divEng .addressItem.zipcode dt {
  display: none;
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressItem.zipcode dd, .zipcodeArea .inputZipcode .scrollArea .divEng .addressItem.zipcode dd {
  color: var(--MainColor);
  font-size: var(--fs15);
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem {
  margin-bottom: 10px;
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem dt, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem dt {
  margin-bottom: 5px;
  font-size: var(--fs13);
  color: var(--MainFontColor) Lighter;
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem dd > input, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem dd > input {
  width: 100%;
  height: 33px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 3px;
  padding: 5px 10px;
  font-size: var(--fs14);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem dd > input::placeholder, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem dd > input::placeholder {
  color: rgba(var(--MainFontColor), 0.3);
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem dd > input::-webkit-input-placeholder, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem dd > input::-webkit-input-placeholder {
  color: rgba(var(--MainFontColor), 0.3);
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem dd > input::-ms-input-placeholder, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem dd > input::-ms-input-placeholder {
  color: rgba(var(--MainFontColor), 0.3);
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem dd > input:-ms-input-placeholder, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem dd > input:-ms-input-placeholder {
  color: rgba(var(--MainFontColor), 0.3);
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem dd > input:focus, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem dd > input:focus {
  border-color: var(--MainColor);
  color: var(--MainColor);
}
.zipcodeArea .inputZipcode .scrollArea .divKor .addressInputItem dd > input[type=number]::-webkit-inner-spin-button, .zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem dd > input[type=number]::-webkit-inner-spin-button {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}
.zipcodeArea .inputZipcode .scrollArea .divEng .addressInputItem {
  margin-top: 20px;
}
.zipcodeArea .inputZipcode .scrollArea > .divViewEnglish {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 5px;
}
.zipcodeArea .inputZipcode .scrollArea > .divViewEnglish > .txtLabel {
  display: flex;
  align-items: center;
  height: 20px;
  color: var(--FontColorGrey1);
  font-size: var(--fs14);
  cursor: pointer;
}
.zipcodeArea .inputZipcode .scrollArea > .divViewEnglish > .iconArrow {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 20px;
}
.zipcodeArea .inputZipcode .scrollArea > .divViewEnglish > .iconArrow::before {
  position: absolute;
  top: 9px;
  left: 7px;
  content: "";
  width: 5px;
  height: 5px;
  border-right: 1px solid var(--BorderGreyDark);
  border-bottom: 1px solid var(--BorderGreyDark);
  transform: rotate(-135deg);
}
.zipcodeArea .inputZipcode .scrollArea > .divViewEnglish > .iconArrow.open::before {
  transform: rotate(45deg);
  top: 6px;
}
.zipcodeArea .inputZipcode .btnWrap {
  width: 100%;
  padding: 15px;
  background-color: #F5F7F9;
  border-top: 1px solid #CFCFCF;
}
.zipcodeArea .inputZipcode .btnWrap button {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  width: 140px;
  height: 36px;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  border: 0;
  font-size: var(--fs15);
  padding: 0 15px;
  transition: all 0.3s;
  cursor: pointer;
}
.zipcodeArea .inputZipcode .btnWrap button:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.zipcodeArea .inputZipcode .btnWrap button:active {
  background-color: var(--ButtonDefaultColorActive);
}
.zipcodeArea .inputZipcode.User {
  width: 100%;
  height: 100%;
  background: transparent;
  border: 0;
}
.zipcodeArea .inputZipcode.User .divKor .group {
  display: flex;
  margin-bottom: 10px;
}
.zipcodeArea .inputZipcode.User .divKor .group .addressInputItem {
  width: 100%;
}
.zipcodeArea .inputZipcode.User .divKor .group .addressInputItem.zipcode {
  width: 30%;
  margin-right: 10px;
}
.zipcodeArea .divJpnPost {
  display: flex;
  flex-direction: column;
  overflow: auto;
}
.zipcodeArea .divJpnPost .divSearchArea {
  display: flex;
  position: relative;
  height: 47px;
  padding: 0 10px;
  border-bottom: 1px solid var(--BorderGreyDark1);
  background-color: var(--MainBgColor);
}
.zipcodeArea .divJpnPost .divSearchArea > input[type=text] {
  width: 100%;
  height: 100%;
  padding-left: 8px;
  border: 0;
  font-size: var(--fs17);
  background-color: transparent;
  color: var(--MainFontColor);
}
.zipcodeArea .divJpnPost .divSearchArea > .btnDel {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  width: 30px;
  height: 100%;
  background-color: var(--MainBgColor);
  border: 0;
  cursor: pointer;
}
.zipcodeArea .divJpnPost .divSearchArea > .btnDel > i {
  display: block;
  width: 12px;
  height: 12px;
  background-image: url(//t1.daumcdn.net/localimg/localimages/07/postcode/2015/320/dark.png);
  background-repeat: no-repeat;
  background-position: -45px 0;
}
.zipcodeArea .divJpnPost .divSearchArea > .btnSearch {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 36px;
  height: 100%;
  background-color: var(--MainBgColor);
  border: 0;
  cursor: pointer;
}
.zipcodeArea .divJpnPost .divSearchArea > .btnSearch > span {
  display: block;
  width: 16px;
  height: 17px;
  background-image: url(//t1.daumcdn.net/localimg/localimages/07/postcode/2015/320/dark.png);
  background-repeat: no-repeat;
}
.zipcodeArea .divJpnPost .txtErrorMsg {
  padding: 12px 13px 11px;
}
.zipcodeArea .divJpnPost .divResultArea > ul > li {
  padding: 10px 5px 10px 15px;
}
.zipcodeArea .divJpnPost .divResultArea > ul > li > .jpnZip {
  color: var(--colorRed);
  margin-bottom: 5px;
}
.zipcodeArea .divJpnPost .divResultArea > ul > li .jpnAddr:hover {
  text-decoration: underline;
  cursor: pointer;
}
.zipcodeArea .divRecentZipcode {
  position: absolute;
  top: 10px;
  right: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 8px 0 0;
  cursor: pointer;
}
.zipcodeArea .divRecentZipcode > .txtRecentZipcode {
  display: inline-block;
  height: 20px;
  color: var(--FontColorGrey1);
  font-size: var(--fs14);
  line-height: 13px;
  vertical-align: text-top;
}
.zipcodeArea .divRecentZipcode > .txtRecentZipcode:hover > .txtRecentZipcode {
  text-decoration: underline;
}
.zipcodeArea .divRecentZipcode > .txtRecentZipcode > .iconArrow {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 20px;
}
.zipcodeArea .divRecentZipcode > .txtRecentZipcode > .iconArrow::before {
  position: absolute;
  top: 1px;
  left: 7px;
  content: "";
  width: 8px;
  height: 8px;
  border-right: 1px solid var(--BorderGreyDark);
  border-bottom: 1px solid var(--BorderGreyDark);
  transform: rotate(45deg);
}

.divApiList {
  width: 100%;
  height: 100%;
}
.divApiList .divResultArea {
  display: flex;
  flex-direction: column;
  height: calc(100% - 47px);
}
.divApiList .divResultArea > .msgArea {
  padding: 16px;
  font-size: var(--fs13);
  background-color: var(--BgColorGrey1);
  flex-shrink: 0;
}
.divApiList .divResultArea > .msgArea > .txtPoint {
  color: var(--colorBlue);
  text-decoration: underline;
}
.divApiList .divResultArea > ul {
  height: 100%;
  overflow-y: auto;
}
.divApiList .divResultArea > ul > li > p {
  display: flex;
  align-items: flex-start;
  font-size: var(--fs15);
  line-height: 1.5;
}
.divApiList .divResultArea > ul > li .txtCaption {
  flex-shrink: 0;
  display: inline-block;
  min-width: 40px;
  margin: 3px 8px 0 0;
  font-size: var(--fs11);
  color: var(--colorBlue);
  text-align: center;
  border: 1px solid var(--colorBlue);
  border-radius: 2px;
}
.divApiList .divResultArea > ul > li .txtAddress {
  margin-bottom: 8px;
}
.divApiList .divResultArea > ul > li .txtAddress:hover {
  cursor: pointer;
  text-decoration: underline;
}
.divApiList .divResultArea > ul > li .txtNumber {
  font-size: var(--fs17);
  color: var(--colorRed);
}
.divApiList .divResultArea > .pageArea {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  font-size: var(--fs13);
  background-color: var(--BgColorGrey1);
  flex-shrink: 0;
}
.divApiList .divResultArea > .pageArea > .txtOn {
  font-weight: bold;
}
.divApiList .divResultArea > .pageArea > .txtOn + span:before {
  content: " / ";
}
.divApiList .divResultArea > .pageArea > .btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 5px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
}
.divApiList .divResultArea > .pageArea > .btn:hover {
  cursor: pointer;
  background-color: var(--BgColorGrey);
}
.divApiList .divResultArea > .pageArea > .btn:before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-width: 0px 0 2px 2px;
  border-style: solid;
  border-color: var(--BorderGreyDark1);
  transform: rotate(45deg);
}
.divApiList .divResultArea > .pageArea > .btn.Next:before {
  transform: rotate(-135deg);
}

.everDesignWrap {
  height: 100%;
  padding: 0 8px 4px 0;
  background-color: var(--PgmAreaBgColor);
}
.everDesignWrap > .everDesign {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  border: 1px solid #929292;
  box-shadow: -5px 0px 10px 0px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.everDesignWrap > .everDesign.show {
  right: 0;
}
.everDesignWrap > .everDesign.hide {
  right: -300px;
}
.everDesignWrap > .everDesign > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 43px;
  padding: 0 12px;
  border-bottom: 1px solid #E3E7EB;
}
.everDesignWrap > .everDesign > header .title {
  display: flex;
  align-items: center;
}
.everDesignWrap > .everDesign > header .title > i {
  margin-right: 8px;
}
.everDesignWrap > .everDesign > header .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.everDesignWrap > .everDesign > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  margin-left: auto;
  cursor: pointer;
}
.everDesignWrap > .everDesign > header .btnClose:hover {
  background-color: #F5F6F8;
}
.everDesignWrap > .everDesign .topArea {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding: 6px 12px;
  background-color: #F4F5F6;
  border-bottom: 1px solid #E3E7EB;
}
.everDesignWrap > .everDesign .topArea .selectCompany {
  display: flex;
  align-items: center;
  padding: 8px;
}
.everDesignWrap > .everDesign .topArea .selectCompany .txt {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
  margin-right: 4px;
}
.everDesignWrap > .everDesign .topArea .selectCompany:hover {
  background-color: #f5f5f5;
}
.everDesignWrap > .everDesign .topArea .dlgContextUI.everDesignCompany {
  top: 40px;
  z-index: 2;
}
.everDesignWrap > .everDesign .titleArea {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding: 10px 12px;
  border-bottom: 1px solid #E3E7EB;
}
.everDesignWrap > .everDesign .titleArea .controlName {
  display: flex;
  align-items: center;
  word-break: keep-all;
  padding: 8px;
  border-radius: 4px;
  cursor: pointer;
}
.everDesignWrap > .everDesign .titleArea .controlName .txt {
  margin-left: 5px;
  margin-right: 10px;
  font-size: var(--fs15);
  font-weight: bold;
  word-break: break-all;
}
.everDesignWrap > .everDesign .titleArea .controlName:hover {
  background-color: #f5f5f5;
}
.everDesignWrap > .everDesign .titleArea .btnMore {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  margin-left: auto;
  cursor: pointer;
}
.everDesignWrap > .everDesign .titleArea .btnMore:hover {
  background-color: #f5f5f5;
}
.everDesignWrap > .everDesign .titleArea .dlgContextUI.everDesignControl {
  top: 45px;
  left: 10px;
  z-index: 2;
}
.everDesignWrap > .everDesign .titleArea .dlgContextUI.everDesignControl .contextMenu > li .item .caption {
  font-weight: bold;
}
.everDesignWrap > .everDesign .titleArea .dlgContextUI.everDesignControl .contextMenu > li .item .ctrlID {
  margin-left: 5px;
}
.everDesignWrap > .everDesign .titleArea .dlgContextUI.everDesignControl .contextMenu > li .item .property {
  margin-left: 30px;
}
.everDesignWrap > .everDesign .titleArea .dlgContextUI.everDesignMore {
  top: 40px;
  right: 10px;
}
.everDesignWrap > .everDesign .titleArea .ulCombo {
  width: 222px;
  left: 0;
  top: 27px;
}
.everDesignWrap > .everDesign .titleArea .ulCombo li .status {
  float: right;
  color: var(--BorderGrey);
  font-size: var(--fs13);
}
.everDesignWrap > .everDesign .BgPopup {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
}
.everDesignWrap > .everDesign .settingArea {
  font-size: var(--fs14);
  overflow-y: auto;
  height: 100%;
}
.everDesignWrap > .everDesign .settingArea .settingWrap {
  padding: 15px 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup {
  padding: 0;
  margin-bottom: 20px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .title {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  padding: 0 5px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .title .txt {
  position: relative;
  padding: 0 10px;
  font-weight: bold;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .title .txt::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #333;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .radio label {
  color: var(--MainFontColor);
  font-size: var(--fs14);
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .radio > .icon {
  margin-right: 5px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem > .comboBox {
  width: 100%;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem #ctrlDefDate {
  width: 100%;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate {
  margin-top: 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate li {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate li > p {
  font-size: var(--fs14);
  width: 50px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate li > .nbControl {
  display: flex;
  align-items: center;
  font-size: var(--fs14);
  height: 15px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate li > .nbControl > .txtNumber {
  font-size: var(--fs14);
  width: 35px;
  text-align: center;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate li > .nbControl > .btnMinus,
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate li > .nbControl > .btnPlus {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  border: 1px solid var(--ControlBorderColor);
  cursor: pointer;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate li > .nbControl > .btnMinus:hover,
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem .layoutDate li > .nbControl > .btnPlus:hover {
  background-color: #f5f5f5;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem.horizon {
  flex-direction: row;
  margin-bottom: 0;
  margin-left: 20px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup .ulContent li .setItem.horizon .radio {
  margin-right: 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent {
  margin: 0 15px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li {
  display: block;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 2px 0;
  margin-bottom: 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem > .labelCaption {
  flex-shrink: 1;
  justify-content: flex-start;
  font-size: var(--fs14);
  color: var(--MainFontColor);
  text-align: left;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem .txtControlType {
  display: flex;
  align-items: center;
  width: 100%;
  height: 32px;
  padding: 0 10px;
  border-radius: 3px;
  background-color: #E3E7EB;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem input, .everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem textarea, .everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem select {
  width: 100%;
  height: 32px;
  padding: 0 10px;
  border-radius: 3px;
  border: 1px solid var(--ControlBorderColor);
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem input:focus, .everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem textarea:focus, .everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem select:focus {
  transform-origin: top left;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem input.txtValue, .everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem textarea.txtValue, .everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem select.txtValue {
  display: inline-block;
  padding-left: 5px;
  color: var(--MainFontColor);
  font-weight: bold;
  background-color: #E3E7EB;
  border: 0;
  padding: 0 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem .btnWordSeq {
  position: absolute;
  right: 6px;
  bottom: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  cursor: pointer;
  z-index: 1;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem .btnWordSeq:hover {
  background-color: #f5f5f5;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem .btnWordSeq > .iconEditWord {
  width: 15px;
  height: 14px;
  background-position: 0 -159px;
  opacity: 0.7;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem .btnWordSeq > .iconEditWord:hover, .everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem .btnWordSeq > .iconEditWord.selected {
  opacity: 1;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem .btnWordSeq:hover, .everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .setItem .btnWordSeq.selected {
  background-position: -24px -136px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea {
  position: absolute;
  top: 60px;
  width: 100%;
  height: 170px;
  z-index: 99;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch {
  width: 100%;
  background-color: var(--MainBgColor);
  border: 1px solid #ccc;
  box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.21);
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > ul {
  height: 136px;
  background-color: var(--MainBgColor);
  overflow: auto;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > ul > li {
  padding: 5px;
  color: var(--MainFontColor);
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > ul > li:hover {
  background-color: #f1f4f6;
  cursor: pointer;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > .dicController {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 34px;
  background-color: var(--BgColorGrey1);
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > .dicController > .btnWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > .dicController > .btnWrap > .iconPrev,
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > .dicController > .btnWrap > .iconNext {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > .dicController > .btnWrap > .iconPrev > span,
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > .dicController > .btnWrap > .iconNext > span {
  border-left: 6px solid #424242;
  border-right: 5px solid transparent;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  width: 5px;
  height: 5px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > .dicController > .btnWrap > .iconPrev > span {
  transform: rotate(180deg);
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicSearch > .dicController > .btnWrap > .txtPage {
  margin: 0 15px;
  font-weight: bold;
  color: var(--MainFontColor);
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicEdit {
  width: 100%;
  background-color: var(--MainBgColor);
  box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.21);
  padding-bottom: 10px;
  border: 1px solid var(--BgColorGrey2);
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicEdit > .divTitle {
  width: 100%;
  background-color: #434a4e;
  color: #fff;
  text-align: center;
  padding: 5px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicEdit .editWord {
  padding: 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicEdit .editWord > .txtTitle {
  font-size: var(--fs13);
  margin-bottom: 5px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicEdit .editWord > input {
  width: 100%;
  border: 1px solid var(--BgColorGrey2);
  padding: 3px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicEdit .btnWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicEdit .btnWrap > input {
  background-color: var(--ButtonBgColor);
  width: 80px;
  padding: 5px 10px;
  color: var(--ButtonFontColor);
  border: 0;
  cursor: pointer;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li .dictionaryArea > .dicEdit .btnWrap > input:hover {
  opacity: 0.5;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent > li.hasSub > .ulContent {
  margin-left: 23px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent .col2 {
  display: flex;
  gap: 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent .col2 > div {
  flex: 1;
  width: 50%;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup > .ulContent .col2 .check {
  width: 50%;
  justify-content: flex-start;
  margin-bottom: 10px;
}
.everDesignWrap > .everDesign .settingArea .settingWrap .settingGroup.active > .ulContent {
  display: block;
}
.everDesignWrap > .everDesign .settingArea .selectControl {
  display: none;
}
.everDesignWrap > .everDesign .settingArea > .ulContent .title {
  font-weight: normal;
}
.everDesignWrap > .everDesign .settingArea.active .title > .iconArrow {
  transform: rotate(0deg);
}
.everDesignWrap > .everDesign .settingArea.empty {
  display: flex;
  align-items: center;
  justify-content: center;
}
.everDesignWrap > .everDesign .settingArea.empty .selectControl {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.everDesignWrap > .everDesign .settingArea.empty .selectControl > i {
  height: 30px;
  margin-bottom: 20px;
}
.everDesignWrap > .everDesign .settingArea.empty .selectControl > p {
  text-align: center;
}
.everDesignWrap > .everDesign .settingArea.empty > .controlType {
  display: none;
}
.everDesignWrap > .everDesign .settingArea.empty + .btnArea {
  display: none;
}
.everDesignWrap > .everDesign .check {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-align: right;
  font-size: var(--fs14);
}
.everDesignWrap > .everDesign .check .icon {
  position: relative;
  width: 16px;
  height: 16px;
  margin-right: 10px;
  appearance: none;
  background-color: var(--ControlBgColor);
  border-radius: 3px;
  border: 1px solid var(--ControlBorderColor);
}
.everDesignWrap > .everDesign .check > input[type=checkbox] {
  margin-right: 5px;
}
.everDesignWrap > .everDesign .check.Checked .icon {
  background-color: var(--MainColor);
  border-color: var(--MainColor);
}
.everDesignWrap > .everDesign .check.Checked .icon::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  height: 0.333em;
  width: 0.6em;
  transform: rotate(-45deg);
}
.everDesignWrap > .everDesign .radio {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-align: right;
  font-size: var(--fs14);
}
.everDesignWrap > .everDesign .radio .icon {
  position: relative;
  width: 16px;
  height: 16px;
  margin-right: 10px;
  appearance: none;
  background-color: var(--ControlBgColor);
  border-radius: 50%;
  border: 1px solid var(--ControlBorderColor);
}
.everDesignWrap > .everDesign .radio.Checked .icon::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  background-color: var(--MainColor);
}
.everDesignWrap > .everDesign .btnArea {
  display: flex;
  justify-content: flex-start;
  width: 100%;
  padding: 10px;
  background-color: #dcdee3;
}
.everDesignWrap > .everDesign .btnArea .btn {
  display: flex;
  align-items: center;
  margin-right: auto;
}
.everDesignWrap > .everDesign .btnArea .btn > input[type=button] {
  padding: 7px 0;
  width: 105px;
  height: 31px;
  color: var(--ButtonFontColor);
  font-size: var(--fs14);
  background-color: var(--ButtonBgColor);
  border: 0;
  cursor: pointer;
}
.everDesignWrap > .everDesign .btnArea .btn > input[type=button]:hover {
  background-color: var(--ButtonDefaultColorActive);
}
.everDesignWrap > .everDesign .btnArea .check {
  display: inline-flex;
  margin-left: auto;
}
.everDesignWrap > .everDesign .btnArea .check > .icon {
  margin-right: 5px;
}
.everDesignWrap > .everDesign > .btnWrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: column;
  border-top: 1px solid #cfcfcf;
  background-color: #F5F7F9;
  padding: 15px;
}
.everDesignWrap > .everDesign > .btnWrap .check {
  margin-left: auto;
  margin-bottom: 10px;
}
.everDesignWrap > .everDesign > .btnWrap .check > .icon {
  margin-right: 5px;
}
.everDesignWrap > .everDesign > .btnWrap .btn {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}
.everDesignWrap > .everDesign > .btnWrap .btn .btnDefault, .everDesignWrap > .everDesign > .btnWrap .btn .btnLine {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 10px;
  min-width: 80px;
  height: 36px;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  border: 0;
  font-size: var(--fs15);
  padding: 0 10px;
  transition: all 0.3s;
}
.everDesignWrap > .everDesign > .btnWrap .btn .btnDefault.btnDefault, .everDesignWrap > .everDesign > .btnWrap .btn .btnLine.btnDefault {
  width: 110px;
  background-color: var(--MainColor);
  color: #fff;
  cursor: pointer;
}
.everDesignWrap > .everDesign > .btnWrap .btn .btnDefault.btnDefault:hover, .everDesignWrap > .everDesign > .btnWrap .btn .btnLine.btnDefault:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.everDesignWrap > .everDesign > .btnWrap .btn .btnDefault.btnDefault:active, .everDesignWrap > .everDesign > .btnWrap .btn .btnLine.btnDefault:active {
  background-color: var(--ButtonDefaultColorActive);
}
.everDesignWrap > .everDesign > .btnWrap .btn .btnDefault.btnLine, .everDesignWrap > .everDesign > .btnWrap .btn .btnLine.btnLine {
  border: 1px solid var(--BorderGreyLight);
  background-color: #fff;
  color: var(--MainColor);
}
.everDesignWrap > .everDesign > .btnWrap .btn .btnDefault.btnLine:hover, .everDesignWrap > .everDesign > .btnWrap .btn .btnLine.btnLine:hover {
  background-color: rgba(var(--MainColor), 0.1);
  border-color: rgba(var(--MainColor), 0.1);
  cursor: pointer;
}
.everDesignWrap > .everDesign > .btnWrap .btn .btnDefault.btnLine:active, .everDesignWrap > .everDesign > .btnWrap .btn .btnLine.btnLine:active {
  background-color: rgba(var(--MainColor), 0.15);
  border-color: rgba(var(--MainColor), 0.15);
  cursor: pointer;
}

.divManager {
  width: 100%;
  height: 100%;
  background-color: var(--PgmAreaBgColor);
  overflow-y: auto;
}
.divManager .item .titleArea {
  display: flex;
  align-items: center;
  width: 100%;
  height: 40px;
  padding: 0 0 0 15px;
}
.divManager .item .titleArea .txtTitle {
  padding-right: 20px;
  color: var(--MainFontColor);
  font-size: var(--fs15);
  font-weight: 700;
}
.divManager .item .titleArea .ulBtnArea {
  display: flex;
  align-items: center;
  margin-left: auto;
}
.divManager .item .titleArea .ulBtnArea > li {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  height: 30px;
  margin-right: 5px;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  background: linear-gradient(180deg, #fff, #F3F4F8);
  font-size: var(--fs13);
  color: var(--MainFontColor);
}
.divManager .item .titleArea .ulBtnArea > li:hover {
  background: #F1F3F6;
  border-color: #c9ccd0;
  cursor: pointer;
}
.divManager .item .titleArea .ulBtnArea > li > i {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 5px;
  background-image: url(../../Images/Toolbar/T_Query.svg);
  background-repeat: no-repeat;
}
.divManager .item .titleArea .ulBtnArea > li.Query > i {
  background-image: url(../../Images/Toolbar/T_Query.svg);
}
.divManager .item .titleArea .ulBtnArea > li.SaveAs > i {
  background-image: url(../../Images/Toolbar/T_SaveAs.svg);
}

.easyFlowWrap {
  width: 100%;
  height: 100%;
}
.easyFlowWrap header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 40px;
  background-color: var(--MainBgColor);
  border-bottom: 1px solid var(--EverViewGrey);
}
.easyFlowWrap header .titleArea {
  display: flex;
  align-items: center;
  color: var(--MainFontColor);
}
.easyFlowWrap header .titleArea > .logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: #0EB16D;
}
.easyFlowWrap header .titleArea > .logo > span {
  display: inline-block;
  width: 24px;
  height: 26px;
  background-position: 0 0;
}
.easyFlowWrap header .titleArea > .txtTitle {
  margin-left: 10px;
  font-size: var(--fs17);
}
.easyFlowWrap header .searchArea .programQueryArea {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  z-index: 9999;
}
.easyFlowWrap header .searchArea .programQueryArea .btnProgramQuery {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 30px;
  border-radius: 6px;
  cursor: pointer;
}
.easyFlowWrap header .searchArea .programQueryArea .btnProgramQuery:hover, .easyFlowWrap header .searchArea .programQueryArea .btnProgramQuery:focus {
  background-color: var(--CenterHeaderAreaBtnOn);
}
.easyFlowWrap .toolBarArea {
  display: flex;
  width: 100%;
  height: 37px;
  background-image: linear-gradient(to top, #f0f0f0, #ffffff), linear-gradient(#efefef, #efefef);
  border-bottom: solid 1px var(--EverViewGrey);
  padding: 0 10px;
}
.easyFlowWrap .toolBarArea .btn {
  display: inline-flex;
  align-items: center;
  height: 100%;
  padding: 5px 10px;
  font-size: var(--fs13);
  cursor: pointer;
}
.easyFlowWrap .toolBarArea .btn:hover {
  background-color: #ededed;
  cursor: pointer;
}
.easyFlowWrap .toolBarArea .btn:active, .easyFlowWrap .toolBarArea .btn:focus {
  background-color: #d1d1d1;
  cursor: pointer;
}
.easyFlowWrap .toolBarArea .btn > span {
  display: inline-block;
  width: 15px;
  height: 15px;
  background-position: 0 -36px;
  margin-right: 5px;
}
.easyFlowWrap .toolBarArea .btn.Dis {
  opacity: 0.3;
  pointer-events: none;
}
.easyFlowWrap .toolBarArea .btn.New > span {
  width: 15px;
  background-position: 0 -36px;
}
.easyFlowWrap .toolBarArea .btn.Refresh > span {
  width: 14px;
  background-position: 0 -60px;
}
.easyFlowWrap .toolBarArea .btn.Copy > span {
  width: 15px;
  background-position: 0 -83px;
}
.easyFlowWrap .toolBarArea .btn.Apply > span {
  width: 12px;
  height: 10px;
  background-position: 0 -107px;
}
.easyFlowWrap .toolBarArea .btn.ApplyReset > span {
  width: 14px;
  background-position: -20px -103px;
}
.easyFlowWrap .toolBarArea .btn.Save > span {
  width: 15px;
  background-position: 0 -126px;
}
.easyFlowWrap .toolBarArea .btn.Layout > span {
  width: 15px;
  background-position: 0 -149px;
}
.easyFlowWrap .toolBarArea .btn.Reset > span {
  width: 14px;
  background-position: 0 -172px;
}
.easyFlowWrap .toolBarArea .btn.Delete > span {
  width: 14px;
  background-position: 0 -407px;
}
.easyFlowWrap .toolBarArea > .ApplyArea {
  position: relative;
}
.easyFlowWrap .toolBarArea > .ApplyArea > p > span {
  width: 10px;
  height: 9px;
  background-position: 0 -107px;
}
.easyFlowWrap .toolBarArea > .ApplyArea > .ulApply {
  position: absolute;
  bottom: -1px;
  left: -1px;
  display: none;
  flex-direction: column;
  width: 190px;
  height: 74px;
  border: 1px solid var(--EverViewGrey);
  background-color: var(--MainBgColor);
  box-shadow: 1px 3px 3px rgba(0, 0, 0, 0.5);
  z-index: 1;
}
.easyFlowWrap .toolBarArea > .ApplyArea > .ulApply > li {
  height: 37px;
}
.easyFlowWrap .toolBarArea > .ApplyArea:hover > .ulApply {
  display: flex;
}
.easyFlowWrap .toolBarArea > .ApplyArea.Dis {
  opacity: 0.3;
  pointer-events: none;
}
.easyFlowWrap .toolBarArea > .ApplyArea.Dis:hover > .ulApply {
  display: none;
}
.easyFlowWrap .toolBarArea > .line {
  display: inline-flex;
  float: left;
  width: 2px;
  height: 100%;
  background-color: var(--EverViewGrey);
  border-right: 1px solid #fff;
  margin: 0 10px;
}
.easyFlowWrap .contentsArea {
  position: relative;
  width: 100%;
  height: calc(100% - 77px);
  background-color: var(--MainBgColor);
}
.easyFlowWrap .contentsArea .easyFlowParentContent {
  float: left;
  width: calc(100% - 350px);
  height: 100%;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent {
  width: 100%;
  height: 100%;
  padding: 10px 10px 0 10px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 40px;
  background-color: #4a4f5c;
  margin-bottom: 5px;
  z-index: 0;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar > ul {
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0 5px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar > ul > li {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px dashed #fff;
  background-color: #4a4f5c;
  color: #fff;
  font-size: var(--fs14);
  border-radius: 3px;
  min-width: 70px;
  height: 28px;
  margin-right: 5px;
  padding: 0 8px;
  cursor: pointer;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar > ul > li > i {
  width: 16px;
  height: 16px;
  margin-right: 6px;
  background-image: url(../../Images/Toolbar/T_Query.png);
  background-repeat: no-repeat;
  flex-shrink: 0;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar > ul > li.Query > i {
  background-image: url(../../Images/Toolbar/T_Query.png);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar > ul > li.Jump > i {
  background-image: url(../../Images/Toolbar/T_JumpFrm.png);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar > ul > li.Print > i {
  background-image: url(../../Images/Toolbar/T_Print.png);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar .btnAddToolbar {
  position: absolute;
  top: 6px;
  right: 5px;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 28px;
  border-radius: 5px;
  background-color: white;
  font-size: var(--fs14);
  cursor: pointer;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar .btnAddToolbar:hover {
  background-color: #edeff5;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .DevLayout {
  position: absolute;
  margin: 0px;
  padding: 0px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType {
  position: relative;
  height: calc(100% - 50px);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .MasterWrap {
  position: absolute;
  width: 100%;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Master {
  position: relative;
  width: 100%;
  height: calc(20% - 10px);
  border: 1px solid var(--BorderGrey);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  margin-bottom: 5px;
  padding: 0;
  overflow: auto;
  z-index: 0;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Master > .itemWrap {
  height: 100%;
  overflow: auto;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Sheet {
  width: 100%;
  height: 80%;
  border: 1px solid var(--BorderGrey);
  border-radius: 5px;
  background-color: var(--MainBgColor);
  overflow: hidden;
  z-index: 0;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Sheet .btnExpandArea {
  position: absolute;
  right: 30px;
  bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: #d7dee0;
  border-radius: 50%;
  cursor: pointer;
  z-index: 1;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Sheet .btnExpandArea > i {
  display: inline-block;
  width: 18px;
  height: 16px;
  background-position: 0 -381px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Sheet .btnExpandArea.Collapse > i {
  background-position: -28px -381px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType .Sheet .btnExpandArea:hover {
  background-color: #cacfd1;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType01 {
  display: block;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType02 {
  display: block;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType02 .Sheet01 {
  width: calc(50% - 5px);
  margin-right: 5px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType02 .Master02 {
  width: 50%;
  height: 50px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType03 .Master02 {
  width: 50%;
  height: 50px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType02 .Master02 > .itemWrap,
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType03 .Master02 > .itemWrap {
  white-space: nowrap;
  padding: 0 10px;
  margin-top: 10px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType02 .Sheet02 {
  width: 50%;
  height: 60%;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType03 {
  display: block;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType03 .Sheet01 {
  width: calc(50% - 5px);
  margin-right: 5px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType03 .Sheet02 {
  width: 50%;
  height: 30%;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType03 .Sheet03 {
  width: calc(50% - 5px);
  height: 30%;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType04 {
  display: block;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType04 > div {
  float: left;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType04 .Sheet01, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .EFType04 .Sheet02 {
  height: calc(40% - 5px);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .bgTxt {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 20px;
  opacity: 0.5;
  font-size: var(--fs14);
  z-index: -1;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .divToolbar .bgTxt {
  color: var(--InvertFontColor);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .controlContent .resizeName {
  padding-left: 28px;
  opacity: 0.7;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDuplicate {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -7px;
  right: 13px;
  width: 18px;
  height: 18px;
  background-color: var(--MainBgColor);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  cursor: pointer;
  z-index: 99;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDuplicate:focus {
  border: 1px solid #3f51b5;
  outline: 0;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDuplicate > i {
  width: 9px;
  height: 9px;
  background-position: -113px -350px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnResize {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 18px;
  height: 18px;
  background-position: -72px -343px;
  cursor: se-resize;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal {
  position: relative;
  display: inline-flex;
  margin-right: 15px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal {
  position: absolute;
  display: flex;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.5);
  font-size: var(--fs14);
  border-radius: 3px;
  border: 1px dashed #ccc;
  cursor: move;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl:hover, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal:hover {
  box-shadow: 3px 2px 6px 1px rgba(162, 162, 162, 0.55);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl:focus, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal:focus {
  box-shadow: 0px 0 0 1px var(--MainColor);
  border: 1px solid transparent;
  outline: 0;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeCodehelp .controlContent, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeCodehelp .controlContent {
  background-color: #e1f1fc;
  border-bottom: 1px solid #87c4ec;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeCodehelp .controlContent::before, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeCodehelp .controlContent::before {
  content: "";
  width: 16px;
  height: 16px;
  margin-left: 5px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeCodehelp .controlContent .resizeName, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeCodehelp .controlContent .resizeName {
  padding-left: 6px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeDate .controlContent, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeDate .controlContent {
  background-position: left center;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeOption .icon-radio, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeOption .icon-radio {
  position: relative;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-left: 5px;
  border: 1px solid #ccc;
  border-radius: 50%;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeOption .icon-radio::after, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeOption .icon-radio::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--MainColor);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeCheck .icon-check, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeCheck .icon-check {
  flex-shrink: 0;
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  margin-right: 5px;
  width: 17px;
  height: 17px;
  border-radius: 3px;
  border: 1px solid var(--MainColor);
  background-color: #fff;
  margin-left: 5px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeCheck .icon-check::after, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeCheck .icon-check::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  border-left: 2px solid var(--MainColor);
  border-bottom: 2px solid var(--MainColor);
  height: 4px;
  width: 8px;
  transform: rotate(-45deg);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeCombo .icon-selectbox, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeCombo .icon-selectbox {
  width: 6px;
  height: 7px;
  border-top: 6px solid #242424;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  margin: 0 3px 0 10px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeLabel .controlCaption, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeLabel .controlCaption {
  text-align: left;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeHidden, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeHidden {
  background-color: rgba(0, 0, 0, 0.1);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl.typeHidden .controlContent, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal.typeHidden .controlContent {
  opacity: 0.5;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .controlCaption, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal .controlCaption {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 70px;
  padding: 0 5px;
  word-break: break-all;
  line-height: 14px;
  overflow: hidden;
  text-align: right;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .controlCaption > p, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal .controlCaption > p {
  overflow: hidden;
  text-overflow: ellipsis;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .controlContent, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal .controlContent {
  border: 0;
  display: inline-flex;
  align-items: center;
  background-color: var(--MainBgColor);
  border-radius: 3px;
  border: 1px solid var(--BorderGrey) Light;
  border-bottom: 1px solid #aaa;
  overflow: hidden;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDelete, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal .btnDelete, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemToolbar .btnDelete {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -7px;
  right: -8px;
  width: 18px;
  height: 18px;
  background-color: var(--MainBgColor);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  cursor: pointer;
  z-index: 99;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDelete:hover, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal .btnDelete:hover, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemToolbar .btnDelete:hover {
  background-color: var(--BgColorGrey);
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDelete:focus, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal .btnDelete:focus, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemToolbar .btnDelete:focus {
  border: 1px solid var(--MainColor);
  outline: 0;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemControl .btnDelete > i, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemNormal .btnDelete > i, .easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContent .itemToolbar .btnDelete > i {
  width: 8px;
  height: 8px;
  background-position: -97px -350px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContentBg {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 20px 10px;
}
.easyFlowWrap .contentsArea .easyFlowParentContent .easyFlowContentBg > p {
  font-size: var(--fs21);
  font-weight: bold;
  color: rgba(51, 51, 51, 0.3);
}
.easyFlowWrap .contentsArea .rightArea {
  float: right;
  width: 350px;
  height: 100%;
}
.easyFlowWrap .contentsArea .rightArea .titleArea {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--MainBgColor);
}
.easyFlowWrap .contentsArea .rightArea .titleArea > ul > li {
  display: inline-flex;
  align-items: center;
  font-size: var(--fs14);
  height: 40px;
  margin-right: 10px;
  padding: 0 10px;
  cursor: pointer;
}
.easyFlowWrap .contentsArea .rightArea .titleArea > ul > li:hover {
  font-weight: bold;
}
.easyFlowWrap .contentsArea .rightArea .titleArea > ul > li.on {
  border-top: 4px solid var(--MainColor);
  background-color: var(--MainBgColor);
  color: var(--MainColor);
  font-weight: bold;
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl {
  position: relative;
  padding-right: 20px;
  padding-left: 10px;
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl.styleCheckToggle {
  color: var(--ButtonBgColor);
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl.styleCheckToggle .checkWrap {
  color: currentColor;
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl.styleCheckToggle .checkWrap > input[type=checkbox] + label {
  position: relative;
  display: flex;
  align-items: flex-start;
  flex-shrink: 1;
  font-size: 1em;
  line-height: 1.167em;
  word-break: break-word;
  white-space: normal;
  color: var(--MainFontColor);
  transition: color 0.2s;
  cursor: pointer;
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl.styleCheckToggle .checkWrap > input[type=checkbox] + label::before {
  content: "";
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  width: 2.5em;
  height: 1.333em;
  margin-right: 5px;
  border-radius: 20px;
  background-color: var(--styleCheckToggleBgColor);
  margin-top: -1px;
  transition: background-color 0.2s;
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl.styleCheckToggle .checkWrap > input[type=checkbox] + label::after {
  content: "";
  position: absolute;
  top: 0.2em;
  left: 0.333em;
  width: 0.833em;
  height: 0.833em;
  border-radius: 50%;
  background-color: #fff;
  transition: left 0.2s;
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl.styleCheckToggle.check .checkWrap > input[type=checkbox] + label {
  color: currentColor;
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl.styleCheckToggle.check .checkWrap > input[type=checkbox] + label::before {
  background-color: var(--ControlBgColorSelected);
}
.easyFlowWrap .contentsArea .rightArea .titleArea .layoutControl.styleCheckToggle.check .checkWrap > input[type=checkbox] + label::after {
  left: 1.3em;
}
.easyFlowWrap .contentsArea .rightArea .propertyArea {
  overflow: hidden;
  display: inline-block;
  width: 100%;
  height: calc(100% - 40px);
}
.easyFlowWrap .contentsArea .rightArea .propertyArea .divProperty {
  position: relative;
  width: 350px;
  height: 100%;
}
.easyFlowWrap .contentsArea .rightArea .propertyArea .divProperty .divForm {
  height: 100%;
}
.easyFlowWrap .contentsArea .rightArea .descriptionArea {
  position: absolute;
  bottom: 0;
  width: 350px;
  height: 100px;
  font-size: var(--fs14);
  padding: 3px;
  color: var(--MainFontColor);
}
.easyFlowWrap .contentsArea .rightArea .descriptionArea .divDescription {
  background-color: var(--MainBgColor);
  border: 1px solid #bebebe;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  padding: 5px;
  overflow: auto;
}
.easyFlowWrap .contentsArea .rightHelpArea {
  position: absolute;
  top: 0;
  right: 350px;
  display: flex;
  flex-direction: column;
  width: 320px;
  height: 100%;
  background-color: var(--BgColorGrey);
  box-shadow: -3px 3px 6px rgba(0, 0, 0, 0.1);
  opacity: 1;
  transition: width, opacity linear 0.3s;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle {
  position: relative;
  display: flex;
  width: 100%;
  padding: 20px 16px;
  border-bottom: 1px solid var(--BorderGrey);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .helpIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  margin-right: 8px;
  border-radius: 4px;
  background-color: var(--MainColor);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .helpIcon.iconControl > i {
  width: 24px;
  height: 13px;
  background-position: -40px 0;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .helpIcon.iconToolbar > i {
  width: 28px;
  height: 5px;
  background-position: -40px -22px;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .helpIcon.iconSheet > i {
  width: 24px;
  height: 15px;
  background-position: -40px -35px;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .helpIcon.iconScreen > i {
  width: 18px;
  height: 13px;
  background-position: -40px -59px;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .titleBox {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .titleBox > .title {
  color: var(--MainColor);
  font-weight: bold;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle > .titleBox > .titleInfo {
  color: var(--MainFontColorLighter);
  font-size: var(--fs13);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle .btnHelpClose {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle .btnHelpClose:before {
  content: "";
  position: absolute;
  width: 1px;
  height: 15px;
  background-color: var(--MainFontColor);
  transform: rotate(45deg);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle .btnHelpClose:after {
  content: "";
  position: absolute;
  width: 15px;
  height: 1px;
  background-color: var(--MainFontColor);
  transform: rotate(45deg);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle .btnHelpClose:hover {
  cursor: pointer;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpTitle .btnHelpClose:hover:before, .easyFlowWrap .contentsArea .rightHelpArea > .helpTitle .btnHelpClose:hover:after {
  background-color: var(--MainColor);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents::-webkit-scrollbar-track {
  background-color: transparent;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents::-webkit-scrollbar-track:hover {
  background-color: rgba(0, 0, 0, 0.05);
  box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.15);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.25);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents::-webkit-scrollbar-thumb:active {
  background-color: rgba(0, 0, 0, 0.4);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents::-webkit-scrollbar-corner {
  background-color: transparent;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  background-color: transparent;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents {
  scrollbar-face-color: transparent;
  scrollbar-track-color: transparent;
  scrollbar-3dlight-color: transparent;
  scrollbar-highlight-color: transparent;
  scrollbar-darkshadow-color: transparent;
  scrollbar-shadow-color: transparent;
  scrollbar-arrow-color: transparent;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap {
  padding: 10px 20px;
  font-size: var(--fs13);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap > dt {
  position: relative;
  color: var(--MainFontColor);
  font-weight: bold;
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap > dt:before {
  content: "";
  position: absolute;
  top: 7px;
  left: -8px;
  width: 3px;
  height: 3px;
  background-color: rgba(var(--MainFontColor-rgb), 0.5);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap > dd {
  color: var(--MainFontColor);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap > dd > .subInfo {
  color: rgba(var(--MainFontColor-rgb), 0.5);
  font-size: var(--fs11);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap.active {
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap.active > dt {
  color: var(--MainColor);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap.active > dt:before {
  background-color: var(--MainColor);
}
.easyFlowWrap .contentsArea .rightHelpArea > .helpContents > .propertyWrap.active > dd {
  color: var(--MainColor);
}
.easyFlowWrap .contentsArea .rightHelpArea.hide {
  width: 0;
  height: 0;
  opacity: 0;
  overflow: hidden;
  transition: width, opacity linear 0.3s;
}
.easyFlowWrap .gc-no-user-select {
  position: unset;
  position: initial;
}

.msgWrap.EverView .msgBox .btnClose {
  position: absolute;
  top: 20px;
  right: 25px;
  width: 20px;
  height: 20px;
  background-position: -25px -350px;
  background-color: var(--MainBgColor);
  cursor: pointer;
}
.msgWrap.EverView .msgBox .btnClose:hover {
  opacity: 0.7;
}
.msgWrap.EverView .msgBox.new {
  width: 350px;
}
.msgWrap.EverView .msgBox.new .msgContent ul.pgmInfo > li {
  width: 100%;
  margin-bottom: 15px;
}
.msgWrap.EverView .msgBox.new .msgContent ul.pgmInfo > li label {
  display: block;
  margin-bottom: 5px;
  font-size: var(--fs13);
  font-weight: bold;
}
.msgWrap.EverView .msgBox.new .msgContent ul.pgmInfo > li > p.txtInfo {
  padding-top: 6px;
  font-size: var(--fs13);
  color: var(--MainColor);
}
.msgWrap.EverView .msgBox.typeSelect {
  width: auto;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout {
  position: relative;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  margin: 0;
  border-radius: 50%;
  background-color: #7f8490;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected:hover {
  background-color: #7f8490;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected > span {
  display: inline-block;
  width: 15px;
  height: 12px;
  background-position: 0 -350px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected.EFTypeDlgStatus1 {
  top: -9px;
  left: 255px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected.EFTypeDlgStatus2 {
  top: -9px;
  left: 665px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected.EFTypeDlgStatus2-2 {
  top: -9px;
  left: 465px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected.EFTypeDlgStatus3 {
  top: 205px;
  left: 360px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected.EFTypeDlgStatus3-2 {
  top: 205px;
  left: 155px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected.EFTypeDlgStatus4 {
  top: 205px;
  left: 565px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .iconSelected.EFTypeDlgStatus4-2 {
  top: 205px;
  left: 765px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .line {
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .line:last-child {
  margin-bottom: 0;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type {
  display: flex;
  align-items: center;
  flex-direction: column;
  float: left;
  width: 175px;
  margin: 0 30px 0 0;
  cursor: pointer;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type:last-child, .msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type:nth-child(4) {
  margin-right: 0;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type:nth-child(n+5) {
  margin-bottom: 0;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type > .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  background-color: #e9e9e9;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type > .icon:hover {
  background-color: #4a4f5c;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type > .icon > i {
  display: inline-block;
  width: 154px;
  height: 145px;
  background-position: 0 -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout01 > .icon > i {
  background-position: 0 -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout02 > .icon > i {
  background-position: -163px -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout02-2 > .icon > i {
  background-position: -326px -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout03 > .icon > i {
  background-position: -489px -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout03-2 > .icon > i {
  background-position: -652px -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout04 > .icon > i {
  background-position: -815px -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout04-2 > .icon > i {
  background-position: -978px -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout04-3 > .icon > i {
  background-position: -1141px -193px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type .info {
  display: inline-block;
  margin-top: 10px;
  font-size: var(--fs11);
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type .info .txtSend {
  flex-shrink: 0;
  color: var(--MainColor);
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type .info .txtRecieve {
  text-align: left;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type .info .iconMultiArrow {
  display: inline-block;
  flex-shrink: 0;
  width: 16px;
  height: 7px;
  margin: 0 5px;
  background-position: 0 -430px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type .info .iconMultiArrow2 {
  display: inline-block;
  flex-shrink: 0;
  width: 16px;
  height: 7px;
  margin: 0 5px;
  background-position: -26px -430px;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout03-2 .info {
  width: 107%;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type.layout04 .info {
  flex-wrap: wrap;
  justify-content: center;
}
.msgWrap.EverView .msgBox.typeSelect .msgContent .layout .type .info .txtRecieve.noShrink {
  flex-shrink: 0;
}
.msgWrap.EverView .msgBox.layoutTypeSelect {
  width: auto;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgTitle {
  padding: 20px 15px;
  border-bottom: 1px solid var(--BorderGrey);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent {
  display: flex;
  padding: 0;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  width: 645px;
  padding: 20px 30px 0;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 174px;
  margin: 0 30px 20px 0;
  padding: 10px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type:nth-child(3n) {
  margin-right: 0;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .title {
  color: var(--MainFontColorLighter);
  font-size: var(--fs11);
  margin-bottom: 5px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .icon > i {
  display: block;
  width: 154px;
  height: 145px;
  background-position: 0 -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.layout01 > .icon > i {
  background-position: 0 -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.layout02 > .icon > i {
  background-position: -163px -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.layout02-2 > .icon > i {
  background-position: -326px -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.layout03 > .icon > i {
  background-position: -489px -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.layout03-2 > .icon > i {
  background-position: -652px -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.layout04 > .icon > i {
  background-position: -815px -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.layout04-2 > .icon > i {
  background-position: -978px -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.layout04-3 > .icon > i {
  background-position: -1141px -193px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .btnArea {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
  font-size: var(--fs11);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .btnArea > .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  height: 30px;
  border-radius: 5px;
  background-color: var(--MainBgColor);
  font-size: var(--fs11);
  opacity: 0.2;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .btnArea > .btn:hover {
  cursor: pointer;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .btnArea > .btn.btnInfo {
  margin-right: 3px;
  border: 1px solid var(--MainColor);
  color: var(--MainColor);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .btnArea > .btn.btnInfo:hover {
  border-color: var(-- ButtonDefaultColorActive);
  color: var(-- ButtonDefaultColorActive);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .btnArea > .btn.btnApply {
  margin-left: 3px;
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .btnArea > .btn.btnApply:hover {
  background-color: var(-- ButtonDefaultColorActive);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type > .btnArea > .txtSelected {
  display: none;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type:hover {
  background-color: var(--BgColorGrey);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type:hover > .btnArea > .btn {
  opacity: 1;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.Selected {
  border: 1px solid var(--MainColor);
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.1);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.Selected:before {
  content: "";
  position: absolute;
  top: 5px;
  right: 5px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--MainColor);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.Selected:after {
  content: "";
  position: absolute;
  top: 8px;
  right: 11px;
  width: 5px;
  height: 9px;
  border-bottom: 2px solid var(--InvertFontColor);
  border-right: 2px solid var(--InvertFontColor);
  transform: rotate(45deg);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.Selected > .btnArea > .btnApply {
  display: none;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.Selected > .btnArea > .txtSelected {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  height: 30px;
  margin-left: 3px;
  color: var(--MainColor);
  font-size: var(--fs11);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .layout .type.helpDetail > .title {
  color: var(--MainFontColor);
  font-weight: bold;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp {
  align-self: stretch;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea {
  display: none;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected {
  display: flex;
  flex-direction: column;
  width: 260px;
  height: 100%;
  padding: 15px 20px;
  background-color: var(--BgColorGrey);
  color: var(--MainFontColor);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeTitle {
  width: 100%;
  flex-shrink: 0;
  margin-bottom: 30px;
  font-size: var(--fs15);
  font-weight: bold;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeContent {
  width: 100%;
  height: 100%;
  padding-left: 15px;
  overflow: auto;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeContent > li {
  font-size: var(--fs13);
  list-style: decimal;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeContent > li + li {
  margin-top: 20px;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeContent > li > span {
  display: inline-block;
  margin: 1px 2px;
  padding: 2px 5px;
  border-radius: 2px;
  background: var(--MainBgColor);
  color: var(--MainFontColorLighter);
  font-size: var(--fs11);
  border-width: 1px;
  border-color: var(--BorderGreyDark);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeContent > li > span.boxSolid {
  border-style: solid;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeContent > li > span.boxDash {
  border-style: dashed;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeContent > li > span.color1 {
  border-color: #EC008C;
  color: #EC008C;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .typeContent > li > span.color2 {
  border-color: #007EEC;
  color: #007EEC;
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .txtInfo {
  font-size: var(--fs13);
}
.msgWrap.EverView .msgBox.layoutTypeSelect .msgContent .rightHelp > .helpArea.Selected > .txtInfo > i {
  display: inline-block;
  margin: 1px 2px 1px 0;
  padding: 1px 5px;
  border: 1px solid var(--MainColor);
  border-radius: 2px;
  background: var(--MainBgColor);
  color: var(--MainColor);
  font-size: var(--fs11);
  font-style: normal;
}
.msgWrap.EverView .msgBox.SQL {
  width: auto;
}
.msgWrap.EverView .msgBox.SQL .msgContent.SQL {
  width: auto;
  height: auto;
}
.msgWrap.EverView .msgBox.SQL .msgContent .divSQLView > textarea {
  min-width: 700px;
  min-height: 400px;
  max-width: 1000px;
  max-height: 700px;
  padding: 10px;
  background-color: var(--InvertBgColor);
  color: var(--InvertFontColor);
  font-size: var(--fs13);
}

.CodeHelpSheet.popupEF {
  z-index: 1000;
}
.CodeHelpSheet.popupEF .popupCodehelp .searchCodehelpArea .searchBox {
  width: 100%;
  border: 2px solid var(--MainColor);
}
.CodeHelpSheet.popupEF .popupCodehelp .searchCodehelpArea .searchBox .searchBtnWrap .btn.Query {
  border: 0;
}
.CodeHelpSheet.popupEF .popupCodehelp .queryListArea .everViewCodeHelp {
  width: 870px;
  height: 370px;
  position: absolute;
}
.CodeHelpSheet.popupEF .popupCodehelp .queryListArea .everViewCodeHelp .groupBoxSheet {
  width: 870px;
  height: 370px;
}

.SSItem {
  display: inline-block;
  width: auto !important;
  color: #333 !important;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  text-align: center;
  margin: 0px -1px 4px 0px;
  cursor: move;
  z-index: 9999999;
}
.SSItem .divTitle {
  height: 56px;
  padding: 7px 15px;
  background-color: #edeff5;
  border-radius: 3px 3px 0 0;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #333;
}
.SSItem .divTitle .label {
  height: 18px;
  font-size: var(--fs15);
  color: #333;
  margin-bottom: 7px;
  cursor: text;
}
.SSItem .divTitle input.label {
  border-radius: 3px;
  padding: 3px 5px;
  background-color: #fff;
  border: 1px solid #d6d6d6;
  margin-bottom: 0;
  font-size: var(--fs14);
}
.SSItem .divTitle .fieldName {
  font-size: var(--fs13);
  color: rgba(51, 51, 51, 0.5);
}
.SSItem .itemInfo {
  color: #333;
  font-size: var(--fs14);
  width: 100%;
  display: flex;
  justify-content: center;
}
.SSItem .itemInfo > ul {
  color: #333;
  font-size: var(--fs14);
  text-align: left;
  padding: 10px 10px 5px 10px;
  cursor: pointer;
}
.SSItem .itemInfo > ul > li {
  margin-bottom: 7px;
}
.SSItem .itemInfo > ul > li > input[type=checkbox] {
  margin-right: 3px;
}
.SSItem.On > .divTitle {
  background-color: #e5e7ff;
}

.SSItemMove {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3px;
  background-color: #fff;
  border: 1px dashed #838383;
  border-radius: 3px;
  font-size: var(--fs15);
  opacity: 0.7;
  height: 40px !important;
  cursor: move;
  z-index: 100000000000000020000 !important;
}

.secMyDefaultValue .myDefaultValueWrap {
  width: 100%;
  height: 100%;
  padding: 0 8px 4px 0;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  border: 1px solid #929292;
  box-shadow: -5px 0px 10px 0px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue.show {
  right: 0;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue.hide {
  right: -300px;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 43px;
  padding: 0 12px;
  border-bottom: 1px solid #E3E7EB;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue > header .title {
  display: flex;
  align-items: center;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue > header .title > i {
  margin-right: 8px;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue > header .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue > header .title .iconHelp {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-left: 5px;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue > header .title .iconHelp:hover ~ .helpBox {
  display: flex;
  z-index: 1;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue > header .txtDescription {
  font-size: var(--fs14);
  color: var(--MainFontColorLighter);
  margin-bottom: 15px;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-left: auto;
  cursor: pointer;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: auto;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap .title {
  display: flex;
  align-items: center;
  padding: 12px 10px 12px 15px;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap .title .txtTitle {
  font-weight: bold;
  font-size: var(--fs13);
  color: var(--MainFontColor);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap .title .btnDeleteAll {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 4px;
  margin-left: auto;
  cursor: pointer;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap .title .btnDeleteAll:hover {
  background-color: #f5f5f5;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap .noSelected {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  font-size: var(--fs13);
  border-top: 1px solid #ddd;
  color: var(--MainFontColor);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap .noSelected > i {
  height: 35px;
  margin-bottom: 20px;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap .noSelected > span.subTxt {
  opacity: 0.5;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li {
  border-bottom: 1px solid #ddd;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li:first-child {
  border-top: 1px solid #ddd;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item {
  display: inline-flex;
  align-items: center;
  width: 100%;
  min-height: 37px;
  padding: 0 15px;
  font-size: var(--fs13);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .btnDelete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: var(--MainFontColor);
  margin-right: 5px;
  cursor: pointer;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .btnDelete > i {
  width: 6px;
  height: 2px;
  background-color: #fff;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .caption {
  display: inline-block;
  max-width: 40%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--MainFontColorLighter);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .value {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  max-width: 60%;
  padding: 5px 0;
  margin-left: auto;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .value > i {
  flex-shrink: 0;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .value > i.chkbox {
  position: relative;
  display: inline-block;
  width: 17px;
  height: 17px;
  border-radius: 3px;
  background-color: var(--ControlBgColorDis);
  border: 1px solid var(--ControlBorderColorDis);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .value > i.chkbox.checked {
  border: 1px solid var(--ControlBorderColorDis);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .value > i.chkbox.checked::after {
  content: "";
  position: absolute;
  top: 0px;
  left: 4px;
  width: 5px;
  height: 8px;
  border-right: 2px solid #999999;
  border-bottom: 2px solid #999999;
  transform: rotate(45deg);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .value > i.optionChecked {
  position: relative;
  display: inline-block;
  margin-right: 5px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: var(--MainBgColor);
  border: 1px solid var(--ControlBorderColorDis);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .value > i.optionChecked:before {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #999;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .value .txt {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--MainFontColor);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item .btnDateSetting {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 26px;
  padding: 0 7px;
  margin-right: -10px;
  font-size: var(--fs13);
  cursor: pointer;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item.multiCodehelp {
  padding-right: 0;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item.multiCodehelp .value {
  max-height: 70px;
  display: block;
  overflow: auto;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item.multiCodehelp .value .txt {
  display: block;
  height: 100%;
  overflow: hidden;
  padding-right: 15px;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .listWrap ul li .item.multiCodehelp .value .txt .txtCode {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .btnWrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-top: 1px solid var(--BorderGreyLight);
  background-color: #F5F7F9;
  padding: 15px;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .btnWrap button {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 10px;
  min-width: 80px;
  height: 36px;
  border-radius: 5px;
  background-color: var(--MainColor);
  color: #fff;
  border: 0;
  font-size: var(--fs15);
  padding: 0 15px;
  transition: all 0.3s;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .btnWrap button.btnDefault {
  background-color: var(--MainColor);
  color: #fff;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .btnWrap button.btnDefault:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .btnWrap button.btnDefault:active {
  background-color: var(--ButtonDefaultColorActive);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .btnWrap button.btnLine {
  border: 1px solid var(--BorderGreyLight);
  background-color: #fff;
  color: var(--MainColor);
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .btnWrap button.btnLine:hover {
  background-color: rgba(var(--MainColor-rgb), 0.1);
  border-color: rgba(var(--MainColor-rgb), 0.1);
  cursor: pointer;
}
.secMyDefaultValue .myDefaultValueWrap > .myDefaultValue .btnWrap button.btnLine:active {
  background-color: rgba(var(--MainColor-rgb), 0.15);
  border-color: rgba(var(--MainColor-rgb), 0.15);
  cursor: pointer;
}

.CenterArea .CenterHeaderArea.FixedFav ~ .myDefaultValueWrap .myDefaultValue {
  top: 80px;
  height: calc(100% - 80px);
}

.helpBox {
  display: none;
  position: absolute;
  max-width: 300px;
  background-color: rgba(var(--MainFontColor-rgb), 0.9);
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  padding: 10px;
  border-radius: 5px;
  animation: fade-in 0.5s forwards;
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.helpBox.dv {
  top: 40px;
  left: 10px;
}
.helpBox.today {
  top: 30px;
  left: 0px;
}
.helpBox.lastday {
  top: 30px;
  left: 0px;
}
.helpBox.thisYear {
  top: 30px;
  left: 0;
}
.helpBox.thisMonth {
  top: 30px;
  left: 0;
}
.helpBox.thisDay {
  top: 30px;
  left: 0px;
}

.msgWrap.myDefaultValueDateWrap {
  position: fixed;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate {
  width: 330px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgTitle .controlCap {
  font-size: var(--fs13);
  font-weight: normal;
  color: var(--MainFontColorLighter);
  margin-left: 8px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent {
  padding: 0;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem {
  padding: 20px 15px;
  border-top: 1px solid var(--BorderGreyLight);
  font-size: var(--fs13);
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem.noset .toggleCheck {
  display: flex;
  align-items: center;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem.noset .toggleCheck input[type=checkbox] + label {
  position: relative;
  display: flex;
  align-items: center;
  color: var(--MainFontColor);
  transition: color 0.2s;
  cursor: pointer;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem.noset .toggleCheck input[type=checkbox] + label::before {
  content: "";
  width: 2.5em;
  height: 1.333em;
  border-radius: 20px;
  background-color: var(--styleCheckToggleBgColor);
  border: 0;
  margin-right: 5px;
  transition: background-color 0.2s;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem.noset .toggleCheck input[type=checkbox] + label::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.4156em);
  left: 0.333em;
  width: 0.833em;
  height: 0.833em;
  border-radius: 50%;
  background-color: #fff;
  transition: left 0.2s;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem.noset .toggleCheck input[type=checkbox]:checked + label {
  color: var(--MainColor);
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem.noset .toggleCheck input[type=checkbox]:checked + label::before {
  background-color: var(--MainColor);
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem.noset .toggleCheck input[type=checkbox]:checked + label::after {
  left: 1.3em;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem:first-child {
  border: 0;
  padding-top: 0;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem:last-child {
  border-bottom: 0;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .txtTitle {
  font-size: var(--fs13);
  font-weight: bold;
  margin-bottom: 10px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .selectSet {
  display: inline-flex;
  border-radius: 5px;
  border: 1px solid #ddd;
  height: 30px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .selectSet input[type=radio] + label {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0 10px;
  border-right: 1px solid #ddd;
  color: var(--MainFontColorLighter);
  cursor: pointer;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .selectSet input[type=radio] + label:hover {
  color: var(--MainFontColor);
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .selectSet input[type=radio] + label:last-child {
  border-right: 0;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .selectSet input[type=radio]:checked + label {
  color: var(--MainColor);
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .selectSet input[type=radio]:disabled + label {
  opacity: 0.5;
  cursor: default;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .selectSet input[type=radio]:disabled + label:hover {
  color: var(--MainFontColorLighter);
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .calDateWrap {
  position: relative;
  height: 26px;
  margin-top: 15px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .calDateWrap .txtHelp {
  text-decoration: underline;
  cursor: help;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .calDateWrap .txtHelp:hover ~ .helpBox {
  display: flex;
  z-index: 1;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .calDateWrap select {
  width: 70px;
  height: 26px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  font-size: var(--fs13);
  border-radius: 3px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .calDateWrap input[type=number] {
  width: 40px;
  height: 26px;
  min-height: 26px;
  padding: 0;
  margin: 0 5px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  border-radius: 3px;
  text-align: center;
  font-size: var(--fs14);
  -moz-appearance: textfield;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .calDateWrap .selectBA {
  display: inline-flex;
  margin-left: 5px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .calDateWrap .selectBA input[type=radio] + label {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  border-radius: 50px;
  padding: 0 10px;
  color: var(--MainFontColorLighter);
  cursor: pointer;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .calDateWrap .selectBA input[type=radio]:checked + label {
  color: var(--MainColor);
  background-color: rgba(var(--MainColor-rgb), 0.1);
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .directWrap {
  position: relative;
  display: flex;
  align-items: center;
  height: 26px;
  margin-top: 15px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .directWrap select {
  width: 80px;
  height: 26px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  font-size: var(--fs13);
  border-radius: 3px;
  padding: 0 5px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .directWrap input[type=number] {
  width: 60px;
  height: 26px;
  min-height: 26px;
  border: 1px solid var(--ControlBorderColor);
  background-color: var(--ControlBgColor);
  color: var(--MainFontColor);
  border-radius: 3px;
  text-align: center;
  font-size: var(--fs14);
  -moz-appearance: textfield;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .directWrap .iconHelp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-left: 10px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .directWrap .iconHelp:hover ~ .helpBox {
  display: flex;
  z-index: 1;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .thisDateWrap {
  position: relative;
  display: flex;
  align-items: center;
  height: 26px;
  margin-top: 15px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .thisDateWrap > input {
  width: 60px;
  height: 26px;
  min-height: 26px;
  background-color: #F1F4F6;
  border: 0;
  font-size: var(--fs13);
  padding: 10px;
  text-align: center;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .thisDateWrap .iconHelp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-left: 10px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .thisDateWrap .iconHelp:hover ~ .helpBox {
  display: flex;
  z-index: 1;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .nullWrap {
  position: relative;
  display: flex;
  align-items: center;
  height: 26px;
  margin-top: 15px;
}
.msgWrap.myDefaultValueDateWrap .msgBox.myDefaultValueDate .msgContent .setItem .nullWrap > input {
  width: 60px;
  height: 26px;
  min-height: 26px;
  background-color: #F1F4F6;
  border: 0;
  font-size: var(--fs13);
  padding: 10px;
  text-align: center;
}

.programArea.selectMode .toolbarArea .ulToolbar > li, .programArea.selectModeSubForm .toolbarArea .ulToolbar > li {
  opacity: 0.5;
  cursor: default;
}
.programArea.selectMode .toolbarArea .btnMore, .programArea.selectModeSubForm .toolbarArea .btnMore {
  opacity: 0.5;
  cursor: default;
}
.programArea.selectMode .pgmTopArea .pgmTop .pgmTitleWrap .pgmTools > button, .programArea.selectModeSubForm .pgmTopArea .pgmTop .pgmTitleWrap .pgmTools > button {
  opacity: 0.5;
  cursor: default;
}
.programArea.selectMode .layoutControl, .programArea.selectModeSubForm .layoutControl {
  cursor: pointer;
}
.programArea.selectMode .layoutControl .labelCaption, .programArea.selectModeSubForm .layoutControl .labelCaption {
  cursor: pointer;
}
.programArea.selectMode .layoutControl:hover::before, .programArea.selectModeSubForm .layoutControl:hover::before {
  content: "";
  position: absolute;
  top: 0;
  width: 100%;
  height: calc(100% - 2px);
  border: 1px solid var(--MainColor);
  border-radius: 3px;
  z-index: 0;
}
.programArea.selectMode .layoutControl.selectedControl:before, .programArea.selectModeSubForm .layoutControl.selectedControl:before {
  content: "";
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  border: 1px solid var(--MainColor);
  background-color: rgba(var(--MainColor-rgb), 0.3);
  z-index: 0;
}
.programArea.selectMode .layoutControl.DateBox > input, .programArea.selectModeSubForm .layoutControl.DateBox > input {
  background-position: right 3px center;
}
.programArea.selectMode .layoutControl.DateBox.Value > input, .programArea.selectModeSubForm .layoutControl.DateBox.Value > input {
  background-image: none;
}
.programArea.selectMode .layoutControl[kui-button] > button:hover, .programArea.selectMode .layoutControl[kui-button] > button:focus, .programArea.selectModeSubForm .layoutControl[kui-button] > button:hover, .programArea.selectModeSubForm .layoutControl[kui-button] > button:focus {
  box-shadow: none;
}
.programArea.selectMode .layoutControl[kui-checkbox] .selectArea, .programArea.selectMode .layoutControl[kui-optionlist] .selectArea, .programArea.selectModeSubForm .layoutControl[kui-checkbox] .selectArea, .programArea.selectModeSubForm .layoutControl[kui-optionlist] .selectArea {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-color: transparent;
}
.programArea.selectMode .layoutControl.Dis, .programArea.selectModeSubForm .layoutControl.Dis {
  cursor: default !important;
}
.programArea.selectMode .layoutControl.Dis:hover:before, .programArea.selectModeSubForm .layoutControl.Dis:hover:before {
  display: none;
}
.programArea.selectMode .layoutControl.Dis::after, .programArea.selectModeSubForm .layoutControl.Dis::after {
  content: "";
  position: absolute;
  top: 2px;
  right: 0;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  background: rgba(var(--MainBgColor-rgb), 0.7);
  z-index: 9;
}
.programArea.selectMode div[kui-sheet], .programArea.selectMode div[kui-tree] > .tree, .programArea.selectMode div[kui-fileupload], .programArea.selectMode div[kui-html], .programArea.selectMode div[kui-image], .programArea.selectMode div[kui-button], .programArea.selectMode div[kui-label], .programArea.selectMode div[kui-password], .programArea.selectMode div[kui-chart], .programArea.selectMode div[kui-scheduler], .programArea.selectMode div[kui-pmonth], .programArea.selectMode div[kui-piday], .programArea.selectMode div[kui-pday] > .monthSelect, .programArea.selectMode div.layoutControl.DateControlType, .programArea.selectMode div.layoutControl.Password, .programArea.selectModeSubForm div[kui-sheet], .programArea.selectModeSubForm div[kui-tree] > .tree, .programArea.selectModeSubForm div[kui-fileupload], .programArea.selectModeSubForm div[kui-html], .programArea.selectModeSubForm div[kui-image], .programArea.selectModeSubForm div[kui-button], .programArea.selectModeSubForm div[kui-label], .programArea.selectModeSubForm div[kui-password], .programArea.selectModeSubForm div[kui-chart], .programArea.selectModeSubForm div[kui-scheduler], .programArea.selectModeSubForm div[kui-pmonth], .programArea.selectModeSubForm div[kui-piday], .programArea.selectModeSubForm div[kui-pday] > .monthSelect, .programArea.selectModeSubForm div.layoutControl.DateControlType, .programArea.selectModeSubForm div.layoutControl.Password {
  cursor: default !important;
}
.programArea.selectMode div[kui-sheet]:hover:before, .programArea.selectMode div[kui-tree] > .tree:hover:before, .programArea.selectMode div[kui-fileupload]:hover:before, .programArea.selectMode div[kui-html]:hover:before, .programArea.selectMode div[kui-image]:hover:before, .programArea.selectMode div[kui-button]:hover:before, .programArea.selectMode div[kui-label]:hover:before, .programArea.selectMode div[kui-password]:hover:before, .programArea.selectMode div[kui-chart]:hover:before, .programArea.selectMode div[kui-scheduler]:hover:before, .programArea.selectMode div[kui-pmonth]:hover:before, .programArea.selectMode div[kui-piday]:hover:before, .programArea.selectMode div[kui-pday] > .monthSelect:hover:before, .programArea.selectMode div.layoutControl.DateControlType:hover:before, .programArea.selectMode div.layoutControl.Password:hover:before, .programArea.selectModeSubForm div[kui-sheet]:hover:before, .programArea.selectModeSubForm div[kui-tree] > .tree:hover:before, .programArea.selectModeSubForm div[kui-fileupload]:hover:before, .programArea.selectModeSubForm div[kui-html]:hover:before, .programArea.selectModeSubForm div[kui-image]:hover:before, .programArea.selectModeSubForm div[kui-button]:hover:before, .programArea.selectModeSubForm div[kui-label]:hover:before, .programArea.selectModeSubForm div[kui-password]:hover:before, .programArea.selectModeSubForm div[kui-chart]:hover:before, .programArea.selectModeSubForm div[kui-scheduler]:hover:before, .programArea.selectModeSubForm div[kui-pmonth]:hover:before, .programArea.selectModeSubForm div[kui-piday]:hover:before, .programArea.selectModeSubForm div[kui-pday] > .monthSelect:hover:before, .programArea.selectModeSubForm div.layoutControl.DateControlType:hover:before, .programArea.selectModeSubForm div.layoutControl.Password:hover:before {
  display: none;
}
.programArea.selectMode div[kui-sheet]::after, .programArea.selectMode div[kui-tree] > .tree::after, .programArea.selectMode div[kui-fileupload]::after, .programArea.selectMode div[kui-html]::after, .programArea.selectMode div[kui-image]::after, .programArea.selectMode div[kui-button]::after, .programArea.selectMode div[kui-label]::after, .programArea.selectMode div[kui-password]::after, .programArea.selectMode div[kui-chart]::after, .programArea.selectMode div[kui-scheduler]::after, .programArea.selectMode div[kui-pmonth]::after, .programArea.selectMode div[kui-piday]::after, .programArea.selectMode div[kui-pday] > .monthSelect::after, .programArea.selectMode div.layoutControl.DateControlType::after, .programArea.selectMode div.layoutControl.Password::after, .programArea.selectModeSubForm div[kui-sheet]::after, .programArea.selectModeSubForm div[kui-tree] > .tree::after, .programArea.selectModeSubForm div[kui-fileupload]::after, .programArea.selectModeSubForm div[kui-html]::after, .programArea.selectModeSubForm div[kui-image]::after, .programArea.selectModeSubForm div[kui-button]::after, .programArea.selectModeSubForm div[kui-label]::after, .programArea.selectModeSubForm div[kui-password]::after, .programArea.selectModeSubForm div[kui-chart]::after, .programArea.selectModeSubForm div[kui-scheduler]::after, .programArea.selectModeSubForm div[kui-pmonth]::after, .programArea.selectModeSubForm div[kui-piday]::after, .programArea.selectModeSubForm div[kui-pday] > .monthSelect::after, .programArea.selectModeSubForm div.layoutControl.DateControlType::after, .programArea.selectModeSubForm div.layoutControl.Password::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(var(--MainBgColor-rgb), 0.7);
  z-index: 10;
}
.programArea.selectMode div[kui-fileupload]::after, .programArea.selectModeSubForm div[kui-fileupload]::after {
  top: -2px;
}

.programArea.selectModeSubForm .layoutControl {
  cursor: default !important;
}
.programArea.selectModeSubForm .layoutControl input:focus {
  border-color: var(--ControlBorderColor);
  box-shadow: none;
  user-select: none;
  outline: none;
  color: transparent;
}
.programArea.selectModeSubForm .layoutControl:hover:before {
  display: none;
}
.programArea.selectModeSubForm .layoutControl::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(var(--MainBgColor-rgb), 0.7);
  z-index: 9;
}

.dataScrapWrap {
  height: 100%;
  padding: 0 8px 4px 0;
  background-color: var(--PgmAreaBgColor);
}
.dataScrapWrap > .dataScrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  border: 1px solid #929292;
  box-shadow: -5px 0px 10px 0px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.dataScrapWrap > .dataScrap.show {
  right: 0;
}
.dataScrapWrap > .dataScrap.hide {
  right: -300px;
}
.dataScrapWrap > .dataScrap > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 43px;
  padding: 0 12px;
  border-bottom: 1px solid #E3E7EB;
}
.dataScrapWrap > .dataScrap > header .title {
  display: flex;
  align-items: center;
}
.dataScrapWrap > .dataScrap > header .title > i {
  margin-right: 8px;
}
.dataScrapWrap > .dataScrap > header .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.dataScrapWrap > .dataScrap > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  margin-left: auto;
  cursor: pointer;
}
.dataScrapWrap > .dataScrap > header .btnClose:hover {
  background-color: #F5F6F8;
}
.dataScrapWrap > .dataScrap .contentWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.dataScrapWrap > .dataScrap .contentWrap .btnArea {
  display: flex;
  align-items: center;
  padding: 12px 15px;
  border-bottom: 1px solid #E3E7EB;
}
.dataScrapWrap > .dataScrap .contentWrap .btnArea .btnScrap {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 10px;
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  border-radius: 4px;
  font-weight: bold;
  cursor: pointer;
}
.dataScrapWrap > .dataScrap .contentWrap .btnArea .btnScrap > i {
  margin-right: 4px;
}
.dataScrapWrap > .dataScrap .contentWrap .btnArea .btnScrap:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap {
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding: 12px 15px 0 15px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title > .txtTitle {
  font-size: var(--fs14);
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .btnSort {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  padding: 8px;
  margin-left: auto;
  border-radius: 4px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .btnSort .txt {
  font-size: var(--fs14);
  color: var(--MainFontColorLighter);
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .btnSort > i {
  margin-left: 4px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .btnSort:hover {
  background-color: #F5F6F8;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort {
  position: absolute;
  top: 148px;
  right: 20px;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  box-shadow: var(--dlgBoxShadow);
  z-index: 1;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu {
  width: 100%;
  padding: 5px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li {
  width: 100%;
  margin-bottom: 5px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li:last-child {
  margin-bottom: 0;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 33px;
  padding: 0 10px 0 8px;
  border-radius: 4px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li > a > i {
  margin-right: 5px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li > a .txt {
  font-size: var(--fs13);
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li > a:hover {
  background-color: #F5F6F8;
  color: initial;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea {
  height: 100%;
  overflow-y: auto;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list {
  padding: 15px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item {
  position: relative;
  width: 100%;
  border: 1px solid #E3E7EB;
  border-radius: 8px;
  padding: 15px;
  margin-bottom: 10px;
  cursor: pointer;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item:hover {
  background-color: #F5F6F8;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap {
  display: flex;
  margin-bottom: 8px;
  padding-right: 24px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap > i {
  margin-top: 1px;
  margin-right: 4px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .txt {
  font-size: var(--fs15);
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .btnMore {
  position: absolute;
  top: 5px;
  right: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 6px;
  cursor: pointer;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .btnMore:hover {
  background-color: #e6e9ee;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgWrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore {
  position: absolute;
  top: 100px;
  right: 30px;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  box-shadow: var(--dlgBoxShadow);
  z-index: 1;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu {
  width: 100%;
  padding: 5px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li {
  width: 100%;
  margin-bottom: 5px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li:last-child {
  margin-bottom: 0;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 33px;
  padding: 0 10px 0 8px;
  border-radius: 4px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li > a > i {
  margin-right: 5px;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li > a .txt {
  font-size: var(--fs13);
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li > a:hover {
  background-color: #F5F6F8;
  color: initial;
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .txtDate {
  margin-bottom: 8px;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.dataScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .txtDscrpt {
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.dataScrapWrap > .dataScrap .contentWrap.noData {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.dataScrapWrap > .dataScrap .contentWrap.noData .noDataContent {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.dataScrapWrap > .dataScrap .contentWrap.noData .noDataContent .txt {
  text-align: center;
  font-size: var(--fs14);
  color: #999;
}
.dataScrapWrap > .dataScrap .contentWrap.noData .noDataContent .btnScrap {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 10px;
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  border-radius: 4px;
  font-weight: bold;
  margin-top: 15px;
  cursor: pointer;
}
.dataScrapWrap > .dataScrap .contentWrap.noData .noDataContent .btnScrap > i {
  margin-right: 4px;
}
.dataScrapWrap > .dataScrap .contentWrap.noData .noDataContent .btnScrap:hover {
  background-color: var(--ButtonDefaultColorHover);
}

.msgWrap {
  position: fixed;
}
.msgWrap.editDataScrapInfo .msgBox > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 43px;
  padding: 0 12px;
  border-bottom: 1px solid #E3E7EB;
}
.msgWrap.editDataScrapInfo .msgBox > header .title {
  display: flex;
  align-items: center;
}
.msgWrap.editDataScrapInfo .msgBox > header .title > i {
  margin-right: 8px;
}
.msgWrap.editDataScrapInfo .msgBox > header .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.msgWrap.editDataScrapInfo .msgBox > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  margin-left: auto;
  cursor: pointer;
}
.msgWrap.editDataScrapInfo .msgBox > header .btnClose:hover {
  background-color: #F5F6F8;
}
.msgWrap.editDataScrapInfo .msgBox .msgContent {
  padding: 15px 20px;
}
.msgWrap.editDataScrapInfo .msgBox .msgContent .setItem {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
}
.msgWrap.editDataScrapInfo .msgBox .msgContent .setItem label {
  margin-bottom: 8px;
  font-size: var(--fs13);
  color: #666666;
}
.msgWrap.editDataScrapInfo .msgBox .msgContent .setItem input {
  font-size: var(--fs14);
}
.msgWrap.editDataScrapInfo .msgBox .msgContent .setItem textarea {
  height: 62px;
  font-size: var(--fs14);
}
.msgWrap.editDataScrapInfo .msgBox .btnWrap > button {
  min-width: 70px;
  height: 32px;
  padding: 0 10px;
  font-size: var(--fs14);
}

.sheetConditionWrap {
  position: relative;
  height: 100%;
  padding: 0 8px 4px 0;
  background-color: var(--PgmAreaBgColor);
}
.sheetConditionWrap .sheetCondition {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  border: 1px solid #E5E9F0;
  overflow: hidden;
}
.sheetConditionWrap .sheetCondition.show {
  right: 0;
}
.sheetConditionWrap .sheetCondition.hide {
  right: -300px;
}
.sheetConditionWrap .sheetCondition > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 43px;
  padding: 0 12px;
  border-bottom: 1px solid #E3E7EB;
}
.sheetConditionWrap .sheetCondition > header .title {
  display: flex;
  align-items: center;
}
.sheetConditionWrap .sheetCondition > header .title i {
  margin-right: 8px;
}
.sheetConditionWrap .sheetCondition > header .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.sheetConditionWrap .sheetCondition > header .title .btnBack {
  display: flex;
  align-items: center;
}
.sheetConditionWrap .sheetCondition > header .title .btnBack:hover {
  cursor: pointer;
}
.sheetConditionWrap .sheetCondition > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-left: auto;
  border-radius: 4px;
  cursor: pointer;
}
.sheetConditionWrap .sheetCondition > header .btnClose:hover {
  background-color: #F5F6F8;
}
.sheetConditionWrap .sheetCondition .contentWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 36px;
  margin-top: 8px;
  padding: 0 8px 0 16px;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .btnAllConidition {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  border-radius: 4px;
  font-size: var(--fs14);
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .btnAllConidition.back {
  color: var(--MainFontColor);
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .btnAllConidition.back:hover {
  cursor: pointer;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .btnMore {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 4px;
  padding: 0;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .btnMore:hover {
  background-color: #E3E7EB;
  cursor: pointer;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .toggleArea {
  display: flex;
  align-items: center;
  padding-right: 8px;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .toggleArea > input[type=checkbox] {
  display: none;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .toggleArea > input[type=checkbox]:checked + label > i {
  background-color: var(--MainColor);
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .toggleArea > input[type=checkbox]:checked + label > i::before {
  left: 17px;
  transition: 0.2s;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .toggleArea > input[type=checkbox]:disabled + label {
  opacity: 0.5;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .toggleArea > label {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs14);
  color: #424242;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .toggleArea > label > i {
  position: relative;
  display: flex;
  width: 32px;
  height: 18px;
  margin-left: 8px;
  border-radius: 30px;
  background-color: #ECEFF1;
}
.sheetConditionWrap .sheetCondition .contentWrap .topBtnArea .toggleArea > label > i::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: var(--MainBgColor);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  transition: 0.2s;
}
.sheetConditionWrap .sheetCondition .contentWrap .item {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 24px 20px 0;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dt {
  width: 100%;
  padding-bottom: 4px;
  font-size: var(--fs13);
  color: var(--FontColorGrey1);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd {
  width: 100%;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd > .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox {
  position: relative;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox .conditionTypeBlind {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox > .selected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 4px;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox > .selected > .txt {
  display: flex;
  align-items: center;
  width: 100%;
  font-size: var(--fs14);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox > .selected > .txt > i {
  margin-right: 8px;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox > .selected > .txt > .placeholder {
  color: rgba(var(--MainFontColor-rgb), 0.5);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox > .selected:hover, .sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox > .selected.Active {
  border-color: var(--MainColor);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox .comboList {
  position: absolute;
  top: 32px;
  left: 0;
  width: 100%;
  background-color: var(--MainBgColor);
  border: 1px solid var(--ControlBorderColor);
  border-radius: 4px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox .comboList > li {
  display: flex;
  align-items: center;
  min-height: 32px;
  padding: 0 10px;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox .comboList > li > .txt {
  padding-left: 8px;
  font-size: var(--fs14);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .combobox .comboList > li:hover {
  background-color: #F1F3F5;
  cursor: pointer;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .inputText {
  width: 50%;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 4px;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .inputText:hover, .sheetConditionWrap .sheetCondition .contentWrap .item > dd .inputText:focus {
  border-color: var(--MainColor);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd select {
  width: 50%;
  height: 32px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 4px;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd select:hover, .sheetConditionWrap .sheetCondition .contentWrap .item > dd select:focus {
  border-color: var(--MainColor);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 50px;
  margin-bottom: 10px;
  border: 1px solid var(--ControlBorderColor);
  border-radius: 4px;
  background-image: url("../../Images/bgColStyle.svg?var(--ImageVersion)");
  background-repeat: repeat;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 190px;
  height: 30px;
  border-radius: 4px;
  font-size: var(--fs16);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox.fill.red {
  background-color: #FFDEE7;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox.fill.orange {
  background-color: #FFE4CD;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox.fill.yellow {
  background-color: #FFF8DF;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox.fill.green {
  background-color: #DFFFE5;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox.fill.skyblue {
  background-color: #DEF6FF;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox.fill.blue {
  background-color: #DFE5FF;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox.fill.pink {
  background-color: #FFF0FD;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .stylePreview > .txtBox.fill.violet {
  background-color: #F3EDFF;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color {
  display: block;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(var(--MainFontColor-rgb), 0.16);
  border-radius: 50%;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.red {
  background-color: #FFDEE7;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.orange {
  background-color: #FFE4CD;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.yellow {
  background-color: #FFF8DF;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.green {
  background-color: #DFFFE5;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.skyblue {
  background-color: #DEF6FF;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.blue {
  background-color: #DFE5FF;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.pink {
  background-color: #FFF0FD;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.violet {
  background-color: #F3EDFF;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color.Active {
  border: 3px solid var(--InvertFontColor);
  outline: 2px solid var(--MainFontColor);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorSet > .color:not(.Active):hover {
  border-color: rgba(var(--MainFontColor-rgb), 0.5);
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorEtc {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 42px;
  height: 30px;
  margin-left: 6px;
  border-radius: 4px;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorEtc::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid #424242;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd .colorStyleWrap .colorPicker .colorEtc:hover {
  background-color: #f1f1f1;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd.horizontal {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}
.sheetConditionWrap .sheetCondition .contentWrap .item > dd.horizontal .txtRange {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 16px;
  font-size: var(--fs14);
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList {
  width: 100%;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li {
  display: flex;
  align-items: center;
  width: 100%;
  padding-left: 16px;
  border-bottom: 1px solid #E3E7EB;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > .btnEye {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > .btnEye:hover {
  background-color: #ced5dc;
  cursor: pointer;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl {
  width: 100%;
  padding: 16px 0 16px 8px;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dt {
  display: flex;
  align-items: center;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dt .colName {
  padding-left: 4px;
  font-size: var(--fs14);
  font-weight: bold;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd {
  display: flex;
  align-items: center;
  padding-top: 2px;
  padding-left: 2px;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .txt {
  display: flex;
  align-items: center;
  padding-left: 6px;
  font-size: var(--fs13);
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .txt::after {
  content: "";
  width: 1px;
  height: 12px;
  margin: 0 8px;
  background-color: #B0BEC5;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style {
  width: 13px;
  height: 13px;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill {
  border: 1px solid rgba(0, 0, 0, 0.2);
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill.red {
  background-color: #FFDEE7;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill.orange {
  background-color: #FFE4CD;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill.yellow {
  background-color: #FFF8DF;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill.green {
  background-color: #DFFFE5;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill.skyblue {
  background-color: #DEF6FF;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill.blue {
  background-color: #DFE5FF;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill.pink {
  background-color: #FFF0FD;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > dl > dd > .style.fill.violet {
  background-color: #F3EDFF;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li > .btnDel {
  display: none;
  flex-shrink: 0;
  width: 50px;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li:hover {
  background-color: #E3E7EB;
  cursor: pointer;
}
.sheetConditionWrap .sheetCondition .contentWrap .conditionList > li:hover > .btnDel {
  display: flex;
  align-items: center;
  justify-content: center;
}
.sheetConditionWrap .sheetCondition .contentWrap .txtNodata {
  display: none;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.sheetConditionWrap .sheetCondition .contentWrap .txtNodata > .txt {
  padding-top: 8px;
  color: rgba(var(--MainFontColor-rgb), 0.6);
  font-size: var(--fs14);
}
.sheetConditionWrap .sheetCondition .contentWrap.noData .conditionList {
  display: none;
}
.sheetConditionWrap .sheetCondition .contentWrap.noData .txtNodata {
  display: flex;
  align-items: center;
  justify-content: center;
}
.sheetConditionWrap .sheetCondition .btnArea {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  width: 100%;
  padding: 16px 20px;
}
.sheetConditionWrap .sheetCondition .btnArea > button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 70px;
  min-height: 32px;
  padding: 8px 10px;
  border-radius: 4px;
  font-size: var(--fs13);
  cursor: pointer;
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnDel {
  margin-right: auto;
  border: 1px solid #CFD8DC;
  color: #F54646;
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnDel:hover, .sheetConditionWrap .sheetCondition .btnArea > button.btnDel:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnDel:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnLine {
  border: 1px solid var(--MainColor);
  background-color: var(--MainBgColor);
  color: var(--MainColor);
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnLine:hover, .sheetConditionWrap .sheetCondition .btnArea > button.btnLine:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnLine:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnDefault {
  margin-left: 10px;
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnDefault:hover, .sheetConditionWrap .sheetCondition .btnArea > button.btnDefault:focus {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.sheetConditionWrap .sheetCondition .btnArea > button.btnDefault:active {
  box-shadow: inset 3px 3px 1000px rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25) 1px 2px 5px;
}
.sheetConditionWrap .sheetCondition .btnArea > button.Dis {
  border: 1px solid #CFD8DC;
  background-color: #F5F5F5;
  color: #BDBDBD;
  cursor: default;
}
.sheetConditionWrap .sheetCondition .btnArea > button.Dis:hover {
  border: 1px solid #CFD8DC;
  background-color: #F5F5F5;
  color: #BDBDBD;
  box-shadow: none;
  cursor: default;
}

.toggleAutoBox {
  position: absolute;
  top: 170px;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--BorderGrey);
  border-radius: 4px;
  background-color: var(--MainBgColor);
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.12);
}
.toggleAutoBox > input[type=checkbox] {
  display: none;
}
.toggleAutoBox > input[type=checkbox]:checked + label > i {
  background-color: var(--MainColor);
}
.toggleAutoBox > input[type=checkbox]:checked + label > i::before {
  left: 17px;
  transition: 0.2s;
}
.toggleAutoBox > input[type=checkbox]:disabled + label {
  opacity: 0.5;
}
.toggleAutoBox > label {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs14);
  color: #424242;
}
.toggleAutoBox > label > i {
  position: relative;
  display: flex;
  width: 32px;
  height: 18px;
  margin-left: 8px;
  border-radius: 30px;
  background-color: #ECEFF1;
}
.toggleAutoBox > label > i::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: var(--MainBgColor);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  transition: 0.2s;
}

.PEWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.PEWrap > .gnb {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  width: 100%;
  height: 60px;
  padding: 0 20px;
  background: linear-gradient(45deg, var(--PEMainColor), #7342FF);
}
.PEWrap > .gnb > h1 {
  display: flex;
  align-items: center;
  justify-content: center;
}
.PEWrap > .gnb .navi ul.list {
  display: flex;
  align-items: center;
}
.PEWrap > .gnb .navi ul.list > li {
  margin: 0 60px;
  opacity: 0.5;
}
.PEWrap > .gnb .navi ul.list > li > a {
  color: var(--InvertFontColor);
  font-size: var(--fs15);
  font-weight: bold;
}
.PEWrap > .gnb .navi ul.list > li.on {
  opacity: 1;
}
.PEWrap .pathArea {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 45px;
  padding: 0 25px;
  background-color: #fff;
  border-bottom: 1px solid #E2E2E2;
}
.PEWrap .pathArea .pathList {
  display: flex;
  align-items: center;
}
.PEWrap .pathArea .pathList .name {
  font-size: var(--fs14);
}
.PEWrap .pathArea .pathList .name.On {
  font-weight: bold;
}
.PEWrap .pathArea .pathList .name:hover {
  color: inherit;
  text-decoration: underline;
}
.PEWrap .pathArea .pathList .pathSlash {
  margin: 0 5px;
}
.PEWrap .contentArea {
  display: flex;
  width: 100%;
  height: 100%;
}
.PEWrap .contentArea .lnbWrap {
  flex-shrink: 0;
  width: 290px;
  padding: 20px;
  background-color: #F5F6F8;
}
.PEWrap .contentArea .lnbWrap .lnb {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: 20px 0;
  border-radius: 16px;
  background-color: #fff;
}
.PEWrap .contentArea .lnbWrap .lnb .title {
  padding: 0 20px;
  margin-bottom: 15px;
  font-size: var(--fs14);
  color: #9a9a9a;
}
.PEWrap .contentArea .lnbWrap .lnb .reportList {
  padding: 0 10px;
}
.PEWrap .contentArea .lnbWrap .lnb .reportList li {
  margin-bottom: 5px;
}
.PEWrap .contentArea .lnbWrap .lnb .reportList li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 38px;
  padding: 10px;
  border-radius: 4px;
}
.PEWrap .contentArea .lnbWrap .lnb .reportList li > a > i {
  margin-right: 5px;
}
.PEWrap .contentArea .lnbWrap .lnb .reportList li > a .txt {
  font-size: var(--fs15);
  font-weight: bold;
}
.PEWrap .contentArea .lnbWrap .lnb .reportList li > a:hover {
  background-color: #f5f5f5;
  color: initial;
}
.PEWrap .contentArea .lnbWrap .lnb .btnWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  margin-top: auto;
}
.PEWrap .contentArea .lnbWrap .lnb .btnWrap .btnNewPrompt {
  width: 100%;
  height: 40px;
  border-radius: 8px;
  border: 1px solid var(--PEMainColor);
  color: var(--PEMainColor);
}
.PEWrap .contentArea .content {
  width: 100%;
  height: 100%;
  box-shadow: -5px 4px 24px 0 rgba(0, 0, 0, 0.05);
}
.PEWrap .contentArea .content .promptContent {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.PEWrap .contentArea .content .promptContent .promptTitle {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 60px;
  padding: 0 25px;
  border-bottom: 1px solid #E2E2E2;
}
.PEWrap .contentArea .content .promptContent .promptTitle > i {
  margin-right: 5px;
}
.PEWrap .contentArea .content .promptContent .promptTitle .txtTitle {
  font-weight: bold;
  font-size: var(--fs16);
}
.PEWrap .contentArea .content .promptContent .promptTitle input.txtTitle {
  width: 300px;
  padding: 5px;
  margin-right: 10px;
  border-radius: 4px;
  border: 1px solid var(--ControlBorderColor);
}
.PEWrap .contentArea .content .promptContent .promptTitle .txtID {
  font-size: var(--fs13);
  color: #9a9a9a;
  margin-left: 10px;
}
.PEWrap .contentArea .content .promptContent .promptTitle .btnPromptSetting {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  margin-left: 10px;
}
.PEWrap .contentArea .content .promptContent .promptTitle .btnPromptSetting:hover {
  background-color: #f5f5f5;
  color: initial;
}
.PEWrap .contentArea .content .promptContent .promptTitle .btnWrap {
  margin-left: auto;
}
.PEWrap .contentArea .content .promptContent .promptTitle .btnWrap .btnDelete {
  margin-right: 10px;
  padding: 8px 20px;
  border-radius: 8px;
  color: #999;
  font-size: var(--fs14);
  cursor: pointer;
}
.PEWrap .contentArea .content .promptContent .promptTitle .btnWrap .btnDelete:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.PEWrap .contentArea .content .promptContent .promptTitle .btnWrap .btnSave {
  padding: 8px 20px;
  border-radius: 8px;
  background-color: var(--PEMainColor);
  color: var(--InvertFontColor);
  font-weight: bold;
  font-size: var(--fs14);
  cursor: pointer;
}
.PEWrap .contentArea .content .promptContent .promptTitle .btnWrap .btnSave:hover {
  background-color: #3321fe;
}
.PEWrap .contentArea .content .promptContent .editArea {
  display: flex;
  width: 100%;
  height: 100%;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap {
  display: flex;
  width: 100%;
  height: 100%;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  border-right: 1px solid #E2E2E2;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 100%;
  height: 45px;
  padding: 0 25px;
  background-color: rgba(var(--PEMainColor-rgb), 0.05);
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt > header .title {
  font-size: var(--fs14);
  font-weight: bold;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt > header .btnHelper {
  margin-left: auto;
  padding: 6px 10px;
  background-color: #fff;
  border: 1px solid #E2E2E2;
  border-radius: 4px;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt > header .btnHelper .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt .editBox {
  width: 100%;
  height: 100%;
  background-color: #fff;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt .editBox > textarea {
  width: 100%;
  height: 100%;
  padding: 20px;
  font-size: var(--fs15);
  border: 0;
  resize: none;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt.system {
  width: 35%;
}
.PEWrap .contentArea .content .promptContent .editArea .editPromptWrap .editPrompt.developer {
  width: 65%;
}
.PEWrap .contentArea .content .promptContent .editArea .promptSetting {
  width: 100%;
  max-width: 350px;
}
.PEWrap .contentArea .content .promptContent .editArea .promptSetting .settingContent {
  width: 100%;
  height: 100%;
  padding: 20px;
  overflow-y: auto;
}
.PEWrap .contentArea .content .promptContent .editArea .promptSetting .settingContent .setItem {
  display: flex;
  flex-direction: column;
  margin-bottom: 25px;
}
.PEWrap .contentArea .content .promptContent .editArea .promptSetting .settingContent .setItem label {
  margin-bottom: 10px;
  font-size: var(--fs14);
  font-weight: bold;
}
.PEWrap .contentArea .content .promptContent .editArea .promptSetting .settingContent .setItem .inputWrap > input, .PEWrap .contentArea .content .promptContent .editArea .promptSetting .settingContent .setItem .inputWrap textarea {
  width: 100%;
  padding: 8px 10px;
  border-radius: 4px;
  border: 1px solid var(--ControlBorderColor);
  resize: none;
}
.PEWrap .contentArea .content .promptContent .editArea .promptSetting .settingContent .setItem .inputWrap > textarea {
  height: 70px;
}

.data111ScrapWrap {
  position: absolute;
  top: 84px;
  right: 0px;
  height: calc(100% - 84px);
  padding: 4px;
  background-color: var(--ProgramBgColor);
}
.data111ScrapWrap > .dataScrap {
  display: flex;
  flex-direction: column;
  width: 300px;
  height: 100%;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  overflow: hidden;
  z-index: 120;
}
.data111ScrapWrap > .dataScrap.show {
  right: 0;
}
.data111ScrapWrap > .dataScrap.hide {
  right: -300px;
}
.data111ScrapWrap > .dataScrap > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 43px;
  padding: 0 12px;
  border-bottom: 1px solid #E3E7EB;
}
.data111ScrapWrap > .dataScrap > header .title {
  display: flex;
  align-items: center;
}
.data111ScrapWrap > .dataScrap > header .title > i {
  margin-right: 8px;
}
.data111ScrapWrap > .dataScrap > header .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.data111ScrapWrap > .dataScrap > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  margin-left: auto;
  cursor: pointer;
}
.data111ScrapWrap > .dataScrap > header .btnClose:hover {
  background-color: #F5F6F8;
}
.data111ScrapWrap > .dataScrap .contentWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.data111ScrapWrap > .dataScrap .contentWrap .btnArea {
  display: flex;
  align-items: center;
  padding: 12px 15px;
  border-bottom: 1px solid #E3E7EB;
}
.data111ScrapWrap > .dataScrap .contentWrap .btnArea .btnScrap {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 10px;
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  border-radius: 4px;
  font-weight: bold;
  cursor: pointer;
}
.data111ScrapWrap > .dataScrap .contentWrap .btnArea .btnScrap > i {
  margin-right: 4px;
}
.data111ScrapWrap > .dataScrap .contentWrap .btnArea .btnScrap:hover {
  background-color: var(--ButtonDefaultColorHover);
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap {
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding: 12px 15px 0 15px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title > .txtTitle {
  font-size: var(--fs14);
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .btnSort {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  padding: 8px;
  margin-left: auto;
  border-radius: 4px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .btnSort .txt {
  font-size: var(--fs14);
  color: var(--MainFontColorLighter);
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .btnSort > i {
  margin-left: 4px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .btnSort:hover {
  background-color: #F5F6F8;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort {
  position: absolute;
  top: 148px;
  right: 20px;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  box-shadow: var(--dlgBoxShadow);
  z-index: 1;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu {
  width: 100%;
  padding: 5px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li {
  width: 100%;
  margin-bottom: 5px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li:last-child {
  margin-bottom: 0;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 33px;
  padding: 0 10px 0 8px;
  border-radius: 4px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li > a > i {
  margin-right: 5px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li > a .txt {
  font-size: var(--fs13);
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap > .title .dlgContextUI.dataScrapSort .contextMenu > li > a:hover {
  background-color: #F5F6F8;
  color: initial;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea {
  height: 100%;
  overflow-y: auto;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list {
  padding: 15px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item {
  position: relative;
  width: 100%;
  border: 1px solid #E3E7EB;
  border-radius: 8px;
  padding: 15px;
  margin-bottom: 10px;
  cursor: pointer;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item:hover {
  background-color: #F5F6F8;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap > i {
  margin-right: 4px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .txt {
  font-size: var(--fs15);
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .btnMore {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-left: auto;
  cursor: pointer;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .btnMore:hover {
  background-color: #e6e9ee;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgWrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore {
  position: absolute;
  top: 100px;
  right: 30px;
  background-color: var(--MainBgColor);
  border-radius: 4px;
  box-shadow: var(--dlgBoxShadow);
  z-index: 1;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu {
  width: 100%;
  padding: 5px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li {
  width: 100%;
  margin-bottom: 5px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li:last-child {
  margin-bottom: 0;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li > a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 33px;
  padding: 0 10px 0 8px;
  border-radius: 4px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li > a > i {
  margin-right: 5px;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li > a .txt {
  font-size: var(--fs13);
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .titleWrap .dlgContextUI.dataScrapMore .contextMenu > li > a:hover {
  background-color: #F5F6F8;
  color: initial;
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .txtDate {
  margin-bottom: 8px;
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.data111ScrapWrap > .dataScrap .contentWrap .listWrap .listArea .list > li .item .txtDscrpt {
  font-size: var(--fs13);
  color: var(--MainFontColorLighter);
}
.data111ScrapWrap > .dataScrap .contentWrap.noData {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding-top: 30%;
}
.data111ScrapWrap > .dataScrap .contentWrap.noData .noDataContent {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.data111ScrapWrap > .dataScrap .contentWrap.noData .noDataContent .txt {
  text-align: center;
  font-size: var(--fs14);
  color: #999;
}
.data111ScrapWrap > .dataScrap .contentWrap.noData .noDataContent .btnScrap {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 10px;
  background-color: var(--MainColor);
  color: var(--InvertFontColor);
  font-size: var(--fs13);
  border-radius: 4px;
  font-weight: bold;
  margin-top: 15px;
  cursor: pointer;
}
.data111ScrapWrap > .dataScrap .contentWrap.noData .noDataContent .btnScrap > i {
  margin-right: 4px;
}
.data111ScrapWrap > .dataScrap .contentWrap.noData .noDataContent .btnScrap:hover {
  background-color: var(--ButtonDefaultColorHover);
}

.msgW11rap.editDataScrapInfo .msgBox > header {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  height: 43px;
  padding: 0 12px;
  border-bottom: 1px solid #E3E7EB;
}
.msgW11rap.editDataScrapInfo .msgBox > header .title {
  display: flex;
  align-items: center;
}
.msgW11rap.editDataScrapInfo .msgBox > header .title > i {
  margin-right: 8px;
}
.msgW11rap.editDataScrapInfo .msgBox > header .title .txt {
  font-size: var(--fs14);
  font-weight: bold;
}
.msgW11rap.editDataScrapInfo .msgBox > header .btnClose {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  margin-left: auto;
  cursor: pointer;
}
.msgW11rap.editDataScrapInfo .msgBox > header .btnClose:hover {
  background-color: #F5F6F8;
}
.msgW11rap.editDataScrapInfo .msgBox .msgContent {
  padding: 15px 20px;
}
.msgW11rap.editDataScrapInfo .msgBox .msgContent .setItem {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
}
.msgW11rap.editDataScrapInfo .msgBox .msgContent .setItem label {
  margin-bottom: 8px;
  font-size: var(--fs13);
  color: #666666;
}
.msgW11rap.editDataScrapInfo .msgBox .msgContent .setItem input {
  font-size: var(--fs14);
}
.msgW11rap.editDataScrapInfo .msgBox .msgContent .setItem textarea {
  height: 62px;
}
.msgW11rap.editDataScrapInfo .msgBox .btnWrap > button {
  min-width: 70px;
  height: 32px;
  padding: 0 10px;
  font-size: var(--fs14);
}

.ARWrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.ARWrap * {
  color: var(--InvertFontColor);
}
.ARWrap input, .ARWrap textarea {
  background-color: #07060B;
  border: 1px solid #423D56;
  border-radius: 8px;
  padding: 5px 10px;
  font-size: var(--fs15);
  resize: none;
}
.ARWrap > .gnb {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  width: 100%;
  height: 60px;
  padding: 0 20px;
  background-color: #292634;
}
.ARWrap > .gnb > h1 {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ARWrap > .gnb > h1 > i {
  margin-right: 10px;
}
.ARWrap > .gnb > h1 .rptTitle {
  font-size: var(--fs19);
  font-weight: bold;
}
.ARWrap > .gnb .btnWrap {
  margin-left: auto;
}
.ARWrap > .gnb .btnWrap > button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 20px;
  background: var(--ARGrandient);
  border-radius: 8px;
  font-size: var(--fs15);
  font-weight: bold;
  transition: all 0.3s;
  cursor: pointer;
}
.ARWrap > .gnb .btnWrap > button:hover::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.1);
  transition: all 0.3s;
}
.ARWrap .contentArea {
  display: flex;
  width: 100%;
  height: 100%;
  background-color: #191721;
}
.ARWrap .contentArea .presetWrap {
  flex-shrink: 0;
  width: 420px;
  padding: 30px;
}
.ARWrap .contentArea .presetWrap .preset {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  border-radius: 16px;
  background-color: #252230;
}
.ARWrap .contentArea .presetWrap .preset .title {
  padding: 20px;
  border-bottom: 1px solid #403B56;
}
.ARWrap .contentArea .presetWrap .preset .title > h2 {
  font-size: var(--fs16);
  font-weight: bold;
}
.ARWrap .contentArea .presetWrap .preset .setItem {
  padding: 20px;
  border-bottom: 1px solid #403B56;
}
.ARWrap .contentArea .presetWrap .preset .setItem > dt {
  margin-bottom: 15px;
  font-weight: bold;
  font-size: var(--fs15);
  color: #C9C9D0;
}
.ARWrap .contentArea .presetWrap .preset .setItem > dt .count {
  margin-left: 5px;
  color: #897EFF;
}
.ARWrap .contentArea .presetWrap .preset .setItem.check > dd .checkItem {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 10px 10px 0;
}
.ARWrap .contentArea .presetWrap .preset .setItem.check > dd .checkItem > input + label {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px 10px;
  border-radius: 6px;
  background-color: #3D394C;
  font-size: var(--fs15);
  color: #868391;
  cursor: pointer;
}
.ARWrap .contentArea .presetWrap .preset .setItem.check > dd .checkItem > input:checked + label {
  background-color: #5D5677;
  color: #fff;
}
.ARWrap .contentArea .presetWrap .preset .setItem.prompt textarea {
  width: 100%;
  height: 110px;
  padding: 15px;
}
.ARWrap .contentArea .presetWrap .preset .btnWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  margin-top: auto;
}
.ARWrap .contentArea .presetWrap .preset .btnWrap .btnGenerate {
  position: relative;
  width: 100%;
  height: 45px;
  border-radius: 8px;
  background: var(--ARGrandient);
  font-size: var(--fs16);
  font-weight: bold;
  cursor: pointer;
}
.ARWrap .contentArea .presetWrap .preset .btnWrap .btnGenerate:hover::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.1);
  transition: all 0.3s;
}
.ARWrap .contentArea .content {
  width: 100%;
  height: 100%;
}
.ARWrap .contentArea .content .pdfArea {
  width: 100%;
  height: 100%;
  text-align: center;
}
.ARWrap .contentArea .content .pdfArea .pdfIframe {
  width: 900px;
  height: 100%;
  border: 0;
}
.ARWrap .contentArea .content .pdfArea .pdfIframe #toolbar {
  background-color: red;
}
.ARWrap .contentArea .content .pdfArea .welcome {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.ARWrap .contentArea .content .pdfArea .welcome > i {
  margin-bottom: 20px;
}
.ARWrap .contentArea .content .pdfArea .welcome .txt {
  text-align: center;
  font-size: var(--fs18);
  font-weight: bold;
  line-height: 130%;
}
.ARWrap .k-icon {
  font-family: WebComponentsIcons !important;
  color: #333;
}
.ARWrap .k-dropdown-wrap .k-input, .ARWrap .k-numeric-wrap .k-input, .ARWrap .k-picker-wrap .k-input {
  background-color: transparent;
}

.ARDocWrap {
  width: 700px;
  height: 990px;
}
.ARDocWrap .ARDoc {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: 30px;
  background-color: #F8F9FF;
}
.ARDocWrap .ARDoc .headerBg {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-image: url(../../Images/bgARDoc.svg);
  background-repeat: no-repeat;
  background-position: top right;
}
.ARDocWrap .ARDoc > header {
  position: relative;
}
.ARDocWrap .ARDoc > header .reportName {
  margin-bottom: 10px;
  font-size: var(--fs14);
  font-weight: bold;
}
.ARDocWrap .ARDoc > header .h1Title {
  margin-bottom: 20px;
  font-size: var(--fs25);
  font-weight: bold;
}
.ARDocWrap .ARDoc > header .docInfo {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
}
.ARDocWrap .ARDoc > header .docInfo .info {
  display: flex;
  align-items: center;
  font-size: var(--fs13);
  font-weight: bold;
}
.ARDocWrap .ARDoc > header .docInfo .info::after {
  content: "";
  width: 1px;
  height: 10px;
  background-color: #333;
  margin: 0 10px;
}
.ARDocWrap .ARDoc > header .docInfo .info:last-child::after {
  display: none;
}
.ARDocWrap .ARDoc > .content {
  width: 100%;
  height: 100%;
  background-color: #fff;
  border-radius: 12px;
  padding: 20px 25px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.02);
  z-index: 1;
}
.ARDocWrap .ARDoc > .content > .h2Title {
  margin-bottom: 30px;
  font-size: var(--fs19);
  font-weight: bold;
  color: #4A3AFF;
}
.ARDocWrap .ARDoc > .content > .h3Title {
  margin-bottom: 10px;
  font-size: var(--fs16);
  font-weight: bold;
}
.ARDocWrap .ARDoc > .content > .txt {
  margin-bottom: 30px;
  font-size: var(--fs14);
  line-height: 170%;
}
.ARDocWrap .ARDoc > .content > .imgWrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px 0;
}

.readonly-wa {
  /*웹접근성 스크린리더용 요소*/
  position: absolute !important;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  clip: rect(1px, 1px, 1px, 1px);
  clip: rect(1px 1px 1px 1px);
  /* IE6, IE7 */
  padding: 0;
  margin: -1px;
  border: 0;
  overflow: hidden;
}

.unread-wa {
  /*웹접근성 스크린리더용 요소 : 읽기금지*/
  position: absolute !important;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
}

/*스킵 내비게이션*/
.skipNavigation {
  position: relative;
}
.skipNavigation > a {
  position: absolute;
  top: -30px;
  left: 0;
  width: 140px;
  border: 1px solid #15b065;
  background-color: #333;
  text-align: center;
  opacity: 0;
}
.skipNavigation a:active, .skipNavigation a:focus {
  top: 0;
  z-index: 99999;
  text-decoration: none;
  opacity: 1;
}
.skipNavigation span {
  display: inline-block;
  padding: 2px 6px 0 0;
  color: #fff;
  font-size: var(--fs14);
  line-height: 26px;
}