@charset "utf-8";
/* @import url(https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean);
@import url(https://use.fontawesome.com/releases/v5.4.1/css/all.css); */

select{
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}

.pos-bottom {
  position: fixed;
  /*left: 14px;*/
  
  right: 31px;
  bottom: 28px;
}

.leftnav1 {
  right: 28px;
  top: 64px;
  position: fixed;
  width: auto;
}

.leftnav2 {
  right: 23px;
  /*top: 362px;*/
  top:125px;
  position: fixed;
  width: auto;
}


.tooltip2 em {
  overflow: hidden;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 90px;
  display: inline-block;
  vertical-align: middle;
}

.tooltip2 {
  position: relative;
  display: inline-block;
}

.tooltip-text {
  top: -25px;
  left: 0;
  display: none;
  position: absolute;
  border-radius: 5px;
  padding: 5px;
  font-size: 0.8em;
  color: white;
  background: #FFFF99;
  white-space: nowrap;
  color: #000000;
  z-index: 44;
}

.tooltip2:hover .tooltip-text {
  display: inline-block;
}


.fbg {
  background-image: url(../img/editor/editor-btn-folder-active.png) !important;
  width: 28px !important;
  height: 20px !important;
  border-radius: 0px !important;
  margin-right: 0px !important;
  left: -2px;
  position: absolute;
}

.h-Tit {
  padding-left: 26px;
}

.bt-3 {
  margin-bottom: 0.5rem !important;
}


@media (max-width: 844px) {
  .hide-m {
    display: none;
  }

  .fbg {
    left: -5px;
  }
}


::ng-deep .custom-tooltip {
  overflow: initial;
  margin-top: -10px;
  background-color: black;
  height: auto;
  font-size: 20px !important;
  color: #FFF !important;
  right: calc(50% - 0.5rem);
  transform: rotate(0);
  /* bottom: 10px; */
}

.bg-unset {
  background-color: unset !important;
  background-image: url(../img/dashboard/dashboard-icon-calander.png) !important;;
}

.align-mody {
  justify-content: flex-end !important;
}

.stuts {
  display: flex;
  align-items: center;
  margin-right: 12px;
  font-size: .875rem;
}

.replace1 {
  background-image: url(../img/setting/add.png) !important;
}

.replace2 {
  background-image: url(../img/setting/add2.png) !important;
}

.replace3 {
  background-image: url(../img/setting/add3.png) !important;
}

.replace4 {
  background-image: url(../img/setting/add4.png) !important;
}

.liwrap {
  padding: 0.5rem;
  font-size: .875rem;
  position: relative;
  display: flex;
}

.liwrap i {
  background-image: url(../img/setting/setting-thumbnail-user.png);
  width: 20px;
  height: 20px;
  border-radius: 10px;
  display: inline-block;
  margin-right: 5px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.a1 {
  /* width: 370px; */
  width: 420px;
  align-items: center;
  display: flex;
}

.b1 {
  width: 80px;
  align-items: center;
  display: flex;
  justify-content: center;
}

/* .c1 { width:70px;    align-items: center;    display: flex; justify-content: center;  }  */
.d1 {
  width: 80px;
  align-items: center;
  display: flex;
  justify-content: center;
}

.d2 {
  /* width: 100px; */
  width: 120px;
  align-items: center;
  display: flex;
  justify-content: center;
}

.f1 {
  width: 80px;
  align-items: center;
  display: flex;
  justify-content: center;
}

.more {
  position: absolute;
  right: 0;
  width: 30px;
  height: 30px;
  background-image: url(../img/setting/setting-icon-type-setting.png);
  cursor: pointer;
  top: 4px;
}

.g1 {
  position: absolute;
  right: 10px;
}

.asc {
  background: url(../img/editor/up.png) no-repeat;
  background-position: center;
  width: 8px;
  height: 10px;
  padding-left: 20px;
}

.desc {
  background: url(../img/editor/down.png) no-repeat;
  background-position: center;
  width: 8px;
  height: 10px;
  padding-left: 20px;
}

.updown button {
  height: 10px;
  display: flex;
  align-items: center;
}

.updown button:first-child {
  background: url(../img/editor/up.png) no-repeat;
  background-position: center;
}

.updown button:last-child {
  background: url(../img/editor/down.png) no-repeat;
  background-position: center;
}

.updown button:first-child:hover {
  background: url(../img/editor/up2.png) no-repeat;
  background-position: center;
}

.updown button:last-child:hover {
  background: url(../img/editor/down2.png) no-repeat;
  background-position: center;
}

.updown {
  margin-left: 7px;
}

.item-list li:first-child {
  cursor: auto !important;
}

.liwrap .btncs {
  font-size: .775rem;
  position: relative;
  display: flex;
  background: #83c10a;
  color: white;
  border-radius: 3px;
  margin-left: 10px;
  font-weight: 400;
}


@media (max-width: 844px) {
  .liwrap {
    font-size: .875rem;
    position: relative;
    /* display: block; */
    display: flex;
    padding: 0.5rem 0 0.5rem 1rem;
  }

  .item-list li:first-child {
    /*display: none;*/
  }

  .a1 {
    width: 190px;
    align-items: center;
    display: flex;
  }

  .b1 {
    width: auto;
    align-items: center;
    display: inline-flex;
    justify-content: center;
    flex-flow: row wrap;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-right: 1rem;
  }

  .c1 {
    width: auto;
    align-items: center;
    display: inline-flex;
    justify-content: center;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-right: 1rem;
  }

  .d1 {
    width: auto;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-right: 1rem;
  }
  
  .f1 {
    width: 80px;
    align-items: center;
    display: flex;
    justify-content: center;
  }

  /* .f1 {
    width: auto;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-right: 1rem;
    position: absolute;
    right: 11px;
  } */

  .more {
    position: absolute;
    right: 0;
    width: 30px;
    height: 30px;
    background-image: url(../img/setting/setting-icon-type-setting.png);
    cursor: pointer;
    top: 4px;
  }

  .g1 {
    position: absolute;
    right: 10px;
  }
}


.abopos {
  position: absolute;
  right: 10px;
}

.h85 {
  display: block !important;
  background: #f2f5fc;
}

.paner-top {
  display: flex;
}

.paner-top span {
}

.term {
  font-size: 0.755rem;
  display: block;
  padding-top: 10px;
}

.disflex {
  display: flex !important;
  margin-left: 5px;
  position: absolute;
  /* right: 50px; */
  right: 15px;
}

.disflex2 {
  display: flex !important;
  margin-left: 15px;
}

.plus-wrap {
  display: flex;
  align-items: center;
  position: absolute;
  left: 65px;
}

.plus-wrap2 {
  display: flex;
  align-items: center;
  position: absolute;
  left: 50px;
  left: 50px;
  top: 18px;
}

.plus-icon {
  background-image: url(../img/editor/plusicon.png);
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  margin-right: 6px;
}

.plus-icon2 {
  background-image: url(../img/editor/plusicon.png);
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  margin-right: 6px;
}

.plus-icon3 {
  background-image: url(../img/editor/setting.png);
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  margin-left: 6px;
}

.btn-cs {
  margin-left: 10px;
}

.top-btn {
  padding: 0.2em 0.5rem;
  font-size: .675rem;
  border-radius: 0.2rem;
  background: #3D9BFB;
  color: white;
  margin-left: 12px;
  display: flex;
  align-items: center;
}

.btn-com {
  padding: 0.2em 0.5rem;
  font-size: .675rem;
  border-radius: 0.2rem;
  background: #56b500;
  color: white;
}

.posdis {
  position: absolute;
  right: 16px;
  top: -2px;
}

.editor-panel-tool-list li.key:before {
  background-image: url(../img/editor/key.png);
}

.editor-panel-tool-list li.poll:before {
  background-image: url(../img/editor/poll.png);
}

.btn-color {
  background: #464646 !important;
}


.width-880 {
  width: 880px !important;
}

.userbox {
  display: flex;
  margin-bottom: 10px;
  height: 25px;
}

.btnwrap {
  display: flex;
}

.searchwrap {
  display: flex;
}

.btn-style {
  border: 1px solid #dadfeb;
  border-radius: 0.5rem;
  height: 30px;
  margin-left: 2px;
  font-size: 13px;
  background: #f1f3f7;
  color: #303c56;
  padding: 0 0.8rem;
}

.btn-style2 {
  margin-right: 5px;
  border-radius: 100px;
  font-size: .765rem;
  padding: 0.5rem 1.5rem;
  background: #444343;
  color: white;
}

.search {
  background: #fff;
  border: 1px solid #dadfeb;
  border-radius: 0.5rem;
  padding: 3px 0.5rem;
  font-size: .875rem;
  height: 30px;
  width: 270px;
  margin-left: 2px;
}

.ft-select {
  font-size: 13px;
  margin-right: 10px;
}

.mb10 {
  margin-bottom: 10px;
  height: 25px;
}

.set-wrap {
  padding: 20px;
}

.form-control2 {
  border-color: #c6cdde;
  margin-right: 12px;
  border-radius: 100px;
  background-color: transparent;
  font-size: .875rem;
  padding: 0.5rem 1.5rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  width: 60%;
}

.search-box {
  display: flex;
  align-items: center;
  font-size: 14px;
  margin-left: 5px;
  margin-top: 5px;
}

.df15 {
  display: flex;
  align-items: center;
  margin-right: 35px;
}

.m-left15 {
  margin-left: 6px;
}

.left-area {
  display: flex;
  align-items: center;
}

.right-area {
  display: flex;
  align-items: center;
}

.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;
  cursor: pointer;
}

.slp-content .version-head .name {
  width: 120px;
  text-align: center;
  display: flex;
  justify-content: center;
  padding-left: 15px;
}

.slp-content .version-head .userid {
  width: 120px;
  text-align: center;
  display: flex;
  justify-content: center;
  padding-left: 22px;
  position: relative;
}

.slp-content .version-head .part {
  width: 120px;
  text-align: center;
  display: flex;
  justify-content: center;
  position: relative;
}

.slp-content .version-head .position {
  width: 120px;
  text-align: center;
  display: flex;
  justify-content: center;
  position: relative;
}

.slp-content .version-head .grade {
  width: 120px;
  text-align: center;
  display: flex;
  justify-content: center;
  position: relative;
}

.userid:before,
.part:before,
.position:before,
.grade:before {
  content: '';
  position: absolute;
  width: 1px;
  height: 12px;
  background: #eef0f6;
  top: 5px;
  left: 0;
}

.version-list li .userid:before,
.version-list li .part:before,
.version-list li .position:before,
.version-list li .grade:before {
  content: '';
  position: absolute;
  width: unset;
  height: unset;
  background: none;
}

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

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

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

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

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

.tap-title {
  padding: 15px 20px 0;
}

.tap-title .tab-item.active {
  margin-right: 20px;
  color: #333;
  position: relative;
  cursor: pointer;
}

.tap-title .tab-item {
  margin-right: 20px;
  color: #333;
  position: relative;
  cursor: pointer;
}

.tap-title .tab-item.active:after {
  position: absolute;
  content: '';
  background: #4e5669;
  width: 100%;
  height: 2px;
  left: 0;
  right: 0;
  bottom: -7px;
}


@media (max-width: 844px) {
  .width-880 {
    width: 100% !important;
  }

  .btn-style2 {
    margin-right: 5px;
    border-radius: 100px;
    font-size: .765rem;
    padding: 0.5rem 0.1rem;
    background: #444343;
    color: white;
    width: 90px;
  }

  .search-box {
    display: block;
    width: 210px;
  }

  .tap-title {
    padding: 0.5rem 1rem;
    font-size: .875rem;
  }

  .search {
    width: 100%;
  }

  .userbox {
    display: flex;
    margin-bottom: 10px;
    height: auto;
    padding: 0.5rem 1rem;
  }

  .btn-style {
    padding: 0 0;
    width: 80px;
  }

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

  .slp-content .version-list li .userid {
    width: 120px;
    text-align: left;
  }

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

  .slp-content .version-list li .position {
    width: 120px;
    text-align: right;
  }

  .d-d-flex {
    justify-content: space-between;
    display: flex !important;
  }

  .slp-content .version-list li .grade {
    width: 120px;
    text-align: left;
  }

  .slp-content .version-list li {
    display: block;
    display: -ms-flexbox;
    font-size: .875rem;
    padding: 0.25rem;
    position: relative;
    padding: 0.5rem 1rem;
  }

}


.search-wrap,
.slp-footer .paging-area ul {
  position: relative;
}

.disflex2 .new span {
  display: block;
  width: 16px;
  height: 16px;
  background-color: red;
  color: #fff;
  position: absolute;
  top: -3px;
  right: -3px;
  border-radius: 50%;
  font-size: 12px;
  text-align: center;
  line-height: 1;
}


.list-info {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.big1 {
  display: flex;
}

.big2 {
}

.titbox {
  display: flex;
  margin-bottom: 10px;
  height: 25px;
}

.symbol-body {
  padding: 0.25rem 0.5rem;
  border: 1px solid #c6cdde;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
  margin-top: -1px;
  height: 478px;
}


.simbol-item {
  width: 320px;
  padding: 20px;
}

.simbol-wrap {
  display: block;
}

.symbol-list li {
  display: inline-block;
  display: -ms-flexbox;
  font-size: .875rem;
  padding: 0.1rem;
  position: relative;
  margin-bottom: 0.1rem;
  border: 1px solid #dbdbdb;
}

.sicon {
  width: 22px;
  display: flex;
  justify-content: center;
  cursor: pointer;
}

.symbox {
  display: flex;
  margin-bottom: 10px;
  height: 25px;
}

.symbol-container {
  width: 610px;
  padding: 20px;
}


.version-body2 {
  padding: 0.25rem 0.5rem;
  border: 1px solid #c6cdde;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
  margin-top: -1px;
  min-height: 362px;
  height: auto;
}


.version-body3 {
  padding: 0.25rem 0.5rem;
  border: 1px solid #c6cdde;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
  margin-top: -1px;
  min-height: 40px;
  height: auto;
}


@media (max-width: 844px) {

  .list-info {
    font-size: .775rem;
  }

  .titbox {
    display: flex;
    margin-bottom: 10px;
    height: auto;
    padding: 0;
  }


  .big1 {
    min-height: calc(100vh - 162px);
  }

  .big2 {
    padding: 20px 20px 20px 0;
  }

  .symbox {
    display: flex;
    margin-bottom: 0px;
    height: auto;
    padding: 0.5rem 1rem;
  }

  .version-body2 {
    border: none;
    padding: 0;
    margin-bottom: 22px;
    padding: 1px;
  }

  .symbol-list {
    padding: 0;
  }

  .symbol-list li {
    display: inline-block;
    display: -ms-flexbox;
    font-size: .875rem;
    padding: 0.11rem;
    position: relative;
    padding: 0.3rem 0.3rem;
  }

  .symbol-container {
    padding: 0;
    width: auto;
  }

  .symbol-body {
    padding: 0.25rem 0.5rem;
    border: 1px solid #c6cdde;
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
    margin-top: -1px;
    min-height: 497px;
  }


}


/* 2023-0216*/
.centool {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  align-items: center;
}


.tool-081 {
  background-image: url(../img/editor/editor-btn-main-cooperation.svg);
  background-position: center;
  background-repeat: no-repeat;
}

.tool-082 {
  background-image: url(../img/editor/editor-panel-icon-progress-radial-01.png);
  background-position: center;
  background-repeat: no-repeat;
}

.tool-083 {
  background-image: url(../img/editor/editor-panel-icon-list-radi.png);
  background-position: center;
  background-repeat: no-repeat;
}

.tool-list-box {
  display: flex;
  display: -ms-flexbox;
  margin-right: 22px;
}

.tool-list-box li {
  display: flex;
  display: -ms-flexbox;
  padding: 0.25rem 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid #ccc;
  background-color: #fff;
  margin-right: 15px;
}

.pos1 {
  margin-right: 120px;
  /* padding-right: 22px !important; */
}

.down-toggle {
  cursor: pointer;
  height: 15px;
  width: 15px;
  display: flex;
  border: 0px solid black;
  position: absolute;
  right: 14px;
  top: 12px;
}

.down-toggle:before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 4px solid #646464;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  position: absolute;
  top: 5px;
  left: 3px;
}


@media (max-width: 844px) {
  .tool-list-box {
    padding: 5px 1rem;
    border-radius: 0;
    box-shadow: none !important;
    max-width: 420px;
    /* width: 100%; */
    display: flex;
    display: -ms-flexbox;
    justify-content: space-between;
    border: none;
  }

  .pos1 {
    margin-right: 120px;
    width: auto !important;
    /* padding: 5px 0rem!important; */
    position: fixed;
    left: 0px;
  }
  
  .pos-bottom {
    position: fixed;
    /* left: 14px; */
    right: 30px;
    bottom: 28px;
  }

  .pos2 {
    margin-right: 0px;
    width: auto !important;
    padding: 8px !important;
  }

  .section-editor-footer .zoom-wrap {
    bottom: 16px;
    right: 0px;
  }

  .shadow2 {
    box-shadow: none !important;
  }

  .section-editor-footer {
    border-top: 0px solid #c6cdde;
  }

  .btn-change-img {
    font-size: 0.65rem;
  }
}


/* ��Dz ȭ�� �Ⱥ��̰� �մϴ�.*/
.pos2 input[type="checkbox"] {
  display: none
}

.pos2 input[type="checkbox"] + label span {
  background-image: url(../img/editor/progress-main.png);
  background-position: center;
  background-repeat: no-repeat;
  display: inline-block;
  width: 30px;
  height: 30px;
  vertical-align: middle;
  cursor: pointer;
}

.pos2 input[type="checkbox"]:checked + label span {
  background-image: url(../img/editor/editor-panel-icon-list-radi.png);
}

.toggle-show1 {
  position: fixed;
  top: 104px;
  left: 15px;
  width: 234px;
  right: 100px;
  padding: 0.25rem 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid #ccc;
  background-color: #fff;
  /* overflow-y: auto;    height: calc(100vh - 800px);*/
  display: none;
}

.toggle-show2 {
  position: fixed;
  top: 104px;
  left: 15px;;
  width: 234px;
  right: 100px;
  padding: 0.25rem 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid #ccc;
  background-color: #fff;
  /*  overflow-y: auto;    height: calc(100vh - 1040px);  */
  display: none;
}


.editor-panel-tool-list li.poll:before {
  background-image: url(../img/editor/poll.png);
}

.editor-panel-tool-list li.key:before {
  background-image: url(../img/editor/key.png);
}

.editor-panel-tool-list li.chat:before {
  background-image: url(../img/editor/chat.png);
}

/*.tool-list3 {*/
/*    display: flex;*/
/*    display: -ms-flexbox;*/
/*    padding: 8px !important;*/
/*    border-radius: 0.5rem;*/
/*    border: 1px solid #e9e9e9;*/
/*    background-color: #fff;*/
/*}*/

.section-editor-footer {
  height: 0px !important;
  border-top: 0px solid #c6cdde !important;
}

.newbottom {
  padding: 0.25rem 0.5rem;
  border: 1px solid #ccc;
  background-color: #fff;
  border-radius: 0.5rem;
  margin-bottom: 80px;
  position: relative !important;
}

.section-editor-footer .zoom-wrap {
  right: 6px;
}

.shadow2 {
  box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

.mem-list {
  position: fixed;
  display: flex;
  display: -ms-flexbox;
  padding: 0.25rem 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid #ccc;
  background-color: #fff;
}


/* left box contents*/
.top-item input:checked + label {
  color: #000000;
  border-bottom: 1px solid #000;
  font-weight: 600;
}

/*.top-item input:checked + label:before {*/
/*  content: "";*/
/*  background: #3e3e3e;*/
/*  height: 2px;*/
/*  position: absolute;*/
/*  left: 0;*/
/*  width: 100%;*/
/*  bottom: -1px;*/
/*}*/

.top-item label {
  border-bottom: 1px solid #fff;
  display: inline-block;
  cursor: pointer;
  color: #838383;
  font-size: .875rem;
  font-weight: 400;
  margin: 0;
  text-align: center;
  position: relative;
}


.btn-item input:checked + label {
  color: #fff !important;
  background-color: #3c5f8e;
}

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

input[type=radio] {
  display: none;
}

/******************/

.tap-group {
  font-size: 0.875rem;
}


.box-container {
  border-radius: 0.5rem;
  border: 1px solid #e9e9e9;
  background-color: #fff;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
  /* height: min-content !important; */
  position: fixed;
  /*right: 88px;*/
  left:62px;
  /*top: 70px;*/
  width: 320px;
  /*max-height: 60vh;*/
  overflow: hidden;
}


.box-container .close {
  background: url("../img/ico/i-x-lg.svg");
  display: inline-block;
  height: 16px;
  margin: 0 0 0 auto;
  position: relative;
  top: unset;
  right: unset;
  width: 16px;
}
.no-left {right:30px; top:60px; left:auto;}


.samsung-ver .no-left {top: unset; right: unset; left:unset; margin-top:45px;}

.shadow {
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05) !important;
}

.box-header {
  font-weight: 600;
  padding: .75rem 1rem 8px 1rem;
}

.box-content {
  display: flex;
  flex-direction: column;
  /*gap: 5px;*/
  /*overflow-y: scroll;
  max-height: calc(100vh - 180px);
  max-height: calc(75vh);*/
  padding: 0 1rem 1rem 1rem;
  position: relative;
}

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

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




@media (max-width:767px) {
.bottom_mobile_layer .box-content  {  
  overflow-y: none;
}
.bottom_mobile_layer01 .box-content {
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow-y: scroll;
  max-height: 30vh;
 /* max-height: calc(100vh - 180px);
  max-height: calc(75vh);*/
  padding: 0 .75rem 1rem 1rem;
  position: relative;
}

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

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

}



/* s: 20230926 추가 : seonwookim */
.box-container .tap-group {
  align-items: center;
  display: flex;
  gap: 16px;
}

.box-container .tap-group .tap-right{
  align-items: center;
  display: flex;
  margin: 0 0 0 auto;
}


.box-container .panel-icon-wrap2 {
  padding:0px 0px 0px 15px;
}

.box-container .panel-icon-wrap3 {
  padding:0px 0px 0px 0px;
}


.box-container .panel-icon-group {
  justify-content: space-between;
  width: 100%;
}

.box-container .panel-icon-group.type2 {
  justify-content: flex-start;
}

.box-container .panel-icon-group.type3 {
  justify-content: flex-start;
  gap:5px;
}

.box-container .panel-icon-group.type4 {
  justify-content: flex-end;
  gap:5px;
  margin:0px 0px 5px 0px;
}


/* e: 20230926 추가 : seonwookim */

/* 모바일 240311 추가 (도형,테두리,진행방향) */
.panel_icon_list.mobile{
  overflow: hidden;
  position: relative;
  width: 100%;
}

.panel_icon_list.mobile .panel-icon-group-mobile{
  width: auto;
  padding: 0;
  white-space: normal;
}

.panel_icon_list.mobile .panel-icon{
  width:41px;
  height:43px;
  /*height:45px;*/
  display: inline-block;
  background-color: #fff;
  /* border:1px solid #ccc; */
  margin-right:10px;
  border-radius:5px;
}

.panel_icon_list.mobile .panel-icon label{
  background-size: 43px;
}

.panel-item-wrap2.direction.mobile .panel-icon,
.panel-item-wrap2.design.mobile .panel-icon,
.panel-item-wrap2.design.mobile .panel-icon6{
  width:45px !important;
  height:45px !important;
  /* border:1px solid #ccc; */
  border-radius:5px;
  background-color: #fff;
  padding-top:7px;
  display: inline-block;
  margin-right: 5px;
  margin-bottom: 5px;
  touch-action: auto !important;
}

.panel-item-wrap2.design.mobile .panel-icon-group {
  justify-content: flex-start;
  /* width: 75%; */
}

.panel-item-wrap2.direction.mobile .panel-icon label{
  background-size: 35px !important;

}

/* 디자인 판넬 이미지 */
.panel-item-wrap2.design.mobile .panel-icon label,
.panel-item-wrap2.design.mobile .panel-icon6 label{
  background-size: 45px !important;

}

/* .panel-item-wrap2.direction.mobile input:checked + label{
  background-color: #f1f1f1;
  border-color: #f1f1f1 !important;
} */

.design-img.mobile,
.design-bg.mobile{
  display: flex;
  width: 30px;
  background: #f1f1f1;
  justify-content: center;
  align-items: center;
  padding: 5px;
  margin-right: 5px;
  border-radius: 5px;
  opacity: 0.5;
}

input[name=set-type]:checked + .design-img.mobile,
input[name=set-type]:checked + .design-bg.mobile{
  display: flex;
  opacity: 1;
}

/* 모바일 240311 추가 (도형,테두리,진행방향) */

/* left box contents*/
.panel-content {
  overflow-y: auto;
  height: calc(100vh - 153px);
  margin-top: -1px;
}

.panel-item-wrap {
  padding: 1rem 1rem;
  border-top: 1px solid #dadfeb;
  border-bottom: 1px solid #dadfeb;
  margin-bottom: -1px;
  position: relative;
}

.panel-icon-group {
  display: flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
  margin-left: 0px;
  margin-right: 0px;
}

.panel-icon {
  width: 26px;
}

.panel-icon2 {
  width: calc(16.666% - 4px);
  height: 30px;
  margin-bottom: 4px;
  margin-left: 0px;
  margin-right: 0px;
}

.panel-icon3 {
  width: calc(16.666% - 4px);
}

.panel-icon5 {
  width: calc(16.666% - 4px);
  height: 30px;
}

.color-set {
  /*margin-top: 8px;*/  
  display: flex;
  flex-direction: column; /* 기본값이지만 명시적으로 적어도 좋음 */
  flex-wrap: nowrap; /* 줄바꿈 없이 한 줄로 정렬 */
  /* gap: 8px; 요소 간 간격이 필요하면 추가 */
}



.color-set li {
  width: 1.3rem;
  height: 1.3rem;
  cursor: pointer;
  position: relative;
  border-radius: 100%;
  border: 1px solid #DFDFDF;
  margin-top: 12px;
}

.color-set li:nth-child(1) {
  margin-top:7px;
}


.latest-color-chip {
  margin-top: 12px;
  position: relative;
  text-align: left;
  padding:0px 11px 0px 11px;
}

.toplatest-color-chip {
  margin-top: 0px;
}



.color-chip-group {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: space-between;
}

.color-chip-topgroup {
  gap:2px;
}




.color-chip-group.mobile {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: flex-start;
  column-gap: 4.2%;
}

.color-palate-plus {
  width: 20px;
  height: 20px;
  background-image: url(../img/ico/i_plus.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-color: #ffffff;
}

.color-set li:hover:after {
  content: '';
  display: block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 100%;
  border: 2px solid #ff9600
}

.color-set li.selected:after {
  content: '';
  display: block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 100%;
  border: 2px solid #ff6400
}


.color-chip {
  width: 18px;
  height: 18px;
  border-radius: 100%; 
  border: 1px solid #DFDFDF;
  cursor: pointer;
  position: relative
}

.color-chip:hover:after {
  content: '';
  display: block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 18px;
  height: 18px;
  border-radius: 100%; 
  border: 2px solid #ff9600
}

.color-chip.selected:after {
  content: '';
  display: block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 18px;
  height: 18px;
  border-radius: 100%; 
  border: 2px solid #ff6400
}

.color-more {
  cursor: pointer;
  display:block;
  width:18px;
  height:18px;
  background: url(/assets/img/editor/editor-panel-back-arrow.svg);
  background-repeat: no-repeat;
  background-position: 3px 50%;
  transform: scaleX(-1); /* 가로 반전 */
}

.color-boundary {
  display:block;
  height:12px;
  border-top: 1px solid #f1f1f1;
  margin-top:12px;
}

.top-menu-color-ly .color-boundary {
  display:none;
}


/* 모바일 color 추가 240308 */
/* .color-wrap.mobile{
  overflow-y: auto;
  height: 255px;
} */

.color-chip.mobile {
  width: 1.25rem; /* 20 */
  height: 1.25rem;
  border-radius: 10px;
  border: 1px solid #d2d0d0;
  cursor: pointer;
  position: relative;
  margin-bottom: 10px;
}


.color-set.mobile{
  display:none;
}

.color-set.mobile li{
  width: 1.25rem; /* 20 */
  height: 1.25rem;
  border-radius: 10px;
  cursor: pointer;
  position: relative;
  border-left: 1px solid #f1f1f1;
  border-right: 1px solid #f1f1f1;
  margin-bottom: 5px;
}

.color-chip.mobile.selected:after,
.color-chip.mobile:hover:after {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 10px;
}

.color-set.mobile li.selected:after,
.color-set.mobile li:hover:after {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 10px;
}

.notecolor-chip-set {
  overflow:hidden;
}

.notecolor-chip-set div {
  display:inline-block;
  vertical-align: middle;
}
.notecolor-chip-set div:first-child {
  margin-right:15px;
}
.notecolor-chip-set .color-chip {
  margin:auto 3px;
}

.notecolor-chip-set .color-chip.notemenu {
  margin:auto 4px;
}


.form-switch {
  padding: 0;
}

.d-flex {
  align-items: center;
  display: flex;
}

/*.d-flex2 {*/
/*  align-items: center;*/
/*  display: flex;*/
/*  padding: 12px 0 0 0;*/
/*  position: relative;*/
/*}*/

.form-check-input {
  margin: 0;
}

/**/

.form-check-input {
  margin-left: -2.5em;
  background-image: url(data:image/svg+xml,%3csvg xmlns= 'http://www.w3.org/2000/svg' viewBox= '-4 -4 8 8' %3e%3ccircle r= '3' fill= 'rgba%280, 0, 0, 0.25%29' /%3e%3c/svg%3e);
  background-position: left center;
  border-radius: 2em;
  transition: background-position .15s ease-in-out;
  margin-left: 0px !important;
}


.form-select {
  padding: 0 1.5rem 0 5px;
  border: none;
  font-size: .875rem;
  color: #4e5669;
  background-position: right center;
}


.select-wrap {
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
  /*gap: 12px;*/
  margin-bottom:10px;
  padding:0px 11px 0px 11px;
}

.select-weight {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.select-weight .wrap {
  align-items: center;
  display: flex;
}

.select-wrap .panel-item-label {
  flex: 0 0 auto;
  text-align: left;
  /*min-width: 30px;*/
  padding-right:11px;
}

/* 모바일 추가 240308 */
.select-wrap.mobile .panel-item-label{
  font-size: 14px;
}

/* 색상 = 가지 */
.mobile_scroll.toolcolorlink{
 /* height:120px;*/
  overflow-y:auto;
  overflow-x: hidden;
}

/* 색상 = 도형 */
.mobile_scroll.figure{
 /* height:150px;*/
  overflow-y:auto;
  overflow-x: hidden;
}

/* 색상 = 글자 */
.mobile_scroll.font{
  /**height:170px;*/
  overflow-y:auto;
}

/* 색상 = 배경 */
.mobile_scroll.bg{
  /*height:32vh;*/
  overflow-y:auto;
  overflow-x: hidden;
}

.mobile_notescroll.bg{
  height:35px;
  width:60vw;
  overflow-y:auto;
  overflow-x: auto;
}

.mobile_scroll.text{
  /*height:280px;*/
  overflow-y:auto;
}

.mobile_scroll.figure2{
  /*height:170px;*/
  overflow-y:auto;
}

.mobile_scroll.design{
  height:160px;
  overflow-y:auto;
}

/* 모바일 240312 추가 */
.form_wrap.selectYes{
  position: relative;
}

.select-arrow.selectYes{
  position: relative;
}

.font-style-wrap.selectYes,
.font-align-wrap.selectYes{
  position: relative;
}

.font-style-wrap.selectYes{
  margin-right:20px;
}

.mobile_panel_select_btn {
  align-items: center;
  border-radius: 8px;
  border: 1px solid rgba(210, 213, 218, 0.50);
  background: #FFF;
  color: #666;
  cursor: pointer;
  display: block;
  font-size: 14px;
  text-align: left;
  justify-content: left;
  width: 50px;
  height: 24px;
  position: relative;
}

.mobile_panel_select_btn.h30{
  height: 30px;
}

.mobile_panel_select_btn.disabled{
  background-color: #f1f1f1;
}

.mobile_panel_select_btn img{
  height: 24px;
  object-fit: cover;
}

.mobile_panel_select_btn.active::after {
  transform: rotate(180deg);
  transition: 1s;
}

.mobile_panel_select_btn::after {
  background: url('/assets/img/dashboard/mymap/icon/chevron_down.svg') no-repeat;
  content: '';
  display: inline-block;
  height: 14px;
  margin: 0;
  transition: 1s;
  width: 14px;
  position: absolute;
  right:0;
  top: 6px;
}

.mobile_panel_select_btn.h30::after{
  top: 9px;
}

.mobile_panel_select_content {
  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;
  min-width: 50px;
  position: absolute;
  padding: 8px 0;
  z-index: 1;
  top: 23px;
  left: 40px;
}

.mobile_panel_select_content.active {
  display: block;
}

.mobile_panel_select_content input[type=checkbox]{
  display:none;
}

.mobile_panel_select_content a {
  justify-content: center;
  align-items: center;
  color: #464646;
  display: flex;
  font-size: 14px;
  font-weight: 400;
  text-decoration: none;
}

.mobile_panel_select_content a:hover {
  background-color: #fafafa;
}

.mobile_panel_select_content a label{
  width:100%;
  height: 25px;
  background-repeat: no-repeat;
  background-position: center;
}



.select-weight select {
    overflow: unset;
    background-image: none;
  border: 1px solid rgba(0,0,0,.25);
  border-radius: 4px;
  font-size: 12px;
  padding: 0px 5px 0px 5px;
  /*width: 58px;*/
}

.select-weight select:disabled {
    overflow: unset;
    background-image: none;
  border: 1px solid rgba(0,0,0,.25);
  border-radius: 4px;
  padding: 0px 5px 0px 5px;
}



.select-weight select, .select-weight select::picker(select) {
  appearance: base-select !important;
}

@supports (appearance: base-select) {
  .select-weight select,
  .select-weight select::picker(select) {
    appearance: base-select;
  }
}
.select-weight select::picker(select) {
  border-color:rgba(0,0,0,.25);
}


.select-weight select.custom {
  -webkit-appearance: none;
  appearance: none;
  /* 2)에서 골라둔 경계 표현 사용 */
  border-radius: 6px;
  outline-offset: -1px; /* border처럼 보이게 안쪽으로 */
}

select:not([multiple]) option::checkmark {
  content: none !important;
}

@supports (appearance: base-select) {
  select::picker(select) option::checkmark {
    content: none !important;
  }
}

select:not([multiple]) option::checkmark { 
  content: none !important; 
  opacity: 0 !important;
}


.select-shodow {
  width: 50%;
}

.select-shodow .wrap {
  align-items: center;
  display: flex;
}


.panel-icon-group-width {
  display: flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
}

.panel-icon {
  /* width: 30px;    height: 30px; */
  /*
width: calc(20% - 4px)!important;
  height: 36px!important;    */
}


.panel-icon5 {
  width: calc(21% - 4px) !important;
  height: 26px !important;
}

.panel-icon5 label {
  width: 100%;
  /* height: 30px; */
  height: 26px;

  border-radius: 0.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-color: transparent;
  cursor: pointer;
  border: 1px solid transparent;
}


.panel-icon5 input:checked + label {
  background-color: #e3e8f6;
  border-color: #e3e8f6 !important
}

.disabled .panel-icon6 input:checked + label,
.disabled .panel-icon label {
  background-color: transparent;
  border-color: transparent !important;
  cursor: default;
  opacity: .5
}

.panel-icon6 input:checked + label {
  background-color: #f1f1f1;
}

.disabled .panel-icon6 input:checked + label,
.disabled .panel-icon label {
  background-color: transparent;
  border-color: transparent !important;
  cursor: default;
  opacity: .5
}

.panel-icon7 input:checked + label {
  background-color: #e3e8f6;
  border-color: #e3e8f6 !important
}

.disabled .panel-icon6 input:checked + label,
.disabled .panel-icon label {
  background-color: transparent;
  border-color: transparent !important;
  cursor: default;
  opacity: .5
}

.panel-icon8 input:checked + label {
  background-color: #e3e8f6;
  border-color: #e3e8f6 !important
}

.disabled .panel-icon6 input:checked + label,
.disabled .panel-icon label {
  background-color: transparent;
  border-color: transparent !important;
  cursor: default;
  opacity: .5
}


.panel-icon5-1 label {
  width: 100%;
  /* height: 30px;
  height: 30px; 
  height:26px;*/
  border-radius: 0.15rem;
  background-position: center;
  background-repeat: no-repeat;
  background-color: transparent;
  cursor: pointer;
  border: 1px solid transparent;
  font-size: 12px;
  line-height:23px;
   display:block;
  height:24px;
}

.panel-icon7-1 label {
  width: 100%;
  /* height: 30px;
  height: 30px; 
  height:26px;*/
  border-radius: 0.15rem;
  background-position: center;
  background-repeat: no-repeat;
  background-color: transparent;
  cursor: pointer;
  border: 1px solid transparent;
  font-size: 12px;
  line-height:23px;
   display:block;
  height:24px;
}


/* 연결 */
.panel-icon6 {
  width: 30px; 
  height: 30px;
}

.panel-icon6 label {
  width: 100%;
  height: 30px;
  border-radius: 0.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-color: transparent;
  cursor: pointer;
  border: 1px solid transparent;
}

.panel-icon.w-25 {
  width: calc((100% / 5) - 4px) !important;
}


.panel-icon7 {
  width:90px !important;
  height: 25px !important;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}

.panel-icon7 label {
  width: 100%;
  /* height: 30px; */
  height: 25px;

  border-radius: 0.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-color: transparent;
  cursor: pointer;
  border: 1px solid transparent;
}


.panel-icon8 {
  width: calc(17% - 4px) !important;
  height: 26px !important;
  margin-bottom: 14px;
  margin-left: 2px;
  margin-right: 5px;
}

.panel-icon8 label {
  width: 100%;
  /* height: 30px; */
  height: 40px;
  border-radius: 0.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-color: transparent;
  cursor: pointer;
  border: 1px solid transparent;
}


.section-editor-body .real-scroll-w {
  z-index: 0;
  /* bottom index*/
}

/*.panel-icon + .panel-icon {*/
/*    margin-left: 4px;*/
/*}*/

.panel-icon input[type=checkbox],
.panel-icon input[type=radio] {
  display: none;
}

.editor-panel-icon-link-stroke-02 {
  background-image: url(../img/editor/editor-panel-icon-link-stroke-02.png);
}


.panel-icon2 {
  width: 30px;
  height: 30px;
}

.panel-icon2 + .panel-icon2 {
  margin-left: 4px;
}

.panel-icon2 input[type=checkbox],
.panel-icon input[type=radio] {
  display: none;
}

.panel-icon2 label {
  height: 30px;
}


.panel-icon3 {
  width: 24px;
  height: 24px;
}

.panel-icon3 + .panel-icon3 {
  margin-left: 4px;
}

.panel-icon3 input[type=checkbox],
.panel-icon input[type=radio] {
  display: none;
}

.panel-icon4 + .panel-icon3 {
  margin-left: 4px;
}

.panel-icon4 input[type=checkbox],
.panel-icon input[type=radio] {
  display: none;
}

.con1,
.con2,
.con3 {
  display: none;
}


.editor-link-01 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-01.png);
}

.editor-link-02 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-02.png);
}

.editor-link-03 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-03.png);
}

.editor-link-04 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-04.png);
}

.editor-link-05 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-05.png);
}

.editor-link-06 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-06.png);
}

.editor-link-07 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-07.png);
}

.editor-link-08 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-08.png);
}

.editor-link-09 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-09.png);
}

.editor-link-10 {
  background-image: url(../img/editor/editor-panel-icon-connect-kind-10.png);
}


.editor-map-01 {
  background-image: url(../img/editor/process1.png);
  background-size: contain;
}

.editor-map-02 {
  background-image: url(../img/editor/process2.png);
  background-size: contain;
}

.editor-map-03 {
  background-image: url(../img/editor/process3.png);
  background-size: contain;
}

.editor-map-04 {
  background-image: url(../img/editor/process4.png);
  background-size: contain;
}

.editor-map-05 {
  background-image: url(../img/editor/process5.png);
  background-size: contain;
}

.editor-map-06 {
  background-image: url(../img/editor/process6.png);
  background-size: contain;
}

.editor-map-07 {
  background-image: url(../img/editor/process7.png);
  background-size: contain;
}

.editor-map-08 {
  background-image: url(../img/editor/process8.png);
  background-size: contain;
}

.editor-map-09 {
  background-image: url(../img/editor/process9.png);
  background-size: contain;
}

.editor-map-10 {
  background-image: url(../img/editor/process10.png);
  background-size: contain;
}

.editor-map-11 {
  background-image: url(../img/editor/process11.png);
  background-size: contain;
}

.editor-map-12 {
  background-image: url(../img/editor/process12.png);
  background-size: contain;
}


.editor-map-13 {
  background-image: url(../img/editor/process13.png);
  background-size: contain;
}

.editor-map-14 {
  background-image: url(../img/editor/process14.png);
  background-size: contain;
}

.editor-map-15 {
  background-image: url(../img/editor/editor-panel-icon-progress-left-08.png);
}

.editor-map-16 {
  background-image: url(../img/editor/process16.png);
  background-size: contain;
}

.editor-map-17 {
  background-image: url(../img/editor/process17.png);
  background-size: contain;
}

.editor-map-18 {
  background-image: url(../img/editor/process18.png);
  background-size: contain;
}

.editor-map-19 {
  background-image: url(../img/editor/editor-panel-icon-progress-right-12.png);
}

.editor-map-20 {
  background-image: url(../img/editor/process19.png);
  background-size: contain;
}

.editor-map-21 {
  background-image: url(../img/editor/process20.png);
  background-size: contain;
}

.editor-map-22 {
  background-image: url(../img/editor/process21.png);
  background-size: contain;
}

.editor-map-23 {
  background-image: url(../img/editor/process22.png);
  background-size: contain;
}

.editor-map-24 {
  background-image: url(../img/editor/process23.png);
  background-size: contain;
}

.editor-map-25 {
  background-image: url(../img/editor/process24.png);
  background-size: contain;
}

.editor-map-26 {
  background-image: url(../img/editor/process25.png);
  background-size: contain;
}

.editor-map-27 {
  background-image: url(../img/editor/process26.png);
  background-size: contain;
}

.editor-map-28 {
  background-image: url(../img/editor/process27.png);
  background-size: contain;
}

.editor-map-29 {
  background-image: url(../img/editor/process28.png);
  background-size: contain;
}

.editor-map-30 {
  background-image: url(../img/editor/editor-panel-icon-progress-succession-01.png);
}



.color-palate {
    padding: 0px 8px;
}

.editor-color-01 {
  background-image: url(../img/editor/01_dn.svg);
  background-size: contain;
}

.editor-color-02 {
  background-image: url(../img/editor/02_dn.svg);
  background-size: contain;
}

.editor-color-03 {
  background-image: url(../img/editor/03_dn.svg);
  background-size: contain;
}

.editor-color-04 {
  background-image: url(../img/editor/04_dn.svg);
  background-size: contain;
}


.editor-simbol-01 {
  background-image: url(../img/editor/legend_left_1.5.png);
  background-size: contain;
}

.editor-simbol-02 {
  background-image: url(../img/editor/legend_right_1.5.png);
  background-size: contain;
}

.editor-simbol-03 {
  background-image: url(../img/editor/clipart_delete_1.5.png);
  background-size: contain;
}

/* 모바일 240311 추가 */
.deitor-column.mobile{
  border-top:0px;
  padding:0px;
}


.deitor-column.mobile .panel-icon-group{
  justify-content: flex-end !important;
}

.editor-simbol-01.mobile {
  background-image: url(../img/editor/legend_left_1.5_m.png);
  background-size: contain;
  width:50px;
  height:30px;
  margin:0 0 0 auto;
  display: block;
}

.editor-simbol-02.mobile {
  background-image: url(../img/editor/legend_right_1.5_m.png);
  background-size: contain;
  width:50px;
  height:30px;
  margin:0 0 0 auto;
  display: block;
}

.editor-simbol-03.mobile {
  background: #fff;
  background-image: url(../img/editor/editor-main-tool-08.svg);
  background-repeat:  no-repeat;
  background-position: center;
  background-size: 35px;
  width:50px;
  height:30px;
  border-radius:5px;
  margin:0 0 0 auto;
  display: block;
}

.panel-icon-group.shapes.mobile .panel-icon{
  display:inline-block;
  width:45px !important;
  height:45px !important;
  margin-right:7px;
  margin-bottom:7px;
  background-color: #fff;
  /* border:1px solid #ccc; */
  border-radius: 5px;
  padding-top:10px;
}

.panel-icon-group.images.mobile .panel-icon{
  display:inline-block;
  width:45px !important;
  height:45px !important;
  margin-right:6px;
  margin-bottom:7px;
  background-color: #fff;
  /* border:1px solid #ccc; */
  border-radius: 5px;
  padding-top:10px;
}


.panel-icon-group.shapes.mobile .panel-icon:nth-child(7n),
.panel-icon-group.images.mobile .panel-icon:nth-child(7n){
  margin-right:0;
}

.panel-icon-group.shapes.mobile .panel-icon label{
  background-size: 30px !important
}

.panel-icon-group.images.mobile .panel-icon label{
  background-size: 28px !important
}

.editor-img-01 {
  background-image: url(../img/editor/clipart_top_1.5.svg);
  background-size: contain;
}

.editor-img-02 {
  background-image: url(../img/editor/clipart_left_1.5.svg);
  background-size: contain;
}

.editor-img-03 {
  background-image: url(../img/editor/clipart_back_1.5.svg);
  background-size: contain;
}

.editor-img-04 {
  background-image: url(../img/editor/clipart_right_1.5.svg);
  background-size: contain;
}

.editor-img-05 {
  background-image: url(../img/editor/clipart_bottom_1.5.svg);
  background-size: contain;
}

.editor-img-06 {
  background-image: url(../img/editor/clipart_delete_1.5.svg);
  background-size: contain;
}

.editor-img-07 {
  background-image: url(../img/editor/clipart_delete_1.6.svg);
  background-size: contain;
}

.editor-img-08 {
  background-image: url(../img/editor/clipart_upload_1.6.svg);
  background-size: contain;
}

.editor-img-delect {
    background-image: url(../img/editor/clipart_delete_1.6.svg);
  background-size: contain;
}


.editor-bullet-01 {
  background-image: url(../img/editor/p-img-01.png);
  background-size: cover
}

.editor-bullet-02 {
  background-image: url(../img/editor/p-img-02.png);
  background-size: cover
}

.editor-bullet-03 {
  background-image: url(../img/editor/p-img-03.png);
  background-size: cover
}

.editor-bullet-04 {
  background-image: url(../img/editor/p-img-04.png);
  background-size: cover
}

.editor-bullet-05 {
  background-image: url(../img/editor/p-img-05.png);
  background-size: cover
}

.editor-bullet-06 {
  background-image: url(../img/editor/p-img-06.png);
  background-size: cover
}

.editor-bullet-07 {
  background-image: url(../img/editor/p-img-07.png);
  background-size: cover
}

.editor-bullet-08 {
  background-image: url(../img/editor/p-img-08.png);
  background-size: cover
}

.editor-bullet-09 {
  background-image: url(../img/editor/p-img-09.png);
  background-size: cover
}

.editor-bullet-10 {
  background-image: url(../img/editor/p-img-10.png);
  background-size: cover
}

.editor-bullet-11 {
  background-image: url(../img/editor/p-img-11.png);
  background-size: cover
}

.editor-bullet-12 {
  background-image: url(../img/editor/p-img-12.png);
  background-size: cover
}

.editor-bullet-13 {
  background-image: url(../img/editor/p-img-13.png);
  background-size: cover
}

.editor-bullet-14 {
  background-image: url(../img/editor/p-img-14.png);
  background-size: cover
}

.editor-bullet-15 {
  background-image: url(../img/editor/p-img-15.png);
  background-size: cover
}

.editor-bullet-16 {
  background-image: url(../img/editor/p-img-16.png);
  background-size: cover
}

.editor-bullet-17 {
  background-image: url(../img/editor/p-img-17.png);
  background-size: cover
}

.editor-bullet-18 {
  background-image: url(../img/editor/p-img-18.png);
  background-size: cover
}

.editor-bullet-19 {
  background-image: url(../img/editor/p-img-19.png);
  background-size: cover
}

.editor-bullet-20 {
  background-image: url(../img/editor/p-img-20.png);
  background-size: cover
}

.editor-bullet-21 {
  background-image: url(../img/editor/p-img-21.png);
  background-size: cover
}

.editor-bullet-22 {
  background-image: url(../img/editor/p-img-22.png);
  background-size: cover
}

.editor-bullet-23 {
  background-image: url(../img/editor/p-img-23.png);
  background-size: cover
}

.editor-bullet-24 {
  background-image: url(../img/editor/p-img-24.png);
  background-size: cover
}

.editor-bullet-25 {
  background-image: url(../img/editor/p-img-25.png);
  background-size: cover
}

.editor-bullet-26 {
  background-image: url(../img/editor/p-img-26.png);
  background-size: cover
}

.editor-bullet-27 {
  background-image: url(../img/editor/p-img-27.png);
  background-size: cover
}

.editor-bullet-28 {
  background-image: url(../img/editor/p-img-28.png);
  background-size: cover
}

.editor-bullet-29 {
  background-image: url(../img/editor/p-img-29.png);
  background-size: cover
}

.editor-bullet-30 {
  background-image: url(../img/editor/p-img-30.png);
  background-size: cover
}

.editor-bullet-31 {
  background-image: url(../img/editor/p-img-31.png);
  background-size: cover
}

.editor-bullet-32 {
  background-image: url(../img/editor/p-img-32.png);
  background-size: cover
}

.editor-bullet-33 {
  background-image: url(../img/editor/p-img-33.png);
  background-size: cover
}

.editor-bullet-34 {
  background-image: url(../img/editor/p-img-34.png);
  background-size: cover
}

@media (max-width: 844px) {
  .section-login .logo {
    margin-bottom: 0.8rem;
    height: 70px;
  }

  /* 추가 */
  .section-login .logo span {
    width: 220px !important;
    height: 68px !important;
    background-image: url(../img/brand/logo_brand.png);
    top: 0px !important;
    left: 200px !important;
    left: 76px !important;
  }
}

.form-con {
  border-color: #c6cdde;
  border-radius: 100px;
  background-color: transparent;
  font-size: .875rem;
  padding: 0.5rem 1.5rem;
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  resize: none;
  height: 82px;


}

.bgimage {
}

.bgcolor {
  display: none;
}


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

.radio-item {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  width: 120px;
}


.option-block {
  flex: 1;
  display: flex;
  display: -ms-flexbox;
  margin-top: 10px;
  align-items: center;
  margin-bottom: 12px;
}

.check-label {
  font-size: 12px;
  color: #333;
}


.radio-item2 {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  margin-right:3px;
}

.mleft10 {
  margin-right: 5px;
}

.btn-area2 {
  display: flex;
  display: -ms-flexbox;
  justify-content: flex-end;
  padding: 10px;
  border-top: 1px solid #eef0f6;
}

.btn2 {
  margin-right: 2px;
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;

  border: 1px solid transparent;
  padding: 0.2em 1rem;
  font-size: .775rem;
  border-radius: 0.2rem;
  background-color: #3c5f8e;
}

.btn-area {
  margin-top: 10px;
}


.opacity-opt {
  display: flex;
  align-items: center;
  justify-content: space-between !important;
}

.left-opt {
  margin-right: 7px;
  font-size: .875rem;
  display: flex;
}

.right-opt {
}

.range-group2 {
  width: 114px;
  height: 30px;
  position: relative;
}

.rang-label2 {
  font-size: 0;
  letter-spacing: 0;
  color: transparent;
  width: 14px;
  height: 14px;
  margin: 0;
  background-image: url(../img/editor/editor-btn-foot-rang.png);
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: 8px;
  max-width: 60px;
  background: #ffffff;
  border: 2px solid #6e6e6e;
  cursor: pointer;
}

.range-group2:before {
  content: '';
  display: block;
  width: 100px;
  height: 2px;
  background: #dfdfdf;
  position: absolute;
  top: 14px;
  left: 14px;
}


.editor-space-01 {
  background-image: url(../img/editor/editor-panel-icon-design-interval-01.png);
}

.editor-space-02 {
  background-image: url(../img/editor/editor-panel-icon-design-interval-02.png);
}

.editor-space-03 {
  background-image: url(../img/editor/editor-panel-icon-design-interval-03.png);
}

.editor-space-04 {
  background-image: url(../img/editor/editor-panel-icon-design-interval-04.png);
}

.editor-space-05 {
  background-image: url(../img/editor/replay.svg);
}


.editor-stem-01 {
  background-image: url(../img/editor/editor-panel-icon-link-stem-01.png);
}

.editor-stem-02 {
  background-image: url(../img/editor/editor-panel-icon-link-stem-02.png);
}

.editor-stem-03 {
  background-image: url(../img/editor/editor-panel-icon-link-stem-03.png);
}

.editor-stem-04 {
  background-image: url(../img/editor/editor-panel-icon-link-stem-04.png);
}

.editor-stem-05 {
  background-image: url(../img/editor/editor-panel-icon-link-stem-05.png);
}

.editor-stem-06 {
  background-image: url(../img/editor/editor-panel-icon-link-stem-06.png);
}

.editor-stem-07 {
  background-image: url(../img/editor/editor-panel-icon-link-stem-07.png);
}

.editor-stem-08 {
  background-image: url(../img/editor/editor-panel-icon-link-stem-08.png);
}


.editor-angle-01 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-01.png);
}

.editor-angle-02 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-02.png);
}

.editor-angle-03 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-03.png);
}

.editor-angle-04 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-04.png);
}

.editor-angle-05 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-05.png);
}

.editor-angle-06 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-06.png);
}

.editor-angle-07 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-07.png);
}

.editor-angle-08 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-08.png);
}

.editor-angle-09 {
  background-image: url(../img/editor/editor-panel-icon-link-branch-09.png);
}

.editor-angle-10.mobile {
  background: #fff;
  background-image: url(../img/editor/editor-main-tool-08.svg);
  background-repeat:  no-repeat;
  background-position: center;
  background-size: 35px;
  width:40px;
  height:30px;
  border-radius:5px;
  margin:0 0 5px 0;
  display: block;  
}

.editor-angle-10 {
  background-image: url(../img/editor/clipart_delete_1.6.svg);
  background-size: 50%;
}


.editor-trian-01 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-01.png);
}

.editor-trian-02 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-02.png);
}

.editor-trian-03 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-03.png);
}

.editor-trian-04 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-04.png);
}

.editor-trian-05 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-06.png);
}

.editor-trian-06 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-07.png);
}

.editor-trian-07 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-08.png);
}

.editor-trian-08 {
  background-image: url(../img/editor/shape-09.png);
}

.editor-trian-09 {
  background-image: url(../img/editor/shape-10.png);
}

.editor-trian-10 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-22.png);
}


.editor-trian-11 {
  background-image: url(../img/editor/shape-11.png);
}

.editor-trian-12 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-02.png);
}

.editor-trian-13 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-09.png);
}

.editor-trian-14 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-11.png);
}

.editor-trian-15 {
  background-image: url(../img/editor/shape-15.png);
}


.editor-trian-16 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-25.png);
}

.editor-trian-17 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-26.png);
}

.editor-trian-18 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-27.png);
}

.editor-trian-19 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-28.png);
}

.editor-trian-20 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-30.png);
}

.editor-trian-21 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-31.png);
}

.editor-trian-22 {
  background-image: url(../img/editor/editor-panel-icon-figure-shape-32.png);
}

.editor-trian-23 {
  background-image: url(../img/editor/shape-23.png);
}

.editor-trian-24 {
  background-image: url(../img/editor/shape-24.png);
}

.editor-trian-25 {
  background-image: url(../img/editor/shape-25.png);
}


.editor-trian-26 {
  background-image: url(../img/editor/shape-26.png);
}

.editor-trian-27 {
  background-image: url(../img/editor/shape-27.png);
}

.editor-trian-28 {
  background-image: url(../img/editor/shape-28.png);
}

.editor-trian-29 {
  background-image: url(../img/editor/shape-29.png);
}

.editor-trian-30 {
  background-image: url(../img/editor/shape-30.png);
}


.editor-outline-01 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-01.png);
}

.editor-outline-02 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-02.png);
}

.editor-outline-03 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-03.png);
}

.editor-outline-04 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-04.png);
}

.editor-outline-05 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-05.png);
}

.editor-outline-06 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-06.png);
}

.editor-outline-07 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-07.png);
}

.editor-outline-08 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-08.png);
}

.editor-outline-09 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-09.png);
}

.editor-outline-10 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-10.png);
}

.editor-outline-11 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-11.png);
}

.editor-outline-12 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-12.png);
}

.editor-outline-13 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-13.png);
}

.editor-outline-14 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-14.png);
}

.editor-outline-15 {
  background-image: url(../img/editor/editor-panel-icon-figure-border-15.png);
}

.panel-item-label-title {
  display: flex;
  display: -ms-flexbox;
  justify-content: space-between;
  align-items: center;
  /*min-height: 30px;*/
}

.section-editor-wrap .editor-panel-file-list li,
.section-editor-wrap .editor-panel-link-list li {
  background: #f1f1f1;
  font-size: 12px;
  border-radius: 4px;
  display: block;
  padding: 6px 10px;
  /* margin-bottom: 8px; */
  position: relative;
}

.editor-panel-link-list li.link:before {
  content: "";
  background-image: url(../img/editor/editor-panel-icon-link-list-link.png);
}

.editor-panel-link-list li span {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
}

.editor-panel-link-list li > .close {
  content: '';
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 2px;
  right: 0;
  background-image: url(../img/editor/editor-panel-icon-link-list-close.png);
  cursor: pointer;
}

.editor-panel-link-list li.partner:before {
  content: "";
  background-image: url(../img/editor/editor-panel-icon-link-list-partner.png);
}

.editor-panel-link-list li {
  background: #e3e8f6;
  font-size: .75rem;
  border-radius: 1rem;
  display: block;
  padding: 0.5rem 1.5rem 0.5rem 2.5rem;
  margin-bottom: 0.25rem;
  position: relative;
}


.editor-panel-link-list li.link:before {
  content: '';
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 2px;
  left: 10px;
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
}

.editor-panel-link-list li.partner:before {
  content: '';
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 2px;
  left: 10px;
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
}

.right-area {
  flex: 1;
  position: relative;
}

.right-area-cloud {
  position: relative;
}

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

.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;
}


.editor-file {
  background: #e3e8f6;
  font-size: .75rem;
  border-radius: 1rem;
  display: block;
  padding: 0.5rem 1.5rem 0.5rem 2.5rem;
  margin-bottom: 0.25rem;
  position: relative;
}

.editor-file li.file:before {
  background-image: url(../img/editor/addfile.png);
}

.editor-file li.file:before {
  content: '';
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 2px;
  left: 10px;
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
}

.editor-file li > .close {
  content: '';
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 2px;
  right: 0;
  background-image: url(../img/editor/editor-panel-icon-link-list-close.png);
  cursor: pointer;
}

.showcon1 {
}

.add-notice {
  display: inline-block;
  font-size: 0.7rem;
  text-align: right;
  width: 100%;
  letter-spacing: -0.8px;
  color: #d53737;
  padding-top: 20px;
}


.panel-add-wrap {
  padding: 0.5rem 0rem;
  margin-bottom: -1px;
  position: relative;
}

.editor-addfile {
  background-image: url(../img/editor/addplus.png);
  width: 20px;
  height: 20px;
  cursor: pointer;
}


.textarea-item {
  position: relative;
  width: 100%;
  height: 90px;
  text-align: center;
  margin-bottom: 25px;
}


.check-label2 {
  font-size: .775rem;
  color: #6d758a;
  cursor: pointer;

  position: relative;
  border: 1px dashed #c6cdde;
  border-radius: 0.2rem;
  padding: 1rem;
  width: 100%;
  height: 90px;
  text-align: center;
  margin-bottom: 25px;
}


.add-wrap {
  margin-bottom: 22px;
}


.input-group2 {
  display: flex;
  position: relative;
  width: 100%;
  height: 33px;
  margin-bottom: 10px;
}


.form-control4 {
  display: block;
  width: 100%;
  padding: 0.375rem 0.55rem;
  font-size: 0.775rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #3c5f8e;;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

#style-1::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
  background-color: #ffffff;
}

#style-1::-webkit-scrollbar {
  width: 5px;
  background-color: #ffffff;
}

#style-1::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #cecbcb;
}

.btn2-1 {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  user-select: none;
  border: 1px solid transparent;
  font-size: .775rem;
  border-radius: 0.2rem;
  background-color: #3c5f8e;
  color: white;
  width: 60px;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  padding-left: 4px;
}


.btn3 {
  font-weight: 400;
  font-size: .775rem;
  background: #3c5f8e;
  text-align: center;
  color: white;
  width: 100%;
  padding: 0.375rem 0.55rem;
  border-radius: 22px;
}


.font-wrap {
  padding: 0;
  display: flex;
  justify-content: space-between;
  position: relative;
}

.font-wrap.mobile{
  justify-content: space-between;
}

.font-wrap select {
  background: #ffffff url("../img/dashboard/mymap/icon/i_chevron_down.svg") no-repeat;
  background-position: 90% center;
  border: 1px solid #f1f1f1;
  border-radius: 4px;
  color: #333;
  padding: 4px 8px;
}

.font-wrap select:disabled {
  background: #f1f1f1 url("../img/dashboard/mymap/icon/i_chevron_down.svg") no-repeat;
  background-position: 90% center;
  border: 1px solid #f1f1f1;
  border-radius: 4px;
  padding: 4px 8px;
}

.font-wrap select:focus {
  border: 1px solid #ccc;
}

.font-wrap .font-set select {
  width: 124px;
}

.font-wrap .font-size select {
  width: 72px;
}

.font-wrap.mobile .font-set select {
  width: 100px;
  margin-right:10px;
}

.font-wrap.mobile .font-size select {
  width: 50px;
  margin-right:10px;
}

.font-set {
  display: flex;
}

.font-size {
  display: flex;
}

/* 모바일 240311 */
.font-btn-group{
  display: flex;
  justify-content: center;
  align-items: center;
  /* margin-right:20px; */
}

.mobile_font_size_txt{
  display: flex;
  min-width:40px;
  height:30px;
  margin-right:10px;
  justify-content: center;
  align-items: center;
}

.mobile_font_size_txt.disabled{
  background-color: #f1f1f1;
  padding:0 5px;
  content:'0';
  border-radius:5px;
}

.font_size_control_btn{
    display: flex;
    width: 20px;
    height: 20px;
    border: 1px solid #666;
    border-radius: 5px;
    color: #666;
    text-align: center;
    text-decoration: none;
    justify-content: center;
    align-items: center;
}

.font_size_control_btn:first-child{
  margin-right:10px;
}

.panel-play-group {
  display: flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
  align-items: center;
}


.panel-play-info ul {
  background: #eef0f6;
  padding: 0.5rem;
  border-radius: 0.25rem rem;
}


.panel-play-info {
  margin-top: 0.5rem;
  position: absolute;
  left: 0px;
  width: 100%;
  padding: 0rem 1rem;
}


.panel-play-info ul li {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
}

.panel-play-info ul li label {
  width: 60px;
  font-size: .75rem;
  color: #4e5669;
}

.panel-play-info ul li div {
  font-size: .75rem;
  color: #4e5669;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.panel-control {
  width: 30px;
  height: 30px;
}


.panel-control + .panel-control {
  margin-left: 0px;
}


.panel-control {
  /*    width: calc(16.666% - 4px);  */
  height: 30px;
  margin-left: 0px;
  margin-right: 0px;
}


.panel-control label {
  width: 100%;
  height: 30px;
  border-radius: 0.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-color: transparent;
  cursor: pointer;
  border: 1px solid transparent;
}

.panel-head {
  font-size: .875rem;
  margin-right: 12px;
}


.note-wript {
  width: 100%;
  height: 300px;
}

.text-area {
  font-size: .875rem;
  resize: none;
  width: 100%;
  height: 100%;
  background: #f5f5f5;
  padding: 10px;
  border: 1px solid #f1f1f1;
}


.new-window {
  width: 30px;
  height: 30px;
  display: block;
  background-image: url(../img/editor/editor-panel-icon-new.svg);
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
}

.new-window2 {
  width: 20px;
  height: 20px;
  display: block;
  background-image: url(../img/editor/editor-panel-icon-new.svg);
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  margin-right: 8px;
}

/*tooltip*/
.tool {
  display: block;
  /* width: 30px;    height: 30px; */
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0.25rem;
  position: relative;
}

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

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


/*back
.tool-tip-container {
  position: fixed;
  width: 200px;
  bottom: -30px;
  left: -200vw;
  z-index: 1;
  text-align: center
}
*/




/*.tool-tip-container:before {*/
/*  content: '';*/
/*  display: inline-block;*/
/*  width: 0;*/
/*  height: 0;*/
/*  border-bottom: solid 4px #131416;*/
/*  border-right: solid 4px transparent;*/
/*  border-left: solid 4px transparent;*/
/*  position: fixed;*/
/*  top: -2px;*/
/*  left: calc(100px - 4px)*/
/*}*/

.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;
  height: 28px; 
}

.new-window2 > .tool-tip-container {
  left:-200000px;
}

/*
.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;
  height: 28px;
}
*/



.color-none {
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  border: 1px solid #ffffff !important;
  cursor: default !important;
}

.color-none:hover:after {
  content: '';
  display: block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  border: 2px solid #ffffff !important;
}

.color-none.selected:after {
  content: '';
  display: block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  border: 2px solid #ffffff !important;
}

.color-reset {
  background: url("/assets/img/editor/i_color_reset.svg") no-repeat;
  background-size:100%;
  cursor: pointer;
  height: 16px;
  margin: 0 0 0 auto;
  width: 16px;
}

.color-reset-b {
  background: url("/assets/img/editor/i_color_reset_b.svg") no-repeat;
  cursor: pointer;
  /* height: 20px; */
  /* margin: 0 0 0 auto; */
  width: 20px;
  background-size: 20px;
  border: none !important;
  /* position: absolute;
  top: -43px;
  right: 4px; */
}

.color-reset-b01 {
  background: url("/assets/img/editor/i_color_reset_b01.svg") no-repeat;
  background-size:1rem;
    width: 1rem !important;
    height: 1rem !important;
    border-radius: 4px !important;
    border: 1px solid #d2d0d0;
    cursor: pointer;
    position: relative;
}
.color-reset-zero {
    width: 1rem !important;
    height: 1rem !important;
    border-radius: 4px !important;
    border: 0px solid #d2d0d0;
    margin:auto 5px;
}

.color-spoiler {
  background: url("/assets/img/editor/i_color_spoiler.svg");
  background-size:100%;
  background-repeat:no-repeat;
  cursor: pointer;
  width: 15px;
  height: 15px;
  margin: 0 0 0 0;
}


.color-reset-b01:hover:after{content:'';display:block;position:absolute;top:-1px;left:-1px;width:1rem;height:1rem;border-radius:4px !important; border:0px !important;} 

@media (max-width:767px) {
  .color-reset-b01 {
    background: url("/assets/img/editor/i_color_reset_b01.svg") no-repeat;
    background-size:1.25rem;
      width: 1.25rem !important;
      height: 1.25rem !important;
      border-radius: 10px !important;
      border: 1px solid #d2d0d0;
      cursor: pointer;
      position: relative;
  }
  .color-reset-zero {
      width: 1.25rem !important;
      height: 1.25rem !important;
      border-radius: 4px !important;
      border: 0px solid #d2d0d0;
      margin:auto 5px;
  }
  
  .color-reset-b01:hover:after{content:'';display:block;position:absolute;top:-1px;left:-1px;width:1.25rem;height:1.25rem;border-radius:10px !important; border:0px !important;} 
  
      
}



/*.color-reset:before {*/
/*  content: "";*/
/*  position: absolute;*/
/*  left: -1px;*/
/*  top: -1px;*/
/*  background: url(../img/editor/line.png) no-repeat;*/
/*  width: 16px;*/
/*  height: 16px;*/
/*}*/



.color-code-area {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  margin-top: 12px;
  margin-bottom: 0px;
  gap: 5px;
  position: relative;  
  padding:0px 11px;
}

.color-preview {
  width: 20px;
  height: 20px;
  border: 1px solid #cccccc;
  border-radius: 5px;
}

.color-mode {
  font-size: 14px;
}

.color-code {
  font-size: 14px;
}

.inputcolor {
  border: 1px solid #cccccc;
  background-color:#fff;
  width:70px;
  border-radius: 5px;
  padding:0px 5px;
}

.close {
  width: 30px;
  height: 30px;
  background-image: url(../img/editor/editor-btn-color-close.png);
  cursor: pointer;
  margin: 0 0 0 auto;
}


.close2 {
  width: 16px;
  height: 16px;
  background-image: url(../img/ico/i-x-lg.svg);
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
}

.section-editor-footer .btn-window-glass {
  background-image: url(../img/editor/editor-btn-foot-glass.svg);
  background-size: 80%;
  background-position: center;
}

.con1,
.con2,
.con3 {
  display: none;
}

.panel-icon3 input:checked + label {
  background-color: #f1f1f1;
  border-color: #f1f1f1 !important;
}

.panel-icon3 label {
  background-size: cover;
  height: 24px;
  border-radius: 0.25rem;
  cursor: pointer;
  width: 24px;
}

.panel-icon4 {
  width: 20px;
  height: 20px;
}

.panel-icon4 input:checked + label {
  background-color: #f1f1f1;
}

.panel-icon4 label {
  background-size: cover;
  height: 20px;
  border-radius: 0.25rem;
  cursor: pointer;
  width: 20px;
}


.panel-icon5 input:checked + label {
  background-color: #e3e8f6;
  border-color: #e3e8f6 !important;
}


.panel-icon5-1 {
  width: 45px !important;
  height: 25px !important;
  border:1px solid #044A89;
  color:#547CA0;
  background-color:#F8FBFF;
  text-align:center;
  border-radius: .2rem;
}

.panel-icon7-1 {
 /* width: 70px !important;*/
  width: unset;
  height: 25px !important;
  border:1px solid #044A89;
  color:#547CA0;
  background-color:#F8FBFF;
  text-align:center;
  border-radius: .2rem;
  padding-left:5px;
  padding-right:5px;
}


.panel-icon5-1 input:disabled + label {
  opacity: 0.5;
}


.panel-icon5-1:nth-child(2) input:disabled + label {
  opacity: 0.5;
}

.panel-icon5-1:nth-child(1) input:checked + label {
  background-image: url(../img/editor/01_up.svg);
  background-color:#044A89;  
  border:0px solid transparent;
  color:#fff;
}

.panel-icon5-1:nth-child(2) input:checked + label {
  background-image: url(../img/editor/02_up.svg);
    background-color:#044A89;
  border: 0px solid transparent;
  color:#fff;
}

.panel-icon5-1:nth-child(3) input:checked + label {
  background-image: url(../img/editor/03_up.svg);
    background-color:#044A89;
  border: 0px solid transparent;
  color:#fff;
}

.panel-icon5-1:nth-child(4) input:checked + label {
  background-image: url(../img/editor/04_up.svg);
    background-color:#044A89;
  border: 0px solid transparent;
  color:#fff;
}




.panel-icon7-1 input:disabled + label {
  opacity: 0.5;
}

.panel-icon7-1:nth-child(1) input:checked + label {
  /*background-image: url(../img/editor/01_up.svg);*/
  background-color:#044A89;  
  border:0px solid transparent;
  color:#fff;
}

.panel-icon7-1:nth-child(2) input:checked + label {
  /*background-image: url(../img/editor/02_up.svg);*/
    background-color:#044A89;
  border: 0px solid transparent;
  color:#fff;
}

.samsung-ver > .panel-icon5-1 {
  width: 45px !important;
  height: 25px !important;
  border:1px solid #9C92C3;
  color:#6C4EEE;
  background-color:#F6F5FD;
  text-align:center;
  border-radius: .2rem;
}

.samsung-ver > .panel-icon5-1:hover{
  color: #53439c !important;
  background-color: #f0eefc !important;
  border-color: #a399cb !important;
}
.samsung-ver > .panel-icon5-1:active{
  color: #5b4da5 !important;
  background-color: #e5e1fc !important;
  border-color: #a299d0 !important;
}

.samsung-ver .panel-icon5-1 input:disabled + label {
  background-color: #f8f9fb;
  border-color: #ebecee !important;
  color: #c0c1c5;
  cursor: not-allowed;
}

.samsung-ver .panel-icon5-1:nth-child(1) input:checked + label {
  /*background-image: url(../img/editor/01_up.svg);*/
  color: #fff !important;
  background-color: #6742F1 !important;
  border:0px solid transparent;
  background-image: unset !important;
}

.samsung-ver .panel-icon5-1:nth-child(1) input:checked + label:hover{
  background-color: #5c43d2 !important;
  background-image: unset;
}
.samsung-ver .panel-icon5-1:nth-child(1) input:checked + label:active{
  background-color: #4a2ebf !important;
  background-image: unset !important;
}

.samsung-ver .panel-icon5-1:nth-child(1) input:checked + label:disabled{
  background-color: #ecebf0;
  border-color: #ecebf0 !important;
  color: #bcbbc1;
  cursor: not-allowed;
}


.samsung-ver .panel-icon5-1:nth-child(2) input:checked + label {
  /*background-image: url(../img/editor/02_up.svg);*/
  color: #fff !important;
  background-color: #6742F1 !important;
  border: 0px solid transparent;
  background-image: unset !important;
}

.samsung-ver .panel-icon5-1:nth-child(2) input:checked + label:hover{
  background-color: #5c43d2 !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon5-1:nth-child(2) input:checked + label:active{
  background-color: #4a2ebf !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon5-1:nth-child(2) input:checked + label:disabled{
  background-color: #ecebf0;
  border-color: #ecebf0 !important;
  color: #bcbbc1;
  cursor: not-allowed;
}


.samsung-ver .panel-icon5-1:nth-child(3) input:checked + label {
  /*background-image: url(../img/editor/03_up.svg);*/
  color: #fff !important;
  background-color: #6742F1 !important;
  border: 0px solid transparent;
  background-image: unset !important;
}

.samsung-ver .panel-icon5-1:nth-child(3) input:checked + label:hover{
  background-color: #5c43d2 !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon5-1:nth-child(3) input:checked + label:active{
  background-color: #4a2ebf !important;
}
.samsung-ver .panel-icon5-1:nth-child(3) input:checked + label:disabled{
  background-color: #ecebf0;
  border-color: #ecebf0 !important;
  color: #bcbbc1;
  cursor: not-allowed;
}



.samsung-ver .panel-icon5-1:nth-child(4) input:checked + label {
  /*background-image: url(../img/editor/04_up.svg);*/
  color: #fff !important;
  background-color: #6742F1 !important;
  border: 0px solid transparent;
  background-image: unset !important;
}


.samsung-ver .panel-icon5-1:nth-child(4) input:checked + label:hover{
  background-color: #5c43d2 !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon5-1:nth-child(4) input:checked + label:active{
  background-color: #4a2ebf !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon5-1:nth-child(4) input:checked + label:disabled{
  background-color: #ecebf0;
  border-color: #ecebf0 !important;
  color: #bcbbc1;
  cursor: not-allowed;
}



.panel-icon7-1 label {
    width: 100%;
    border-radius: 0.15rem;
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;
    cursor: pointer;
    border: 1px solid transparent;
    font-size: 12px;
    line-height: 23px;
    display: block;
    height: 24px;
}

.samsung-ver > .panel-icon7-1 {
  /*width: 65px !important;*/
  width: unset !important;
  height: 25px !important;
  border:1px solid #9C92C3;
  color:#6C4EEE;
  background-color:#F6F5FD;
  text-align:center;
  border-radius: .2rem;
}

.samsung-ver > .panel-icon7-1:hover{
  color: #53439c !important;
  background-color: #f0eefc !important;
  border-color: #a399cb !important;
}
.samsung-ver > .panel-icon7-1:active{
  color: #5b4da5 !important;
  background-color: #e5e1fc !important;
  border-color: #a299d0 !important;
}

.samsung-ver .panel-icon7-1 input:disabled + label {
  background-color: #f8f9fb;
  border-color: #ebecee !important;
  color: #c0c1c5;
  cursor: not-allowed;
}

.samsung-ver .panel-icon7-1:nth-child(1) input:checked + label {
  /*background-image: url(../img/editor/01_up.svg);*/
  color: #fff !important;
  background-color: #6742F1 !important;
  border:0px solid transparent;
  background-image: unset !important;
}

.samsung-ver .panel-icon7-1:nth-child(1) input:checked + label:hover{
  background-color: #5c43d2 !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon7-1:nth-child(1) input:checked + label:active{
  background-color: #4a2ebf !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon7-1:nth-child(1) input:checked + label:disabled{
  background-color: #ecebf0;
  border-color: #ecebf0 !important;
  color: #bcbbc1;
  cursor: not-allowed;
}


.samsung-ver .panel-icon7-1:nth-child(2) input:checked + label {
  /*background-image: url(../img/editor/02_up.svg);*/
  color: #fff !important;
  background-color: #6742F1 !important;
  border: 0px solid transparent;
  background-image: unset !important;
}

.samsung-ver .panel-icon7-1:nth-child(2) input:checked + label:hover{
  background-color: #5c43d2 !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon7-1:nth-child(2) input:checked + label:active{
  background-color: #4a2ebf !important;
  background-image: unset !important;
}
.samsung-ver .panel-icon7-1:nth-child(2) input:checked + label:disabled{
  background-color: #ecebf0;
  border-color: #ecebf0 !important;
  color: #bcbbc1;
  cursor: not-allowed;
}

.panel-unset {
  display:flex;
  align-items: center;
  justify-content: center;
}

.panel-unset input {
  display:block;
  margin-right:2px;
}


.editor-panel-icon-link-line-01 {
  background-image: url(../img/editor/editor-line-01.png);
}

.panel-icon2 + .panel-icon2 {
  margin-left: 1px;
}

.panel-icon3 + .panel-icon3 {
  margin-left: 4px;
}


.editor-stroke-01 {
  background-image: url(../img/editor/stroke-01.png);
  background-size: 70%;
}

.editor-stroke-02 {
  background-image: url(../img/editor/stroke-02.png);
  background-size: 70%;
}

.editor-stroke-03 {
  background-image: url(../img/editor/stroke-03.png);
  background-size: 70%;
}

.editor-stroke-04 {
  background-image: url(../img/editor/stroke-04.png);
  background-size: 70%;
}

.editor-stroke-05 {
  background-image: url(../img/editor/stroke-05.png);
  background-size: 70%;
}

.editor-stroke-06 {
  background-image: url(../img/editor/stroke-06.png);
  background-size: 70%;
}


.repos {
  display: flex;
  display: -ms-flexbox;
  padding: 4px 8px;
  border-radius: 0.5rem;
  border: 1px solid #e9e9e9;
  background-color: #fff;
  position: relative;
  justify-content: space-between;
  margin-right: 0px;
  left: 10px;
  bottom: 8px;
  width: 46px;
  display:none;
}


.toolpos {
  display: block;
  width: 30px;
  height: 30px;
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0.25rem;
  position: relative;
}

.newmem {
  position: absolute;
  left: 10px;
  top: 10px;
}

@media (max-width: 1138px) {
  /* 모바일 240308 */
  .box-container.mobile{
    z-index:999;
    background: transparent;
    position: relative;
    width:100vw;
    max-width:390px;
    box-shadow:none;
    top: 0;
    border-left: none;    
    right: 0;
    border-radius: 0rem;
    border: 0px solid #ccc;
}
}

@media (max-width: 960px) {

  .newmem {
    position: absolute;
    left: 15px;
    top: 60px;
  }

  .repos {
    padding: 0.2rem 0.1rem 0.2rem 0.3rem;
  }

  .down-toggle {
    left: 35px;
    top: 11px;
  }

  .toggle-show1 {
    top: 152px;
  }

  .toggle-show2 {
    top: 152px;
  }


  /* 사용 하지 않게 주석 처리 by jyuhm_250514
  .box-container {
    width: calc(100vw - 41px);
    top: 0;
    border-left: none;
    right: 0;
    background-color: #fff;
    z-index: 2;
    border-radius: 0rem;
    border: 0px solid #ccc;
  } */

  /* 모바일 240308 */
  .box-container.mobile{
    z-index:999;
    background: transparent;
    position: relative;
    width:100vw;
    /*width:85vw;*/
    max-width:390px;
    box-shadow:none;
    left:unset;
    pointer-events: auto !important;
    touch-action: auto !important;      /* 혹시 none으로 막혀 있으면 풀기 */



    
}


  .box-container.mobile .box-content {
    padding: .5rem 1rem 2.5rem .5rem;
     -webkit-overflow-scrolling: touch;  /* iOS 모멘텀 스크롤 */
    overscroll-behavior: contain;       /* 아래 레이어로 체이닝 금지 */
    touch-action: auto !important;              /* 핵심: 세로 터치 스크롤 허용 */
        justify-content: flex-start !important;
  }


  .box-container.mobile .panel-icon-wrap2 {
    padding: 0px 0px 0px 0px;
        justify-content: flex-start !important;
  }




/* .box-header.mobile{
  padding: .625rem;
} */

/* .box-header.mobile ul{
    list-style:none;
    display:flex;
    justify-content: center;
    align-items: center;
}

.box-header.mobile ul li{
    margin-right:5px;
    display:flex;
    justify-content: center;
    align-items: center;
}

.box-header.mobile ul li:last-child{
    margin-right:0;
}

.box-header.mobile ul li.active{
    background: #F1F1F1;
    border-radius:5px;
}

.box-header.mobile ul li img{
    width:35px;
} */

.panel-icon-wrap.mobile{
    width: 100%;
    margin: 0 0 0 auto;
    background: transparent;
    display:flex;
    justify-content: space-between;
}

.panel-icon-wrap.mobile .panel-icon-group{
  width:100%;
  justify-content: start;
  gap:5px;
}

.panel-icon-wrap.mobile .palate_view_btn{
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.panel-icon-wrap.mobile .palate_view_btn button{
  width:32px;
  height:32px;
  border:1px solid #ccc;
  border-radius:5px;
  cursor:pointer;
}

.panel-icon-wrap.mobile .palate_view_btn button span{
  display:block;
  width:9px;
  height:9px;
  border:2px solid #000;
  border-left:none;
  border-top:none;
  transform: rotate(45deg);
  position: absolute;
  top: 10px;
  left: 12px;
}

.panel-icon-wrap.mobile .palate_view_btn button.on span{
  transform: rotate(-135deg);
  top: 14px;
  left: 12px;
}

.panel-icon-wrap.mobile .panel-icon5-1:nth-child(1) input:checked + label {
    /*background-image: url(/assets//img/editor/01_dn_gray.svg);*/
}

.panel-icon-wrap.mobile .panel-icon5-1:nth-child(2) input:checked + label {
    /*background-image: url(/assets/img/editor/02_dn_gray.svg);*/
}

.panel-icon-wrap.mobile .panel-icon5-1:nth-child(3) input:checked + label {
    /*background-image: url(/assets/img/editor/03_dn_gray.svg);*/
}

.panel-icon-wrap.mobile .panel-icon5-1:nth-child(4) input:checked + label {
    /*background-image: url(/assets/img/editor/04_dn_gray.svg);*/
}


  .shadow {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0) !important;
  }

  /*.tool-list3 {*/
  /*    display: flex;*/
  /*    display: -ms-flexbox;*/
  /*    border-radius: 0;*/
  /*    border: 0px solid #ccc;*/
  /*    width: 41px !important;*/
  /*    background-color: #eef0f6;*/
  /*    padding: 10px 5px 5px !important;*/
  /*}*/
  .leftnav1 {
    left: 0;
  }

  .leftnav2 {
    right: 0px;
    top: 340px;
    position: fixed;
    padding: 0px 5px 0px !important;
  }

  .section-wrap {
    display: flex;
    display: -ms-flexbox;
    height: calc(100vh - 0px);
    overflow: hidden;
    background-color: #eef0f6;
    width: 41px !important;
    right: 0px;
    position: fixed;
    top: 0px;
    z-index: 1;
  }

  .newbottom {
    padding: 0.25rem 0.5rem;
    border: 0px solid #ccc;
    background-color: #fff;
    border-radius: 0;
    margin-bottom: 0px;
    position: relative !important;
    height: 40px;
    width: 100%;
    left: 0px !important;
    background-color: #ffffff;
    border-top: 0px solid #c6cdde;
  }

  .shadow2 {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0) !important;
  }

  @media (max-width: 844px) {
    .container-login:before {
      content: '';
      left: -129px;
    }

    .container-login:after {
      left: -900px;
    }

    .flex-btn .btn-primary {
      width: 110px !important;
      margin-left: 10px;
    }

  }

}

.hg-fix {
  height: 556px !important;
}

@media (max-width: 844px) {
  .hg-fix {
    height: auto !important;
  }
}

.form_wrap {
  align-items: center;
  display: flex;
  padding:0px 11px 0px 11px;
}

.panel-item-area {
  padding: 0 5px 0px 5px;
}

.box-area {
  padding: 0 0 12px 0;
}

@media (max-width: 767px) {
  .box-container.type2 {
    max-height: 100vh !important;
    right: 0;
    width: calc(100% - 47px);
  }
}

/* custome css */
.form-switch .form-check-input {
  height: 16px;
  width: 45px;
}

.form-check-input:checked {
  background-color: #003E97;
  border-color: #003E97;
}

.samsung-ver > .form-check-input:checked {
  background-color: #673dff;
  border-color: #6742F1;
}