@charset "utf-8";
/*@import url(https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean);*/
/* @font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

@import url(https://use.fontawesome.com/releases/v5.4.1/css/all.css); */

li,
ol,
p,
ul {
  margin: 0;
  padding: 0
}

.btn-cloud,
.btn-cloud-active {
  width: 80px
}

.btn-cloud,
.btn-cloud-active,
.btn-primary,
.btn-save,
.select-wrap .file-option .btn-select,
.select-wrap .file-option ul li,
.slp-content .link-file-label:after,
.slp-content .profile-file-label:after,
.slp-footer .paging-area ul li.end,
.slp-footer .paging-area ul li.next,
.slp-footer .paging-area ul li.num {
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out
}

.mlp-alert,
.mlp-content {
  /*max-height: calc(100vh - 11rem)*/
}

* {
  outline: 0
}

:focus {
  outline: 0 !important;
  box-shadow: none !important
}

body,
html {
  font-size: 1rem;
  font-weight: 400;
  font-family: 'Pretendard', sans-serif;
  color: #333;
  overflow-x: hidden;
}

a:active,
a:focus,
a:hover {
  color: #0080f8;
  text-decoration: none
}

li,
ol,
ul {
  list-style: none
}

img {
  max-width: 100%
}

h4 {
  font-size: 1.25rem
}

h5 {
  font-size: 1rem
}

button,
input,
select {
  border: none;
  outline: 0;
  font-size: 1rem;
  background-color: transparent
}

.section-editor-header .btn-icon,
.section-editor-header ul.dropdown-nav > li > .nav-item,
button {
  cursor: pointer;
}

.btn,
.slp-content .contact-list-saved li span {
  white-space: nowrap
}

.btn-primary,
.btn-save {
  color: #fff;
  background-color: #013E98;
  border-color: #013E98
}

.btn-primary:hover,
.btn-save:hover {
  color: #fff;
  background-color: #233f65;
  border-color: #233f65
}

.samsung-ver-color {
  color: #fff !important;
  background-color: #6742F1 !important;
  border-color: #6742F1 !important;
}

.samsung-ver-color:hover{
  background-color: #5c43d2 !important;
}
.samsung-ver-color:active{
  background-color: #4a2ebf !important;
}
.samsung-ver-color:disabled{
  background-color: #ecebf0;
  border-color: #ecebf0 !important;
  color: #bcbbc1;
  cursor: not-allowed;
}

.samsung-ver-color02 {
  color: #6C4EEE !important;
  background-color: #F6F5FD !important;
  border-color: #9C92C3 !important;
}

.samsung-ver-color02:hover{
  color: #53439c !important;
  background-color: #f0eefc !important;
  border-color: #a399cb !important;
}
.samsung-ver-color02:active{
  color: #5b4da5 !important;
  background-color: #e5e1fc !important;
  border-color: #a299d0 !important;
}
.samsung-ver-color02:disabled{
  background-color: #f8f9fb;
  border-color: #ebecee !important;
  color: #c0c1c5;
  cursor: not-allowed;
}



.samsung-ver-round {
  border-radius: 5px !important;
}



.btn-cloud:active,
.btn-cloud:focus,
.btn-primary:active,
.btn-primary:focus,
.btn-save:active,
.btn-save:focus {
  color: #fff;
  background-color: #23354d;
  border-color: #23354d
}

.btn-cloud:disabled,
.btn-primary:disabled,
.btn-save:disabled {
  color: #96a8c2;
  background-color: #3c5f8e;
  border-color: #3c5f8e
}

.btn-cancel,
.btn-cloud-active,
.btn-secondary {
  color: #495367;
  background-color: #eef0f6;
  border-color: #eef0f6
}

.btn-cancel:hover,
.btn-cloud-active:hover,
.btn-secondary:hover,
.elp-content .btn-item button:hover,
.slp-content .link-file-label:hover:after,
.slp-content .profile-file-label:hover:after,
.slp-footer .paging-area ul li.num:hover {
  color: #495367;
  background-color: #dadfeb;
  border-color: #dadfeb
}

.btn-cancel:active,
.btn-cancel:focus,
.btn-cloud-active:active,
.btn-cloud-active:focus,
.btn-secondary:active,
.btn-secondary:focus,
.elp-content .btn-item button:active,
.elp-content .btn-item button:focus {
  color: #495367;
  background-color: #c6cdde;
  border-color: #c6cdde
}

.btn-cancel:disabled,
.btn-cloud-active:disabled,
.btn-secondary:disabled,
.elp-content .btn-item button:disabled {
  color: #abb0bb;
  background-color: #eef0f6;
  border-color: #eef0f6
}

.btn-normal {
  color: #495367;
  background-color: #fff;
  border-color: #d1d9e8
}

.btn-normal:hover,
.select-wrap .file-option .btn-select:hover {
  color: #495367;
  background-color: #f4f6fb;
  border-color: #d1d9e8
}

.btn-normal:active,
.btn-normal:focus,
.select-wrap .file-option .btn-select:active,
.select-wrap .file-option .btn-select:focus {
  color: #495367;
  background-color: #eef0f6;
  border-color: #d1d9e8
}

.btn-normal:disabled,
.select-wrap .file-option .btn-select:disabled {
  color: #bababa;
  background-color: #fff;
  border-color: #d1d9e8
}

.btn-white {
  color: #6d758a;
  background-color: #fff;
  border-color: #fff
}

.btn-white:active,
.btn-white:disabled,
.btn-white:focus,
.btn-white:hover {
  color: #fff;
  background-color: #6d758a;
  border-color: #6d758a
}

.btn-cloud,
.btn-cloud:hover {
  color: #fff;
  border-color: #3c5f8e;
  background-color: #3c5f8e
}

.btn-service {
  width: 120px;
  border-radius: .25rem !important;
  font-size: 80%
}

.btn-logo-home {
  background-image: url("../img/common/brand_logo.svg");
  background-position: 70% 50%;
  background-repeat: no-repeat;
  background-size: 23px;
    font-size: 0;
    flex: 0 0 auto;
    letter-spacing: 0;
    position: relative;
    width:35px;
    height:31px;
    background-color:#fff;
    border:1px solid #CFCFCF;
    border-radius: .3rem;
    display:inline-block;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);

    
}


.wrap-body,
.wrap-box,
.wrap-content {
  width: 100%;
  min-height: 100%
}

.custom-control-input:checked ~ .custom-control-label::before {
  border-color: #212165;
  background-color: #212165
}

.form-check-input {
  margin-top: 0 !important
}

.scroll-box {
  overflow-y: auto
}

.scroll-box.type2 {
  min-height: 90px;
  max-height: 466px;
  padding: 0 8px 0 0;
}

.scroll-box::-webkit-scrollbar {
  background: none;
  width: 4px;
}

.scroll-box::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 100px;
}

.scroll-box.type2 .panel-icon-group {
  justify-content: flex-start !important;
}

.vh-428px {
  height: calc(100vh - 428px)
}

.wrap-body {
  background-color: transparent
}

.opacity-50,
.section-editor-header ul.dropdown-nav > li.disabled,
.slp-content .radio-wrap {
  opacity: .5
}

.pl-10px {
  padding-left: 10px
}

.pl-17px {
  padding-left: 17px
}

.pl-20px,
.pl-d-20px {
  padding-left: 20px
}

.page-login .wrap-box {
  background-color: #111
}

.section-login {
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  align-items: center;
  height: 100vh
}

.section-login .text-wrap {
  color: #fff9;
  margin-bottom: 3rem;
  line-height: 2
}

.section-login .text-wrap .flex {
  text-align: center
}

.section-login .container-login {
 /* min-width: 240px;
  max-width: 280px*/
}

.section-login .logo {
  margin-bottom: 3rem
}

.section-login .logo span {
  margin: auto;
  display: block;
  width: 102px;
  height: 35px;
  background-image: url(../img/brand/brand.png);
  background-size: cover;
  background-position: center
}

.section-login .input-flex-group + .input-flex-group {
  margin-top: 1rem
}

.section-login .custom-control {
  font-size: .9rem;
  margin-top: .25rem;
  text-align: right
}

.section-login .custom-control-label::before {
  width: 15px;
  height: 15px
}

.section-login .custom-control-label::after {
  top: 4px;
  left: -1.5rem;
  width: 15px;
  height: 15px
}

.section-login .btn-area {
  margin-top: 2rem
}

.section-login .btn-area > .btn,
.w-d-100 {
  width: 100%
}

.section-login .btn-area.d-flex {
  margin-left: -1rem;
  margin-right: -1rem
}

.section-login .btn-area.d-flex .btn + .btn {
  margin-left: 1rem
}

.section-login .find-password {
  display: block;
  text-align: center;
  font-size: .75rem;
  color: #fff5;
  margin-top: 1.5rem
}

.section-login .form-control {
  font-size: .875rem;
  padding: .5rem 1.5rem
}

.section-login .form-control:focus {
  border-color: #fff;
  background-color: transparent;
  color: #fff
}

.section-login .text-center-light {
  color: #fff9;
  font-size: .875rem
}

.section-dashboard-header .brand-logo,
.section-dashboard-header .profile-thumbnail {
  font-size: 0;
  color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  letter-spacing: 0;
  background-size: cover
}

.input-flex-group {
  display: flex;
  display: -ms-flexbox;
  flex-direction: column-reverse;
  -ms-flex-direction: column
}

.input-flex-group > label {
  font-size: .875rem;
  margin-bottom: .25rem;
  color: #fff5
}

.input-flex-group > input:focus + label,
.section-dashboard-body .icon ul li:hover,
.section-dashboard-body .icon:hover .label,
.section-dashboard-header .profile-nav ul li:hover,
.section-editor-header .profile-nav ul li:hover,
.slp-header .select-wrap .select-option span,
.slp-header .select-wrap .select-option-click span {
  color: #fff
}

.page-dashboard .wrap-box {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100vw;
  min-height: 100vh
}

.section-dashboard-header {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  align-items: center;
  height: 70px;
  border-bottom: 1px solid #fff1;
  padding: 0 30px
}

.section-dashboard-header .brand-logo {
  width: 102px;
  height: 35px;
  background-image: url(../img/brand/brand.png)
}

.mlp-alert,
.mlp-content,
.mlp-header,
.search-item-slp,
.section-dashboard-body .search-item,
.section-dashboard-header .profile-wrap,
.section-editor-header .btn-save-file,
.section-editor-header .search-item,
.select-wrap .select-option,
.select-wrap .select-option-click,
.slp-content .file-input-item,
.slp-content .input-cloud-group .right-area {
  position: relative;
}


.btn-save-file,
.search-item {
position: relative;
    display: flex;
    align-items: center;
    padding: 0px 10px 0px 10px;
    margin-left: 10px;
    border-radius: .3rem;
    border: 1px solid #b7b7b7;
    height: 30px;
    background-color: #fff;

}

.btn-save-file,
.search-item01 {
    background-color:#fff;
    padding: 3px 10px 3px 10px !important;
    height:32px !important;
}

.section-editor-header.mobile .search-item {
    border: 0px;
    background-color: unset;

}


.section-dashboard-header .profile-thumbnail {
  width: 40px;
  height: 40px;
  border-radius: 20px;
  cursor: pointer;
}

.section-dashboard-header .profile-nav {
  display: none;
  background: #1c1e25;
  border-radius: .5rem;
  padding: .5rem 0;
  position: absolute;
  top: 45px;
  right: 0;
  width: 250px;
  z-index: 1;
  text-align:center;
  color: #fff9;
}

.section-dashboard-header .profile-nav .profile_header {
  margin:0px 20px 0px 20px;
  padding:10px 0px 10px 0px;
  display:block;
  overflow:hidden;
  height:50px ;
}

.section-dashboard-header .profile-nav .profile-thumbnail {position: absolute; display:inline-block; left:50%; transform: translate(-50%, 0); }
.section-dashboard-header .profile-nav .changephoto {display: inline-block; margin:17px 0px 0px 10px; position: absolute;  left:50%; cursor: pointer;}
.section-dashboard-header .profile-nav .plan {color:#fff; background-color:#CACACA;
  border-radius: 10px;
  font-size:12px;
  padding:1px 5px;
  display:inline-block;
  margin:20px 0px 0px 130px;
  left:50%;
}


.section-dashboard-header .profile-nav .profile-name {
  border-bottom:1px solid #fff;
  margin:0px 20px 0px 20px;
  padding:10px 0px 10px 0px;
  display:block;
}

.section-dashboard-header .profile-nav ul li,
.section-editor-header .profile-nav ul li {
  color: #fff9;
  font-size: .875rem;
  text-align: center;
  padding: .25rem 1rem;
  cursor: pointer;
  transition: color .15s ease-in-out
}

 .profile-nav ul li {
  color: #fff9;
  font-size: .875rem;
  text-align: center;
  padding: .25rem 1rem;
  cursor: pointer;
  transition: color .15s ease-in-out
}

.nav-menu-list-container.active,
.point-menu-list.on,
.search-item-slp .search-option-container.active,
.section-dashboard-header .active .profile-nav,
.section-editor-header .active .profile-nav,
.section-editor-header .file-name-wrap:hover .dropdown-nav-wrap,
.section-editor-header ul.dropdown-nav > li:hover .nav-sub,
.slp-content .color-picker-area .color-picker-module.active,
.title-wrap:hover ul {
  display: block
}


.active .profile-nav,
.file-name-wrap:hover .dropdown-nav-wrap,
ul.dropdown-nav > li:hover .nav-sub {
  display: block
}


.section-dashboard-body,
.section-randing {
  height: calc(100vh - 131px);
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center
}

.section-randing .randing-title {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center
}

.section-randing .randing-title h1,
.section-randing .randing-title h2 {
  font-size: 2rem;
  color: #fff;
  font-weight: 700;
  padding: 0 .25rem
}

.section-randing .randing-title .text-point {
  color: #dc3545;
  font-style: italic
}

.section-randing .randing-btn-list {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  margin-top: 2rem
}

.section-randing .randing-btn-list li,
.slp-content .contact-list-container .added {
  padding: 0 .5rem
}

.section-randing .randing-btn {
  width: 200px;
  padding: 2.5rem 1.5rem;
  border: 1px solid #fff;
  background: #0003;
  border-radius: .5rem;
  cursor: pointer;
  text-align: center;
  transition: background .15s ease-in-out
}

.section-randing .randing-btn:hover {
  background: #0007
}

.section-randing .randing-btn h3 {
  color: #fff;
  font-size: 1.25rem;
  margin-bottom: 1rem
}

.section-randing .randing-btn p {
  color: #fff9
}

.elp-footer .paging-area ul,
.section-dashboard-body .search-wrap,
.slp-footer .paging-area ul {
  display: flex;
  display: -ms-flexbox;
  justify-content: center
}

.section-dashboard-body .input-search-text {
  width: 400px;
  height: 42px;
  border-radius: 22px;
  border: 1px solid #fff;
  font-size: 1rem;
  padding: 0 45px 0 25px;
  color: #fff;
  transition: border .15s ease-in-out;
  background-color: #fff;
}

.section-dashboard-body .input-search-text::placeholder {
  color: #fff;
}

.section-dashboard-body .input-search-text:focus {
  border: 1px solid #fff5;
  transition: border .15s ease-in-out
}

.d-d-none,
.elp-content .tap-group input[type=radio],
.elp-footer .paging-area .page-more-area,
.mobile-search-layer-container,
.nav-menu-list-container .main-item.disabled:hover > ul,
.nav-menu-list-container .main-item > ul,
.note-container,
.search-item-slp .input-search-text + label,
.section-dashboard-body .icon ul,
.section-dashboard-body .input-search-text + label,
.section-editor-footer .cooperation-wrap .label-warp,
.section-editor-header .dropdown-nav-wrap .nav-mobile-head,
.section-editor-header .dropdown-nav-wrap .nav-sub-mobile-head,
.section-editor-header .input-search-text + label,
.section-editor-header .search-option,
.section-editor-panel-left .btn-icon span.tip-label,
.section-editor-panel-left .btn-icon.disabled .tip-label,
.section-editor-panel-right .btn-icon span.tip-label,
.section-editor-panel-right .btn-icon.disabled .tip-label,
.select-wrap .position-option .folder ul,
.slp-content .contact-category-nav .edit-list:before,
.slp-content .contact-list-saved .form-check-input,
.slp-content .contact-title-wrap.mobile,
.slp-content .type-item input[type=radio],
.slp-content ul.type-gallery > li span.file-make-data,
.slp-content ul.type-gallery > li span.file-make-user,
.slp-content ul.type-gallery > li span.file-make-user-before,
.slp-content ul.type-gallery > li span.file-size,
.slp-content ul.type-list .file-thumbnail,
.slp-footer .paging-area .page-more-area,
.viewer-layer-container {
  display: none
}


.dropdown-nav-wrap .nav-mobile-head,
.dropdown-nav-wrap .nav-sub-mobile-head,
.input-search-text + label,
.search-option {
  display: none
}


.section-dashboard-body .btn-search {
  font-size: 0;
  letter-spacing: 0;
  color: transparent;
  width: 30px;
  height: 30px;
  border: 0;
  background-image: url(../img/editor/editor-btn-search.png);
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: 6px;
  right: 10px
}

.section-dashboard-body .element-wrap {
  margin-top: 20px;
  width: 660px;
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between
}

.section-dashboard-body .section-profile-information {
  width: 320px;
  height: 470px;
  border-radius: 20px;
  background: #fff;
  overflow: hidden
}

.section-dashboard-body .user-info-wrap {
  display: flex;
  display: -ms-flexbox;
  flex-direction: column;
  justify-content: space-between;
  padding: 30px;
  height: 140px
}

.search-item-slp .search-option-container .option-group,
.section-dashboard-body .user-info-group,
.section-editor-footer .icon-group,
.section-editor-footer .item-wrap,
.section-editor-footer .zoom-group,
.section-editor-header .icon-group,
.section-editor-header .nav-wrap-center,
.section-editor-header .nav-wrap-left,
.section-editor-header .nav-wrap-right,
.select-wrap .position-option > ul,
.slp-content .contact-wrap,
.slp-content .input-cloud-group .left-area,
.slp-content .set-bg-color-wrap .color-code-area,
.slp-content .type-open,
.slp-content .vote-container .option-item,
.vote-time-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
}

.nav-wrap-right .search-wrap {
  /*border: 1px solid #CFCFCF;*/
        position: relative;
    display: flex;
    align-items: center;
    padding: 4px 0px 4px 0px;
    border-radius: .3rem;
    /*box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
    background-color:#fff;*/
}

.nav-wrap-search .search-wrap .search-item {
   position: relative;
  display:flex;
  align-items: center;
    padding: 0px 10px 0px 10px;
    margin-left: 10px;
    border-radius: .3rem;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
}

.nav-wrap-search .search-wrap .search-item .input-search-text {
  display:none;
}

.nav-wrap-search .search-wrap .search-item .search-option-wrap {
  display:none;
}
.nav-wrap-search .search-wrap .search-item .btn-search-off {
  display:block;
  border: 0;
    background-image: url(../img/common/i_search.svg);
    /* background-image: url(../img/editor/editor-btn-search.png); */
    background-size: cover;
    height: 22px;
    padding: 0;
    width: 22px;
    font-size: 12px;
    color: transparent;
    background-position: center;
    background-repeat: no-repeat;
    letter-spacing: 0;
}





.nav-wrap-search.on .search-wrap .search-item .input-search-text {
  display: block;
  margin-right:10px;
}
.nav-wrap-search.on .search-wrap .search-item .search-option-wrap {
  display:block;
}
.nav-wrap-search.on .search-wrap .search-item .btn-search-off {
  display:none;
}





.icon-group,
.nav-wrap-center,
.nav-wrap-left,
.nav-wrap-right {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
}

.section-dashboard-body .user-slogan {
  font-size: 26px
}

.section-dashboard-body .user-name {
  font-size: 18px
}

.section-dashboard-body .user-company {
  font-size: 14px;
  color: #6d758a;
  margin-left: 10px
}

.section-dashboard-body .user-info-cover-img {
  width: 320px;
  height: 330px;
  overflow: hidden;
}

.retry {
  border-radius: 4px;
    font-size: 0;
    flex: 0 0 flex;
    letter-spacing: 0;
    justify-content: center;
    color: transparent;
    position: relative;
    cursor: pointer;
    transition: background-color .15s ease-in-out;
}

.retry span {
  font-weight:bold; padding:4px 10px 4px 7px ; margin:5px 10px 0px; font-size:15px; background-color:#e82c22; display:inline-block; color:#fff; border-radius: 30px;
}

.retry .tool-tip-container {
     position: absolute;
    width: 200px;
    bottom: -36px;
    left: -150vw;
    z-index: 9;
    text-align: center;
}

.retry:hover .tool-tip-container {
  left: calc(50% - 100px)
}



.section-dashboard-body .user-info-cover-img img {
  width: 100%;
  min-width: 320px;
  height: 100%;
  min-height: 330px
}

.section-dashboard-body .icon-group {
  width: 100%;
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between
}

.section-dashboard-body .icon {
  flex: 1;
  display: flex;
  display: -ms-flexbox;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  position: relative;
  padding: 1rem 0
}

.section-dashboard-body .icon .label {
  font-size: .875rem;
  color: #fff;
  margin-top: 7px;
  cursor: pointer;
  text-align:center;
}

.section-dashboard-body .icon + .icon:before {
  width: 2px;
  height: 58px;
  content: '';
  display: block;
  background-color: #fff1;
  position: absolute;
  top: 16px;
  left: -1px
}

.section-dashboard-body .icon:hover ul {
  position: absolute;
  display: block;
  top: 80px;
  left: 5px;
  background: #1c1e25;
  border-radius: .5rem;
  padding: .75rem 1rem;
  width: calc(100% - 10px);
  z-index: 1
}

.section-dashboard-body .icon ul li {
  font-size: .875rem;
  color: #fff5;
  padding: .25rem 0
}

.section-dashboard-body .section-add-icon {
  margin-top: 15px
}

.section-dashboard-body .section-main-icon {
  width: 320px;
  height: 130px;
  background-color: #fff1;
  border-radius: 15px;
  display: flex;
  display: -ms-flexbox;
  align-items: center
}

.section-dashboard-body .section-main-icon-1 {
  width: 100px
}

.section-dashboard-body .section-main-icon-2 {
  width: 210px
}

.section-dashboard-body ul.add-icon-list {
  display: flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
  width: 332px;
  margin: 0 -5px
}

.section-dashboard-body ul.add-icon-list li {
  width: 100px;
  height: 100px;
  border: 1px solid #ccc;
  border-radius: 15px;
  margin: 5px;
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  align-items: center
}

.section-dashboard-body ul.add-icon-list li .link-wrap {
  position: relative;
  text-align: center;
  cursor: pointer
}

.section-dashboard-body ul.add-icon-list li .link-wrap .label-container {
  position: absolute;
  width: 200px;
  bottom: -34px;
  left: -100vw;
  z-index: 9
}

.section-dashboard-body ul.add-icon-list li .link-wrap:hover .label-container,
.section-editor-header .btn-icon:hover .tool-tip-container,
.section-editor-header .btn-save-file:hover .tool-tip-container,
.select-wrap .file-option li:hover .tool-tip-container {
  left: calc(50% - 100px)
}

.btn-icon:hover .tool-tip-container,
.btn-save-file:hover .tool-tip-container {
  left: calc(50% - 100px)
}



.section-dashboard-body ul.add-icon-list li .link-wrap .label-container:before {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-bottom: 4px solid #131416;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  position: absolute;
  top: -2px;
  left: 96px
}

.section-dashboard-body ul.add-icon-list li .link-wrap label {
  font-size: .75rem;
  color: #fff;
  display: inline-block;
  width: max-content;
  height: 26px;
  padding: 3px 10px;
  border-radius: .25rem;
  background-color: #131416
}

.section-dashboard-body ul.add-icon-list li .link-label {
  color: #fff;
  font-size: .75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 70px
}

.section-dashboard-body ul.add-icon-list li.added .link-icon,
.section-dashboard-body ul.add-icon-list li.ready .link-icon {
  display: inline-block;
  width: 40px;
  height: 40px;
  border-radius: 25px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

.section-dashboard-body ul.add-icon-list li.ready .link-icon {
  background-image: url(../img/dashboard/dashboard-icon-add-mark.png)
}

.section-dashboard-footer {
  height: 60px;
  display: flex;
  display: -ms-flexbox;
  justify-content: center
}

.section-dashboard-footer .copyright {
  color: #fff5;
  font-size: .875rem
}

.elp-footer .paging-area ul li.end,
.elp-footer .paging-area ul li.next,
.section-dashboard-footer .tip-question,
.slp-footer .paging-area ul li.end,
.slp-footer .paging-area ul li.next {
  font-size: 0;
  letter-spacing: 0;
  color: transparent;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat
}

.section-dashboard-footer .tip-question {
  position: fixed;
  right: 30px;
  bottom: 30px;
  width: 50px;
  height: 50px;
  border-radius: 25px;
  background-color: #333;
  background-image: url(../img/dashboard/dashboard-question-mark.png);
  cursor: pointer
}

.editor-layer-container,
.setting-layer-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  align-items: center;
  z-index: 999;
  background: rgba(0, 0, 0, .5)
}

.d-d-flex,
.editor-layer-container.active,
.modal-layer-container.active,
.select-wrap .file-option ul,
.setting-detail-container.active,
.setting-layer-container.active,
.slp-content .input-link-group,
.slp-content .input-profile-group,
.slp-content .set-bg-radio-wrap,
.slp-content ul.type-list > li .file-info-wrap {
  display: flex;
  display: -ms-flexbox
}

.elp-wrap,
.slp-wrap {
  margin: 0 auto;
  padding: 0 1rem
}

.elp-size,
.slp-size {
  width: 750px
}

.slp-size-sm {
  width: 400px
}

.elp-header,
.slp-header {
  position: relative;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
  height: 60px;
  border-bottom: 1px solid #c6cdde;
  border-top-left-radius: 1rem;
  -moz-border-radius-topleft: 1rem;
  border-top-right-radius: 1rem;
  -moz-border-radius-topright: 1rem;
  background: #233f65
}

.elp-header .headline,
.slp-header .headline {
  position: absolute;
  top: 0;
  left: 0;
  height: 60px;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  margin: 0
}

.elp-header .headline .title,
.slp-header .headline span {
  font-size: 1.125rem;
  color: #fff;
  padding-left: 1rem
}

.slp-header .slp-close {
  position: absolute;
  top: 15px;
  right: 10px;
  opacity: .5;
  cursor: pointer;
  transition: opacity .15s ease-in-out
}

.elp-header .slp-close span,
.slp-header .slp-close span {
  display: block;
  width: 30px;
  height: 30px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(../img/setting/setting-icon-close.png)
}

.elp-header .slp-close:hover,
.mlp-header .mlp-close:hover,
.slp-header .slp-close:hover {
  opacity: .75
}

.slp-header .ver {
  display: block;
  border: 1px solid #fff5;
  font-size: .75rem !important;
  padding: .25rem .5rem !important;
  border-radius: .5rem;
  margin-left: 1rem;
  height: 26px
}

.elp-footer,
.slp-content.slp-content-radius,
.slp-footer {
  border-bottom-left-radius: 1rem;
  -moz-border-radius-bottomleft: 1rem;
  border-bottom-right-radius: 1rem;
  -moz-border-radius-bottomright: 1rem
}

.slp-content {
  position: relative;
  background: #fff
}

.slp-content.slp-content-radius {
  overflow: hidden
}

.elp-footer,
.slp-footer {
  padding: 1rem 1.5rem;
  background: #eef0f6
}

.elp-footer .btn-area,
.mlp-footer .btn-area,
.slp-footer .btn-area {
  display: flex;
  display: -ms-flexbox;
  justify-content: flex-end
}

.elp-footer .btn-area .btn + .btn,
.mlp-footer .btn-area .btn + .btn,
.search-item-slp .search-option-container .btn-area .btn + .btn,
.select-wrap .file-option ul li + li,
.slp-footer .btn-area .btn + .btn {
  margin-left: .25rem
}

.elp-footer .paging-area ul li,
.slp-footer .paging-area ul li {
  width: 26px;
  height: 26px;
  border-radius: 13px;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
  color: #1c1e25;
  font-size: .875rem;
  cursor: pointer
}

.elp-footer .paging-area ul li + li,
.slp-content .view-type-icon-wrap .type-item + .type-item,
.slp-footer .paging-area ul li + li {
  margin-left: 5px
}

.elp-footer .paging-area ul li.num.active,
.slp-footer .paging-area ul li.num.active {
  background-color: #3c5f8e;
  color: #fff
}

.elp-footer .paging-area ul li.next,
.slp-footer .paging-area ul li.next {
  background-image: url(../img/setting/setting-icon-paging-next.png)
}

.elp-footer .paging-area ul li.end,
.slp-footer .paging-area ul li.end {
  background-image: url(../img/setting/setting-icon-paging-end.png)
}

.slp-footer .paging-area ul li.end:hover,
.slp-footer .paging-area ul li.next:hover {
  background-color: #dadfeb;
  border-color: #dadfeb
}

.search-item-slp .input-search-text {
  width: 400px;
  height: 40px;
  border-radius: 20px;
  background-color: #fff;
  font-size: .875rem;
  padding: 0 95px 0 20px;
  color: #fff1
}

.search-item-slp .btn-search,
.search-item-slp .btn-setting {
  color: transparent;
  height: 30px;
  border: 0;
  background-position: center;
  background-repeat: no-repeat;
  top: 5px;
  position: absolute;
  font-size: 0;
  letter-spacing: 0;
  width: 30px
}

.search-item-slp .input-search-text::placeholder {
  color: #fff5
}

.search-item-slp .btn-search {
  background-image: url(../img/setting/setting-icon-search.png);
  right: 55px
}

.search-item-slp .btn-setting {
  background-image: url(../img/setting/setting-icon-setting.png);
  right: 15px
}

.search-item-slp .btn-search + .btn-setting:before {
  content: '';
  display: block;
  width: 1px;
  height: 20px;
  background-color: #fff2;
  position: absolute;
  top: 5px;
  left: -5px
}

.search-item-slp .search-option-container {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 45px;
  background: #fff;
  border-radius: 10px;
  z-index: 1
}

.search-item-slp .search-option-container ul {
  padding: 15px 0
}

.search-item-slp .search-option-container ul li {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding: 5px 20px
}

.search-item-slp .search-option-container .option-label {
  font-size: .875rem;
  width: 80px
}

.search-item-slp .search-option-container .option-item {
  min-width: 90px;
  display: flex;
  display: -ms-flexbox;
  align-items: center
}

.search-item-slp .search-option-container .form-check-label {
  font-size: .875rem;
  padding-left: .5rem;
  color: #6d758a
}

.search-item-slp .search-option-container input:checked + .form-check-label,
.section-editor-header .search-option li:hover,
.slp-content .select-wrap .select-option span,
.slp-content .select-wrap .select-option-click span {
  color: #333
}

.search-option li:hover {
  color: #333
}


.search-item-slp .search-option-container .btn-area {
  display: flex;
  display: -ms-flexbox;
  justify-content: flex-end;
  padding: 10px;
  border-top: 1px solid #eef0f6
}

.search-item-slp .search-option-container .btn-area .btn {
  width: 70px
}

.file-select-wrap {
  justify-content: space-between !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important
}

.mlp-footer .check-area label,
.section-editor-footer .item-wrap + .item-wrap,
.select-wrap .select-option + .select-option,
.select-wrap .select-option + .select-option-click,
.select-wrap .select-option-click + .select-option,
.select-wrap .select-option-click + .select-option-click {
  margin-left: .5rem
}

.select-wrap .select-option span,
.select-wrap .select-option-click span {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  height: 40px;
  border-radius: 20px;
  padding: 0 1rem;
  cursor: pointer;
  font-size: .875rem;
  transition: background-color .15s ease-in-out
}

.select-wrap .select-option span:after,
.select-wrap .select-option-click span:after {
  content: '';
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: none;
  margin-left: .5rem
}

.select-wrap .position-option {
  /* position: absolute; */
  top: 0;
  bottom: 0;
  left: 150px;
  right: 125px;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: flex-end;
}

.page-open-type2 .select-wrap .position-option {
  justify-content: flex-start;
  left: 1.5rem;
  right: auto
}

.select-wrap .position-option .label {
  color: #6d758a;
  font-size: .875rem;
  margin-right: .25rem
}

.select-wrap .file-option ul li,
.select-wrap .position-option .home {
  color: transparent;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat
}

.select-wrap .position-option > ul > li {
  cursor: default
}

.select-wrap .position-option > ul > li + li {
  margin-left: .25rem;
  display: flex;
  display: -ms-flexbox;
  align-items: center
}

.select-wrap .position-option > ul > li + li:before {
  content: '';
  display: inline-block;
  width: 10px;
  height: 20px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(../img/setting/setting-icon-posion-arrow.png);
  margin-right: .25rem
}

.select-wrap .position-option .home {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url(../img/setting/setting-icon-posion-home.png)
}

.select-wrap .position-option .folder {
  color: #6d758a;
  font-size: .875rem;
  position: relative;
  white-space: nowrap;
  cursor: pointer
}

.select-wrap .position-option .folder:hover {
  text-decoration: underline
}

.select-wrap .position-option .folder:hover ul {
  display: block;
  position: absolute;
  background-color: #fff;
  padding: .75rem 1rem;
  border-radius: .5rem;
  top: 20px;
  left: 0;
  z-index: 1
}

.select-wrap .position-option .folder:hover ul li {
  font-size: .875rem;
  white-space: nowrap;
  padding: .25rem 0;
  cursor: pointer
}

.select-wrap .position-option .folder:hover ul li:hover {
  color: #000
}

.select-wrap .position-option .current {
  color: #131416 !important
}

.select-wrap .file-option {
  display: flex;
  display: -ms-flexbox;
  justify-content: flex-end;
  height: 30px
}

.select-wrap .file-option .btn-select {
  font-size: .875rem;
  color: #4e5669;
  border: 1px solid #d1d9e8;
  border-radius: 1rem;
  height: 28px;
  padding: 2px .75rem;
  cursor: pointer;
  margin-right: .5rem
}

.select-wrap .file-option ul + ul,
.slp-content .cloud-service-wrap {
  margin-left: .75rem
}

.select-wrap .file-option ul li {
  font-size: 0;
  line-height: 0;
  letter-spacing: 0;
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 15px;
  border: 1px solid #d1d9e8;
  position: relative;
  cursor: pointer
}

.select-wrap .file-option .file-btn-new {
  background-image: url(../img/setting/setting-icon-file-new.png);
  background-color: #fff
}

.select-wrap .file-option .file-btn-import {
  background-image: url(../img/setting/setting-icon-file-import.png);
  background-color: #fff
}

.select-wrap .file-option .file-btn-upload {
  background-image: url(../img/setting/setting-icon-file-upload.png);
  background-color: #fff
}

.select-wrap .file-option .file-btn-add {
  background-image: url(../img/setting/setting-icon-file-add.png);
  background-color: #fff
}

.select-wrap .file-option li:hover {
  background-color: #f4f6fb;
  border-color: #d1d9e8
}

.select-wrap .file-option li:active,
.select-wrap .file-option li:focus {
  background-color: #eef0f6;
  border-color: #d1d9e8
}

.select-wrap .file-option li.disabled,
.select-wrap .file-option li:disabled {
  background-color: #fff;
  border-color: #d1d9e8;
  opacity: .5;
  z-index: 1
}

.select-wrap .file-option .tool-tip-container {
  position: absolute;
  width: 200px;
  bottom: -30px;
  left: -150vw;
  z-index: 1;
  text-align: center
}

.section-editor-header .tool-tip-container:before,
.select-wrap .file-option .tool-tip-container:before {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-bottom: 4px solid #131416;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  position: absolute;
  top: -4px;
  left: calc(100px - 4px)
}


.tool-tip-container:before,
.select-wrap .file-option .tool-tip-container:before  {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-bottom: 4px solid #131416;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  position: absolute;
  top: -3px;
  left: calc(100px - 4px)
}


.section-editor-header .tool-tip-container label,
.select-wrap .file-option .tool-tip-container label {
  font-size: .8rem;
  line-height: 1;
  letter-spacing: normal !important;
  color: #fff;
  display: inline-block;
  width: max-content;
  padding: .375rem .75rem;
  border-radius: .25rem;
  background-color: #131416
}

.tool-tip-container label,
.select-wrap .file-option .tool-tip-container label {
  font-size: .8rem;
  line-height: 1;
  letter-spacing: normal !important;
  color: #fff;
  display: inline-block;
  width: max-content;
  padding: .375rem .75rem;
  border-radius: .25rem;
  background-color: #131416
}


.select-wrap .sub-nav-container {
  position: absolute;
  top: 40px;
  left: 0;
  z-index: 1;
  display: none
}

.select-wrap .sub-nav-container .wrap {
  padding: 4px;
  border-radius: 12px;
  cursor: pointer;
  background: #fff
}

.select-wrap .sub-nav-container ul li {
  font-size: .875rem;
  padding: 5px 10px;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color .15s ease-in-out;
  white-space: nowrap
}

.select-wrap .select-option-click.active .sub-nav-container,
.select-wrap .select-option:hover .sub-nav-container,
.slp-content .list-nav-container.active {
  display: inline-block
}

.slp-header .select-wrap .select-option span:after,
.slp-header .select-wrap .select-option-click span:after {
  border-top: 4px solid #fff
}

.elp-content,
.loading-area-light,
.mlp-alert,
.slp-header .select-wrap .sub-nav-container ul,
.slp-header .select-wrap .sub-nav-container ul li {
  background: #fff
}

.slp-header .select-wrap .select-option-click.active span,
.slp-header .select-wrap .select-option-click:hover span,
.slp-header .select-wrap .select-option:hover span {
  background-color: #3a5375
}

.section-editor-header ul.dropdown-nav > li:hover,
.slp-content .select-wrap .sub-nav-container ul li:hover,
.slp-header .select-wrap .sub-nav-container ul li:hover,
.viewer-layer-container li:hover {
  background: #f1f1f1;
}

ul.dropdown-nav > li:hover {
  background: #f1f1f1;
}


.slp-content .select-wrap .select-option span:after,
.slp-content .select-wrap .select-option-click span:after {
  border-top: 4px solid #4e5669
}

.slp-content .select-wrap .select-option-click.active span,
.slp-content .select-wrap .select-option-click:hover span,
.slp-content .select-wrap .select-option:hover span {
  background-color: #eef2f6
}

.slp-content .list-wrap {
  background: #eef0f6;
  padding: 0 1rem
}

.select-wrap .date-wrap {
  border-top: 1px solid #eef0f6;
  margin-top: .5rem;
  padding: .5rem 10px
}

.elp-content .zoom-item .range-text,
.point-menu-list .main-item,
.sdc-wrap .form-control,
.sdc-wrap .label,
.select-wrap .date-wrap .caption,
.slp-content .contact-list-container .added .mail {
  font-size: .875rem
}

.select-wrap .date-wrap .input-item {
  position: relative;
  margin-top: .25rem
}

.select-wrap .date-wrap input {
  font-size: .75rem;
  border: 1px solid #c6cdde;
  padding: .375rem 30px .375rem 10px;
  border-radius: .25rem;
  width: 110px
}

.select-wrap .date-wrap label {
  width: 30px;
  height: 30px;
  display: block;
  position: absolute;
  top: 1px;
  right: 0;
  background-image: url(../img/setting/setting-icon-date.png);
  background-position: center;
  background-repeat: no-repeat;
  font-size: 0;
  line-height: 0;
  color: transparent
}

.slp-content .view-type-icon-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: flex-end;
  padding: .5rem 0
}

.slp-content .type-open:after {
  content: '';
  display: inline-block;
  width: 1px;
  height: 20px;
  background-color: #c6cdde;
  margin: 0 10px
}

.slp-content .type-open .btn-open {
  font-size: .875rem;
  color: #4e5669;
  border: 1px solid #c6cdde;
  border-radius: 1rem;
  height: 28px;
  padding: 2px .75rem;
  cursor: pointer
}

.slp-content .type-item {
  font-size: 0;
  letter-spacing: 0;
  color: transparent
}

.slp-content .view-type-icon-wrap .type-item label {
  display: inline-block;
  width: 30px;
  height: 30px;
  border-radius: 15px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer
}

.slp-content .type-toggle-list {
  background-image: url(../img/setting/setting-icon-type-list.png);
  background-color: #c6cdde
}

.slp-content .type-toggle-gallery {
  background-image: url(../img/setting/setting-icon-type-gallery.png);
  background-color: #c6cdde
}

.slp-content input:checked + .type-toggle-list {
  background-image: url(../img/setting/setting-icon-type-list-active.png);
  background-color: #fff
}

.slp-content input:checked + .type-toggle-gallery {
  background-image: url(../img/setting/setting-icon-type-gallery-active.png);
  background-color: #fff
}

.slp-content .file-control-list-wrap,
.slp-content .search-result-list-wrap {
  padding-top: .5rem
}

.slp-content .file-control-list-wrap ul.item-list,
.slp-content .search-result-list-wrap ul.item-list {
  min-height: 150px
}

.slp-content .file-control-list-wrap ul.item-list li,
.slp-content .search-result-list-wrap ul.item-list li {
  background: #fff;
  border-radius: .5rem;
  position: relative;
  cursor: pointer
}

.slp-content .file-control-list-wrap ul.item-list > li .file-make-data,
.slp-content .file-control-list-wrap ul.item-list > li .file-make-user,
.slp-content .file-control-list-wrap ul.item-list > li .file-make-user-before,
.slp-content .file-control-list-wrap ul.item-list > li .file-size,
.slp-content .search-result-list-wrap ul.item-list > li .file-make-data,
.slp-content .search-result-list-wrap ul.item-list > li .file-make-user,
.slp-content .search-result-list-wrap ul.item-list > li .file-make-user-before,
.slp-content .search-result-list-wrap ul.item-list > li .file-size {
  font-size: .875rem;
  padding-top: .5rem;
  padding-bottom: .5rem;
  padding-right: 1rem
}

.slp-content .save-file-wrap + .file-control-list-wrap,
.slp-content .view-type-icon-wrap + .search-result-list-wrap {
  padding-top: 0
}

.slp-content .file-control-list-wrap .scroll-box {
  max-height: 420px;
  margin-left: -1rem;
  margin-right: -1rem;
  padding-left: 1rem;
  padding-right: 1rem
}

.slp-content .list-nav-container {
  display: none;
  position: absolute;
  z-index: 1
}

.slp-content .list-nav-container ul {
  min-width: 70px;
  background: #fff;
  padding: 3px 0;
  border-radius: 6px
}

.slp-content .list-nav-container ul li {
  font-size: .875rem;
  padding: 4px 10px;
  opacity: .8;
  text-align: center;
  white-space: nowrap;
  cursor: pointer
}

.slp-content .contact-list-added li .edit.active,
.slp-content .contact-list-added li .view.active,
.slp-content .list-nav-container ul li:hover,
.slp-content .radio-wrap.active {
  opacity: 1
}

.mlp-footer .check-wrap,
.slp-content ul .file-item-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: space-between
}

.slp-content ul > li .file-name-wrap {
  flex: 1;
  padding: .5rem 0 .5rem 1rem;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  font-size: .875rem
}

.slp-content ul > li .file-name-wrap .file-thumbnail,
.slp-content ul > li .file-name-wrap .user-thumbnail {
  width: 20px;
  height: 20px;
  /*border-radius: 10px;*/
  display: block;
  margin-right: 5px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat
}

.slp-content ul > li span.file-setting {
  display: block;
  width: 30px;
  height: 30px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(../img/setting/setting-icon-type-setting.png);
  margin-left: 50px;
  cursor: pointer
}

.slp-content .no-result {
  width: 100%;
  display: block;
  text-align: center;
  padding: 4rem 0 3rem
}

.slp-content .save-file-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
  padding: .5rem 0
}

.slp-content .file-input-item .form-control {
  width: 370px;
  background-color: #fff
}

.slp-content .file-input-item .btn-save-file {
  width: 80px;
  height: 30px;
  position: absolute;
  top: 5px;
  right: 5px;
  color: #fff;
  background-color: #3c5f8e;
  border-radius: 1rem;
  text-align: center;
  padding: 4px 0;
  font-size: .875rem;
  line-height: 1
}

.slp-content ul.type-list > li + li {
  margin-top: 5px
}

.slp-content ul.type-list > li span.file-make-data {
  width: 130px;
  text-align: right
}

.slp-content ul.type-list > li span.file-make-user,
.slp-content ul.type-list > li span.file-make-user-before {
  width: 100px;
  text-align: right
}

.slp-content ul.type-list > li span.file-size {
  width: 90px;
  text-align: right
}

.slp-content ul.type-list .list-nav-container {
  top: 6px;
  right: 6px
}

.slp-content ul.type-list li:last-child .list-nav-container {
  top: auto;
  bottom: 6px;
  right: 6px
}

.slp-content ul.type-gallery {
  display: flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: -10px;
  max-height: 600px;
  overflow-y: auto
}

.slp-content ul.type-gallery > li,
.slp-content ul.type-new > li {
  width: calc(33.333% - 5px);
  margin-bottom: 10px
}

.slp-content ul.type-gallery .file-thumbnail,
.slp-content ul.type-new .file-thumbnail {
  padding: 1rem;
  border-bottom: 1px solid #eef0f6
}

.slp-content ul.type-gallery .file-thumbnail span,
.slp-content ul.type-new .file-thumbnail span {
  font-size: 0;
  letter-spacing: 0;
  color: transparent;
  display: block;
  height: 120px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover
}

.slp-content ul.type-gallery .list-nav-container {
  bottom: 6px;
  right: 6px
}

.slp-content .file-list-wrap ul.item-list li,
.slp-content .recent-list-wrap ul.item-list li {
  background: #fff;
  border-radius: .5rem;
  position: relative
}

.slp-content .file-list-wrap ul.item-list > li span,
.slp-content .recent-list-wrap ul.item-list > li .file-make-data,
.slp-content .recent-list-wrap ul.item-list > li .file-make-user,
.slp-content .recent-list-wrap ul.item-list > li .file-make-user-before,
.slp-content .recent-list-wrap ul.item-list > li .file-size {
  font-size: .875rem;
  cursor: pointer;
  padding-top: .5rem;
  padding-bottom: .5rem
}

.slp-content ul.type-new {
  display: flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-top: 1rem;
  margin-bottom: -10px;
  max-height: 600px;
  overflow-y: auto
}

.slp-content .setting-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: flex-start
}

.slp-content .setting-nav {
  width: 140px;
  height: 530px;
  border-right: 1px solid #dadfeb;
  padding: 1.5rem
}

.slp-content .setting-nav ul li {
  color: #6d758a;
  padding: .5rem 0;
  cursor: pointer;
  transition: color .15s ease-in-out
}

.slp-content .setting-nav ul li:hover {
  color: #2e61e2
}

.slp-content .setting-nav ul li.active {
  color: #233f65;
  font-weight: 700
}

.slp-content .setting-container {
  flex: 1;
  width: 100%;
  padding: 2rem 1.5rem
}

.slp-content .set-bg-radio-wrap .item-group {
  display: flex;
  display: -ms-flexbox;
  background-color: #eef0f6;
  border-radius: 20px;
  overflow: hidden
}

.slp-content .set-bg-radio-wrap .type-item label {
  display: inline-block;
  width: 80px;
  height: 40px;
  cursor: pointer;
  color: #333;
  font-size: .875rem;
  text-align: center;
  padding: 9px 0;
  border-radius: 20px
}

.elp-content .tap-group .type-item input:checked + label,
.slp-content .set-bg-radio-wrap .type-item input:checked + label {
  color: #fff !important;
  background-color: #3c5f8e
}

.slp-content .set-bg-container {
  height: auto
}

.slp-content .set-bg-img-wrap {
  position: relative;
  margin-top: 20px;
  width: 300px;
  height: 200px;
  display: block;
  border-radius: 20px;
  overflow: hidden
}

.slp-content .set-bg-img-wrap .bg-thumbnail {
  width: 300px;
  height: 200px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center
}

.elp-content .set-profile-img-wrap .btn-change-img,
.slp-content .set-bg-img-wrap .btn-change-img,
.slp-content .set-profile-img-wrap .btn-change-img {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  height: 40px;
  font-size: .875rem;
  color: #fff;
  background-color: #0005;
  z-index: 1;
  padding: .725rem 0;
  cursor: pointer
}

.elp-content .set-profile-img-wrap .btn-delete,
.slp-content .set-bg-img-wrap .btn-delete,
.slp-content .set-profile-img-wrap .btn-delete {
  position: absolute;
  bottom: 0;
  padding: 10px;
  background-image: url(../img/setting/setting-icon-delete.png);
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  z-index: 1
}

.slp-content .set-bg-img-wrap .btn-delete {
  top: 5px;
  right: 5px;
  width: 35px;
  height: 35px
}

.slp-content ul.img-wrap-list,
.slp-content ul.link-list {
  display: flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
  margin: -5px
}

.slp-content ul.img-wrap-list li,
.slp-content ul.link-list li {
  width: 20%;
  padding: 5px
}

.slp-content ul.img-wrap-list .img-thumbnail {
  width: 100%;
  height: 103px;
  background-size: cover;
  background-color: #eef0f6;
  background-position: center;
  border-radius: 20px;
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  align-items: center
}

.slp-content ul.img-wrap-list .added,
.slp-content ul.link-list .added {
  position: relative;
  cursor: pointer
}

.slp-content ul.img-wrap-list .ready {
  background-size: 50%;
  background-repeat: no-repeat;
  background-image: url(../img/dashboard/dashboard-icon-add-mark-dark.png);
  cursor: pointer
}

.slp-content ul.img-wrap-list .added .close {
  display: block;
  width: 30px;
  height: 30px;
  background-color: #0005;
  border-radius: 15px;
  background-image: url(../img/setting/setting-icon-link-close.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  right: 0
}

.slp-content .label-flex-start {
  align-items: flex-start !important;
  padding-top: 1rem
}

.elp-content .set-profile-img-wrap,
.slp-content .set-profile-img-wrap {
  width: 120px;
  height: 120px;
  display: block;
  border-radius: 20px;
  overflow: hidden;
  position: relative
}

.elp-content .set-profile-img-wrap .bg-thumbnail,
.slp-content .set-profile-img-wrap .bg-thumbnail {
  width: 120px;
  height: 120px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center
}

.elp-content .set-profile-img-wrap .btn-delete,
.slp-content .set-profile-img-wrap .btn-delete {
  top: 0;
  right: 0;
  width: 35px;
  height: 35px
}

.slp-content .set-bg-color-wrap {
  margin-top: 20px;
  width: 200px
}

.slp-content .set-bg-color-wrap .color-preview {
  width: 20px;
  height: 20px;
  border: 1px solid #c9cfe0;
  border-radius: 1rem
}

.slp-content .set-bg-color-wrap .color-code {
  border-bottom: 1px solid #c6cdde;
  margin-left: 10px;
  padding: 0 .375rem
}

.slp-content .set-bg-color-wrap .color-picker-area {
  margin-top: 1.5rem;
  position: relative;
}

.slp-content .color-picker-area .panel-item-label {
  color: #4e5669;
  font-size: .875rem;
  cursor: pointer
}

.slp-content .color-picker-area .color-palate-plus {
  width: 20px;
  height: 20px;
  background-image: url(../img/editor/editor-panel-color-palate-plus.png);
  background-position: center;
  background-repeat: no-repeat;
  background-color: #eef0f6
}

.slp-content .color-picker-area .color-chip-group {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: space-between;
  margin-top: .5rem
}

.slp-content .color-picker-area .color-chip {
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  border: 1px solid #dadfeb;
  cursor: pointer;
}

.slp-content .color-picker-area ul.color-set {
  border: 1px solid #dadfeb;
  margin-top: .25rem;
  border-radius: 1rem;
  overflow: hidden;
  
}

.slp-content .color-picker-area ul.color-set li {
  width: calc(1rem - 2px);
  height: calc(1rem - 2px);
  cursor: pointer
}

.slp-content .color-picker-area .color-picker-module {
  position: absolute;
  top: 150px;
  left: 0;
  padding: 1rem;
  border-radius: .5rem;
  background: #fff;
  display: none
}

.slp-content .color-picker-area .color-picker-module .close {
  width: 30px;
  height: 30px;
  background-image: url(../img/editor/editor-btn-color-close.png);
  position: absolute;
  top: 0;
  right: 0
}

.elp-content .radio-item,
.slp-content .input-bg-group .left-area,
.slp-content .input-link-group .left-area,
.slp-content .input-profile-group .left-area {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  width: 120px
}

.slp-content .input-link-group .right-area,
.slp-content .input-profile-group .right-area {
  flex: 1;
  position: relative
}

.slp-content .input-bg-group .bg-label,
.slp-content .input-link-group .link-label,
.slp-content .input-profile-group .profile-label,
.slp-content .wrap-title {
  color: #6d758a;
  font-size: .875rem
}

.elp-content .block-title .form-check-input + label,
.elp-content .option-block .btn-item + .btn-item,
.elp-content .option-block .item-dummy-sm + .select-item-sm,
.elp-content .option-block .select-item + .select-item,
.elp-content .option-block .wrap + .wrap,
.elp-content .select-item .option-name,
.elp-content input + .check-label,
.slp-content .input-bg-group input + .bg-label,
.slp-content .input-link-group input + .link-label,
.slp-content .input-profile-group input + .profile-label {
  margin-left: 10px
}

.slp-content .input-cloud-group {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between
}

.slp-content .cloud-icon-wrap {
  border-radius: 20px;
  overflow: hidden
}

.slp-content .cloud-service-wrap .service {
  font-size: 1.125rem;
  line-height: 1
}

.elp-content .check-label,
.slp-content .cloud-service-wrap .account {
  font-size: .875rem;
  color: #6d758a
}

.slp-content .form-control {
  border-color: #c6cdde;
  border-radius: 100px;
  background-color: transparent;
  font-size: .875rem;
  padding: .5rem 1.5rem
}

.slp-content .link-file-label,
.slp-content .profile-file-label {
  display: block;
  width: 100%;
  color: #6d758a;
  font-size: .875rem;
  cursor: pointer;
  padding: .5rem 6rem .5rem 1.5rem;
  border: 1px solid #c6cdde;
  border-radius: 20px;
  background-color: transparent;
  min-height: 39px
}

.slp-content .link-file-label:after,
.slp-content .profile-file-label:after {
  content: '����';
  width: 80px;
  height: 30px;
  position: absolute;
  top: 5px;
  right: 5px;
  background-color: #e8eaf1;
  border-radius: 1rem;
  text-align: center;
  padding: 4px 0
}

.slp-content .link-wrap {
  padding-bottom: 20px;
  border-bottom: 1px solid #dadfeb;
  margin-bottom: 20px
}

.slp-content ul.link-list .link-icon {
  width: 100%;
  height: 103px;
  background: #eef0f6;
  border: 2px solid #eef0f6;
  border-radius: 20px;
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  align-items: center
}

.slp-content ul.link-list .added.active,
.slp-content ul.link-list .link-icon.active {
  background: #fff;
  border: 2px solid #969cad
}

.slp-content ul.link-list .added .favicon,
.slp-content ul.link-list .ready .favicon {
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 25px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  cursor: pointer
}

.slp-content ul.link-list .added .close {
  display: block;
  width: 30px;
  height: 30px;
  background-image: url(../img/setting/setting-icon-link-close.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  right: 0
}

.slp-content .contact-group {
  width: 400px;
  padding: 20px
}

.slp-content .contact-group .title-wrap {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  align-items: center
}

.slp-content .contact-group .title-wrap01 {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  align-items: center
}


.slp-content .contact-group label {
  font-size: .875rem;
  height: 30px;
  padding-top: .25rem;
  display: block
}

.slp-content .contact-group .editor-btn-set-setting {
  display: block;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(../img/editor/editor-btn-set-setting.png);
  background-position: center
}

.slp-content .contact-group .contact-group-head,
.slp-content .version-container .version-head {
  padding: .5rem;
  border: 1px solid #c6cdde;
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
  display: flex;
  display: -ms-flexbox;
  font-size: .875rem
}

.slp-content .contact-group .contact-group-head .category-list {
  width: 100px;
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  position: relative;
  cursor: pointer
}

.slp-content .contact-group .contact-group-head .category-list:after {
  content: '';
  display: block;
  width: 1px;
  height: 20px;
  background: #dadfeb;
  position: absolute;
  top: 1px;
  right: 0
}


.slp-content .contact-group .contact-group-head01 {
  padding: .5rem .5rem .5rem .5rem;
  display: flex;
  display: -ms-flexbox;
  font-size: .875rem
}

.slp-content .contact-group .contact-group-head01 .category-list {
  min-width: 50px;
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  position: relative;
  cursor: pointer
}

.slp-content .contact-group .contact-group-head .contact-sort {
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  flex: 1;
  cursor: pointer
}

.slp-content .contact-group .contact-group-head .contact-authority {
  width: 50px;
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  position: relative
}

.slp-content .contact-group .contact-group-head .contact-authority:before {
  content: '';
  display: block;
  width: 1px;
  height: 20px;
  background: #dadfeb;
  position: absolute;
  top: 1px;
  left: 0
}

.slp-content .contact-group .contact-group-head .point-menu-list {
  z-index: 1;
  left: 5px;
  top: 25px
}


.slp-content .contact-group .contact-group-head01 .point-menu-list {
  z-index: 1;
  left: 5px;
  top: 25px
}

.slp-content .contact-group .editor-btn-set-arrow {
  display: block;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-image: url(../img/editor/editor-btn-set-arrow.png);
  background-position: center
}

.slp-content .contact-group .editor-btn-set-sort {
  display: block;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-image: url(../img/editor/editor-btn-set-sort.png);
  background-position: center
}

.slp-content .contact-group .contact-group-body {
  padding: .25rem .5rem;
  border: 1px solid #c6cdde;
  border-bottom-left-radius: .5rem;
  border-bottom-right-radius: .5rem;
  margin-top: -1px;
  height: 362px
}

.slp-content .contact-list-saved li {
  position: relative;
  border-radius: .5rem
}

.slp-content .contact-list-added li:hover,
.slp-content .contact-list-saved li:hover {
  background: #e3e9f8;
  cursor: pointer !important
}

.slp-content .contact-category-nav .added .wrap:hover,
.slp-content .contact-list-added li.active,
.slp-content .contact-list-container .added .wrap:hover,
.slp-content .contact-list-saved li.active {
  background: #adc0ee
}

.slp-content .contact-list-saved label {
  display: flex;
  display: -ms-flexbox;
  font-size: .875rem;
  padding: .25rem
}

.slp-content .contact-list-saved li .category {
  width: 100px;
  text-align: center;
  padding-right: 1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.slp-content .contact-list-saved li .email {
  width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.slp-content .contact-list-added li {
  display: flex;
  display: -ms-flexbox;
  font-size: .875rem;
  padding: .25rem .5rem;
  border-radius: .5rem;
  justify-content: space-between
}

.slp-content .contact-list-added li .user-info {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-right: 1rem
}

.slp-content .contact-list-added li .edit,
.slp-content .contact-list-added li .view {
  display: block;
  width: 20px;
  height: 20px;
  font-size: 0;
  letter-spacing: 0;
  line-height: 0;
  opacity: .5;
  background-repeat: no-repeat;
  background-position: center
}

.slp-content .contact-list-added li .edit {
  background-image: url(../img/editor/editor-btn-list-edit.png)
}

.slp-content .contact-list-added li .view {
  background-image: url(../img/editor/editor-btn-list-view.png)
}

.slp-content .contact-arrow {
  flex: 1;
  display: flex;
  display: -ms-flexbox;
  flex-flow: column;
  justify-content: center;
  height: 100%
}

.slp-content .editor-btn-set-left,
.slp-content .editor-btn-set-right {
  width: 40px;
  height: 40px;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer
}

.slp-content .editor-btn-set-left {
  border: 1px solid #cad0e0;
  border-radius: 20px;
  background-image: url(../img/editor/editor-btn-set-left.png)
}

.slp-content .editor-btn-set-right {
  border: 1px solid #cad0e0;
  border-radius: 20px;
  background-image: url(../img/editor/editor-btn-set-right.png)
}

.btn-align-wrap .btn + .btn,
.section-editor-header .nav-sub .wrap + .wrap,
.slp-content .editor-btn-set-left + .editor-btn-set-right,
.slp-content .version-btn-wrap .btn + .btn {
  margin-top: .5rem
}


.nav-sub .wrap + .wrap {
  margin-top: .5rem
}


.slp-content .contact-list {
  width: 320px;
  padding: 20px
}

.slp-content .contact-list label {
  height: 30px;
  padding-top: .25rem;
  display: block;
  font-size: .875rem
}

.slp-content .contact-wrap {
  display: flex;
  display: -ms-flexbox;
  width: 100%;
  align-items: center
}

.slp-content .contact-category-nav {
  width: 200px;
  height: 500px;
  border-right: 1px solid #dadfeb;
  padding: 1rem .5rem
}

.slp-content .contact-category-nav ul {
  padding-top: .5rem;
  margin: 0 -1.5rem
}

.slp-content .contact-category-nav .added {
  padding: 0 .5rem;
  cursor: pointer
}

.slp-content .contact-category-nav .added .wrap {
  padding: .5rem 1rem .5rem 2.5rem;
  font-size: .875rem;
  border-radius: .5rem;
  position: relative
}

.slp-content .contact-category-nav .added .wrap:before {
  content: '';
  display: block;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(../img/editor/editor-btn-folder.png);
  background-position: center;
  position: absolute;
  top: 3px;
  left: .5rem
}

.slp-content .contact-category-nav .added .wrap:hover .edit,
.slp-content .contact-list-container .added .wrap:hover .edit {
  position: absolute;
  display: block;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(../img/editor/editor-btn-list-edit.png);
  background-position: center;
  top: 3px;
  right: 30px
}

.slp-content .contact-category-nav .added .wrap:hover .delete,
.slp-content .contact-list-container .added .wrap:hover .delete {
  position: absolute;
  display: block;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(../img/editor/editor-btn-list-close.png);
  background-position: center;
  top: 3px;
  right: 0
}

.slp-content .contact-category-nav .added .wrap:hover:before,
.slp-content .contact-category-nav .added.active .wrap:before {
  background-image: url(../img/editor/editor-btn-folder-active.png)
}

.slp-content .contact-category-nav .edit-list,
.slp-content .contact-list-container .edit-list {
  background: #f4f6fb;
  padding: .5rem;
  display: flex;
  display: -ms-flexbox
}

.slp-content .contact-category-nav .edit-list .category-input {
  background: #fff;
  border: 1px solid #dadfeb;
  border-radius: .5rem;
  padding: 3px .5rem;
  font-size: .875rem;
  height: 30px;
  width: 119px
}

.slp-content .contact-category-nav .edit-list .close,
.slp-content .contact-list-container .edit-list .close {
  background: url(../img/editor/editor-btn-list-close.png) center no-repeat #fff;
  border: 1px solid #dadfeb;
  border-radius: .5rem;
  width: 30px;
  height: 30px;
  margin-left: 2px
}

.slp-content .contact-category-nav .edit-list .check,
.slp-content .contact-list-container .edit-list .check {
  background: url(../img/editor/editor-btn-list-check.png) center no-repeat #fff;
  border: 1px solid #dadfeb;
  border-radius: .5rem;
  width: 30px;
  height: 30px;
  margin-left: 2px
}

.slp-content .contact-container {
  flex: 1;
  width: 100%;
  padding: 1.5rem
}

.slp-content .contact-title-wrap {
  display: -ms-flexbox;
  display: flex;
  font-size: .875rem;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #eef0f6;
  padding-bottom: .25rem
}

.slp-content .editor-btn-set-add-contact {
  display: block;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(../img/editor/editor-btn-set-add-contact.png);
  background-position: center;
  cursor: pointer
}

.slp-content .contact-list-container {
  width: 100%;
  padding: 1rem 1.5rem
}

.slp-content .contact-list-container ul {
  margin: 0 -1.5rem -1rem;
  padding-top: .5rem;
  overflow-y: auto;
  height: 449px
}

.slp-content .contact-list-container .added .wrap {
  display: flex;
  display: -ms-flexbox;
  padding: .5rem 1rem;
  font-size: .875rem;
  border-radius: .5rem;
  position: relative
}

.slp-content .contact-list-container .added .category,
.slp-content .contact-list-container .added .name {
  width: 100px;
  font-size: .875rem
}

.slp-content .contact-list-container .edit-list .category-input,
.slp-content .contact-list-container .edit-list .mail-input,
.slp-content .contact-list-container .edit-list .name-input {
  background: #fff;
  border: 1px solid #dadfeb;
  border-radius: .5rem;
  padding: 3px .5rem;
  font-size: .875rem;
  height: 30px
}

.slp-content .contact-list-container .edit-list .category-input {
  width: 104px
}

.slp-content .contact-list-container .edit-list .name-input {
  width: 99px;
  margin-left: 2px
}

.slp-content .contact-list-container .edit-list .mail-input {
  width: 253px;
  margin-left: 2px
}

.slp-content .vote-container .vote-title {
  border-bottom: 1px solid #eef0f6;
  padding: 1rem;
  width: 400px
}

.slp-content .vote-container .vote-title input {
  font-size: .875rem;
  width: 100%
}

.slp-content .vote-container .vote-option {
  padding: .5rem 1rem
}

.slp-content .vote-container .vote-option li {
  padding: .5rem 0;
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  align-items: center;
  font-size: .875rem
}

.slp-content .vote-container .vote-option .num {
  width: 20px;
  height: 20px;
  text-align: center;
  background-color: #6d758a;
  font-size: .75rem;
  color: #fff;
  border-radius: 1rem;
  margin-right: .5rem
}

.slp-content .vote-container .vote-option li:first-child .num {
  background-color: #3c5f8e !important
}

.slp-content .vote-container .vote-time {
  border-top: 1px solid #eef0f6;
  padding: 1rem;
  width: 400px;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: space-between
}

.slp-content .vote-container .option-item label {
  font-size: .875rem;
  margin-left: .5rem
}

.slp-content .version-container {
  width: 610px;
  padding: 20px
}

.slp-content .version-head .num {
  width: 60px;
  text-align: center
}

.slp-content .version-head .date {
  width: 125px;
  text-align: center;
  position: relative
}

.slp-content .version-head .date:before,
.slp-content .version-head .mention:before,
.slp-content .version-head .version:before,
.slp-content .version-head .worker:before {
  content: '';
  position: absolute;
  width: 1px;
  height: 12px;
  background: #eef0f6;
  top: 5px;
  left: 0
}

.slp-content .version-head .worker {
  width: 90px;
  text-align: center;
  position: relative
}

.slp-content .version-head .mention {
  flex: 1;
  text-align: center;
  position: relative
}

.slp-content .version-head .version {
  width: 109px;
  text-align: center;
  position: relative
}

.slp-content .version-container .version-body {
  padding: .25rem .5rem;
  border: 1px solid #c6cdde;
  border-bottom-left-radius: .5rem;
  border-bottom-right-radius: .5rem;
  margin-top: -1px;
  min-height: 362px;
  height: auto
}

.slp-content .version-list li {
  display: flex;
  display: -ms-flexbox;
  font-size: .875rem;
  padding: .25rem;
  position: relative
}

.slp-content .version-list li:hover {
  background: #f4f6fb;
  border-radius: .5rem;
  cursor: pointer
}

.section-editor-header .btn-top-back,
.section-editor-header .btn-top-dashboard,
.section-editor-header .btn-top-do,
.section-editor-header .btn-top-folder,
.section-editor-header .btn-top-key,
.section-editor-header .btn-top-new,
.section-editor-header .btn-top-redo,
.section-editor-header .btn-top-trans,
.section-editor-wrap .alert-message > div:before {
  background-position: center;
  background-repeat: no-repeat
}


.btn-top-back,
.btn-top-dashboard,
.btn-top-do,
.btn-top-folder,
.btn-top-key,
.btn-top-new,
.btn-top-redo,
.btn-top-trans {
  background-position: center;
  background-repeat: no-repeat
}



.slp-content .version-list li .num {
  width: 50px;
  text-align: center
}

.slp-content .version-list li .date {
  width: 130px;
  text-align: center
}

.slp-content .version-list li .worker {
  width: 90px;
  text-align: center
}

.slp-content .version-list li .mention {
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 174px
}

.slp-content .version-list li .version {
  width: 100px;
  text-align: center
}

.slp-content .version-btn-wrap {
  width: 130px;
  padding: 20px 20px 0 0
}

.slp-content .version-btn-wrap .btn {
  width: 110px
}

.slp-content-radius .file-control-list-wrap ul.item-list,
.slp-content-radius .search-result-list-wrap ul.item-list {
  padding: 0 0 1rem
}

.page-editor .btn-icon {
  border-radius: 4px;
  font-size: 0;
  flex: 0 0 auto;
  letter-spacing: 0;
  color: transparent;
  width: 30px;
  height: 30px;
  position: relative;
  cursor: pointer;
  transition: background-color .15s ease-in-out;
}

.page-editor .btn-icon.type2 {
  height: 26px;
  width: 26px;
}

.btn-icon span.tip-label {
  font-size: .75rem;
  color: #fff;
  display: inline-block;
  width: max-content;
  height: 26px;
  padding: 3px 10px;
  border-radius: .25rem;
  background-color: #131416;
  position: absolute;
  top: 2px;
  left: 40px;
  transition: opacity .15s ease-in-out;
  z-index: 99;
}

.btn-icon span.tip-label:after {
   content: '';
  position: absolute;
  top: 9px;
  left: -3px; /* 더 왼쪽으로 조정 */
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-right: 4px solid #131416; /* 왼쪽을 향하는 삼각형 */
  z-index: 99;
}

.section-editor-header {
/* display: inline-flex;*/
   display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: space-between;
  /*height: 50px;*/
  /*background-color: #044a89;*/
  padding: 0 0px 0 12px;
  position: relative;
}

.section-editor-header .nav-wrap-left {
  justify-content: flex-start;
 /*width: 300px;*/
 background: #fff;
 border-radius: 25px;
}


.nav-wrap-left {
  justify-content: flex-start;
  position:fixed; 
  z-index: 100;
  display:inline-block;
  top:10px;
  left:15px;
  /*height:50px;*/
  padding-top:3px;
  display: flex;
}




.section-editor-header .nav-wrap-center { 
  justify-content: center;
  position: relative;
  display: inline-flex;
  align-items: center;
  background-color: #044a89;
  border-radius: 25px;
  padding:0px 20px;
}

.nav-wrap-center { 
  display: flex;
  justify-content: center; /* horizontal centering */
  align-items: center;
  position:absolute; 
  z-index: 100;
  margin:0px auto 0px auto;
  /*height:50px;*/
  left:50%;
  transform: translate(-50%, 0);
  top:7px;
  color:#fff;
}

.nav-wrap-center .headerbgblue {

  background-color: #044a89;
  border-radius: 25px;
  padding:0px 20px;  
  display: flex;
  z-index:5;
}


.nav-wrap-center .share-file-name-wrap {
  color:#fff;
  align-items: center;
  padding: 7px 5px 7px 5px;
}

.nav-wrap-center01 { 
  display: flex;
  justify-content: center; /* horizontal centering */
  align-items: center;
  position:absolute; 
  z-index: 100;
  margin:0px auto 0px auto;
  /*height:50px;*/
  left:50%;
  transform: translate(-50%, 0);
  top:7px;
  color:#fff;
  padding-left:70px;
}

.nav-wrap-center01 .headerbgblue {

  background-color: #044a89;
  border-radius: 25px;
  padding:0px 20px;  
  display: flex;
  z-index:5;
}

.section-editor-header .nav-wrap-center  .file-name-wrap {
  padding:10px 10px !important;  
  height:40px;

}

.section-editor-header .nav-wrap-center01  .file-name-wrap {
  padding:10px 0px !important;  
  height:40px;
}



.nav-wrap-center  .file-name-wrap {
  padding:10px 0px !important;  
  height:40px;
}

.nav-wrap-center01  .file-name-wrap {
  padding:10px 0px !important;  
  height:40px;
}


.section-editor-header .nav-wrap-center  .file-name-wrap .file-name .title {
  width:100%;
  max-width:400px;
  min-width:120px;
  white-space: nowrap;  
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left:5px;
}

.section-editor-header .nav-wrap-center01  .file-name-wrap .file-name .title {
  width:100%;
  max-width:400px;
  min-width:120px;
  white-space: nowrap;  
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left:5px;
}

.nav-wrap-center  .file-name-wrap .file-name .title {
  width:100%;
  max-width:400px;
  min-width:120px;
  white-space: nowrap;  
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left:5px;
}

.nav-wrap-center01  .file-name-wrap .file-name .title {
  width:100%;
  max-width:400px;
  min-width:120px;
  white-space: nowrap;  
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left:5px;
}

.nav-wrap-center .dropdown-nav-wrap{
  color:#333;
}

.nav-wrap-center01 .dropdown-nav-wrap{
  color:#333;
}

.section-editor-header .nav-wrap-center .dropdown-nav-wrap{
  color:#333;
}

.section-editor-header .nav-wrap-center01 .dropdown-nav-wrap{
  color:#333;
}





.section-editor-header .nav-wrap-right {
  justify-content: flex-end;
  gap: 12px; 
  padding-right:34px;
  /*margin-right:25px;*/
/*  width: 350px;
  background: #fff;
    border-radius: 25px;
    height:38px;
    padding-right:5px;*/
}

.nav-wrap-right { 
  position: fixed;
  right: 30px;
  top: 11px;
  text-align: right;
  z-index: 100;
  display: flex;
}

.ssnav-wrap-right { 
  text-align: left;
}


.nav-wrap-right-do {
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    padding: 0px;
    margin-left: 10px;
    position: relative;
    gap:10px;
   /* background-color:#fff;*/

}

.nav-wrap-right-do > .btn-top-redo {
  background-image: url(../img/common/btn-top-redo.svg);
     background-size: 120%;
    background-position: center;
    width: 30px;
    border-radius: 100%;
    height: 30px;
    background-color: #fff;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
}

.nav-wrap-right-do > .btn-top-do {
  background-image: url(../img/common/btn-top-do.svg);
  background-size: 120%;
    background-position: center;
    width: 30px;
    height: 30px;
    background-color: #fff;
    border-radius: 100%;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
}



.section-editor-header .nav-wrap-right.on {
}

.section-editor-header .nav-wrap-right .btn-view-arrow {
  background-color: #fff;
  background-image: url(../img/common/view-arrow.svg);
  background-repeat: no-repeat;
  background-size:8px;
  background-position:5px center;
  width:20px;
  height:20px;
  display:block;
  color: transparent;
  font-size:8px;
  cursor: pointer;
  border-radius: 25px;
  margin-top:3px;
}

.nav-wrap-right .btn-view-arrow {
  background-color: #fff;
  background-image: url(../img/common/view-arrow.svg);
  background-repeat: no-repeat;
  background-size:10px;
  background-position:6px center;
  width:25px;
  height:25px;
  display:block;
  color: transparent;
  font-size:8px;
  cursor: pointer;
  border-radius: 25px;
  margin-top:3px;
}


.section-editor-header .nav-wrap-right.on .btn-view-arrow {
  background-color: #fff;
  background-image: url(../img/common/view-arrow.svg);
  background-repeat: no-repeat;
  background-size:8px;
  background-position:5px center;
  transform: rotate(180deg);
  width:20px;
  height:20px;
  display:block;
  color: transparent;
  font-size:8px;
  cursor: pointer;
  border-radius: 25px;
  margin-top:3px;
}

.nav-wrap-search { 
  /*position: fixed;
  left: 150px;
  top: 7px;*/
  text-align: right;
  z-index: 100;
  display: flex;
}







.nav-wrap-search .btn-view-arrow {
  background-color: #fff;
  background-image: url(../img/common/btn_search_bottom.svg);
  background-repeat: no-repeat;
  background-size:13px;
  background-position:top center;
  transform: rotate(90deg);
  width:20px;
  height:20px;
  display:block;
  color: transparent;
  font-size:8px;
  cursor: pointer;
  margin-top:0px;
}




.nav-wrap-search.on .btn-view-arrow {
  background-color: #fff;
  background-image: url(../img/common/btn_search_bottom.svg);
  background-repeat: no-repeat;
  background-size:13px;
  background-position:top center;
  transform: rotate(-90deg);
  width:20px;
  height:20px;
  display:block;
  color: transparent;
  font-size:8px;
  cursor: pointer;
  margin-top:0px;
}

.btn-view-arrow-bottom {
  background-color: #fff;
  background-image: url(../img/common/btn_search_bottom.svg);
  background-repeat: no-repeat;
  background-size:13px;
  background-position:top center;
  width:20px;
  height:20px;
  display:block;
  color: transparent;
  font-size:8px;
  cursor: pointer;
  margin-top:0px;
}





.section-editor-header .nav-wrap-right .btn-top-trans-b {
  display:none;
}
.section-editor-header .nav-wrap-right.on .btn-top-trans-b {
  display:block;
}
/*
.section-editor-header .nav-wrap-right .btn-top-trans {
  display:none;
}
.section-editor-header .nav-wrap-right.on .btn-top-trans {
  display:block;
}
*/

.section-editor-header .nav-wrap-right .search-wrap {
  display:none;
}
.section-editor-header .nav-wrap-right.on .search-wrap {
  display:block;
}

.nav-wrap-right .btn-top-trans-b {
  /*display:none;*/
  display:block;
}

/*
.nav-wrap-right .btn-top-trans {
  display:none;
}
*/
.nav-wrap-right.on .btn-top-trans-b {
  display:block;
  border-radius: 19px;
  width:38px;
  height:38px;
  justify-items: center;
  /*background-color:transparent !important;*/
}
/*
.nav-wrap-right.on .btn-top-trans {
  display:block;
  border-radius: 19px;
  width:38px;
  height:38px;
  justify-items: center;
}
*/
/*
.nav-wrap-right .search-wrap {
  display:none;
}*/
.nav-wrap-right.on .search-wrap {
  display:block;
  margin-left:15px;
}


.section-editor-header .btn-top-back {
  background-image: url(../img/editor/editor-btn-top-back.png)
}

.section-editor-header .btn-top-dashboard {
  background-image: url(../img/editor/editor-btn-top-dashboard.png);
  background-size: cover
}

.section-editor-header .btn-top-key {
  background-image: url(../img/editor/editor-btn-top-key.svg);
}

.section-editor-header .btn-top-new {
  background-image: url(../img/editor/editor-btn-top-new.svg)
}

.section-editor-header .btn-top-folder {
  background-image: url(../img/editor/editor-btn-top-folder.svg)
}

.section-editor-header .btn-top-redo {
  background-image: url(../img/editor/editor-btn-top-redo.svg)
}

.btn-top-redo {
  background-image: url(../img/editor/editor-btn-top-redo.svg);
  background-size:23px;
}

.section-editor-header .btn-top-do {
  background-image: url(../img/editor/editor-btn-top-do.svg)
}

.btn-top-do {
  background-image: url(../img/editor/editor-btn-top-do.svg);
  background-size:35px;
}

.section-editor-header .btn-top-trans {
  background-image: url(../img/common/i_translate_disable.svg);
}

.btn-top-trans {
  background-image: url(../img/common/i_translate_disable.svg);
}

.section-editor-header .btn-top-trans-b {
  background-image: url(../img/common/i_translate_b.svg);
  background-repeat: no-repeat;
  background-color:#fff;
  border-radius: 20px;
}


.btn-top-trans-b {
  background-image: url(../img/common/i_translate_b.svg);
  background-repeat: no-repeat;
  background-color:#fff;
  margin-left:10px;
  background-position: center center;
}

.section-editor-header .btn-top-trans.none {
  background-image: none;
}
.btn-top-trans.none {
  background-image: none;
}

.section-editor-header .tool-tip-container {
  position: absolute;
  width: 200px;
  bottom: -35px;
  left: -150vw;
  z-index: 9;
  text-align: center
}
.tool-tip-container {
  position: absolute;
  width: 200px;
  bottom: -35px;
  left: -150vw;
  z-index: 9;
  text-align: center
}

.section-editor-header .file-name-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding: 13px 0;
  /*height: 50px*/
}
.file-name-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding: 0px;
  margin-left:10px;
  border:1px solid #CFCFCF;
  border-radius: .3rem;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
  min-width:170px;
  /*height: 50px;*/
  position: relative;
  background-color:#fff;
}

.ssfile-name-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-self: flex-end;
  padding: 0px !important;
  box-shadow: 0px;
  min-width:70px;
  position: relative;
  background-color:#fff;
  border:1px solid #CFCFCF;
  border-radius: .3rem;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
}


.ssfile-name-wrap .file-name {
  font-weight: bold;
    color: #181818;
}

.ssfile-name-wrap .file-name:hover {
  background-color: #f2f3f7 !important;
  color:#131315;
}
.ssfile-name-wrap .file-name .title {
  cursor: pointer;
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    padding: 0px 10px 0px 0px;
}

.ssfile-name-wrap:disabled{
  background-color: #ffffff;
  border-color: #ececec !important;
  color: #bcbbc1;
  cursor: not-allowed;
}



.ssfile-name-wrap02 {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding: 0px;
  margin-left:0px;
  box-shadow: 0px;
  min-width:70px;
}


.ssfile-name-wrap02 .file-name {
  font-weight: bold;
    color: #181818;
  background-color:#fff;
  border-radius: .3rem;
}

.ssfile-name-wrap02 .file-name:hover{
  background-color: #f2f3f7 !important;
  color:#131315;
}

.ssdisabled{
  background-color: #ffffff;
  border-color: #ececec !important;
  color: #bcbbc1;
  cursor: not-allowed;
}


.ssfile-name-wrap03 {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding: 0px;
  margin-left:10px;
  min-width:70px;
  position: relative;
  border:0px;
  box-shadow: 0px;
}

.ssfile-name-wrap03 .file-name {
  font-weight: bold;
    color: #181818;
  border:1px solid #b6b6b6;
  background-color:#fff;
  border-radius: .3rem;
}

.ssfile-name-wrap03 .file-name:hover{
  background-color: #f2f3f7 !important;
  color:#131315;
}

.ssfile-name-wrap03:disabled{
  background-color: #ffffff;
  border-color: #ececec !important;
  color: #bcbbc1;
  cursor: not-allowed;
}



.file-name-wrap .btn-view-arrow {
  background-color: transparent;  
  background-image: url(../img/common/view-arrow-bottom.svg);
  background-repeat: no-repeat;
  background-size:8px;
  background-position:5px center;
  width:13px;
  height:20px;
  display:block;
  color: transparent;  
  font-size:8px;
  cursor: pointer; 
}

.ssfile-name-wrap .btn-view-arrow {
  background-color: transparent;  
  background-image: url(../img/common/view-arrow02-bottom.svg);
  background-repeat: no-repeat;
  background-size:13px;
  background-position:top center;
  width:13px;
  height:20px;
  display:block;
  color: transparent;  
  font-size:8px;
  cursor: pointer; 
}

.section-editor-header .file-name-wrap:after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 4px solid #fff;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  margin-left: 5px
}

.file-name-wrap:after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 4px solid #fff;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  margin-left: 5px
}


.ssfile-name-wrap02:after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 0px solid #fff;
  border-right: 0px solid transparent;
  border-left: 0px solid transparent;
  margin-left: 0px
}

.ssfile-name-wrap03:after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 0px solid #fff;
  border-right: 0px solid transparent;
  border-left: 0px solid transparent;
  margin-left: 0px
}



.section-editor-header .file-name-wrap .file-name {
  color: #fff;
  cursor: pointer;
  display: flex;
  display: -ms-flexbox;
  align-items: center
}

.file-name-wrap .file-name {
  /*color: #fff;*/
  cursor: pointer;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding:3px 10px;
}

.ssheader-menu-btn {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding: 3px 10px;
  margin-left:10px;
  border:1px solid #b6b6b6;
  cursor: pointer;
  border-radius: .3rem;
  position: relative;
  background-color:#fff;
  font-weight:bold;
  color: #181818;
}

.ssheader-menu-btn:hover{
  background-color: #f2f3f7 !important;
  color:#131315;
  border:1px solid #959698;
}
.ssheader-menu-btn:active{
  background-color: #ecebf0 !important;
  color:#17161b;
  border:1px solid #9a9b9d;
}
.ssheader-menu-btn:disabled{
  background-color: #ffffff;
  border-color: #ececec !important;
  color: #bcbbc1;
  cursor: not-allowed;
}


.dev-not {
 opacity: 0.5; 
}




.section-editor-header .file-name-wrap .file-name .icon-collaboration {
  background-image: url(/assets/img/common/icon-collaboration.svg);
  background-size:30px !important;
  background-position: left center;
  width: 30px !important;
  height: 30px;
  margin-right: 0rem;
}

.file-name-wrap .file-name .icon-collaboration {
  background-image: url(/assets/img/common/icon-collaboration.svg);
  background-size:30px !important;
  background-position: left center;
  width: 30px !important;
  height: 30px;
  margin-right: 0rem;
}


.icon-collaboration01 {
  background-image: url(/assets/img/common/icon-collaboration-333.svg);
  width: 22px;
  height: 22px;
  background-size: 28px;
  background-position:50% 50%; 
  /*margin-right: .25rem;*/
  margin-right:0px;

}



.btn-top-back {
  background-image: url(../img/editor/editor-btn-top-back.png);
}

.btn-top-dashboard {
  background-image: url(../img/editor/editor-btn-top-dashboard.png);
  background-size: cover
}

.btn-top-key {
  background-image: url(../img/editor/editor-btn-top-key.svg);
  background-size:36px;
}

.btn-top-new {
  background-image: url(../img/editor/editor-btn-top-new.svg);
  background-size:36px;
}

.btn-top-folder {
  background-image: url(../img/editor/editor-btn-top-folder.svg);  
  background-size:36px;
}

.section-editor-header .nav-sub ul > li.disabled,
.section-editor-header ul.dropdown-nav > li.disabled > .nav-item,
.viewer-layer-container .viewer-btn-back.disabled,
.viewer-layer-container .viewer-btn-left.disabled,
.viewer-layer-container .viewer-btn-right.disabled,
.viewer-layer-container .viewer-btn-zoom-minus.disabled,
.viewer-layer-container .viewer-btn-zoom-plus.disabled,
.viewer-layer-container .viewer-btn-zoom.disabled {
  cursor: default;
  opacity: .5
}

.nav-sub ul > li.disabled,
ul.dropdown-nav > li.disabled > .nav-item {
  cursor: default;
  opacity: .5
}

.section-editor-header .file-name-wrap .file-name .icon {
  width: 1rem;
  height: 1rem;
  background-size: cover;
  margin-right: .25rem
}

.file-name-wrap .file-name .icon {
  width: 1rem;
  height: 1rem;
  background-size: cover;
  margin-right: .25rem
}

.section-editor-header .file-name-wrap .file-name .icon-google {
  background-image: url(../img/common/icon-google-drive.png)
}

.file-name-wrap .file-name .icon-google {
  background-image: url(../img/common/icon-google-drive.png)
}

.iconblock {
  border:1px solid #333;
  border-radius: 100%;
  padding:4px 4px 4px 4px;
  background-color:#fff;   
  margin-left:10px;
}

.icon-google01 {
  background-image: url(../img/common/icon-google-drive.png);
  width: 17px;
  height: 17px;
  background-size: cover;
  /*margin-right: .25rem;*/
  margin-right:0px;
}

.section-editor-header .btn-save-file {
  font-size: .75rem;
  color: #fff;
  border: 1px solid #fff5;
  background-color: transparent;
  border-radius: 1rem;
  padding: .25rem .75rem;
  cursor: pointer;
  margin-left: .5rem
}

.btn-save-file {
  font-size: .75rem;
  color: #fff;
  border: 1px solid #fff5;
  background-color: transparent;
  border-radius: 1rem;
  padding: .25rem .75rem;
  cursor: pointer;
  margin-left: .5rem
}

.section-editor-header .btn-save-file:hover {
  border: 1px solid #fff7;
  background-color: #fff2
}

.btn-save-file:hover {
  border: 1px solid #fff7;
  background-color: #fff2
}
         
.btn-save-file01 {
  font-size: 0.9rem;
  cursor: pointer;
  border:3px solid #a60000;
  border-radius: 20px;
  padding:1px 0px 1px 0px;
  background-color:#ffffff;  
  color:#a60000;
  width:55px;
  text-align:center;
}

.btn-save-file01 .def {
  display: inline;
}

.btn-save-file01 .saving {
  display: none; /* Initially hidden */
}

.btn-save-file01 .saving .savefadeintext {
  animation: fadein 1s infinite; /* Add animation if required */
}

@keyframes fadein {
  0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; }
}


.border-w-l {
  border: 1px solid #CFCFCF;
  background-color:#fff;
  /*z-index:6;*/
  border-radius: 25px;  
  padding:3px 3px 3px 3px;
  /*margin-right:-8px;*/
  margin-left:10px;
  display: flex;
  align-items: center;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
}

.border-w-l .btn-view-arrow {
    background-color: #fff;
    background-image: url(../img/common/btn_search_bottom.svg);
    background-repeat: no-repeat;
    background-size: 13px;
    background-position: center center;
    width: 20px;
    height: 20px;
    display: block;
    color: transparent;
    font-size: 8px;
    cursor: pointer;
    margin-top: 0px;
}

.share-menu-gr { margin-left:5px; cursor: pointer; border:1px solid #101010;}
.btn-share-def {border: 1px solid #333;
    border-radius: 100% !important;
    padding: 2px 2px 2px 2px;
    margin-left: 10px;
    background-color:#333; cursor: pointer; width: 30px !important; height:30px !important; background-image:url(../img/editor/editor-header-share-icon.svg); background-repeat: no-repeat; background-position: 50% 50%; background-size: 75%;}
.btn-share-on { border: 1px solid #333333;
    border-radius: 100% !important;
    padding: 2px 2px 2px 2px;
    background-color: #fff;
    margin-left: 10px; cursor: pointer; width: 30px !important; height:30px !important;
    color:#eee;
    background-image:url(../img/editor/editor-header-share-icon333-on.svg); background-repeat: no-repeat; background-position: 50% 50%; background-size: 75%;}


.share-hover-wrap {
  position: relative;
  display: inline-block;
}

.share-hover-wrap:hover .dropdown-nav-wrap {
  display: block;
}



.share-menu-gr .dropdown-nav {
  position: absolute;
}

.border-w-r {
  border:2px solid #fff;  
  border-radius: 20px;  
  display:inline-block;

  
}

.trans-block {
  display:block;  
  z-index:6;
  min-width:100px;
  margin-left:-18px;
}



.section-editor-header ul.dropdown-nav,
.section-editor-header ul.dropdown-nav > li > .nav-sub {
  border-radius: 6px;
  border: 1px solid #cecece;
  background: #FFF;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
  padding: 8px 0;
}

ul.dropdown-nav,
ul.dropdown-nav > li > .nav-sub {
  border-radius: 6px;
  border: 1px solid #cecece;
  background: #FFF;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
  padding: 8px 0;
}

.section-editor-header .dropdown-nav-wrap {
  position: absolute;
  top: 40px;
  left: calc(50% - 75px);
  width: 150px;
  z-index: 3;
  display: none;
  transition: left .15s ease-in-out, right .15s ease-in-out
}

.dropdown-nav-wrap {
  position: absolute;
  top: 90%;
  right: 0;
  /* left: calc(50% - 75px);
  width: 150px; 
  left: calc(50% - 170px);*/
  width: 170px;
  z-index: 3;
  display: none;
  margin-left:auto;
  transition: left .15s ease-in-out, right .15s ease-in-out
}

.ssdropdown-nav-wrap {
  width: 100px;
  top: 99%;
}

.ssdropdown-nav-wrap02 {
  width: 180px;
  top: 99%;
  left: 0;
  right: auto;
}

.ssdropdown-nav-wrap03 {
  width: 100px;
  top: 99%;
  left: 0;
  right: auto;
}





.section-editor-header ul.dropdown-nav > li {
  cursor: pointer;
  font-size: 12px;
  padding: 4px 12px;
  position: relative;
}

ul.dropdown-nav > li {
  cursor: pointer;
  font-size: 12px;
  padding: 4px 12px;
  position: relative;
}



.ssdropdown-nav-wrap ul.dropdown-nav > li {
  font-size: 14px;
}

.ssdropdown-nav-wrap02 ul.dropdown-nav > li {
  font-size: 14px;
}

.ssdropdown-nav-wrap03 ul.dropdown-nav > li {
  font-size: 14px;
}


.ssdropdown-nav-wrap ul.dropdown-nav > li:hover {
  /*color:#4975cc;*/
  background-color:#f1f1f1;
}

.ssdropdown-nav-wrap02 ul.dropdown-nav > li:hover {
  /*color:#4975cc;*/
  background-color:#f1f1f1;
}

.ssdropdown-nav-wrap03 ul.dropdown-nav > li:hover {
  /*color:#4975cc;*/
  background-color:#f1f1f1;
}

.ssdropdown-nav-wrap02 ul.dropdown-nav > li:disabled{
  background-color: #ffffff;
  border-color: #ececec !important;
  color: #bcbbc1;
  cursor: not-allowed;
}

.ssdropdown-nav-wrap03 ul.dropdown-nav > li:disabled{
  background-color: #ffffff;
  border-color: #ececec !important;
  color: #bcbbc1;
  cursor: not-allowed;
}







.section-editor-header .nav-sub ul > li.disabled:hover,
.section-editor-header ul.dropdown-nav > li.disabled:hover {
  background: 0 0
}

.nav-sub ul > li.disabled:hover,
ul.dropdown-nav > li.disabled:hover {
  background: 0 0
}

.section-editor-header ul.dropdown-nav > li.disabled:hover .nav-sub {
  display: none !important
}

ul.dropdown-nav > li.disabled:hover .nav-sub {
  display: none !important
}

.section-editor-header ul.dropdown-nav > li > .nav-sub + .nav-item:before {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 4px solid #333;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  position: absolute;
  top: 8px;
  right: 19px
}
ul.dropdown-nav > li > .nav-sub + .nav-item:before {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 4px solid #333;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  position: absolute;
  top: 8px;
  right: 19px
}

.section-editor-header ul.dropdown-nav > li > .nav-sub {
  display: none;
  position: absolute;
  width: 172px;
  top: -4px;
  right: -172px;
  transition: left .15s ease-in-out, right .15s ease-in-out
}

ul.dropdown-nav > li > .nav-sub {
  display: none;
  position: absolute;
  width: 172px;
  top: -4px;
  right: -172px;
  transition: left .15s ease-in-out, right .15s ease-in-out
}

.section-editor-header .nav-sub .caption {
  cursor: pointer;
  font-size: 12px;
  padding: 4px 12px;
  position: relative;
}

.nav-sub .caption {
  cursor: pointer;
  font-size: 12px;
  padding: 4px 12px;
  position: relative;
}

.section-editor-header .nav-sub ul > li {
  cursor: pointer;
  font-size: 12px;
  padding: 4px 12px;
  position: relative;
}

.nav-sub ul > li {
  cursor: pointer;
  font-size: 12px;
  padding: 4px 12px;
  position: relative;
}

.nav-menu-list-container .main-item:hover,
.nav-menu-list-container .main-item > ul li:hover,
.point-menu-list .main-item:hover,
.section-editor-header .nav-sub ul > li:hover {
  background: #f1f1f1;
}

.nav-sub ul > li:hover {
  background: #f1f1f1;
}

.nav-menu-list-container .main-item:hover,
.nav-menu-list-container .main-item > ul li:hover,
.point-menu-list .main-item:hover,
.nav-sub ul > li:hover {
  background: #f1f1f1;
}

.section-editor-header .input-search-text {
  border: 1px solid #cdcdcd;
  width: 240px;
  height: 30px;
  border-radius: 15px;
  background-color: #ffffff;
  font-size: .875rem;
  padding: 0 34px 0 20px;
  color: #333;
}

.input-search-text {
  border: 0px solid #666;
  width: 100px;
  height: 20px;
  background-color: #ffffff;
  font-size: .875rem;
  padding: 0px;
  color: #333;
}

.ssinput-search-text {
  border: 0px;
}



.section-editor-header .btn-search,
.section-editor-header .profile-thumbnail {
  font-size: 0;
  color: transparent;
  width: 30px;
  height: 30px;
  background-position: center;
  background-repeat: no-repeat;
  letter-spacing: 0
}

.btn-search,
.profile-thumbnail {
  font-size: 0;
  color: transparent;
  width: 35px;
  height: 35px;
  background-position: center;
  background-repeat: no-repeat;
  letter-spacing: 0;
}


.section-editor-header .input-search-text::placeholder {
  color: #fff5
}

.input-search-text::placeholder {
  color: #fff5
}

.section-editor-header .search-option-wrap {
  position: absolute;
  display: block;
  top: -2px;
  right: 12px;
}

.search-option-wrap {
  /*position: absolute;*/
  display: block;
  /*top: 2px;
  right: 12px;*/
}


.section-editor-header .btn-search {
  border: 0;
  background-image: url(../img/common/i_search.svg);
  /* background-image: url(../img/editor/editor-btn-search.png); */
  background-size: cover;
  height: 20px;
  padding: 0;
  width: 20px;
}

.btn-search {
  border: 0;
  background-image: url(../img/common/i_search.svg);
  /* background-image: url(../img/editor/editor-btn-search.png); */
  background-size: cover;
  height: 16px;
  padding: 0;
  width: 16px;
  font-size:12px;
}


.section-editor-header .search-option-wrap:hover .search-option {
  display: block;
  /* top: 30px; */
  top: 25px;
  right: 0;
  padding: .25rem 0;
  background: #fff;
  border-radius: .5rem;
  position: absolute;
  width: 100px;
  box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .2);
  z-index: 6
}

.search-option-wrap:hover .search-option {
  display: block;
  /* top: 30px; */
  top: 25px;
  right: 0;
  padding: .25rem 0;
  background: #fff;
  border-radius: .5rem;
  position: absolute;
  width: 100px;
  box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .2);
  z-index: 6
}


.section-editor-header .search-option li {
  color: #3339;
  font-size: .8rem;
  text-align: left;
  padding: .25rem 1rem;
  cursor: pointer;
  transition: color .15s ease-in-out
}

.search-option li {
  color: #3339;
  font-size: .8rem;
  text-align: left;
  padding: .25rem 1rem;
  cursor: pointer;
  transition: color .15s ease-in-out
}

.section-editor-header .profile-wrap {
  /*margin-left: 20px;*/
  position: relative
}

.profile-wrap {
  margin-left: 10px;
  position: relative;
}


.section-editor-header .profile-thumbnail {
  border-radius: 15px;
  background-size: cover;
  cursor: pointer
}

.profile-thumbnail {
  border-radius: 19px;
  background-size:cover;
  cursor: pointer;
  height: 30px;
  width: 30px;

}

.section-editor-header .profile-nav {
  display: none;
  background: #1c1e25;
  border-radius: .5rem;
  padding: .25rem 0;
  position: absolute;
  top: 45px;
  right: 0;
  min-width: 120px;
  z-index: 6
}

.profile-nav {
  display: none;
  background: #1c1e25;
  border-radius: .5rem;
  padding: .25rem 0;
  position: absolute;
  top: 45px;
  right: 0;
  min-width: 120px;
  z-index: 6
}

.section-editor-wrap {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  /*height: calc(100vh - 50px); */ 
  height: 100vh;  
  position: relative;
  overflow: hidden;
}

@media (max-width:1024px){
  .section-editor-wrap {
    height:100vh;
  }
}


.section-editor-wrap .alert-information {
  position: absolute;
  top: .5rem;
  left: 0;
  right: 0;
  text-align: center
}

.section-editor-wrap .alert-information span {
  color: #868da0;
  background: #eef0f7;
  display: inline-block;
  padding: .25rem .5rem;
  font-size: .75rem;
  margin: auto;
  border-radius: .25rem
}

.section-editor-wrap .alert-message {
  position: absolute;
  bottom: calc(14px + 1.5rem);
  left: calc(41px + 1.5rem);
  z-index: 1
}

.section-editor-wrap .alert-message > div {
  color: #fff;
  background: #233f65;
  display: inline-block;
  padding: 1rem 1rem 1rem 2.5rem;
  font-size: .75rem;
  border-radius: .25rem;
  position: relative
}

.section-editor-wrap .alert-message > div:before {
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  background-image: url(../img/editor/editor-btn-chat.png);
  margin-right: .25rem;
  position: absolute;
  left: 1rem
}

.open-left .section-editor-wrap .alert-message {
  left: calc(234px + 41px + 1.5rem)
}

.section-editor-wrap .alert-timer {
  position: absolute;
  top: .5rem;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 9
}

.section-editor-wrap .alert-timer .timer-wrap {
  background: #3c5f8e;
  display: inline-block;
  margin: auto;
  border-radius: .5rem;
  overflow: hidden
}

.section-editor-wrap .alert-timer .time {
  color: #fff;
  font-size: 2rem;
  padding: 1rem 2rem;
  position: relative;
  width: 100%
}

.section-editor-wrap .alert-timer .close {
  display: block;
  width: 20px;
  height: 20px;
  background-image: url(../img/editor/editor-btn-close-light-sm.png);
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: .5rem;
  right: .5rem
}

.section-editor-wrap .alert-timer .tool-group {
  display: flex;
  display: -ms-flexbox;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  background-color: #233f65;
  font-size: .75rem;
  color: #fff
}

.section-editor-wrap .alert-timer .reset,
.section-editor-wrap .alert-timer .start {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding-right: .5rem;
  position: relative;
  cursor: pointer
}

.section-editor-wrap .alert-timer .reset:before,
.section-editor-wrap .alert-timer .start:before {
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat
}

.section-editor-wrap .alert-timer .start:before {
  background-image: url(../img/editor/editor-btn-timer-start.png)
}

.section-editor-wrap .alert-timer .reset:before {
  background-image: url(../img/editor/editor-btn-timer-reset.png)
}

.section-editor-wrap .alert-timer .reset:after {
  content: '';
  display: block;
  width: 1px;
  height: 12px;
  background-color: #fff5;
  top: 5px;
  right: 0;
  position: absolute
}

.section-editor-wrap .alert-timer .down,
.section-editor-wrap .alert-timer .up {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer
}

.section-editor-wrap .alert-timer .down {
  background-image: url(../img/editor/editor-btn-timer-down.png)
}

.section-editor-wrap .alert-timer .up {
  margin-left: .5rem;
  background-image: url(../img/editor/editor-btn-timer-up.png)
}

.section-editor-wrap .alert-timer .plus {
  margin-left: .25rem;
  cursor: pointer
}

.section-editor-panel-left .icon-group {
  border-right: 1px solid #c6cdde
}

.section-editor-detail-panel-left {
  width: 0;
  height: 0;
  position: fixed;
  top: -100vh;
  left: -100vw
}

.open-left .section-editor-detail-panel-left {
  /* width: 234px; */
  width: 280px;
  height: calc(100vh - 91px);
  border-right: 1px solid #c6cdde;
  top: 50px;
  left: 41px;
  /*background-color: #fff*/
}

.section-editor-panel-left .btn-icon span.tip-label:after {
  border-right: 4px solid #131416;
  left: -4px
}

.section-editor-panel-left .btn-icon:hover span.tip-label {
  display: inline-block;
  left: 45px
}

.section-editor-panel-left .btn-left-cooperation {
  background-image: url(../img/editor/editor-btn-main-cooperation.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 30px
}

.section-editor-panel-left .btn-left-translation {
  background-image: url(../img/editor/icons8-translation-24.png);
  background-position: center;
  background-repeat: no-repeat
}

.section-editor-panel-left .btn-left-cooperation.active {
  background-image: url(../img/editor/editor-btn-main-cooperation-hover.png)
}

.section-editor-panel-left .btn-left-calender {
  background-image: url(../img/editor/editor-btn-main-calender.png);
  background-position: center;
  background-repeat: no-repeat
}

.section-editor-panel-left .btn-left-desk {
  background-image: url(../img/editor/editor-btn-main-desk.png);
  background-position: center;
  background-repeat: no-repeat
}

.section-editor-panel-left .btn-left-announcement {
  background-image: url(../img/editor/editor-btn-main-announcement.png);
  background-position: center;
  background-repeat: no-repeat
}

.section-editor-body,
.section-editor-body .scroll-bar-area {
  position: relative;
  flex: 1
}

.section-editor-body .real-scroll-w {
  position: absolute;
  display: flex;
  display: -ms-flexbox;
  flex-direction: row;
  height: 15px;
  left: 0;
  right: 15px;
  bottom: 0;
  background: #fafafa;
  border-top: 1px solid #eee;
  z-index: 3
}

.section-editor-body .real-scroll-w:after {
  content: '';
  position: absolute;
  display: block;
  width: 15px;
  height: 15px;
  top: -1px;
  right: -15px;
  background: #fafafa;
  border-top: 1px solid #eee;
  border-left: 1px solid #eee
}

.section-editor-body .real-scroll-w .scroll-bar {
  position: absolute;
  display: block;
  top: 0;
  left: 5%;
  height: 15px;
  cursor: pointer;
  background: #ddd
}

.section-editor-body .real-scroll-h {
  position: absolute;
  display: flex;
  display: -ms-flexbox;
  flex-direction: column;
  width: 15px;
  top: 0;
  right: 0;
  bottom: 15px;
  background: #fafafa;
  border-left: 1px solid #eee;
  z-index: 3
}

.section-editor-footer .btn-cooperation,
.section-editor-footer .btn-fullscreen-type,
.section-editor-footer .btn-mail,
.section-editor-footer .btn-minus,
.section-editor-footer .btn-plus,
.section-editor-footer .btn-real-size,
.section-editor-footer .btn-right-note,
.section-editor-footer .btn-window-type,
.section-editor-footer .main-point,
.section-editor-panel-right .btn-right-color,
.section-editor-panel-right .btn-right-connect,
.section-editor-panel-right .btn-right-design,
.section-editor-panel-right .btn-right-figure,
.section-editor-panel-right .btn-right-font,
.section-editor-panel-right .btn-right-link,
.section-editor-panel-right .btn-right-note,
.section-editor-panel-right .btn-right-progress,
.section-editor-panel-right .btn-right-taste {
  background-position: center;
  background-repeat: no-repeat
}

.section-editor-body .real-scroll-h .scroll-bar {
  position: absolute;
  display: block;
  left: 0;
  top: 5%;
  width: 15px;
  cursor: pointer;
  background: #ddd
}

.open-left .section-editor-body .real-scroll-w {
  left: 234px
}

.section-editor-body .scroll-bottom,
.section-editor-body .scroll-left,
.section-editor-body .scroll-right,
.section-editor-body .scroll-top {
  display: block;
  width: 15px;
  height: 15px;
  position: relative
}

.section-editor-body .scroll-bottom:after,
.section-editor-body .scroll-left:after,
.section-editor-body .scroll-right:after,
.section-editor-body .scroll-top:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute
}

.section-editor-body .scroll-left:after {
  border-right: 4px solid #999;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  left: 5px;
  top: 4px
}

.section-editor-body .scroll-right:after {
  border-left: 4px solid #999;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  right: 3px;
  top: 4px
}

.section-editor-body .scroll-top:after {
  border-bottom: 4px solid #999;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  left: 4px;
  top: 5px
}

.section-editor-body .scroll-bottom:after {
  border-top: 4px solid #999;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  left: 4px;
  bottom: 5px
}

.section-editor-wrap .panel-content {
  overflow-y: auto;
  height: calc(100vh - 153px);
  margin-top: -1px
}

.section-editor-panel-right .icon-group {
  border-left: 1px solid #c6cdde
}

.section-editor-detail-panel-right {
  width: 0;
  height: 0;
  position: fixed;
  top: -100vh;
  right: -100vw
}

/*.open-right .section-editor-detail-panel-right {*/
/*    width: 234px;*/
/*    height: calc(100vh - 91px);*/
/*    border-left: 1px solid #c6cdde;*/
/*    top: 50px;*/
/*    right: 41px;*/
/*    background-color: #fff*/
/*}*/

.section-editor-panel-right .btn-icon span.tip-label:after {
  border-right: 4px solid #131416;
  right: -3px
}

.section-editor-panel-right .btn-icon:hover span.tip-label {
  display: inline-block;
  right: 45px
}

.zoom-wrap .btn-icon:hover span.tip-label {
  display: inline-block;
  right: 45px
}

.zoom-wrap .btn-icon span.tip-label:after {
  border-left: 4px solid #131416;
  right: -3px
}

.section-editor-panel-right .btn-right-color {
  background-image: url(../img/editor/editor-btn-main-color.png)
}

.section-editor-panel-right .btn-right-color.active {
  background-image: url(../img/editor/editor-btn-main-color-hover.png)
}

.section-editor-panel-right .btn-right-font {
  background-image: url(../img/editor/editor-btn-main-font.png)
}

.section-editor-panel-right .btn-right-font.active {
  background-image: url(../img/editor/editor-btn-main-font-hover.png)
}

.section-editor-panel-right .btn-right-figure {
  background-image: url(../img/editor/editor-btn-main-figure.png)
}

.section-editor-panel-right .btn-right-figure.active {
  background-image: url(../img/editor/editor-btn-main-figure-hover.png)
}

.section-editor-panel-right .btn-right-taste {
  background-image: url(../img/editor/editor-btn-main-taste.png)
}

.section-editor-panel-right .btn-right-taste.active {
  background-image: url(../img/editor/editor-btn-main-taste-hover.png)
}

.section-editor-panel-right .btn-right-progress {
  background-image: url(../img/editor/editor-btn-main-progress.png)
}

.section-editor-panel-right .btn-right-progress.active {
  background-image: url(../img/editor/editor-btn-main-progress-hover.png)
}

.section-editor-panel-right .btn-right-connect {
  background-image: url(../img/editor/editor-btn-main-connect.png)
}

.section-editor-panel-right .btn-right-connect.active {
  background-image: url(../img/editor/editor-btn-main-connect-hover.png)
}

.section-editor-panel-right .btn-right-design {
  background-image: url(../img/editor/editor-btn-main-design.png)
}

.section-editor-panel-right .btn-right-design.active {
  background-image: url(../img/editor/editor-btn-main-design-hover.png)
}

.section-editor-panel-right .btn-right-link {
  background-image: url(../img/editor/editor-btn-main-link.png)
}

.section-editor-panel-right .btn-right-link.active {
  background-image: url(../img/editor/editor-btn-main-link-hover.png)
}

.section-editor-panel-right .btn-right-note {
  background-image: url(../img/editor/editor-btn-main-note.png)
}

.section-editor-panel-right .btn-right-note.active {
  background-image: url(../img/editor/editor-btn-main-note-hover.png)
}

.section-editor-panel-left .btn-icon:hover,
.section-editor-panel-right .btn-icon:hover {
  background-color: #dadfeb
}

.section-editor-panel-left .btn-icon.active,
.section-editor-panel-right .btn-icon.active {
  background-color: #3c5f8e
}

.section-editor-panel-left .btn-icon + .btn-icon,
.section-editor-panel-right .btn-icon + .btn-icon {
  margin-top: 10px
}

.section-editor-panel-left .btn-icon.disabled,
.section-editor-panel-right .btn-icon.disabled {
  opacity: .5;
  border-color: transparent;
  background-color: transparent;
  cursor: default
}

.section-editor-panel-left .icon-group,
.section-editor-panel-right .icon-group {
  display: flex;
  display: -ms-flexbox;
  flex-flow: column;
  padding: 15px 5px;
  background: #fff
}

.section-editor-footer {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
  height: 40px;
  background-color: #eef0f6;
  border-top: 1px solid #c6cdde;
  z-index: 99
}

.section-editor-footer .cooperation-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  position: absolute;
  bottom: 5px;
  left: 20px;
  color: #4e5669;
  font-size: .75rem
}

.section-editor-footer .cooperation-wrap:hover .label-warp {
  position: absolute;
  padding: .25rem .5rem;
  background-color: #1c1e25;
  border-radius: .25rem;
  left: 0;
  bottom: 30px;
  display: flex;
  display: -ms-flexbox
}

.section-editor-footer .label-warp:after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 4px solid #131416;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  position: absolute;
  bottom: -4px;
  left: 40px
}

.section-editor-footer .label-warp > div {
  white-space: nowrap;
  font-size: .75rem;
  color: #fff9;
  position: relative;
  cursor: default
}

.section-editor-footer .label-warp > div + div {
  margin-left: .5rem;
  padding-left: .5rem
}

.section-editor-footer .label-warp > div + div:before {
  content: '';
  display: block;
  position: absolute;
  width: 1px;
  height: 12px;
  left: 0;
  top: 4px;
  background-color: #33353b
}

.section-editor-footer .item-wrap + .item-wrap:before {
  content: '';
  display: block;
  position: absolute;
  width: 1px;
  height: 12px;
  background-color: #c6cdde
}

.section-editor-footer .cooperation-wrap .value {
  color: #4e5669;
  font-size: .75rem;
  cursor: pointer
}

.section-editor-footer .btn-cooperation {
  background-image: url(../img/editor/editor-btn-foot-cooperation.png)
}

.section-editor-footer .btn-mail {
  background-image: url(../img/editor/editor-btn-foot-mail.png)
}

.section-editor-footer .copyright {
  color: #6d758a;
  font-size: .75rem
}

.section-editor-footer .zoom-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  position: absolute;
  /* bottom: 5px; */
  right: 25px
}

.section-editor-footer .main-point {
  background-image: url(../img/editor/editor-main-point-03.png)
}

.section-editor-footer .btn-right-note {
  background-image: url(../img/editor/editor-btn-right-note.png)
}

.section-editor-footer .btn-window-type {
  background-image: url(../img/editor/editor-btn-foot-window.svg)
}

.section-editor-footer .btn-fullscreen-type {
  background-image: url(../img/editor/editor-btn-foot-fullsize.svg)
}

.section-editor-footer .btn-real-size {
  background-image: url(../img/editor/editor-btn-foot-real-size.svg)
}

.section-editor-footer .btn-minus {
  background-image: url(../img/editor/editor-btn-foot-minus.svg);
}

.section-editor-footer .btn-plus {
  background-image: url(../img/editor/editor-btn-foot-plus.svg);
}

/* .section-editor-footer .zoom-group:before {
    content: '';
    display: block;
    width: 1px;
    height: 12px;
    background: #c6cdde;
    margin: 0 20px
} */

.section-editor-footer .zoom-percent {
  align-items: center;
  border-radius: 100px;
  background: rgba(0, 0, 0, 0.50);
  color: #fff;
  display: flex;
  font-size: 12px;
  justify-content: center;
  height: 22px;
  width: 44px;
}

.sszoom-percent {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease;
}

.sszoom-percent.show {
  opacity: 1;
  visibility: visible;
  animation: hideAfter3s 0.5s ease 3s forwards;
}

@keyframes hideAfter3s {
  to {
    opacity: 0;
    visibility: hidden;
  }
}

.section-editor-footer .zoom-percent span {
  color: #fff;
}

.section-editor-footer .range-group {
  width: 130px;
  height: 30px;
  position: relative
}

.section-editor-footer .range-group:before {
  content: '';
  display: block;
  width: 100px;
  height: 2px;
  background: #969cad;
  position: absolute;
  top: 14px;
  left: 15px
}

.elp-content .input-item .unit.date,
.elp-content .input-item .unit.per,
.mlp-header .mlp-close span,
.section-editor-footer .range-group .rang-label {
  background-position: center;
  background-repeat: no-repeat
}

.section-editor-footer .range-group .mat-mdc-slider {
  margin-top: -18px
}

.section-editor-footer .range-group .rang-label {
  font-size: 0;
  letter-spacing: 0;
  color: transparent;
  width: 30px;
  height: 30px;
  margin: 0;
  background-image: url(../img/editor/editor-btn-foot-rang.png);
  position: absolute;
  top: 0;
  max-width: 60px
}

.setting-detail-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  background: rgba(0, 0, 0, .1)
}

.sdc-wrap {
  padding: 1rem;
  border-radius: .5rem;
  background-color: #fff
}

.sdc-wrap .label {
  color: #4e5669;
  margin-bottom: .75rem
}

.sdc-wrap .brn-area {
  margin-top: .5rem;
  text-align: right
}

.nav-menu-list-container {
  box-shadow: 0 .5rem 1rem #0002;
  position: absolute;
  z-index: 1;
  border-radius: .25rem;
  display: none
}

.nav-menu-list-container .nav-menu-list,
.point-menu-list {
  border-radius: 6px;
  border: 1px solid #F1F1F1;
  background: #FFF;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
  padding: 8px 0;
  /*width: 154px;*/
  min-width:154px;
}

.nav-menu-list-container .nav-menu-list,
.point-menu-list200 {
  min-width:200px;
}



.nav-menu-list-container .main-item {
  font-size: 12px;
  padding: 4px 12px;
  cursor: pointer;
  position: relative
}

.nav-menu-list-container .main-item.disabled,
.nav-menu-list-container .main-item:disabled,
.nav-menu-list-container .main-item > ul li.disabled,
.nav-menu-list-container .main-item > ul li.disabled:hover,
.point-menu-list .main-item.disabled,
.point-menu-list .main-item:disabled {
  background-color: #fff;
  border-color: #d1d9e8;
  opacity: .5;
  cursor: default
}

.nav-menu-list-container .main-item:hover > ul li,
.point-menu-list .main-item {
  padding: .375rem 1rem;
  border-radius: .25rem;
  cursor: pointer;
  white-space: nowrap
}

.nav-menu-list-container .main-item:hover > ul {
  border-radius: 4px;
  border: 1px solid #F1F1F1;
  display: block;
  position: absolute;
  padding: 8px 0;
  top: 0;
  min-width: 80px;
  left: 153px;
  background: #fff;
  width: 154px;

}

.nav-menu-list-container .main-item:hover > ul li {
  border-radius: 0;
  color: #666;
  font-size: 12px;
  padding: 4px 12px;
}

.nav-menu-list-container .main-item-list ul + div {
  padding-right: .5rem
}

.nav-menu-list-container .main-item-list ul + div:after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid #666;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  position: absolute;
  top: 9px;
  right: 12px
}

/* 20230911 디자인 변경 */
.main-item-text {
  color: #666;
  display: flex;
  justify-content: space-between;
  letter-spacing: -0.264px;
}

.main-item-text .shortcut {
  color: #999;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: -0.264px;
  text-align: right;
}

.nav-menu-list-container .main-item:hover > ul.type2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 8px;
  row-gap: 4px;
}

.main-item-list.type2 li {
  border-radius: 2px;
  border: 1px solid #FAFAFA;
}

/* .nav-menu-list-container .menu-list-group+.menu-list-group:before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #dadfeb;
    margin: .25rem 0
} */

.point-menu-list {
  padding: .25rem;
  border-radius: .5rem;
  background-color: #fff;
  display: none;
  position: absolute
}

.mlp-content.bottom-radius,
.mlp-footer {
  border-bottom-left-radius: .5rem;
  -moz-border-radius-bottomleft: .5rem;
  border-bottom-right-radius: .5rem;
  -moz-border-radius-bottomright: .5rem
}

.note-container.active {
  padding: 1rem;
  border-radius: .5rem;
  background-color: #fff;
  display: block;
  position: absolute
}

.note-container .note-header {
  height: 36px
}

.note-container .note-content {
  width: 100%;
  height: calc(100% - 36px)
}

.note-container .note-content textarea {
  width: 100%;
  height: 100%;
  resize: none
}

.note-container .close {
  width: 30px;
  height: 30px;
  background-image: url(../img/editor/editor-btn-color-close.png);
  position: absolute;
  top: .5rem;
  right: .5rem
}

.elp-header .slp-close,
.mlp-header .mlp-close {
  opacity: .5;
  transition: opacity .15s ease-in-out;
  cursor: pointer
}

.modal-layer-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  align-items: center;
  z-index: 9999;
  background: rgba(0, 0, 0, .8)
}

.loading-area-full,
.viewer-layer-container .viewer-btn-left:hover,
.viewer-layer-container .viewer-btn-right:hover {
  background-color: #0009
}

.mlp-wrap {
  margin-left: auto;
  margin-right: auto;
  padding: 0 1rem
}

.mlp-size {
  background: #fff;
  border-radius: 16px;
  min-width: 300px;
  max-width: 600px;
  min-height:130px;
}

.mlp-lg {
  height: 800px;
  max-width: 800px;
  width: 800px;
}


.mlp-content table {
 width:100%; 
}
.mlp-content th {
  padding:5px 0px 5px 0px;
  vertical-align: top;
}
.mlp-content td {
  padding:5px 0px 5px 0px;
}
.mlp-content td:nth-child(1) {
  padding:0px 0px 5px 0px;
}
.mlp-content input {  
  margin-bottom:5px;
}
.mlp-content select {
  width:100%;
  appearance:button;
  padding:5px 0px 5px 5px;
  border:1px solid #ced4da;
  border-radius: 3px;
  margin-bottom:5px;

}


@media (max-width: 992px) {
  .mlp-lg {
    height: calc(100vh - 100px);
    width: 100%;
  }
}

.mlp-header {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  padding: 20px 20px 0 20px;
}

.mlp-header-title {
  color: #333;
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}

.mlp-header .headline {
  font-size: 1.125rem;
  font-weight: 500;
  margin: 0;
}

.mlp-header .mlp-close {
  display: flex;
}

.mlp-header .mlp-close span {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-size: cover;
  background-image: url(../img/ico/i-x-lg.svg);
}


.mlp-content {
  height: 100%;
  /*overflow-y: auto;*/
  padding: 20px;
}



@media (max-height: 900px) {
    .mlp-size {
      max-width: 500px;
    }
  }

@media (max-height: 760px) {
    .mlp-size {
      max-width: 400px;
    }
  }

  @media (max-height: 610px) {
    .mlp-size {
      max-width: 300px;
    }
  }

  @media (max-height: 470px) {
    .mlp-size {
      max-width: 400px;
    }
    .mlp-content {
      height:280px;
      overflow: auto;
    }    
  }




.mlp-footer {
  padding: 0 20px 20px 20px;
}

.mlp-footer .check-area {
  display: flex;
  display: -ms-flexbox;
  justify-content: flex-start;
  align-items: center
}

.mlp-alert {
  height: 100%;
  overflow-y: auto;
  padding: 2rem;
  border-radius: 1.5rem
}

.mlp-content .mention {
  margin-bottom: 2rem
}

.mlp-content .option-wrap {
  margin-top: .5rem;
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  align-items: center;
  padding: .75rem 1.5rem;
  border: 1px solid #ddd;
  border-radius: .5rem
}

.elp-header .headline .question {
  width: 30px;
  height: 30px;
  background-image: url(../img/editor/editor-slp-question.png);
  background-position: center;
  background-repeat: repeat;
  margin-left: .25rem
}

.elp-header .slp-close {
  top: 15px
}

.elp-content {
  position: relative;
  max-height: calc(100vh - 209px);
  overflow-y: auto
}

.elp-content .block-wrap {
  padding-bottom: 1rem
}

.elp-content .block-title {
  background: #f4f6fb;
  height: 50px;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding: 0 20px;
  margin-bottom: 1rem
}

.elp-content .option-wrap {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  padding: 0 20px 10px
}

.elp-content .option-wrap.flex-up {
  align-items: flex-start
}

.elp-content .option-wrap.flex-down {
  align-items: flex-end
}

.elp-content .label-block {
  width: 230px
}

.elp-content .label-block-sm {
  width: 80px !important
}

.elp-content .option-block {
  flex: 1;
  display: flex;
  display: -ms-flexbox;
  align-items: center
}

.elp-content .option-block .select-item-xs + .select-item-xs {
  margin-left: 5px !important
}

.elp-content .check-group {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  height: 40px
}

.elp-content .label-center {
  width: 100%;
  text-align: center;
  padding-bottom: .25rem;
  margin: 0
}

.elp-content .select-item {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  height: 38px;
  border: 1px solid #c6cdde;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  border-radius: 20px;
  width: 240px;
  color: #25272f;
  font-size: .875rem;
  position: relative
}

.elp-content .select-gray {
  border: 1px solid #f4f6fb;
  background-color: #f4f6fb
}

.elp-content .select-item .color-chip {
  width: 20px;
  height: 20px;
  border: 1px solid #c7cedf;
  border-radius: 50%
}

.elp-content .select-item:after,
.viewer-layer-container ul + .file-name:after {
  content: '';
  border-right: 4px solid transparent;
  border-left: 4px solid transparent
}

.elp-content .select-item:after {
  position: absolute;
  top: 16px;
  right: 16px;
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 4px solid #4e5669
}

.elp-content .select-item-sm {
  width: 110px !important;
  padding-left: .75rem !important;
  padding-right: .75rem !important
}

.elp-content .select-item-xs {
  width: 50px !important;
  padding-left: .5rem !important;
  padding-right: .5rem !important
}

.elp-content .select-item-xs:after {
  right: 8px !important
}

.elp-content .btn-item button {
  height: 38px;
  border: 1px solid #f4f6fb;
  background: #f4f6fb;
  border-radius: 20px;
  width: 240px;
  color: #25272f;
  font-size: .875rem;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out
}

.elp-content .btn-item-sm button {
  width: 110px !important
}

.elp-content .item-dummy-sm {
  height: 38px;
  border: 1px solid transparent;
  border-radius: 20px;
  width: 110px
}

.elp-content .text-item {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
  height: 38px;
  background-color: #f4f6fb;
  border: 1px solid #f4f6fb;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  border-radius: 20px;
  width: 240px;
  color: #25272f;
  font-size: .875rem;
  position: relative
}

.elp-content .radio-item-auto {
  width: auto !important
}

.elp-content .input-item {
  width: 110px;
  position: relative
}

.elp-content .input-item .form-control {
  height: 38px;
  border: 1px solid #c6cdde;
  padding-left: 1rem;
  padding-right: 2rem;
  border-radius: 20px;
  color: #25272f;
  font-size: .875rem
}

.elp-content .input-item .unit {
  position: absolute;
  top: 5px;
  right: 0;
  width: 30px;
  height: 30px;
  font-size: .875rem
}

.elp-content .input-item .unit.date {
  background-image: url(../img/editor/editor-slp-unit-date.png)
}

.elp-content .input-item .unit.per {
  background-image: url(../img/editor/editor-slp-unit-percent.png)
}

.elp-content .input-item + .gap {
  margin: 0 6px;
  font-size: .875rem
}

.elp-content .textarea-item {
  position: relative;
  margin-left: 20px;
  border: 1px solid #c6cdde;
  border-radius: 1rem;
  padding: 1rem;
  width: 330px;
  height: 220px
}

.elp-content .textarea-item .textarea {
  font-size: .875rem;
  resize: none;
  width: 100%;
  height: 100%;
  border: none
}

.elp-content .textarea-item .radio-item + .textarea {
  height: calc(100% - 40px);
  margin-top: .5rem
}

.elp-content .textarea-item-md {
  width: 540px;
  height: 200px
}

.elp-content .textarea-item-lg {
  width: 570px;
  height: 300px
}

.elp-content .zoom-item {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: space-between;
  height: 40px;
  width: 100%
}

.elp-content .zoom-item .btn-range-minus {
  width: 30px;
  height: 30px;
  background-image: url(../img/editor/editor-slp-zoom-minus.png)
}

.elp-content .zoom-item .btn-range-plus {
  width: 30px;
  height: 30px;
  background-image: url(../img/editor/editor-slp-zoom-plus.png)
}

.elp-content .zoom-item .btn-range {
  width: 130px;
  height: 30px;
  position: relative;
  margin: 0 -5px
}

.elp-content .zoom-item .btn-range:before {
  content: '';
  width: 100px;
  height: 2px;
  background-color: #969cad;
  position: absolute;
  top: 14px;
  left: 15px
}

.elp-content .zoom-item .btn-range span {
  width: 30px;
  height: 30px;
  display: block;
  background-image: url(../img/editor/editor-slp-zoom-point.png);
  position: absolute;
  z-index: 1
}

.elp-content .tap-container {
  margin-left: 20px;
  display: flex;
  display: -ms-flexbox;
  margin-bottom: 1rem
}

.elp-content .tap-group {
  display: flex;
  display: -ms-flexbox;
  background: #eef0f6;
  border-radius: 100px
}

.elp-content .tap-group .type-item label {
  display: inline-block;
  width: 80px;
  height: 30px;
  cursor: pointer;
  color: #333;
  font-size: .875rem;
  text-align: center;
  padding: 4px 0;
  border-radius: 20px
}

.viewer-layer-container.active {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
  z-index: 999;
  background: #0005
}

.viewer-layer-container .viewer-btn-wrap {
  z-index: 9
}

.viewer-layer-container .viewer-title-wrap {
  position: fixed;
  display: flex;
  display: -ms-flexbox;
  left: 50px;
  right: 50px;
  top: .75rem;
  justify-content: center
}

.viewer-layer-container .title-wrap {
  display: flex;
  display: -ms-flexbox;
  flex-flow: column-reverse;
  cursor: pointer
}

.viewer-layer-container .file-name {
  color: #fff;
  font-size: .875rem;
  background-color: #0008;
  padding: .5rem 1rem;
  border-radius: .25rem
}

.viewer-layer-container ul + .file-name:after {
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 4px solid #fff;
  margin-left: .5rem
}

.viewer-layer-container ul {
  display: none;
  padding: .25rem;
  border-radius: .25rem;
  background-color: #fff;
  position: absolute;
  top: 36px;
  left: calc(50vw - 50px)
}

.viewer-layer-container li {
  font-size: .875rem;
  padding: .25rem .5rem;
  white-space: nowrap;
  cursor: pointer
}

.viewer-layer-container .viewer-btn-back,
.viewer-layer-container .viewer-btn-left,
.viewer-layer-container .viewer-btn-right,
.viewer-layer-container .viewer-btn-zoom,
.viewer-layer-container .viewer-btn-zoom-minus,
.viewer-layer-container .viewer-btn-zoom-plus {
  display: block;
  width: 40px;
  height: 40px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 50%;
  cursor: pointer
}

.viewer-layer-container .viewer-btn-back {
  background-image: url(../img/viewer/viewer-btn-back2.png);
  /*position: fixed;
  top: 6rem;
  right: .5rem;*/
  background-color: #0005;
  border-radius: 2rem
}

.viewer-layer-container .viewer-btn-left,
.viewer-layer-container .viewer-btn-right {
  position: fixed;
  top: calc(50vh - 20px);
  background-color: #0005;
  border-radius: 2rem
}

.viewer-layer-container .viewer-btn-left {
  background-image: url(../img/viewer/viewer-btn-left.png);
  left: .5rem
}

.viewer-layer-container .viewer-btn-right {
  background-image: url(../img/viewer/viewer-btn-right.png);
  right: .5rem
}

.viewer-layer-container .viewer-btn-group {
  position: fixed;
  display: flex;
  display: -ms-flexbox;
  left: 0;
  right: 0;
  bottom: .5rem
}

.viewer-layer-container .viewer-btn-group .mx-auto {
  padding: .25rem 1rem;
  background-color: #0008;
  display: flex;
  display: -ms-flexbox;
  border-radius: .25rem
}

.viewer-layer-container .viewer-btn-zoom {
  background-image: url(../img/viewer/viewer-btn-zoom.png)
}

.viewer-layer-container .viewer-btn-zoom-plus {
  background-image: url(../img/viewer/viewer-btn-plus.png)
}

.viewer-layer-container .viewer-btn-zoom-minus {
  background-image: url(../img/viewer/viewer-btn-minus.png)
}

.viewer-layer-container .vlp-wrap .image-wrap {
  display:flex;
}




.vote-time-wrap .vote-time {
  color: #fff;
  font-size: 1rem
}

.share-wrap .share-list {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-around;
  align-items: flex-start;
}

.share-wrap .share-list li {
  display: block;
  cursor: pointer;
  padding:10px 20px;
}

.share-wrap .share-list li.share-list-on {
  border-radius: 25px;
  background-color:#EAEAEA;
  
}


.share-wrap .icon {
  border-radius: 50%;
  overflow: hidden
}

.share-wrap .icon,
.share-wrap .icon img {
  width: 50px;
  height: 50px
}

.share-wrap .label {
  font-size: .875rem;
  text-align: center;
  margin-top: .5rem
}

.share-wrap .form-control {
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
  padding-left: 1.5rem;
  border-color: #6c757d;
  text-overflow: ellipsis
}

.w-min-360px {
  min-width: 360px
}

.w-min-480px {
  min-width: 480px
}

.justify-d-content-between {
  justify-content: space-between !important
}

.btn-align-wrap {
  display: flex;
  display: -ms-flexbox;
  flex-flow: column
}

.loading-area {
  border-radius: .5rem;
  min-height: 373px;
  display: flex;
  display: -ms-flexbox;
  align-items: center
}

.loading-area-light {
  border-radius: .5rem;
  min-height: 373px;
  display: flex;
  display: -ms-flexbox;
  align-items: center
}

.loading-area-full {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  cursor: default;
  z-index: 99999
}

.loader,
.loader:after {
  border-radius: 50%;
  width: 8em;
  height: 8em;
}

.loader {
  margin: auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.5em solid rgba(255, 255, 255, .2);
  border-right: 1.5em solid rgba(255, 255, 255, .2);
  border-bottom: 1.5em solid rgba(255, 255, 255, .2);
  border-left: 1.5em solid #fff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: 1s linear infinite load8;
  animation: 1s linear infinite load8
}

.section-editor-body .loader {
  border-color: rgba(51, 51, 51, .2) rgba(51, 51, 51, .2) rgba(51, 51, 51, .2) #333
}

.section-editor-body .loading-area {
  min-height: calc(100vh - 92px)
}

@media (max-height: 700px) {
  .section-dashboard-body .section-profile-information {
    height: 272px
  }

  .section-dashboard-body .user-info-wrap {
    padding: 1.25rem 1.5rem;
    height: 100px
  }

  .section-dashboard-body .user-slogan {
    font-size: 21px
  }

  .section-dashboard-body .user-name {
    font-size: 16px
  }

  .section-dashboard-body .user-info-cover-img img {
    margin-top: -72px
  }

  .section-dashboard-body ul.add-icon-list li {
    width: 58px;
    height: 58px;
    margin: 4px
  }

  .section-dashboard-body ul.add-icon-list li .link-label {
    display: none
  }

  .section-dashboard-footer {
    height: 30px
  }
}

@media (max-height: 470px) {

  .section-dashboard-body,
  .section-randing {
    height: 290px;
    align-items: flex-start;
    margin-top: -52px
  }

  .section-dashboard-body .section-profile-information {
    height: 223px
  }

  .section-dashboard-body .user-info-cover-img img {
    margin-top: -80px
  }

  .section-dashboard-body .user-info-wrap {
    padding: .5rem 1.5rem;
    height: 72px
  }

  .section-dashboard-body .section-main-icon {
    height: 80px;
    background-color: #fff1
  }

  .section-dashboard-footer {
    display: none
  }
}
@media (min-width:993px) and (max-width:1280px) { 
  .section-editor-header.mobile .header_icon_div .round .round_icon_list li.round_icon:nth-last-child(3) {
    width:240px;
  }

  
  .section-editor-header .nav-mobile-head {
  display:none;
}
  
.section-editor-header .nav-sub-mobile-head {
  height: 50px;
  background: #f4f6fb;
  display: flex !important;
  display: -ms-flexbox;
  justify-content: center;
  align-items: center
}


}
@media (min-width:767px) and (max-width: 960px) {
  .section-editor-header.mobile .header_icon_div .round .round_icon_list li.round_icon:nth-last-child(3) {
    width:240px;
  }


  .section-editor-header .search-option-wrap {
    position: absolute;
    display: block;
    top: -2px;
    right: 12px;
}
  
  .msl-header {
    /* background: #233f65; */
    background: #fff;
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    height: 50px;
    padding-right: .5rem
  }

  .msl-header input {
    border:1px solid #ccc;
    padding:5px 10px;
    border-radius: 20px;
    flex: 1;
    color: #000
  }

  .msl-header input:placeholder {
    color: #fff5
  }

  .msl-header .btn-back{
    display: flex;
    width: 55px;
    height: 40px;
    text-align: center;
    justify-content: center;
    align-items: center;
  }

  .msl-header .btn-search {
    display: block;
    width: 40px;
    height: 40px;
    text-align: center;
    background-repeat: no-repeat;
    background-position: center
  }

  /* .msl-header .btn-back {
    background-image: url(../img/editor/editor-btn-top-back.png)
  } */

  .msl-header .back_icon{
    display:inline-block;
    width:12px;
    height:12px;
    border:2px solid #000;
    border-top:none;
    border-right:none;
    transform: rotate(45deg);
    margin-right:5px;
  }


  .msl-header .btn-search {
    /* background-image: url(../img/editor/editor-btn-search.png) */
    background-image: url(../img/common/i_search.svg);
    background-size: 50%;
  }

  .section-editor-header .btn-search {
    border: 0;
    background-image: url(../img/common/i_search.svg);
    background-size: cover;
    height: 20px;
    padding: 0;
    width: 20px;
  }
}





@media (max-width: 767px) {
  .section-dashboard-body .user-info-cover-img img {
    margin-top: -80px
  }

  .elp-content .option-wrap,
  .section-login .text-wrap .flex span,
  .section-randing .randing-title,
  .slp-content .contact-list-saved label span,
  .slp-content ul .file-item-wrap,
  .slp-footer .paging-area .page-more-area {
    display: block
  }

  .btn-align-wrap,
  .mt-m-3,
  .section-randing .randing-btn-list li + li {
    margin-top: 1rem
  }

  .btn span,
  .section-dashboard-body ul.add-icon-list li .link-label,
  .section-dashboard-footer .tip-question,
  .section-editor-footer .btn-right-note,
  .section-editor-footer .btn-window-type,
  .section-editor-footer .copyright,
  .section-editor-footer .zoom-group:before,
  .section-editor-header .btn-top-folder,
  .section-editor-header .btn-top-key,
  .section-editor-header .btn-top-trans,
  .section-editor-header .btn-top-new,
  .section-editor-header .input-search-text,
  .section-editor-header .search-option-wrap:hover .search-option,
  .section-editor-panel-left .btn-icon:hover span.tip-label,
  .section-editor-panel-right .btn-icon:hover span.tip-label,
  .select-wrap .file-option .tool-tip-container,
  .slp-content .added .contact-group,
  .slp-content .contact-arrow,
  .slp-content .contact-category-nav .added .wrap:hover .delete,
  .slp-content .contact-category-nav .added .wrap:hover .edit,
  .slp-content .contact-list,
  .slp-content .contact-list-container .added .wrap:hover .delete,
  .slp-content .contact-list-container .added .wrap:hover .edit,
  .slp-content .contact-list-saved .form-check-input,
  .slp-content .contact-title-wrap.desktop,
  .slp-content .type-open:after,
  .slp-content .version-container .version-head,
  .slp-content ul.link-list li:nth-child(9),
  .slp-footer .paging-area ul {
    display: none
  }




  .brn-m-color .btn-white {
    background: #6d758a;
    border-color: #6d758a;
    color: #fff
  }

  .justify-d-content-between {
    justify-content: flex-start !important
  }

  .section-editor-header .nav-wrap-left,
  .section-editor-header .nav-wrap-right,
  .slp-content .version-btn-wrap .btn,
  .w-d-100 {
    width: auto
  }

  .pl-d-20px {
    padding-left: 0
  }

  .pb-m-3 {
    padding-bottom: 1rem
  }

  .mr-m-2 {
    margin-right: .5rem !important
  }

  .d-m-none {
    display: none !important
  }

  .d-d-flex,
  .d-m-block {
    display: block !important
  }

  .d-m-flex {
    display: flex !important;
    display: -ms-flexbox !important
  }

  .justify-m-content-center {
    justify-content: center !important
  }

  .mb-m-2 {
    margin-bottom: .5rem
  }

  .btn-align-wrap {
    display: flex;
    display: -ms-flexbox;
    flex-flow: row
  }

  .btn-align-wrap .btn + .btn {
    margin-top: 0;
    margin-left: .25rem
  }

  .editor-layer-container.active,
  .setting-layer-container.active {
    display: block;
    overflow-y: auto;
    height: 100vh
  }

  .elp-wrap,
  .slp-content .contact-category-nav .added,
  .slp-content .contact-list-container .added,
  .slp-wrap {
    padding: 0
  }

  .elp-size,
  .slp-size,
  .slp-size-sm {
    width: 100vw;
    max-width: 767px
  }

  .elp-header,
  .slp-header {
    border-radius: 0 !important;
    -moz-border-radius: 0 !important
  }

  .elp-footer,
  .slp-footer {
    border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    background: #fff;
    padding: 1rem 0 0
  }

  .elp-footer .btn-area {
    padding: 1rem;
    background: #f4f6fb
  }

  .elp-footer .item-trail,
  .slp-footer .btn-area .item-group {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
    padding: .5rem 1rem;
    border-radius: 2rem
  }

  .elp-content .select-item,
  .elp-content .text-item {
    width: 100%
  }

  .elp-content .item-dummy-sm,
  .elp-content .select-item-sm {
    width: 70px !important
  }

  .elp-content .textarea-item-lg,
  .elp-content .textarea-item-md {
    width: calc(100% - 40px)
  }

  .elp-content .radio-item-auto {
    width: 140px !important
  }

  .elp-content {
    max-height: none;
    min-height: calc(100vh - 214px)
  }

  .elp-content.max-height {
    min-height: calc(100vh - 161px)
  }

  .section-randing {
    padding: 5rem 0 3rem;
    height: auto;
    min-height: 650px
  }

  .section-randing .randing-title h1,
  .section-randing .randing-title h2 {
    text-align: center;
    font-size: 1.5rem
  }

  .section-randing .randing-btn-list {
    display: block;
    margin-top: 3rem
  }

  .section-randing .randing-btn-list li {
    padding: 0;
    display: flex;
    display: -ms-flexbox;
    justify-content: center
  }

  .section-randing .randing-btn {
    width: calc(100vw - 200px);
    min-width: 200px;
    max-width: 360px;
    padding: 2rem 1rem
  }

  .section-dashboard-body {
    padding: 2rem 0;
    height: auto;
    min-height: 650px
  }

  .section-dashboard-body .input-search-text {
    width: 320px
  }

  .section-dashboard-body .element-wrap {
    display: block;
    width: 100%
  }

  .section-dashboard-body .section-profile-information {
    width: 320px;
    height: 260px
  }

  .section-dashboard-body .user-info-wrap {
    padding: 1.25rem 1.5rem;
    height: 100px
  }

  .section-dashboard-body .user-slogan {
    font-size: 21px
  }

  .section-dashboard-body .user-name {
    font-size: 16px
  }

  .section-dashboard-body .section-main-icon {
    margin-top: 1rem;
    height: 100px
  }

  .section-dashboard-body .section-add-icon,
  .slp-content .contact-list-container .edit-list .d-flex + .d-flex {
    margin-top: .5rem
  }

  .section-dashboard-body ul.add-icon-list li {
    width: 58px;
    height: 58px;
    margin: 4px
  }

  .section-dashboard-body ul.add-icon-list li.added .link-icon,
  .section-dashboard-body ul.add-icon-list li.ready .link-icon {
    width: 36px;
    height: 36px
  }

  .page-file .slp-header,
  .page-open .slp-header,
  .page-search .slp-header {
    height: 120px;
    align-items: flex-end
  }

  .slp-footer .paging-area .btn-more {
    font-size: .875rem;
    color: #6d758a;
    padding: .75rem 1.5rem;
    border-radius: 2rem;
    background: #eef0f6
  }

  .slp-footer .paging-area .copyright {
    font-size: .75rem;
    text-align: center;
    color: #969cad;
    background: #131416;
    padding: 1rem 0 3rem;
    margin-top: 2rem
  }

  .slp-footer .paging-area .top {
    display: block;
    font-size: 0;
    color: transparent;
    line-height: 0;
    width: 45px;
    height: 45px;
    background-image: url(../img/dashboard/dashboard-top-mark.png);
    background-size: cover;
    background-position: center;
    position: fixed;
    right: 1rem;
    bottom: 1rem
  }

  .search-item-slp {
    margin-bottom: 15px
  }

  .search-item-slp .input-search-text {
    width: calc(100vw - 32px)
  }

  .search-item-slp .search-option-container .option-item,
  .search-item-slp .search-option-container .option-label {
    width: 75px
  }

  .select-wrap {
    justify-content: flex-start;
    padding: 0 1rem
  }

  .file-select-wrap {
    display: block;
    height: auto
  }

  .file-select-wrap .item-row {
    display: block;
    height: 50px;
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    margin-left: -1rem;
    margin-right: -1rem;
    padding-left: 1rem;
    padding-right: 1rem
  }

  .file-select-wrap .item-row + .item-row {
    border-top: 1px solid #eef0f6
  }

  .slp-content {
    border-radius: 0;
    -moz-border-radius: 0
  }

  .slp-content .list-wrap {
    padding: .5rem 0 0
  }

  .slp-content .view-type-icon-wrap {
    background: #fff;
    padding: 1rem
  }

  .slp-content .file-control-list-wrap ul.item-list,
  .slp-content .search-result-list-wrap ul.item-list {
    min-height: calc(100vh - 176px)
  }

  .slp-content .file-control-list-wrap ul.item-list > li,
  .slp-content .recent-list-wrap ul.item-list li,
  .slp-content .search-result-list-wrap ul.item-list > li {
    border-radius: 0;
    border-top: 1px solid #eef0f6;
    padding: .25rem 0
  }

  .slp-content .file-control-list-wrap ul.type-gallery li,
  .slp-content .recent-list-wrap ul.type-gallery li,
  .slp-content .search-result-list-wrap ul.type-gallery li {
    border-radius: .25rem;
    border: 1px solid #eef0f6;
    padding: 0
  }

  .slp-content .file-control-list-wrap .scroll-box {
    max-height: initial;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0
  }

  .slp-content .file-input-item .form-control {
    width: calc(100vw - 2rem)
  }

  .slp-content .file-input-item .btn-save-file {
    width: 60px
  }

  .slp-content ul.type-list > li + li {
    margin: 0
  }

  .slp-content ul.type-list > li .file-info-wrap {
    margin-top: -.5rem
  }

  .slp-content ul.type-list > li span.file-make-data {
    width: 100px;
    text-align: left;
    color: #6d758a;
    padding-left: 1rem
  }

  .slp-content ul.type-list > li span.file-make-user {
    width: 70px;
    text-align: left;
    color: #6d758a
  }

  .slp-content ul.type-list > li span.file-make-user-before {
    width: 70px;
    text-align: right;
    color: #6d758a
  }

  .slp-content ul.type-list > li span.file-size {
    width: 90px;
    text-align: left;
    color: #6d758a
  }

  .slp-content ul > li span.file-setting {
    position: absolute;
    right: 0;
    bottom: .5rem
  }

  .slp-content ul.type-new {
    max-height: max-content;
    background: #fff;
    padding: 1rem 1rem 0
  }

  .slp-content ul.type-new > li {
    width: calc(50% - 5px);
    border: 1px solid #eef0f6;
    border-radius: .25rem !important
  }

  .slp-content ul.type-gallery > li span.file-setting {
    bottom: .25rem
  }

  .slp-content ul.type-gallery {
    max-height: max-content;
    background: #fff;
    padding: 0 1rem
  }

  .slp-content ul.type-gallery > li {
    width: calc(50% - 5px)
  }

  .slp-content .no-result {
    background: #fff;
    height: calc(100vh - 206px)
  }

  .page-open .slp-content {
    min-height: calc(100vh - 294px)
  }

  .page-new .slp-content,
  .page-recent .slp-content {
    min-height: calc(100vh - 235px)
  }

  .page-new .slp-content {
    padding-top: 54px
  }

  .page-new .select-wrap {
    position: absolute;
    top: 60px;
    left: 0;
    right: 0;
    z-index: 1
  }

  .slp-header .select-wrap .select-option span {
    color: #333
  }

  .slp-header .select-wrap .select-option span:after {
    border-top: 4px solid #333;
    border-bottom: none
  }

  .slp-header .select-wrap .select-option:hover span {
    background-color: #eef0f6
  }

  .select-wrap .position-option {
    position: static;
    top: initial;
    bottom: initial;
    left: initial;
    right: initial;
    display: block;
    align-items: initial;
    justify-content: initial
  }

  .slp-content .setting-wrap {
    display: block;
    border-bottom: none
  }

  .slp-content .setting-nav {
    height: auto;
    border-right: none;
    width: 100%;
    padding: 0
  }

  .slp-content .setting-nav ul {
    display: flex;
    display: -ms-flexbox;
    justify-content: space-between
  }

  .slp-content .setting-nav ul li {
    width: 25%;
    padding: .75rem 0;
    font-size: .875rem;
    text-align: center;
    border-bottom: 1px solid #ddd
  }

  .slp-content .setting-nav ul li.active {
    border-bottom: 2px solid #3c5f8e
  }

  .slp-content .setting-container {
    min-height: calc(100vh - 107px);
    display: block
  }

  .slp-content .set-bg-radio-wrap {
    justify-content: center;
    width: 100%
  }

  .slp-content .contact-list-added,
  .slp-content .set-bg-radio-wrap .type-item label {
    padding: .5rem 0
  }

  .slp-content .set-bg-color-wrap,
  .slp-content .set-bg-img-wrap {
    margin-left: auto;
    margin-right: auto
  }

  .slp-content ul > li .file-name-wrap .file-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: calc(100% - 55px)
  }

  .slp-content .link-file-label,
  .slp-content .profile-file-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: calc(100vw - 168px)
  }

  .slp-content ul.link-list li {
    width: 33.333%
  }

  .slp-footer .btn-area {
    justify-content: center;
    padding: 1rem
  }

  .section-editor-header,
  .section-editor-header .nav-sub .wrap {
    padding: 0 1rem
  }

  .section-editor-header .btn-search {
    position: absolute;
    top: -8px;
    right: -10px
  }

  .section-editor-header .profile-wrap {
    margin-left: 10px
  }

  .section-editor-header .file-name-wrap .file-name {
    max-width: calc(100vw - 335px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
  }

  .section-editor-footer .cooperation-wrap {
    left: 90px
  }

  .section-editor-footer .zoom-wrap {
    justify-content: space-between;
    left: 20px
  }

  .section-editor-footer .range-group,
  .slp-content .contact-list-container .added .name {
    width: 80px
  }

  .section-editor-footer .range-group:before {
    width: 50px
  }

  .section-editor-wrap .alert-information,
  .section-editor-wrap .alert-timer {
    top: calc(40px + .5rem)
  }

  .open-left .section-editor-detail-panel-left {
    width: calc(100vw - 41px);
    height: 100vh;
    top: 0;
    border-right: none;
    left: 0
  }

  .open-right .section-editor-detail-panel-right {
    width: calc(100vw - 41px);
    height: 100vh;
    top: 0;
    border-left: none
  }

  .section-editor-panel-left .icon-group {
    background-color: transparent;
    border-color: #eef0f6 !important
  }

  .section-editor-panel-right .icon-group {
    border-color: #fff !important
  }

  .section-editor-panel-left {
    z-index: 5;
    transition: right .15s ease-in-out;
    position: absolute;
    top: 330px;
    right: -41px;
    display: none
  }
  
  /* 모바일일때 협업버튼 보여주기 */
  .section-editor-panel-left.open-m-left{
    display: flex;
    top:112px !important;
  }

  .section-editor-panel-right {
    width: 0;
    transition: width .15s ease-in-out;
    margin-top: -50px;
    margin-bottom: -40px;
    display: none
  }

  .open-m-right .section-editor-panel-left {
    display: flex;
    right: 0 !important
  }

  .open-m-right .section-editor-panel-right {
    display: flex;
    /*width: 41px !important*/
  }

  .open-m-right .nav-mobile-toggle {
    right: -50px
  }

  .section-editor-header .nav-mobile-head,
  .section-editor-header .nav-sub-mobile-head {
    height: 50px;
    background: #f4f6fb;
    display: flex !important;
    display: -ms-flexbox;
    justify-content: center;
    align-items: center
  }

  .section-editor-header .nav-sub-mobile-head {
    margin-bottom: 1rem
  }

  .section-editor-header .dropdown-nav-wrap {
    display: block !important;
    position: fixed;
    top: 0;
    left: 100vw;
    right: -100vw;
    bottom: 0;
    width: auto;
    background: #fff;
    z-index: 9
  }

  .section-editor-header .dropdown-nav-wrap .nav-sub.active,
  .section-editor-header .file-name-wrap .dropdown-nav-wrap.active {
    left: 0;
    right: 0
  }

  .section-editor-header ul.dropdown-nav {
    border-radius: 0;
    box-shadow: none
  }

  .section-editor-header ul.dropdown-nav > li,
  .slp-content .version-list li {
    padding: 1rem
  }

  .section-editor-header .nav-sub ul > li:hover,
  .section-editor-header ul.dropdown-nav > li:hover {
    background: #f1f1f1;
  }

  .section-editor-header .dropdown-nav-wrap .nav-sub {
    display: block !important;
    position: fixed !important;
    width: auto !important;
    top: 0 !important;
    left: 100vw;
    right: -100vw;
    bottom: 0;
    background: #fff !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    z-index: 1
  }

  .elp-content .range-text {
    width: 45px
  }

  .elp-content .zoom-item {
    justify-content: flex-start
  }

  .slp-content .type-open {
    flex: 1
  }

  .slp-content .type-toggle-list {
    background-image: url(../img/setting/setting-icon-type-list-m.png);
    background-color: transparent;
    position: relative;
    margin-right: 6px
  }

  .slp-content .type-toggle-gallery {
    background-image: url(../img/setting/setting-icon-type-gallery-m.png);
    background-color: transparent
  }

  .slp-content input:checked + .type-toggle-list {
    background-image: url(../img/setting/setting-icon-type-list-m-active.png);
    background-color: transparent
  }

  .slp-content input:checked + .type-toggle-gallery {
    background-image: url(../img/setting/setting-icon-type-gallery-m-active.png);
    background-color: transparent
  }

  .slp-content .type-toggle-list:after {
    content: '';
    display: inline-block;
    position: absolute;
    width: 1px;
    height: 20px;
    background-color: #c6cdde;
    top: 5px;
    right: -6px
  }

  .page-file-find .file-option,
  .page-open-type2 .file-option {
    position: absolute;
    top: 10px;
    right: 1rem
  }

  .slp-content .contact-group {
    width: 100vw;
    padding: 0
  }

  .slp-content .title-wrap {
    border-bottom: 10px solid #eef0f6;
    padding: .5rem 1rem
  }

  .slp-content .contact-group .contact-group-head {
    border: none;
    padding: 1rem
  }

  .slp-content .contact-group .contact-group-body {
    min-height: calc(100vh - 269px);
    padding: 0;
    border: none
  }

  .slp-content .contact-list-saved li + li {
    margin-top: 1px
  }

  .slp-content .contact-list-saved label {
    padding: .5rem 1rem;
    height: 40px
  }

  .slp-content .contact-list-saved li.active {
    background: #f4f6fb
  }

  .slp-content .contact-list-saved li span {
    width: auto;
    text-align: left;
    padding: 0 1rem 0 .5rem
  }

  .slp-content .contact-list-saved li .category {
    width: 100px;
    text-align: left;
    padding: 0 0 0 .5rem;
    color: #666;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
  }

  .slp-content .added .contact-list {
    display: block;
    width: 100vw;
    padding: 0
  }

  .slp-content .contact-list-added li {
    display: flex;
    display: -ms-flexbox;
    font-size: .875rem;
    padding: .5rem 1rem
  }

  .slp-content .vote-container {
    height: calc(100vh - 161px)
  }

  .slp-content .vote-container .vote-title {
    width: 100vw;
    border-bottom: 10px solid #eef0f6
  }

  .slp-content .vote-container .vote-time {
    width: 100vw;
    border-top: 10px solid #eef0f6
  }

  .slp-content .version-container {
    min-height: calc(100vh - 60px);
    padding: 0;
    width: auto
  }

  .slp-content .version-container .version-body {
    border: none;
    padding: 0
  }

  .slp-content .version-list li + li {
    border-top: 1px solid #dadfeb
  }

  .slp-content .version-list li .num {
    width: 70px;
    text-align: left
  }

  .slp-content .version-list li .date {
    text-align: left
  }

  .slp-content .version-list li .worker {
    position: absolute;
    border: 1rem;
    left: 1rem;
    text-align: left
  }

  .slp-content .version-list li .mention {
    text-align: left;
    width: calc(100vw - 185px)
  }

  .slp-content .version-list li .version {
    width: 90px;
    text-align: left
  }

  .slp-content .version-btn-wrap {
    width: auto;
    padding: 1rem;
    display: flex;
    display: -ms-flexbox;
    justify-content: center
  }

  .slp-content .version-btn-wrap .d-m-flex {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
    padding: .5rem 1rem;
    border-radius: 2rem;
    background: #fff
  }

  .slp-content .version-btn-wrap .btn + .btn {
    margin-top: 0;
    margin-left: .5rem
  }

  .slp-content .contact-wrap {
    display: block;
    min-height: calc(100vh - 162px)
  }

  .slp-content .contact-category-nav {
    border: none;
    width: 100vw;
    border-bottom: 10px solid #eef0f6;
    height: auto;
    padding: 0
  }

  .slp-content .contact-title-wrap {
    padding: .5rem 1rem
  }

  .slp-content .contact-title-wrap.mobile {
    display: flex;
    display: -ms-flexbox
  }

  .slp-content .contact-category-nav ul,
  .slp-content .contact-list-container ul {
    margin: 0;
    padding: .5rem 1rem
  }

  .slp-content .contact-category-nav .added .wrap:before {
    background-image: none !important
  }

  .slp-content .contact-category-nav .added .wrap .etc,
  .slp-content .contact-list-container .added .wrap .etc {
    position: absolute;
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-image: url(../img/editor/editor-panel-icon-setting.png);
    background-position: center;
    right: 0;
    display: block
  }

  .slp-content .contact-category-nav .added .wrap:hover:before {
    background-image: url(../img/editor/editor-btn-contact-check.png) !important
  }

  .slp-content .contact-category-nav .added.active .wrap:before {
    background-image: url(../img/editor/editor-btn-folder.png)
  }

  .slp-content .contact-category-nav .added .wrap .etc {
    top: 3px
  }

  .slp-content .editor-btn-set-add-contact {
    background-image: url(../img/editor/editor-btn-toggle-normal.png)
  }

  .slp-content .contact-category-nav .edit-list {
    margin: 0 -1rem;
    padding: .75rem 1rem
  }

  .slp-content .contact-category-nav .edit-list .category-input {
    border-radius: 2rem;
    padding: 3px 1rem;
    width: calc(100vw - 96px)
  }

  .slp-content .contact-category-nav .edit-list .check,
  .slp-content .contact-category-nav .edit-list .close,
  .slp-content .contact-list-container .edit-list .check,
  .slp-content .contact-list-container .edit-list .close {
    border-radius: 2rem
  }

  .slp-content .contact-list-container {
    padding: .5rem 0;
    width: 100vw
  }

  .slp-content .contact-list-container .added .wrap {
    display: block;
    padding: .5rem 0
  }

  .slp-content .contact-list-container .added .category {
    width: auto;
    color: #999
  }

  .slp-content .contact-list-container .added .wrap:hover {
    background-color: transparent
  }

  .slp-content .contact-list-container .added .wrap .etc {
    top: 15px
  }

  .slp-content .contact-list-container .edit-list {
    display: block;
    margin: 0 -1rem;
    padding: .75rem 1rem
  }

  .slp-content .contact-list-container .edit-list .category-input,
  .slp-content .contact-list-container .edit-list .mail-input,
  .slp-content .contact-list-container .edit-list .name-input {
    border-radius: 2rem;
    padding: 3px 1rem
  }

  .slp-content .contact-list-container .edit-list .category-input {
    width: calc(40vw - 1rem - 1px)
  }

  .slp-content .contact-list-container .edit-list .name-input {
    width: calc(60vw - 1rem - 1px)
  }

  .slp-content .contact-list-container .edit-list .mail-input {
    width: calc(100vw - 2rem - 64px);
    margin-left: 0
  }

  .slp-content.slp-content-radius {
    border-bottom-left-radius: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-right-radius: 0;
    -moz-border-radius-bottomright: 0
  }

  .mobile-search-layer-container.active {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0)
  }

  .msl-header {
    /* background: #233f65; */
    background: #fff;
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    height: 50px;
    padding-right: .5rem
  }

  .msl-header input {
    border:1px solid #ccc;
    padding:5px 10px;
    border-radius: 20px;
    flex: 1;
    color: #000
  }

  .msl-header input:placeholder {
    color: #fff5
  }

  .msl-header .btn-back{
    display: flex;
    width: 55px;
    height: 40px;
    text-align: center;
    justify-content: center;
    align-items: center;
  }

  .msl-header .btn-search {
    display: block;
    width: 40px;
    height: 40px;
    text-align: center;
    background-repeat: no-repeat;
    background-position: center
  }

  /* .msl-header .btn-back {
    background-image: url(../img/editor/editor-btn-top-back.png)
  } */

  .msl-header .back_icon{
    display:inline-block;
    width:12px;
    height:12px;
    border:2px solid #000;
    border-top:none;
    border-right:none;
    transform: rotate(45deg);
    margin-right:5px;
  }


  .msl-header .btn-search {
    /* background-image: url(../img/editor/editor-btn-search.png) */
    background-image: url(../img/common/i_search.svg);
    background-size: 50%;
  }

  .vh-428px {
    height: calc(100vh - 357px)
  }

  .open-m-right .section-editor-wrap {
    overflow: visible
  }

  .section-editor-footer .range-group .mat-mdc-slider {
    margin-top: -16px;
    min-width: 80px
  }

  .loading-area {
    min-height: calc(100vh - 236px)
  }
}

@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}

@keyframes load8 {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}



/* 모바일 240313 -- map header */
.section-editor-header.mobile{
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: space-between;
  height: 46px;
  background-color: transparent;
  padding: 0 20px;
  /* position: fixed;
  top: 0;
  left: 0; */
  width: 100%;
  color: #000;
  z-index: 10;
  background-color:#013E98;
  position:fixed;
}

/* note 일 때 header */
.section-editor-header.mobile.note{
  position: fixed;
  /*background-color: #fff;*/
  background-color:#013E98;
}

.section-editor-header.mobile .search-option-wrap {
  position: relative;
  display: flex;
  top: 0;
  right: 0;
  width: 30px;
  height: 30px;
  justify-content: center;
  align-items: center;
}

.section-editor-header.mobile .btn-search-b {
  border: 0;
  background-image: url(../img/common/i_search_b.svg);
  background-size: contain;
  height: 20px;
  padding: 0;
  width: 20px;
}

@media (min-width:961px) and (max-width: 1280px) {
  .section-editor-header.mobile .input-search-text {
    border: 1px solid #f1f1f1;
    width: 240px;
    height: 30px;
    border-radius: 15px;
    background-color: #ffffff;
    font-size: .875rem;
    padding: 0 34px 0 20px;
    color: #333;
  }
  .section-editor-header.mobile .search-option-wrap {
    position: absolute;
    display: block;
    top: 4px;
    right: 5px;
}

.section-editor-header.mobile .btn-search-b {
    border: 0;
    background-image: url(../img/common/i_search.svg);
    background-size: contain;
    height: 20px;
    padding: 0;
    width: 20px;
  }

}

@media (min-width:767px) and (max-width: 960px) {
  .section-editor-header.mobile .input-search-text {
    border: 1px solid #f1f1f1;
    width: 240px;
    height: 30px;
    border-radius: 15px;
    background-color: #ffffff;
    font-size: .875rem;
    padding: 0 34px 0 20px;
    color: #333;
  }
  .section-editor-header.mobile .search-option-wrap {
    position: absolute;
    display: block;
    top: 4px;
    right: 5px;
}

.section-editor-header.mobile .btn-search-b {
    border: 0;
    background-image: url(../img/common/i_search.svg);
    background-size: contain;
    height: 20px;
    padding: 0;
    width: 20px;
  }

}


.section-editor-header.mobile .header_back{
  display: flex;
  justify-content: center;
  align-items: center;
}

.section-editor-header.mobile .header_back div { }

.section-editor-header.mobile .header_back .back_icon{
  display:block;
  width:12px;
  height:12px;
  border:3px solid #fff;
  border-top:none;
  border-right:none;
  transform: rotate(45deg);  
  margin-right:5px;
}

.collaborationbtn .tool-081 {
  background-image: url(/assets/img/editor/editor-btn-main-cooperation-white.svg);
  background-position: center;
  background-repeat: no-repeat;
  fill:#fff;
  /*background-size:100%;*/
}

.section-editor-header.mobile .header_icon_div{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: -15px;
}

.section-editor-header.mobile .header_icon_div .save_btn.disabled{
  font-size: .75rem;
  color: #ccc;
  border: 1px solid #d9d9d9;
  background-color: transparent;
  border-radius: 1rem;
  padding: 0.25rem 0.75rem;
  cursor: pointer;
  margin-left: 0.5rem;
  pointer-events: auto !important;
  margin-right:10px;
}


.section-editor-header.mobile .header_icon_div .round{
  display: flex;
  justify-content: space-around;
  align-items: center;

  /* width:170px; */
  height: auto;
  /* border:1px solid #f1f1f1;
  background-color: #fbfbfb;
  border-radius:18px;
  padding: 0 10px;
  margin-right:-15px; */
}

.section-editor-header.mobile .header_icon_div .round .round_icon_list{
  display: flex;
  justify-content: center;
  align-items: center;
}

.section-editor-header.mobile .header_icon_div .round .round_icon_list li{
  width: 100%;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.section-editor-header.mobile .header_icon_div .round .round_icon_list li.round_icon{
  width:45px;
}

.section-editor-header.mobile .header_icon_div .round .round_icon_list li.round_icon.active{
  background-color: #ccc;
  border-radius: 15px;
}

.section-editor-header.mobile .header_icon_div .round .round_icon_list .btn-top-do-b {
  background-image: url(/assets/img/editor/editor-btn-top-do-b.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size:70%;
}

.section-editor-header.mobile .header_icon_div .round .round_icon_list .btn-top-redo-b {
  background-image: url(/assets/img/editor/editor-btn-top-redo-b.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size:70%;
}

/* .section-editor-header.mobile .header_icon_div .round .round_icon_list .btn-search-b {
  background-image: url(/assets/img/common/i_search_b.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 57%;
} */

.section-editor-header.mobile .header_icon_div .round .round_icon_list .btn-three-dot {
  background-image: url(/assets/img/dashboard/mymap/icon/three_dots_w.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size:18%;
}

.section-editor-header.mobile .header_icon_div .round .round_icon_list li.round_icon:last-child {
  width:36px;
}

.section-editor-header.mobile .dropdown-nav-wrap{
  z-index: 999;
  background: #fff;
  border-radius: 20px;
  /* border-top-left-radius: 20px;
  border-top-right-radius: 20px; */
  position: fixed;
  width: 100vw;
  max-width: 390px;
  height: 200px !important;
  bottom: 0;
  /* box-shadow: -1px -3px 10px #999; */
  right: 0;
  left:0;
  border: none;
  display:none !important;
  /* display:block !important; */
}

.section-editor-header.mobile .dropdown-nav-wrap.active,
.section-editor-header.mobile .navDim.active{
  display:block !important;
}

.section-editor-header.mobile .navDim{
  width:100vw;
  height:100vh;
  background: #333;
  opacity:.3;
  position: absolute;
  top:0;
  left:0;
  display:none !important;
}

.section-editor-header.mobile .nav-mobile-head{
  background-color: transparent;
  justify-content: space-between;
  padding:0 20px;
}

.section-editor-header.mobile .nav-mobile-head .nav-mobile-title{
  white-space: nowrap;
  word-wrap: break-word;
  overflow: hidden;
  word-break: break-all;
  text-overflow: ellipsis;
  padding-right:30px;
  font-weight:bold;
}

.section-editor-header.mobile .nav-mobile-icon-list{
  display:flex;
  justify-content: space-between;
  align-items: center;
}

.section-editor-header.mobile .nav-mobile-icon-list div{
  width:36px;
  height:auto;
  text-align:right;
}

.section-editor-header.mobile .nav-mobile-icon-list div.disabled{
  opacity:.3;
}

.section-editor-header.mobile ul.dropdown-nav{
  padding:0 20px;
  border:none;
}

.section-editor-header.mobile ul.dropdown-nav li{
  justify-content: flex-start !important;
  padding:1rem 0;
  border-bottom:1px solid #f1f1f1;
  font-size:16px;
}

.section-editor-header.mobile ul.dropdown-nav li:last-child{
  border-bottom:none;
}

.dropdown_map {
  position: relative;
}

.dropbtn_map {
  align-items: center;
  display: flex;
  /*justify-content: center;*/
  width: 36px;
  height: 30px;
}

.dropbtn_map img{
  width:auto !important;
  max-width:none
}

.dropbtn_map.active{
  background-color: #f1f1f1;
}

/* .dropbtn_map.active::after {
  transform: rotate(180deg);
  transition: 1s;
} */

/* .dropbtn::after {
  background: url('/assets/img/dashboard/mymap/icon/chevron_down.svg') no-repeat;
  content: '';
  display: inline-block;
  height: 14px;
  margin: 0 0 0 auto;
  transition: 1s;
  width: 14px;
} */


.dropdown_content_map {
  background-color: #ffffff;
  border: 1px solid #f1f1f1;
  border-radius: 8px;
  display: none;
  filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.10));
  margin: 0;
  width: 210px !important;
  height: auto  !important;
  position: absolute;
  padding: 8px 0;
  z-index: 1;
  right: -25px;
  top: 35px;
}

.dropdown_content_map.active {
  display: block;
}

.dropdown_content_map a {
  align-items: center;
  color: #464646;
  display: flex;
  font-size: 16px;
  font-weight: 400;
  padding: 8px 16px;
  text-decoration: none;
}

.dropdown_content_map a.dropdown_map_close {
  justify-content: flex-end;
  padding:0 16px;
}

.dropdown_content_map a:hover {
  background-color: #f1f1f1;
}

.icoalltop {
  left:20px; 
  top:1px; 
  position: absolute;
  display:block;
  background-image: url(../ico/all-top.svg);
  background-repeat: no-repeat;
  background-size:cover;
  width: 25px;
  height: 25px;
}