@font-face {
  font-family: 'Spoqa Han Sans Neo';
  font-style: normal;
  font-weight: 100;
  src: local('Spoqa Han Sans Neo Thin'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Thin-895a8dbbdf47670ce6d59bfa662434b6.eot'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Thin-895a8dbbdf47670ce6d59bfa662434b6.eot?#iefix') format('embedded-opentype'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Thin-7fdc09f6de82c11d66c573cfdfe794f6.woff') format('woff2'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Thin-ada4b650a0a6a45aee85e5c5a462c519.otf') format('opentype');
}

@font-face {
  font-family: 'Spoqa Han Sans Neo';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: local('Spoqa Han Sans Neo Light'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Light-7fd2f1b3906391a81c261fd2fe9ef15c.eot'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Light-7fd2f1b3906391a81c261fd2fe9ef15c.eot?#iefix') format('embedded-opentype'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Light-de87dfe939de7a3a1f7564bdc95b9f9e.woff2') format('woff2'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Light-e52645d628769c5327c6ed398a918f5c.otf') format('opentype');
}


@font-face {
  font-family: 'Spoqa Han Sans Neo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Spoqa Han Sans Neo Regular'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Regular-41a55a27ea5631028e7a14647bc394fb.eot'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Regular-41a55a27ea5631028e7a14647bc394fb.eot?#iefix') format('embedded-opentype'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Regular-6f876d098a687c3ac9c6871fe473b3f1.woff2') format('woff2'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Regular-be2adee7d1106626bb61fa45d764c46d.otf') format('opentype');
}

@font-face {
  font-family: 'Spoqa Han Sans Neo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: local('Spoqa Han Sans Neo Medium'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Medium-b0af8631a777319af6d02d44b29b7bd1.eot'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Medium-b0af8631a777319af6d02d44b29b7bd1.eot?#iefix') format('embedded-opentype'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Medium-9d46d938dff0062eddc760e606b2a020.woff2') format('woff2'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Medium-f88645542c68b9e2e6fc3e7cb90a1ab0.otf') format('opentype');
}

@font-face {
  font-family: 'Spoqa Han Sans Neo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local('Spoqa Han Sans Neo Bold'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Bold-1bb87c3aa7be91ddd5b1fa8852633109.eot'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Bold-1bb87c3aa7be91ddd5b1fa8852633109.eot?#iefix') format('embedded-opentype'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Bold-d57ff6f22085316b0326e4396df975d3.woff2') format('woff2'),
  url('/resources/static/assets/fonts/spoqa/SpoqaHanSansNeo-Bold-717870889cc831c9eb3bc528453403b9.otf') format('opentype');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 100;
  src: local('Pretendard Thin'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Thin-483e171704cb7ae7ba35ee5487d25908.woff') format('woff'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Thin-cfe8faacaa8e95d4338ccb53249d6562.woff2') format('woff2'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Thin-0b09a12c024a6380cd40dbfaf2fd79cd.otf') format('opentype');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: local('Pretendard Light'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Light-bfff3a54757b20bec529ad0c11de7b7e.woff') format('woff'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Light-8f686c143e28df9c200c189c88f90a40.woff2') format('woff2'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Light-aef3dc5f5592a0a9bfd7e8de7abdc2c5.otf') format('opentype');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Pretendard Regular'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Regular-db095fbdc6e9c9a1cea9577fcb8e0f7a.woff') format('woff'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Regular-bac296f1fd0973251e94406b8d328847.woff2') format('woff2'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Regular-46b0c48afd8b0ddc2ed4fcbb2df81d8b.otf') format('opentype');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: local('Pretendard Medium'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Medium-7bab4a8a2580411ea263b78fb93436fa.woff') format('woff'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Medium-146472533da4d370f600334864179b5b.woff2') format('woff2'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Medium-9ac30a1a68a5140a58b23aaf8025f1db.otf') format('opentype');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local('Pretendard Bold'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Bold-d93573b4d0c2d6b0cd2df2eb87a1d677.woff') format('woff'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Bold-c45234800c42ff624adc8941a1fa9e8f.woff2') format('woff2'),
  url('/resources/static/assets/fonts/pretendard/Pretendard-Bold-e93f79700405e1b4c1b3e70d8c378ca4.otf') format('opentype');
}

:root {
  --primary-300: #227EFF;
  --red-300: #F03E3E;
  --grayscale-white: #FFFFFF;
  --grayscale-gray-100: #DFE0E1;
  --grayscale-gray-300: #9FA1A4;
  --grayscale-gray-500: #606268;
  --grayscale-gray-600: #404249;
  --grayscale-gray-700: #20232B;
  --secondary-300: #462EFF;
  --background-200: #F9F9FB;
  --background-300: #ECF3FF;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

html, body {
  height: 100%;
}
body {
  position: relative;
  font-size: 12px;
  line-height: 1;
  letter-spacing: -0.5px;
  background-color: #f9f9fb;
  margin: 0;
  color: #000;
  font-smooth: always;
  font-smoothing: antialiased;
  -moz-osx-font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  /*-webkit-font-smoothing:subpixel-antialiased;*/
}

body *  {
  font-family: "Pretendard", "Noto Sans KR","Apple SD Gothic Neo","Nanum Barun Gothic","Malgun Gothic","돋옴",Dotum,sans-serif;
}

a {
  color: #37454a;
  text-decoration: none;
  cursor:pointer; }

pre {
  line-height:150%;}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none; }
em {font-style:normal}
table {
  width: 100%;
  table-layout: fixed;
  border: 0;
  border-collapse: collapse; }
table tr {
  padding: 0;
  border: 0; }
table td {
  padding: 0;
  border: 0; }
button {background:none; border:none; letter-spacing:-1px; cursor:pointer; outline: none; font-size:13px;}
input , button {margin:0; padding:0}
input {
  font-size: 12px; }
input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: rgba(55, 69, 74, 0.5); }
input::-moz-placeholder {
  /* Firefox 19+ */
  color: rgba(55, 69, 74, 0.5); }
input:-ms-input-placeholder {
  /* IE 10+ */
  color: rgba(55, 69, 74, 0.5); }
input:-moz-placeholder {
  /* Firefox 18- */
  color: rgba(55, 69, 74, 0.5); }

input:focus , textarea:focus , select:focus {outline: none}

textarea:focus, input:focus {
  outline: none; }

dl, dt, dd {margin:0}

input, textarea {
  font-size: 12px; }

.bold {font-weight:bold}

.cursor-pointer {
  cursor: pointer;
}

.grid {
  width: 100%;
  overflow: hidden; }
  .grid:after {
    display: block;
    clear: both;
    content: " "; }
  .grid.one.wide > .column {
    display: block;
    width: 100%; }
    .grid.one.wide > .column.hidden {
      display: none; }
  .grid.two.wide > .column {
    display: inline-block;
    width: 50%;
    float: left; }
    .grid.two.wide > .column.hidden {
      display: none; }
  .grid.three.wide > .column {
    display: inline-block;
    width: 33.3%;
    float: left; }
    .grid.three.wide > .column:last-child {
      width: 33.4%; }
    .grid.three.wide > .column.hidden {
      display: none; }
  .grid.four.wide > .column {
    display: inline-block;
    width: 25%;
    float: left; }
    .grid.four.wide > .column.hidden {
      display: none; }
  .grid.five.wide > .column {
    display: inline-block;
    width: 20%;
    float: left; }
    .grid.five.wide > .column.hidden {
      display: none; }
  .grid.six.wide > .column {
    display: inline-block;
    width: 16.6%;
    float: left; }
    .grid.six.wide > .column:last-child {
      width: 16.7%; }
    .grid.six.wide > .column.hidden {
      display: none; }
  .grid.eight.wide > .column {
    display: inline-block;
    width: 12.5%;
    float: left; }
    .grid.eight.wide > .column.hidden {
      display: none; }
  .grid.ten.wide > .column {
    display: inline-block;
    width: 10%;
    float: left;
  }

.grid.ten.wide > .column.hidden {
  display: none;
}

.red {
  color: #f41f1f;
}

.blue {
  color: #0093db;
}

/*  .black {color:#000 !important;} */
.black {
  color: #000;
}

.gray {
  color: #718c96;
}

.gray50 {
  color: #DFE0E1;
}

.gray200 {
  color: #BFC0C2;
}

.bg_gray80 {
  background-color: #cdd3d8;
}

.bg_gray200 {
  background-color: #BFC0C2;
}

.bold {
  font-weight: bold
}

.fl {
  float: left !important
}

.fr {
  float: right !important
}

.mt10 {
  margin-top: 10px !important;
}

.mr8 {
  margin-right: 8px !important;
}

.mr12 {
  margin-right: 12px !important;
}

.ls0 {
  letter-spacing: 0
}

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

.default-link {
  font-weight: bold;
  text-decoration: underline
}

.scroll-bar::-webkit-scrollbar {
  width: 6px;
}
.scroll-bar:hover::-webkit-scrollbar-thumb {
  background-color: var(--grayscale-gray-600);
  border-radius: 4px;
}
.scroll-bar:hover::-webkit-scrollbar-track {
}

.naver-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-naver-6dfdcead6b2913b603ecf491231ea96f.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}

.gongbiz-color-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-gongbiz-color-f7f67a3117c6c6e6d4e50471c7974910.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}

.gongbiz-white-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-gongbiz-white-27a6ec70da24adec1ee6704fb110f5d1.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}

.zero-b2c-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-zero-b2c-9c51abbaf8f6c23128c3e3630c1449cc.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}

.search-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-search-f1d974ccda09b723aac00b38f9a04c30.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}

.round-x-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-round-x-c0f4af470cddc4c452179ae59c1c5524.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}

.back-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-back-f6dda07da6a9933fc1653a4cb9932737.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}

.front-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-front-e7d4d80e464ca5f56e11712102dc1e9c.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}

/* selectBox Basic */
.frm_select {
  display: inline-block;
  height: 35px;
  border: none;
  border-bottom: 1px solid #dee2e6;
  border-radius: 2px;
  box-sizing: border-box;
  vertical-align: middle;
  background-color: #fff;
}

.frm_select.type02 {
  border: 1px solid #dee2e6;
}

.frm_select select {
  padding: 0 16px 0 7px;
  width: 100%;
  height: 33px;
  border: none;
  box-sizing: border-box;
  font-size: 13px;
  text-align: left;
  background-image: url('/resources/static/img/icon/ic_frm_arrow-177b976353957143b1caa18b825bf461.png');
  background-repeat: no-repeat;
  background-position: 90% 50%;
  letter-spacing: -1px;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.frm_select.long select {
  background-position: 98% 50%;
}

.frm_select.small select {
  background-position: 88% 50%;
}

.frm_select.small2 select {
  background-position: 88% 50%;
}

@media \0screen {
  /* ie 8 */
  .frm_select select {
    height: auto \0/ !important;
    padding-top: 10px !important
  }
  .frm_select.small select {padding:20px 7px !important}
  .frm_select.small2 select {padding;}
}
@media screen\0 { /* ie9 */
  .frm_select select {padding-top:4px; margin-top:0 }
}
.frm_select select {/*margin-top:4px\0/;*/padding:7px\0/;height:auto\0/;background:none\0/ }  /* ie 8/9 */
_:-ms-lang(x), .frm_select select {margin:0;height:33px}  /* ie10 */
.frm_select select::-ms-expand {opacity:0}  /* ie10 */
_:-ms-fullscreen, :root .frm_select select {margin:0;padding:0 6px 0 6px;height:33px}  /* ie11 */

/* 고객차트 리뉴얼 20180112 dehwang */
.card-icon-area {position:relative; display:inline-block; vertical-align: text-bottom; margin-right:5px}
.card-icon-area.v-m-line {vertical-align: middle;}
.ic_blacklist {display:block; width:15px; height:15px; background-image:url('/resources/static/img/icon/ic_blacklist-ce12cdf1f947ee39a26bacfe37a6ca8c.png');background-repeat:no-repeat;}
.card-wide-wrap {width:100%; margin-top:10px}
.card-wide-list {width:100%; margin-bottom:10px; cursor:pointer;}
.cardWide-wrap {width:100%; background:#fff; border:1px solid #d9e6e8; position:relative; padding:30px;}
.cardWide-wrap .card-icon-area {margin:4px 0 0 8px}
.cardWide-wrap .tit-area {width:100%; display:inline-block; margin-bottom:15px; }
.cardWide-wrap .num-area {float:left; font-size:18px; color:#37454a; margin-right:12px; color:#718c96}
.cardWide-wrap .name-area {float:left;  }
.cardWide-wrap .birth-area {float:left; margin:3px 0 0 10px; font-size:15px; color:#c1cbcc}
.cardWide-wrap .birth-area span {color:#8fafaf}
.cardWide-wrap .name-area span {font-size:18px; line-height:18px; color:#37454a; }
.cardWide-wrap .date-area {position:absolute; top:20px; right:20px;}
.cardWide-wrap .date-area ul li {float:left; padding:0 10px; height:13px; line-height:13px; border-right:1px solid #ecf2f2}
.cardWide-wrap .date-area ul li:last-child {padding-right:0; border-right:0}
.cardWide-wrap .date-area span {font-size:13px; line-height:13px; color:#718c96; float:left; display:inline-block; vertical-align:top;}
.cardWide-wrap .date-area span.tit {margin-right:5px; color:#c1cbcc}
.cardWide-wrap .info-area ul {display:table; width:100%;}
.cardWide-wrap .info-area ul li {display:table-cell; position:relative; padding:0 25px; border-right:1px solid #d9e6e8}
.cardWide-wrap .info-area ul li:first-child {padding-left:0}
.cardWide-wrap .info-area ul li:last-child {padding-right:0; border-right:0}
.cardWide-wrap .info-area ul li.first , .cardWide-wrap .info-area ul li.second , .cardWide-wrap .info-area ul li.fourth {width:18%; vertical-align:top}
.cardWide-wrap .info-area ul li.third {width:46%}
.cardWide-wrap .info-area ul li.third .subject {width:100%}
.cardWide-wrap .info-area dt {font-size:13px; line-height:13px; color:#c1cbcc; margin-bottom:8px}
.cardWide-wrap .info-area dd {text-align:left;margin:0; display: block;width: 100%;float: left;}
.cardWide-wrap .info-area dd span {font-size:15px; float:left; display:inline-block; line-height:18px; vertical-align:top;}
.cardWide-wrap .info-area dd span.subject {color:#718c96}
.cardWide-wrap .info-area .pet-area dt {width:55px; line-height:18px; float:left; margin-bottom:0 }
.cardWide-wrap .info-area .pet-area dd {width:250px; float:left;}
.cardWide-wrap .info-area .pet-area .pet-area-li {display:inline-block; width:100%}
.cardWide-wrap .info-area .pet-area .pet-area-li:first-child {margin-bottom:5px}
.cardWide-wrap .info-area .pet-area dd span {display:inline-block; margin-right:10px; color:#718c96}


.card-plus-wrap {width:100%; display:flex; justify-content: space-between; padding:20px 30px 20px 150px; margin-bottom:20px; position:relative; background:#fff; border:1px solid #d9e6e8}
.card-plus-wrap .tit-area {position:absolute; top:27px; left:30px;}
.card-plus-wrap.add-list .tit-area {top:30px;}
.card-plus-wrap .tit-area i {float:left; font-style:normal; display:block; font-size:26px; margin:-3px 15px 0 0;}
.card-plus-wrap .tit-area span {float:left; display:block; font-size:18px; line-height:22px; width:70px;}
.card-plus-wrap .input-wrap {width:660px; float:left; display:inline-block;}
.card-plus-wrap .input-wrap ul {width:100%; display:inline-block;}
.card-plus-wrap .input-wrap ul li {position:relative; float:left; display:inline-block}
.card-plus-wrap .input-wrap ul li.name {width:140px; margin:0 20px 20px 0}
.card-plus-wrap .input-wrap ul li.cellphone {width:140px; margin:0 20px 20px 0}
.card-plus-wrap .input-wrap ul li.nickname {width:130px; margin: 0 20px 20px 0;}
.card-plus-wrap .input-wrap ul li.cusnumber {width:160px; margin-bottom:20px}
.card-plus-wrap .input-wrap ul li.manager {width:160px; margin:0 20px 20px 0}
.card-plus-wrap .input-wrap ul li.job {width:150px; margin:0 20px 20px 0}
.card-plus-wrap .input-wrap ul li.birthday {width:fit-content; margin:0 20px 20px 0}
.card-plus-wrap .input-wrap ul li.cusgroup {width:140px; margin-bottom:20px}
.card-plus-wrap .input-wrap ul li.memo {width:100%; margin:0 20px 20px 0;}
.card-plus-wrap .input-wrap ul li span.tit {display:block; float:left; font-size:13px; line-height:35px; color:#c1cbcc; margin-right:10px}
.card-plus-wrap .input-wrap ul li input.cusnum-item {float:left; width: 104px !important;}
.card-plus-wrap .input-wrap ul li input.brith-item {float:left; text-align:center; ime-mode:disabled;}
.card-plus-wrap .input-wrap ul li input.brith-item.year {width:41px}
.card-plus-wrap .input-wrap ul li input.brith-item.month , .card-plus-wrap .input-wrap ul li input.brith-item.day {width:43px;}
.card-plus-wrap .input-wrap ul li input[type="text"] {width:100%; border:none; background:none; font-size:13px; border-bottom:1px solid #e7e7e7; height:35px;}
.card-plus-wrap .input-wrap ul li span.txt-error {position:absolute; top:12px; right:0; font-size:11px; color:#fc6063}
.card-plus-wrap .input-wrap li.manager .frm_select {width:115px}
.card-plus-wrap .input-wrap li.cusgroup .frm_select {width:140px}
.card-plus-wrap .btn-area {position:relative; float:left; height:100%;}
.card-plus-wrap .btn-area button {width:75px; height:100%; background:#37454a; border:none; text-align:center; color:#fff; cursor:pointer; border-radius: 2px;}

.card-plus-wrap.petshop .input-wrap ul li.cusnumber {width:140px; margin:0 20px 20px 0}
.card-plus-wrap.petshop .input-wrap ul li.cusgroup {margin:0 0 20px 0;}
.card-plus-wrap.petshop .input-wrap ul li input.cusnum-item {width:84px !important}
.card-plus-wrap.petshop .input-wrap ul li.memo {width:360px; margin:0 20px 20px 0}
.card-plus-wrap.petshop .input-wrap ul li.cusgroup {width:110px; margin-bottom:20px}
.card-plus-wrap.petshop .input-wrap ul li.cusgroup .frm_select {width:110px}
.card-plus-wrap.petshop .input-wrap ul li.petarea {width:560px; }
.card-plus-wrap.petshop .petarea-li {width:100%; display:inline-block; margin-bottom:6px}
.card-plus-wrap.petshop .petarea-li:last-child {margin-bottom:0}
.card-plus-wrap.petshop .petarea-li span.tit {float:left; display:inline-block; width:75px; height:35px; line-height:35px; color:#718c96; background:#f5f7f7; margin-right:20px; border-radius:30px; text-align:center}
.card-plus-wrap.petshop .petarea-li input[type="text"] {float:left; width:105px; margin-right:20px;}
.card-plus-wrap.petshop .petarea-li button {float:left; width:89px; height:35px; line-height:35px; font-weight:bold}
.card-plus-wrap.petshop .petarea-li button.btn-plus {color:#37454a; border:1px solid #37454a}
.card-plus-wrap.petshop .petarea-li button.btn-del {
  color: #718c96;
  border: 1px solid #d9e6e8
}

.modal.customer-registration-date-filter {
  border-radius: 8px;
  box-shadow: 0px 3px 10px #227EFF;
}

.modal.customer-registration-date-filter .wrap .header {
  border-bottom: 1px solid #DDE8EA !important;
}

.modal.customer-registration-date-filter .filter-table {
  display: flex;
  flex-direction: row;
  font-size: 14px;
  font-weight: 500;
  border-bottom: 1px solid #DDE8EA;;
}

.modal.customer-registration-date-filter .filter-table .table-title {
  display: flex;
  align-items: center;
  padding: 0 40px 0 20px;
  background: #F9FBFB;
}

.modal.customer-registration-date-filter .filter-table .table-title span {
  font-size: 14px;
}

.modal.customer-registration-date-filter .filter-table .table-body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.modal.customer-registration-date-filter .filter-table .table-body .row {
  display: flex;
  justify-content: space-between;
  padding: 18px 22px 18px 18px;
}

.modal.customer-registration-date-filter .filter-table .table-body .row:not(:last-child) {
  border-bottom: 1px solid #DDE8EA;
}

.modal.customer-registration-date-filter .filter-table .table-body .row .date-select-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-right: 40px;
}

.modal.customer-registration-date-filter .filter-table .table-body .row .date-select-container:not(:last-child) {
  margin-right: 30px;
}

.modal.customer-registration-date-filter .date-select-container select {
  padding: 0 26px 0 7px;
  width: 100%;
  border: none;
  box-sizing: border-box;
  font-size: 14px;
  text-align: left;
  background-image: url('/resources/static/img/icon/ic_frm_arrow-177b976353957143b1caa18b825bf461.png');
  background-repeat: no-repeat;
  background-position: 90% 50%;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.modal.customer-registration-date-filter .control {
  min-width: 20px;
}

.modal.customer-registration-date-filter .control .reset-button {
  cursor: pointer;
}

.modal.customer-registration-date-filter .control .reset-button.disable {
  filter: invert(1);
  cursor: initial;
}

/* 고객차트 상세페이지  20180112 dehwang */
.profileNew-wrap {
  width: 220px;
}

.profileCard-wrap {
  position: relative;
  width: 100%;
  background: #fff;
  z-index: 1;
  border: 1px solid #d9e6e8;
}

.profileCard-wrap .card-icon-area {
  position: absolute;
  top: 5px;
  left: 5px
}

.profileCard-wrap .customer-grade-area {
  display: flex;
  font-size:0;
  justify-content: center;
  align-items:center;
  height:32px;
}

.profileCard-wrap .name-area, .profileCard-wrap .num-area {
  width: 100%;
  text-align: center;
}

.profileCard-wrap .name-area input, .profileCard-wrap .num-area input {
  border: none;
  background: none;
  text-align: center
}

.profileCard-wrap .name-area input {
  width: 100%;
  font-size: 25px;
  line-height: 25px;
}
.profileCard-wrap .num-area {margin:5px 0 20px 0;}
.profileCard-wrap .num-area input, .profileCard-wrap .num-area .phone-number {width:100%; font-size:16px;}
.profileCard-wrap .teat-area {width:100%; border-bottom:1px solid #dfe2e6; border-top:none; border-left:none; border-right:none; overflow-y: auto;}
.profileCard-wrap .info-area {padding:0 10px;}
.profileCard-wrap .info-area dl {display:inline-block; width:100%; margin:4px 0;}
.profileCard-wrap .info-area dt {width:25%; float:left; color:#718c96; font-size:12px; line-height:22px; padding-right:6px}
.profileCard-wrap .info-area dd {width:75%; float:left; margin:0;}
.profileCard-wrap .info-area dd.birth-area input {width:25px; margin-right:5px; ime-mode:disabled;}
.profileCard-wrap .info-area dd.birth-area input.year {width:35px}
.profileCard-wrap .info-area dd.birth-area input:last-child {margin-right:0}
.profileCard-wrap .info-area dd input {width:100%; height:22px; font-size:12px; background:none; border:none; border-bottom:1px solid #e7e7e7}
.profileCard-wrap .info-area dd .frm_select {width:100%; height:22px}
.profileCard-wrap .info-area dd .frm_select select {padding-left:0; height:20px; font-size:12px}
.profileCard-wrap .info-area dd .frm_select select {padding:0px\0/;}
.profileCard-wrap .info-area .txt-error {padding-top:8px; width:100%; display:inline-block;font-size:11px; color:#fc6063;}
.profileCard-wrap .btn-area {width:100%; margin-top:25px}
.profileCard-wrap .btn-area button {width:100%; border:none; background:#37454a; height:40px; line-height:38px; color:#fff; text-align:center; cursor:pointer;}
.profileCard-wrap .pet-area {margin-top:25px; border-top:1px solid #d9e6e8; padding:25px 25px 0 25px;}
.profileCard-wrap .pet-area h1 {font-size:18px; display:block; text-align:center; color:#181b28; margin:0 0 15px 0; font-weight:normal}
.profileCard-wrap .petroll-wrap {width:128px; overflow:hidden}
.profileCard-wrap .petroll-wrap ul {position:relative;}
.profileCard-wrap .petroll-wrap li {float:left; width:128px;}
.profileCard-wrap .petroll-area {position:relative; padding-left:30px; width:100%;}
.profileCard-wrap .petroll-area .tit {position:absolute; top:9px; left:0; color:#718c96}
.profileCard-wrap .petroll-area .line {display:inline-block; position:relative;margin:4px 0; }
.profileCard-wrap .petroll-area .line .subtxt {position:absolute; top:4px; right:0; font-size:12px;}
.profileCard-wrap .petroll-area input {width: 100%;height: 22px;font-size: 12px;background: none;border: none;border-bottom: 1px solid #e7e7e7;}
.profileCard-wrap .petroll-area textarea {margin-top:4px; width: 100%; border-bottom: 1px solid #e7e7e7;border-top: none;border-left: none;border-right: none;}
.profileCard-wrap .petbtn-wrap {position:relative; margin-top:20px}
.profileCard-wrap .petbtn-wrap .num {position:absolute; top:0; left:0; display:inline-block; line-height:22px; color:#718c96}
.profileCard-wrap .petbtn-wrap .btn-prenexwrap {width:43px; height:22px; margin:0 auto;}
.profileCard-wrap .petbtn-wrap .btn-prenexwrap button {float:left;}
.profileCard-wrap .petbtn-wrap button {width:22px; height:22px; border:1px solid #d9e6e8;padding:5px 0; cursor:pointer}
.profileCard-wrap .petbtn-wrap button i {display:block; margin:0 auto; width:11px; height:11px; background:url('/resources/static/img/icon/ic-cdetail-pet-bf6dbabb220bb3a5af016f50b8894e14.png') no-repeat;}
.profileCard-wrap .petbtn-wrap button.btn-prev i {background-position:0 -11px;}
.profileCard-wrap .petbtn-wrap button.btn-next {margin-left:-1px;}
.profileCard-wrap .petbtn-wrap button.btn-next i {background-position:0 -22px}
.profileCard-wrap .petbtn-wrap button.btn-plus{border-right:0;}
.profileCard-wrap .petbtn-wrap button.btn-plus i {background-position:0 0;}
.profileCard-wrap .petbtn-wrap button.btn-minus i {background-position:0 -33px;}
.profileCard-wrap .petbtn-wrap .btn-pluswrap {position:absolute; top:0; right:0;}
.profileCard-wrap .petbtn-wrap .btn-pluswrap button {float:left;}
.profilePrice-wrap {margin-top:10px; width:100%; background:#f7fafb; border-top:1px solid #d9e6e8; border-left:1px solid #d9e6e8; border-right:1px solid #d9e6e8}
.profilePrice-wrap ul {width:100%}
.profilePrice-wrap ul li {width:100%; padding:13px 10px; width:100%; display:inline-block; border-bottom:1px solid #d9e6e8}
.profilePrice-wrap span {width:50%; float:left; }
.profilePrice-wrap span.tit {color:#839aa3; font-size:13px}
.profilePrice-wrap span.subject {color:#37454a; font-size:13px; text-align:right}
.profilebtn-wrap {width:100%; margin-top:20px}
.profilebtn-wrap button {width:100%; height:40px; margin:1px 0; line-height:38px;color:#fff; cursor:pointer;}
.profilebtn-wrap button.btn-basic01 {background:#3fd2d1; border:1px solid #23c6c6; cursor:pointer;}
.profilebtn-wrap button.btn-basic02 {background:#6ab9f1; border:1px solid #56ace8; cursor:pointer;}
.profilebtn-wrap button.btn-basic03 {background:#45a1ce; border:1px solid #2d8cbb; cursor:pointer;}
.profileCard-pic {position:relative; width:220px; height:180px; margin-bottom:22px; border-top:1px solid #dce8ea;border-right:1px solid #dce8ea;border-left:1px solid #dce8ea; background:url('/resources/static/img/icon/img-myavatar-3704cff00e0e2e721dae2d0634c9473e.png') no-repeat center center #f9fbfb; }
.profileCard-pic .btn-edit {position:relative; left:-1px; display:block; text-align:center;width:220px; height: 22px;line-height: 20px;font-size: 11px;border-top:1px solid #dce8ea;border-left:1px solid #dce8ea;border-right:1px solid #dce8ea;color: #37454a; background:#fff}
.profileCard-pic .picture-wrap {position:relative; width:218px; height:180px; overflow:hidden}
.profileCard-pic .picture-wrap img {width:100%;
  position: absolute;left: 50%;top: 50%;
  transform: translateX(-50%) translateY(-50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);}

/* 고객상세페이지-퀵메뉴 */
.quick-myinfo-wrap{position:fixed;bottom:0;left:0;width:100%;height:60px;background:#335764;box-shadow : -2px -2px 10px rgba(0,0,0,.2);z-index: 999;}
.quick-myinfo-wrap .quick-myinfo{
  max-width: 840px;
  margin: 0 auto;
  height: 60px;
}
.quick-myinfo-wrap .quick-myinfo .myinfo{float:left;}
.quick-myinfo-wrap .quick-myinfo .myinfo dl{float:left;margin-top:16px;line-height:28px;color:#fff;font-weight:400;margin-left:20px;padding-left:20px;border-left:1px solid rgba(255,255,255,.15);}
.quick-myinfo-wrap .quick-myinfo .myinfo dl:first-child{margin-left:0;padding-left:0;border-left:none;}
.quick-myinfo-wrap .quick-myinfo .myinfo dl dt{font-size:11px;float:left;margin-right:10px;}
.quick-myinfo-wrap .quick-myinfo .myinfo dl dd{font-size:12px;float:left;letter-spacing:0;}
.quick-myinfo-wrap .quick-myinfo .myinfo dl dd span{font-size:22px;font-family: 'Roboto', sans-serif;font-weight:500;}
.quick-myinfo-wrap .quick-myinfo .btn{float:right;font-size:0;margin-top:12px;}
.quick-myinfo-wrap .quick-myinfo .btn button{display:inline-block;width:92px;height:36px;border:1px solid rgba(255,255,255,.3);cursor:pointer;font-size:12px;line-height:34px;color:#fff;font-family:'Noto Sans KR' !important;margin-left:5px;background:#335764;-webkit-transition:all 200ms;transition:all 200ms;}
.quick-myinfo-wrap .quick-myinfo .btn button:hover{background:#fff;color:#335764;font-weight:600;}

/* 자동문자 발송시간 설정 */
.timeSelect-area {position:absolute; top:50%; right:100px; margin-top:-20px;}
.timeSelect-area .tit {display:inline-block; font-size:13px; color:#718c96; margin-right:10px;}
.timeSelect-area .frm_select {width:95px; border:1px solid #dee2e6}
.timeSelect-area .frm_select select {font-size:15px}

.employee-table tbody tr:hover {
  box-shadow:3px 3px 3px #dce9ee}
.segmentation {
  width: 100%;
  min-height: 100px;
  border: 1px solid var(--color-gray-100);
  border-collapse: collapse;
  background-color: #ffffff; }
.colorpic-wrap {
  position:relative;
  display:inline-block;
  margin-right:6px;
}
.colorpic-ownColor {
  display:inline-block;
  width:12px; height:12px;
/*   background:#eee; */
  border-radius: 50%;
}
.colorpic-select-wrap {
  position:absolute;
  top:15px;left:0;
  z-index:10;
  padding:30px;
  background:#fff;
  border:1px solid #d8e5e7;
  box-shadow:3px 3px 3px #dce9ee
}

/* dropdown, select 컴포넌트 */
.ui.dropdown, .component.select {
  display: inline-block;
  cursor: pointer;
}

.ui.dropdown > .dropdown-button {
  display:flex;
  gap:6px;
}
.ui.dropdown > .text, .component.select > .text {
  color:#000;
  display: inline-block;
}
.ui.dropdown > span.fa.fa-caret-down, .component.select > span.fa.fa-caret-down {
  color:#000;
  padding-left: 8px;
  padding-right: 8px;
}
.ui.dropdown > .dropdown-items, .component.select > .dropdown-items {
  display: none;
  position: absolute;
  background-color: #ffffff;
  z-index: 1;
  border: 1px solid #d9e6e8;
  max-height: 160px;
  overflow-y: auto;
}
.ui.dropdown > .dropdown-items > .item, .component.select > .dropdown-items > .item {
  word-break: keep-all;
  color:#000;
  min-height: 32px;
  padding-left: 10px;
  padding-right: 15px;
  line-height: 32px;
  font-size: 12px;
  cursor: pointer;
}

.ui.dropdown .dropdown-items .item.big, .component.select .dropdown-items .item.big  {
  font-size:14px;
  padding:0 20px 0 15px;
}
.ui.dropdown > .dropdown-items > .item:hover, .component.select > .dropdown-items > .item:hover {
  background-color: #f5f7f7;
}
.ui.dropdown.opened > .dropdown-items, .component.select.opened > .dropdown-items {
  display: block;
}

.ui.dropdown-check {
  display: inline-block;
  cursor: pointer; }

.ui.dropdown-check .select {
  width:130px; padding:0 10px; height:32px; line-height:30px;background:#fff; border:1px solid #dee2e6; font-size:13px;
}
.ui.dropdown-check .select .text {

}
.ui.dropdown-check .text {
  color:#000;
  display: inline-block; }
.ui.dropdown-check span.fa.fa-caret-down {
  color:#000;
  padding-left: 8px;
  padding-right: 8px; }
.ui.dropdown-check .dropdown-items {
  display: none;
  background-color: #ffffff;
  z-index: 1;
  padding:5px 0 0 0;
  font-size:0;
  border: 1px solid #d9e6e8;
  /*max-height: 160px;*/
  overflow-y: auto; }
.ui.dropdown-check .dropdown-items.type2{padding:5px 0;}

.ui.dropdown-check.select-wrap .dropdown-items {
  max-height:200px;
  width:130px;
}
.ui.dropdown-check.select-wrap .dropdown-items .item {
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  word-wrap: normal !important;
}

/*드롭다운*/
.ui.dropdown-check .dropdown-items .item{color:#000;min-height:32px;padding:0 10px;line-height:32px;font-size:12px;cursor:pointer;}
.ui.dropdown-check .dropdown-items.w50 .item{display:inline-block;width:50%;}
.ui.dropdown-check .dropdown-items.w50 .item:nth-child(2){letter-spacing:-1px}
.ui.dropdown-check .dropdown-items .item:hover{background-color:#f5f7f7;}
.ui.dropdown-check .dropdown-items .item.active{font-weight:bold;}
.ui.dropdown-check.opened .dropdown-items{display:block;}
.ui.dropdown-check .dropdown-items-wrap {position:absolute;/*top:31px;*/top:35px;z-index:10;}
.ui.dropdown-check .dropdown-check-btn button{width:100%;height:35px;line-height:35px;color:#fff;background:#37454a;text-align:center;}
.ui.dropdown-check .dropdown-items .item-text {padding-bottom:5px}
.ui.dropdown-check .dropdown-items .item-text .item-text-feild {display:block; border:1px solid #d9e6e8; width:100%; height:24px; padding-left:5px;}

.ui.dropdown-period {
  display: inline-block;
  cursor: pointer;
  width:130px;}
.ui.dropdown-period > .text {
  display: inline-block; }
.ui.dropdown-period > span.fa.fa-caret-down {
  padding-left: 8px;
  padding-right: 8px; }
.ui.dropdown-period > .dropdown-items {
  display: none;
  position: absolute;
  background-color: #ffffff;
  z-index: 1;
  border: 1px solid #d9e6e8;
  overflow-y: auto;
  max-height: 310px;
  width:120px; }
.ui.dropdown-period > .dropdown-items > .item {
  min-height: 32px;
  padding-left: 15px;
  padding-right: 15px;
  line-height: 32px;
  font-size: 12px;
  cursor: pointer; }
.ui.dropdown-period > .dropdown-items > .item:hover {
  background-color: #f5f7f7; }
.ui.dropdown-period > .dropdown-items > .item.active {
  font-weight: bold; }
.ui.dropdown-period > .dropdown-items > .item .input-balance {
  text-align: right;
  width: 100%; }
.ui.dropdown-period > .dropdown-items > .action {
  display: block;
  margin-top: 5px;
  line-height: 30px;
  text-align: center;
  font-size: 13px;
  background: #000;
  color: #fff;
  width: 90px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px; }
.ui.dropdown-period.opened > .dropdown-items {
  display: block; }

.ui.choose-date {
  display: inline-block;
  position: relative;
  cursor: pointer; }
.ui.choose-date > .text {
  display: inline-block; }
.ui.choose-date > span.fa.fa-caret-down {
  padding-left: 8px;
  padding-right: 8px; }
.ui.choose-date > .dropdown-calendar {
  display: none;
  position: absolute;
  width: 260px;
  left: -80px;
  background-color: #ffffff;
  z-index: 1;
  border: 1px solid #d9e6e8;
  cursor: default; }
.ui.choose-date > .dropdown-calendar > .calendar-header {
  padding: 20px 40px;
  background: #37454a;
  text-align: center; }
.ui.choose-date > .dropdown-calendar > .calendar-header > .fa {
  position: absolute;
  color: #58e5e4;
  line-height: 45px;
  vertical-align: top; }
.ui.choose-date > .dropdown-calendar > .calendar-header > .fa.fa-caret-left {
  left: 40px; }
.ui.choose-date > .dropdown-calendar > .calendar-header > .fa.fa-caret-right {
  right: 40px; }
.ui.choose-date > .dropdown-calendar > .calendar-header > .date {
  display: inline-block;
  height: 45px;
  position: relative;
  text-align: center;
  color: #ffffff; }
.ui.choose-date > .dropdown-calendar > .calendar-header > .date > .year {
  font-size: 12px; }
.ui.choose-date > .dropdown-calendar > .calendar-header > .date > .month {
  font-size: 30px; }
.ui.choose-date > .dropdown-calendar > .calendar-body {
  padding: 25px;
  background: #ffffff; }
.ui.choose-date > .dropdown-calendar > .calendar-body > table {
  width: 100%;
  font-size: 11px;
  line-height: 11px;
  text-align: center;
  color: #37454a;
  border-collapse: collapse; }
.ui.choose-date > .dropdown-calendar > .calendar-body > table td {
  padding: 8px 0;
  cursor: pointer; }
.ui.choose-date > .dropdown-calendar > .calendar-body > table td.today {
  border: 1px solid #cedddf;
  background: #fafcfc; }
.ui.choose-date > .dropdown-calendar > .calendar-body > table td.chosen {
  color: #ffffff;
  background: #58e5e4; }
.ui.choose-date > .dropdown-calendar > .calendar-body > table td.holiday {
  color: #bbc4c8;
  background: #f7fafb; }
.ui.choose-date > .dropdown-calendar > .calendar-body > table tr:first-child td {
  padding-bottom: 0; }
.ui.choose-date > .dropdown-calendar > .calendar-body > table tr:last-child td {
  padding-bottom: 0; }
.ui.choose-date.opened > .dropdown-calendar {
  display: block; }

.ui.choose-time  , .ui.choose-time .time {
  display:inline-block}
.ui.choose-time .time .text {
  font-size: 18px;}
.ui.button {
  display: inline-block; }
.ui.button.normal {
  color: #969ea0;
  height: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  border: 0;
  background: #f7fafb;
  /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left, #f7fafb, #f7fafb);
  /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(right, #f7fafb, #f7fafb);
  /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(right, #f7fafb, #f7fafb);
  /* For Firefox 3.6 to 15 */
  background: linear-gradient(to right, #f7fafb, #f7fafb);
  /* Standard syntax */
  border-bottom-left-radius: 4px;
}
.ui.button.normal:hover{color:#707a7d;}
.ui.button.emphasize {
  color: #ffffff;
  height: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  border: 0;
  background: #3e4c5f;
  border-bottom-right-radius: 4px;
  /*border-bottom-left-radius: 4px;*/
}
.ui.button.emphasize:hover{background:#29373b;}
.ui.button.gradation {
  color: #ffffff;
  height: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  border: 0;
  background: #227EFF;
  border-radius: 2px;
  /*background: #58e5e4;*/
  /* For browsers that do not support gradients */
  /*background: -webkit-linear-gradient(left, #58e5e4, #6ab9f1);*/
  /* For Safari 5.1 to 6.0 */
  /*background: -o-linear-gradient(right, #58e5e4, #6ab9f1);*/
  /* For Opera 11.1 to 12.0 */
  /*background: -moz-linear-gradient(right, #58e5e4, #6ab9f1);*/
  /* For Firefox 3.6 to 15 */
  /*background: linear-gradient(to right, #58e5e4, #6ab9f1);*/
  /* Standard syntax */ }

div.ui.more {
  color: #abbbbd;
  padding:5px 0;
  letter-spacing: 1px;
  line-height: 9px;
  text-align: center;
  background: #f4f5f5;
  cursor: pointer; }
/*div.ui.more:after {
    display: inline-block;
    content: "\2219\2219\2219";
    font-size: 16px;
    font-weight: bold; }*/
div.ui.more.type02 {
  border-right:1px solid #dce8ea;border-bottom:1px solid #dce8ea;border-left:1px solid #dce8ea;
}

.icon-cross-large {
  width: 20px;
  height: 20px;
}
.pagination {
  text-align: center; }
.pagination .item {
  color: #37454a;
  margin-right: 15px; }
.pagination .item:first-child, .pagination .item:last-child {
  color: #000; }
.pagination .item:last-child {
  margin: 0; }
.pagination .item.active {
  font-weight: bold; }
.notifications .content-control-area {
  text-align: center;
  margin-top: 20px;
}

.notifications .all-remove-btn {
  border: 1px solid var(--red-300);
  background: #ffffff;
  color: var(--red-300);
  padding: 4px 16px;
  border-radius: 100px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.notifications .content .noti-msg {
  padding:50px 30px;
  text-align:center;
  color:#464646;
}
.ui.input {
  height: 48px;}
  .ui.input input {
    width: 100%;
    height: 100%;
    padding: 0.67857143em 1em;
    border: 1px solid #d9e6e8;
    border-radius: 2px;
    font-size: 14px; }
    .ui.input input:disabled {
      color: rgba(0, 0, 0, 0.3); }
    .ui.input input:focus {
      border: 1px solid #207eff;
      box-shadow: 0 0 4px 0 #cde2ff;
      /*border: 1px solid #c0cbcf;*/ }

.ui.search.form {
  display: inline-block;
  position: relative;
  height: 42px; }
  .ui.search.form.input-no-border input {
    border: 0; }
  .ui.search.form input {
    width: 300px;
    height: 100%;
    padding-left: 10px;
    padding-right: 60px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 12px;
    border: 1px solid #e4e8ec;
    border-radius: 2px;}
  .ui.search.form .action {
    display: inline-block;
    position: absolute;
    width: 50px;
    height: 100%;
    top: 0px;
    right: 0px;
    line-height: 42px;
    text-align: center;
    color: #ffffff;
    font-size: 13px;
    background: #282e34;
    cursor: pointer;
    border-radius: 0 2px 2px 0;}

    .ui.search.form .action .fa-search {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -6px 0 0 -5px;
    }
    .ui.search.form .action .icon-search {
      margin-top: 13px; }

  .ui.search.form .search-result {
      position: absolute;
      left: 0;
      right: 0;
      top: 41px;
      max-height: 400px;
      overflow-y: auto;
      background: #ffffff;
      border: 1px solid #d9e5e7;
      z-index: 10;
  }

.ui.search.form .search-result .item {
    display: block;
    padding: 10px 20px;
    text-decoration: underline;
    color: #000;
}

.ui.search.form .search-result .item .matched {
    color: #227eff;
    font-weight: 600;
}

.ui.search.form .search-result .item:hover {
    background: #f7f9f8;
}

.ui.search.form .customer-search-result {
    position: absolute;
    left: 0;
    right: 0;
    top: 41px;
    max-height: 400px;
    overflow-y: auto;
    background: #ffffff;
    border: 1px solid #d9e5e7;
    z-index: 10;
}

.ui.search.form .customer-search-result .item {
    display: block;
    padding: 10px 20px;
    text-decoration: underline;
    color: #000;
}

.ui.search.form .customer-search-result .item .matched {
    color: #227eff;
    font-weight: 600;
}

.ui.search.form .customer-search-result .item:hover {
    background: #f7f9f8;
}

input.left {
    text-align: left;
}

input.center {
    text-align: center;
}

input.right {
    text-align: right;
}

.ui.checkbox {
  display: inline-block;
  position: relative;
  margin-right: 5px;
  text-align: left;
  cursor: pointer; }
  .ui.checkbox input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0; }
  .ui.checkbox input + label {padding-left: 25px; cursor: pointer; position: relative; }
  .ui.checkbox input:disabled + label { cursor: default; }
  .checkbox-nodesign .ui.checkbox input + label {padding-left: 0;}
  .signup-container .ui.checkbox input + label {width:100%;display:block;}
    .ui.checkbox input + label > span {
      display: inline-block;
      width: 18px;
      height: 18px;
      margin-right: 10px;
      position: absolute;
      left: 0;
      top: 50% !important;
      margin-top: -9px;
      background: #ffffff;
      border: 1px solid #d9e6e8; }
      .ui.checkbox input + label > span > span {
        background: #227eff;
        display: none;
        position: absolute;
        left:0;
        width: 8px;
        height: 8px;
        margin: 4px; }
  .ui.checkbox input[type="radio"] + label {
    padding-left: 25px;
    color: #bdc5d0;}
    .ui.checkbox input[type="radio"] + label > span {
      border-radius: 50%;
      /*width: 14px;
      height: 14px; */}
      .ui.checkbox input[type="radio"] + label > span > span {
        /*width: 6px;
        height: 6px;
        margin: 3px;*/
        border-radius: 50%; }
  .ui.checkbox input:checked + label {
    color: #000;
    font-weight: 500; }
    .ui.checkbox input:checked + label > span > span {
      display: inline-block; }
  .ui.checkbox.font-size-10 {
    font-size: 10px;
    height: 18px; }
    .ui.checkbox.font-size-10 input + label > span {
      top: -2.5px; }
    .ui.checkbox.font-size-10 input[type="radio"] + label > span {
      top: 0px; }
  .ui.checkbox.font-size-11 {
    font-size: 11px;
    height: 19px; }
    .ui.checkbox.font-size-11 input + label > span {
      top: -1.75px; }
    .ui.checkbox.font-size-11 input[type="radio"] + label > span {
      top: 0.7px; }
  .ui.checkbox.font-size-12 {
    font-size: 12px;
    height: 20px; }
    .ui.checkbox.font-size-12 input + label > span {
      top: 1px; }
    .ui.checkbox.font-size-12 input[type="radio"] + label > span {
      top: 1.4px; }
  .ui.checkbox.font-size-13 {
    font-size: 13px;
    /*height: 21px;*/
    padding:2px 0;}
    .ui.checkbox.font-size-13 input + label > span {
      top: -0.25px; }
    .ui.checkbox.font-size-13 input[type="radio"] + label > span {
      top: 2.1px; }
  .ui.checkbox.font-size-14 {
    font-size: 14px;
    /*height: 22px;*/ }
    .ui.checkbox.font-size-14 input + label > span {
      /*top:0.5px*/}
    .ui.checkbox.font-size-14 input[type="radio"] + label > span {
      /*top: 2.8px;*/ }
  .ui.checkbox.font-size-15 {
    font-size: 15px;
    height: 23px; }
    .ui.checkbox.font-size-15 input + label > span {
      top: 1.25px; }
    .ui.checkbox.font-size-15 input[type="radio"] + label > span {
      top: 3.5px; }
  .ui.checkbox.font-size-16 {
    font-size: 16px;
    /*height: 24px;*/ }
    .ui.checkbox.font-size-16 input + label > span {
      top: 2px; }
    .ui.checkbox.font-size-16 input[type="radio"] + label > span {
      top: 4.2px; }
  .ui.checkbox.font-size-17 {
    font-size: 17px;
    height: 25px; }
    .ui.checkbox.font-size-17 input + label > span {
      top: 2.75px; }
    .ui.checkbox.font-size-17 input[type="radio"] + label > span {
      top: 4.9px; }
  .ui.checkbox.font-size-18 {
    font-size: 18px;
    height: 26px; }
    .ui.checkbox.font-size-18 input + label > span {
      top: 3.5px; }
    .ui.checkbox.font-size-18 input[type="radio"] + label > span {
      /*top: 5.6px;*/ }
  .ui.checkbox.font-size-19 {
    font-size: 19px;
    height: 27px; }
    .ui.checkbox.font-size-19 input + label > span {
      top: 4.25px; }
    .ui.checkbox.font-size-19 input[type="radio"] + label > span {
      top: 6.3px; }
  .ui.checkbox.font-size-20 {
    font-size: 20px;
    height: 28px; }
    .ui.checkbox.font-size-20 input + label > span {
      top: 5px; }
    .ui.checkbox.font-size-20 input[type="radio"] + label > span {
      top: 7px; }
  .ui.checkbox.font-size-21 {
    font-size: 21px;
    height: 29px; }
    .ui.checkbox.font-size-21 input + label > span {
      top: 5.75px; }
    .ui.checkbox.font-size-21 input[type="radio"] + label > span {
      top: 7.7px; }
  .ui.checkbox.font-size-22 {
    font-size: 22px;
    height: 30px; }
    .ui.checkbox.font-size-22 input + label > span {
      top: 6.5px; }
    .ui.checkbox.font-size-22 input[type="radio"] + label > span {
      top: 8.4px; }
  .ui.checkbox.font-size-23 {
    font-size: 23px;
    height: 31px; }
    .ui.checkbox.font-size-23 input + label > span {
      top: 7.25px; }
    .ui.checkbox.font-size-23 input[type="radio"] + label > span {
      top: 9.1px; }
  .ui.checkbox.font-size-24 {
    font-size: 24px;
    height: 32px; }
    .ui.checkbox.font-size-24 input + label > span {
      top: 8px; }
    .ui.checkbox.font-size-24 input[type="radio"] + label > span {
      top: 9.8px; }
  .ui.checkbox.font-size-25 {
    font-size: 25px;
    height: 33px; }
    .ui.checkbox.font-size-25 input + label > span {
      top: 8.75px; }
    .ui.checkbox.font-size-25 input[type="radio"] + label > span {
      top: 10.5px; }
  .ui.checkbox.font-size-26 {
    font-size: 26px;
    height: 34px; }
    .ui.checkbox.font-size-26 input + label > span {
      top: 9.5px; }
    .ui.checkbox.font-size-26 input[type="radio"] + label > span {
      top: 11.2px; }
  .ui.checkbox.font-size-27 {
    font-size: 27px;
    height: 35px; }
    .ui.checkbox.font-size-27 input + label > span {
      top: 10.25px; }
    .ui.checkbox.font-size-27 input[type="radio"] + label > span {
      top: 11.9px; }
  .ui.checkbox.font-size-28 {
    font-size: 28px;
    height: 36px; }
    .ui.checkbox.font-size-28 input + label > span {
      top: 11px; }
    .ui.checkbox.font-size-28 input[type="radio"] + label > span {
      top: 12.6px; }
  .ui.checkbox.font-size-29 {
    font-size: 29px;
    height: 37px; }
    .ui.checkbox.font-size-29 input + label > span {
      top: 11.75px; }
    .ui.checkbox.font-size-29 input[type="radio"] + label > span {
      top: 13.3px; }
  .ui.checkbox.font-size-30 {
    font-size: 30px;
    height: 38px; }
    .ui.checkbox.font-size-30 input + label > span {
      top: 12.5px; }
    .ui.checkbox.font-size-30 input[type="radio"] + label > span {
      top: 14px; }

.ui.choose-day-of-week > .day {
  display: table-cell;
  position: relative;
  width: 30px;
  height: 30px; }
  .ui.choose-day-of-week > .day > input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0; }
  .ui.choose-day-of-week > .day input[type="checkbox"] + label {
    padding: 0;
    text-align: center;
    line-height: 30px; }
    .ui.choose-day-of-week > .day input[type="checkbox"] + label span {
      display: inline-block;
      width: 30px;
      height: 30px;
      margin: 0;
      border: 0;
      border: 1px solid #e4e8ec;
      border-radius: 0;
      left: 0;
      color: #aeb1b3;
      background: #ffffff; }
  .ui.choose-day-of-week > .day:not(:first-child) {
    border-left: 0; }
    .ui.choose-day-of-week > .day:not(:first-child) input[type="checkbox"] + label span {
      border-left: 0; }
  .ui.choose-day-of-week > .day input[type="checkbox"]:checked + label span {
    color: #ffffff;
    background: #222; }

.period-wrap {display:inline-block; width:100%}
.period-wrap .frm_select {width:95px; height:32px; border: 1px solid #dee2e6;}
.period-wrap .frm_select select {height:30px}
.ui.period > .item {
  display: table-cell;
  position: relative;
  height: 34px;
  border: 1px solid var(--color-gray-100); }
  .ui.period > .item > input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0; }
  .ui.period > .item input[type="radio"] + label {
    cursor:pointer;
    padding: 0;
    text-align: center;
    font-size:var(--font-size-s);
    font-weight:var(--font-weight-medium);
    line-height:34px;
  }
    .ui.period > .item input[type="radio"] + label span {
      display: inline-block;
      width: 100%;
      margin: 0;
      padding-left: 10px;
      padding-right: 10px;
      color: var(--color-gray-700);
      background: var(--color-gray-white); }
  .ui.period > .item:not(:first-child) {
    border-left: 0; }
    .ui.period > .item:not(:first-child) input[type="radio"] + label span {
      border-left: 0; }
  .ui.period > .item input[type="radio"]:checked + label span {
    color: var(--color-gray-white);
    background: var(--color-gray-700); }

.ui.option {
  display: inline-block;
  margin-right: 1px;
  margin-bottom: 5px; }
  .ui.option > input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0; }
  .ui.option > label {
    padding: 0; }
    .ui.option > label > span {
      display: inline-block;
      height: 35px;
      line-height: 35px;
      padding: 0 10px;
      border: 1px solid #bbc4c8;
      color: #bbc4c8;
      cursor: pointer;
      background: #ffffff; }
  .ui.option input:checked + label {
    color: #3fd2d1; }
    .ui.option input:checked + label > span {
      border: 1px solid #3fd2d1;
      color: #3fd2d1; }

.table-wrap-tit {
  margin:20px 0 12px 0;
  font-size:var(--font-size-l);
  font-weight:var(--font-weight-bold);
  line-height:var(--line-height-l);
}
.table-wrap table.outside {
  background: #ffffff;
  border: 1px solid var(--color-gray-100);
  font-size: 13px; }
.table-wrap .borderL {
	border-left:1px solid var(--color-gray-100)}
.table-wrap .borderNone {
	border:none}
.table-wrap tr.row {
  border-bottom: 1px solid var(--color-gray-100); }
  .table-wrap tr.row:last-child {
    border-bottom: 0; }
.table-wrap thead tr.row:last-child {
  border-bottom: 1px solid var(--color-gray-100); }
.table-wrap th.column-header {
  color: var(--color-gray-700);
  padding: 14px;
  text-align: center;
  font-weight:bold;
  line-height:1.5;
}
.table-wrap.table-wrap--small th.column-header {
  padding: 8px 4px;
  font-size:var(--font-size-m);
  font-weight:var(--font-weight-bold);
  line-height: var(--line-height-m-20);
}
.table-wrap th.column-no-content {
  color: #37454a;
  padding: 14px;
  text-align: center;
  font-weight: normal;}
.table-wrap th.column-header.type2 {padding:14px 0}
.table-wrap td.column {
  color: var(--color-gray-500);
  padding: 14px;
  text-align: center;
  word-wrap: break-word;
  line-height: 16px;
}
.table-wrap.table-wrap--small td.column{
  padding: 8px 4px;
  font-size:var(--font-size-s);
  font-weight:var(--font-weight-regular);
  line-height: var(--line-height-s);
}
.new-gong-black td.column {
  color: #20232B !important;
}
.new-gong-black td.column a {
  color: #20232B !important;
}

.table-wrap th.column-header.border-right, .table-wrap td.column.border-right {
  border-right:1px solid var(--color-gray-100);
}
.table-wrap td.column.type2 {padding:14px 0; border-bottom:1px solid #f4f5f5}
/* 입력값 글자 영역침범 시 */
#elltxt1 {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
#elltxt2 {white-space: unset; word-break: break-all; line-height: 16px;}

.table-wrap.pet-table th , .table-wrap.pet-table td.column {
  padding:14px 5px;
}

.table-wrap td.column.paddingInput {
  padding:5px 0;
}
.table-wrap td.column-last {
  background:#fafcfc;
  color: #37454a;
  padding: 14px;
  text-align: center; }
.table-wrap td.column-last.top {
  border-top:1px solid #9fabad;
}
  .table-wrap td.column.title {
  text-align: left; }
  .table-wrap td.column.number-only {
    font-family: 'Segoe UI'; }
  .table-wrap td.column.mid-header {
  	background:#f9fbfb;}
  .table-wrap td.column.percent-area {
  	font-weight:bold;}
  .table-wrap td.column.percent-area span {
  	font-weight:bold;
  	color:#f13a3a}
  .table-wrap td.column input, .table-wrap td.column textarea {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 12px; }
  .table-wrap td.column input {
    height: 15px;
    line-height: 15px;
    vertical-align:middle; }
  .table-wrap td.column textarea {
    resize: none; }
  .table-wrap td.column .ui.dropdown {
    position:relative;
    height: 12px; }
  .table-wrap td.column .ui.choose-date {
    height: 12px; }
.table-wrap tfoot.outside {
  border-top: 1px solid #dce8ea; }
  .table-wrap tfoot.outside td.column {
    text-align: left; }
.table-wrap.list th.column-header.collapsing, .table-wrap.list td.column.collapsing {
  width: 1px;
  white-space: nowrap; }
.table-wrap.list th.column-header.width-nano, .table-wrap.list td.column.width-nano {
  width: 50px; }
.table-wrap.list th.column-header.width-tiny, .table-wrap.list td.column.width-tiny {
  width: 60px; }
.table-wrap.list th.column-header.width-small, .table-wrap.list td.column.width-small {
  width: 90px; }
.table-wrap.list th.column-header.width-medium, .table-wrap.list td.column.width-medium {
  width: 100px; }
.table-wrap.list th.column-header.width-large, .table-wrap.list td.column.width-large {
  width: 120px; }
.table-wrap.list th.column-header.width-xlarge, .table-wrap.list td.column.width-xlarge {
  width: 140px; }
.table-wrap.list th.column-header.width-xxlarge, .table-wrap.list td.column.width-xxlarge {
  width: 160px; }
.table-wrap.list th.column-header.width-xxxlarge, .table-wrap.list td.column.width-xxxlarge {
  width: 180px; }
.table-wrap.list th.column-header.width-xxxxlarge, .table-wrap.list td.column.width-xxxxlarge {
  width: 200px; }
.table-wrap.list th.column-header {
  background: var(--color-bg-200); }
  .table-wrap.list th.column-header > .column-option-selectable {
    position: relative;
    display: table;
    width: 100%;
    height: 100%; }
    .table-wrap.list th.column-header > .column-option-selectable > .indicator {
      margin-left: 5px; }
    .table-wrap.list th.column-header > .column-option-selectable > .options {
      display: none;
      position: absolute;
      left: -15px;
      right: -14px;
      margin-top: 14px;
      padding: 10px;
      text-align: left;
      font-weight: normal;
      background: #ffffff;
      border: 1px solid #d8e5e7;
      -webkit-box-shadow: 10px 10px 10px 0px rgba(113, 140, 150, 0.3);
      -moz-box-shadow: 10px 10px 10px 0px rgba(113, 140, 150, 0.3);
      box-shadow: 10px 10px 10px 0px rgba(113, 140, 150, 0.3); }
      .table-wrap.list th.column-header > .column-option-selectable > .options > .option {
        display: block;
        margin-bottom: 5px; }
        .table-wrap.list th.column-header > .column-option-selectable > .options > .option:last-child {
          margin-bottom: 0; }
    .table-wrap.list th.column-header > .column-option-selectable.opened > .options {
      display: table-row; width:150px; }
  .table-wrap.list th.column-header.sub {
    font-weight: normal; }
  .table-wrap.list th.column-header:hover {
    background: var(--color-bg-200); }
.table-wrap.list th.column-no-content {
  background: #FFFFFF; }
.table-wrap.list td.column input[type=number][type=number] {
  -moz-appearance: textfield; }
.table-wrap.list td.column input[type=number][type=number]::-webkit-inner-spin-button, .table-wrap.list td.column input[type=number][type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0; }
.table-wrap.list td.column input[type=number] + .won {
  display: inline-block; }
.table-wrap.list td.column.edit {
    position: relative; }
.table-wrap.list tr.row.editable .content-wrap {
    display: block; }
  .table-wrap.list tr.row.editable .input-wrap {
    display: none; }
  .table-wrap.list tr.row.editable .input-wrap input {
    width:100%;
    height:23px;
    border-bottom:1px solid #dce8ea;
    background-color:#fff;
    text-align: center; }
  .table-wrap.list tr.row.editable .action.edit {
    display: none;
    cursor: pointer;
    position: absolute;
    top: 16px;
    right: 10px;
    opacity: 0.5; }
  .table-wrap.list tr.row.editable .action.submit {
    display: none;
    cursor: pointer;
    position: absolute;
    top: 16px;
    right: 10px;}
  .table-wrap.list tr.row.editable .circle-close {
    display: none;
    position: absolute;
    top: 12px;
    right: 30px;}
  .table-wrap.list tr.row.editable:hover {
    background: #f5f7f7; }
    .table-wrap.list tr.row.editable:hover input, .table-wrap.list tr.row.editable:hover textarea {
      background: #f5f7f7; }
    .table-wrap.list tr.row.editable:hover .action.edit {
      display: inline-block; }
  .table-wrap.list tr.row.editable.editting .content-wrap {
    display: none; }
  .table-wrap.list tr.row.editable.editting .input-wrap {
    display: block; }
  .table-wrap.list tr.row.editable.editting .action.edit {
    display: none; }
  .table-wrap.list tr.row.editable.editting .action.submit {
    display: inline-block; }
  .table-wrap.list tr.row.editable.editting .circle-close {
    display: inline-block; }
.table-wrap.detail td.label {
  width: 130px;
  color: #37454a;
  background: #f9fbfb;
  text-align: left;
  font-weight: bold;
  vertical-align: top; }
.table-wrap.detail td.content {
/*   position: relative;  bada */
  background: #ffffff;
  text-align: left;
  vertical-align: top; }
  .table-wrap.detail td.content input[type=number] + .won {
    display: inline-block; }
  .table-wrap.detail td.content .error {
    color: #3fd2d1; }
  .table-wrap.detail td.content.editable .content-wrap {
    display: block; }
  .table-wrap.detail td.content.editable .input-wrap {
    display: none; }
  .table-wrap.detail td.content.editable .action.edit {
/*     display: none; */
    cursor: pointer;
    position: absolute;
/*     top: 14px; bada */
/*     right: 15px; bada */
    top: 0px;
    right: -10px;
    opacity: 0.5; }
  .table-wrap.detail td.content.editable .action.submit {
    display: none;
    cursor: pointer;
    position: absolute;
/*     top: 14px; bada */
/*     right: 15px;  bada */
    top: 0px;
    right: -10px;}
  .table-wrap.detail td.content.editable .circle-close {
    display: none;
    position: absolute;
/*     top: 11px; bada */
/*     right: 35px; bada */
    top: -3px;
    right: 10px;}
  .table-wrap.detail td .subtxt {
  font-size:13px; color:#bbc4c8}
  .table-wrap.detail td.content.editable:hover {
    background: #f5f7f7; }
    .table-wrap.detail td.content.editable:hover input, .table-wrap.detail td.content.editable:hover textarea {
      background: #f5f7f7; }
    .table-wrap.detail td.content.editable:hover .action.edit {
      display: inline-block; }
  .table-wrap.detail td.content.editable.editting .content-wrap {
    display: none; }
  .table-wrap.detail td.content.editable.editting .input-wrap {
    display: block; }
  .table-wrap.detail td.content.editable.editting .action.edit {
    display: none; }
  .table-wrap.detail td.content.editable.editting .action.submit {
    display: inline-block; }
  .table-wrap.detail td.content.editable.editting .circle-close {
    display: inline-block; }
.table-wrap.fat-header th.fat-header {
  padding: 20px;
  text-align: left;
  color: #37454a;
  font-size: 16px;
  font-weight: normal;
  border-bottom: 1px solid #dce8ea; }
.table-wrap.top-border-point {
  border-top: 1px solid #37454a; }
  .table-wrap.top-border-point table.outside {
    border-top: 0; }
.table-wrap.pop-inner-table {
	margin-bottom:20px}
.table-wrap .tit-area {
  background:#f9fbfb;
  font-size:15px;
  color:#000 !important;}
.table-wrap.pop-inner-table .sum-area {
  color:#000;
  line-height:20px;
  border-left:1px solid #dce8ea}
.table-wrap tr.add-new-item-form {
  border-bottom: 1px solid #dce8ea; }
  .table-wrap tr.add-new-item-form input {
    vertical-align: top; }
.table-wrap tr.add-new-item-action {
  border-bottom: 1px solid #dce8ea;
  cursor: pointer; }
  .table-wrap tr.add-new-item-action:last-child {
    border-bottom: 0; }
  .table-wrap tr.add-new-item-action.inputting:hover {
    background: #37454a; }
    .table-wrap tr.add-new-item-action.inputting:hover td {
      color: #ffffff; }
  .table-wrap tr.add-new-item-action td {
    padding: 14px;
    text-align: center;
    color: #37454a; }
    .table-wrap tr.add-new-item-action td .icon-pencil {
      margin-left: 10px;
      vertical-align: top; }
    .table-wrap .list-normal li {
    padding:5px 0;}
    .table-wrap .list-normal li:first-child {
    padding-top:0;}
    .table-wrap .list-normal li:last-child {
    padding-bottom:0;}


/* 체크박스 영역 정리 20180112 dehwang */
.selectRadio-wrap {position:relative; display:inline-block;}
.selectRadio-wrap input {width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip: rect(0, 0, 0, 0); border: 0; position:absolute;top:0;left:0}
.selectRadio-wrap input + label {padding-left:24px}
.selectRadio-wrap .out-area {position:absolute; top:-2px; left:0; background:#fff; display:inline-block; width:18px; height:18px; border-radius:18px; border:1px solid #d9e6e8}
.selectRadio-wrap .in-area {display:none;position:absolute; top:0; left:0; width:8px; height:8px; margin:4px; border-radius:50%; background:#227eff;}
.selectRadio-wrap .in-area.active {display:inline-block; }
.selectRadio-wrap input:checked + label { color: #000; }
.selectRadio-wrap input:checked + label > span > span { display: inline-block; }

/* 라디오박스 영역 정리 */
.radio-wrap ul{margin:7px 0 0 25px;}
.radio-wrap ul li{margin-top:5px;}
.radio-wrap ul li:first-child{margin-top:0;}
.radio-wrap ul li .ui.checkbox.font-size-12{height:14px;}
.radio-wrap ul li .ui.checkbox input + label{padding-left:17px;}
.radio-wrap ul li .ui.checkbox input + label > span{width:11px;height:11px;margin-top:-4px;margin-right:6px;}
.radio-wrap ul li .ui.checkbox input + label > span > span{width:5px;height:5px;margin:2px;}

/* 테이블 우측메뉴바 20180911 dehwang */
.floatMenu-right {position: fixed;top: 50%;margin: -80px 0 0 970px;}
.listSetMenu-wrap {width:60px; padding:0 12px; background:#fff; border:1px solid #d9e6e8; border-radius:3px;}
.listSetMenu-wrap ul li {position:relative; width:100%; border-bottom:1px solid #d9e6e8}
.listSetMenu-wrap ul li:last-child {border-bottom:0}
.listSetMenu-wrap button {padding:12px 0; width:100%; cursor:pointer; background:none; border:none; }
.listSetMenu-wrap button:focus {outline: none}
.listSetMenu-wrap i.ic-listSet ,
.pop-appsetinfo .txt span.point i.i-arrowcheck ,
.pop-appsetinfo .btn a ,
.set-appmenu-subtxt .btn
{background-image:url('/resources/static/img/icon/ic_listSet-d919049d49e2514c9df8734e1b64036a.png');background-repeat:no-repeat;}
.listSetMenu-wrap i.ic-listSet {display:block; margin:0 auto; width:12px; height:13px; }
.listSetMenu-wrap button.btn-up i {background-position:0 0;}
.listSetMenu-wrap button.btn-down i {background-position:0 -13px;}
.listSetMenu-wrap button.btn-edit i {background-position:0 -26px;}
.listSetMenu-wrap button.btn-del i {background-position:0 -39px;}
.listAppSet {margin-bottom:5px}
.listAppSet button.btn-appset i {width:13px; height:22px; background-position:0 -57px;}
.listSetMenu-wrap ul li:hover .pop-appsetinfo {display:block}
.pop-appsetinfo {display:none; position:absolute; top:15px; left:45px; width:200px; height:30px; padding-left:15px;}
.pop-appsetinfo .txt {float:left; }
.pop-appsetinfo .txt span {font-size:11px; font-weight:bold; color:#718c96; line-height:16px; vertical-align:top;}
.pop-appsetinfo .txt span.point {color:#24bdbc; }
.pop-appsetinfo .txt span.point i.i-arrowcheck {display:inline-block; margin-left:5px; width:9px; height:7px; background-position:0 -85px;}
.pop-appsetinfo .btn {float:left; margin-left:5px}
.pop-appsetinfo .btn a {display:block; width:50px; height:29px; background-position:-18px 0; text-indent:-500em}

.set-appmenu-subtxt {display:inline-block; margin:10px 0 10px 20px;}
.set-appmenu-subtxt span {display:inline-block; vertical-align:top; line-height: 16px; font-size:12px; color:#aaaab0; }
.set-appmenu-subtxt span.point {color:#718c96; font-weight:500;}
.set-appmenu-subtxt .btn {display:inline-block; margin-left:5px; width:42px; height:16px; background-position:-19px -31px; text-indent:-500em;}
.set-appmenu-wrap {padding:0 10px 20px 20px; height:300px; overflow-y:auto;}
.set-appmenu-wrap dl {margin-bottom:20px;}
.set-appmenu-wrap dt {margin-bottom:10px; }
.set-appmenu-wrap dt span {color:#37454a}
.set-appmenu-wrap dd {margin:0; background:#fff; border-top:1px solid #d8e5e7; border-left:1px solid #d8e5e7;  border-right:1px solid #d8e5e7;}
.set-appmenu-wrap dd ul {display:table; width:100%; margin-bottom: -2px;}
.set-appmenu-wrap dd li {display:table-cell;vertical-align: middle; width:33.33%; border-bottom:1px solid #d8e5e7;}
.set-appmenu-wrap dd li label {position:relative; display:table; width:100%; padding:11px 10px; }
.set-appmenu-wrap dd li label.active {background:#d9eded}
.set-appmenu-wrap dd li label span {display:table-cell; vertical-align:middle; color:#7e959d; font-size:13px}
.set-appmenu-wrap dd li input[type="checkbox"] {visibility: hidden; position:absolute; top:0; left:0}


.ui.dimmer {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  z-index: 150; }
  .ui.dimmer.visible {
    display: block; }

.ui.modal {
  display: none;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -webkit-box-shadow: 20px 20px 20px 0px rgba(113, 140, 150, 0.3);
  -moz-box-shadow: 20px 20px 20px 0px rgba(113, 140, 150, 0.3);
  box-shadow: 20px 20px 20px 0px rgba(113, 140, 150, 0.3); }
  .ui.modal.visible {
    display: block;
    border-radius: 5px;
    background: #ffffff;
    position: fixed;
    z-index: 999;
    /*border: 1px solid #dce8ea;*/}
  .ui.modal.mini-size > .wrap {
    width: 250px; }
  .ui.modal.tiny-size > .wrap {
    width: 300px; }
  .ui.modal.small-size > .wrap {
    width: 375px; }
  .ui.modal.middle-size > .wrap {
    width: 450px;}
  .ui.modal.middle2-size > .wrap {
    width: 500px; }
  .ui.modal.large-size > .wrap {
    width: 600px; }
  .ui.modal.xlarge-size > .wrap {
    width: 760px; }
  .ui.modal > .ui.modal-close.button {
    position: absolute;
    right: 30px;
    top: 30px; }
  .ui.modal > .wrap {
    /*background: #fff;*/ }
    .ui.modal-close.button {
      position: relative;
    }
    .ui.modal > .wrap > .header {
      width:100%;
      webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
      padding: 20px 20px!important;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      border-bottom: 1px solid #f7f8f9;
      display: flex;
      align-items: center;
      justify-content: space-between;}
      .ui.modal > .wrap > .header .title {
      	float:left;
      	width:100%;
        font-size: 18px;
        color: #222;
        text-align: left;
        font-weight: bold; }
      .ui.modal > .wrap > .header .title.type02 {
      	text-align:center;
      	width:100%;
      	float:none;
      }
      .ui.modal > .wrap > .header .title .name {
        color:#899eb2;
        font-size:18px;
        font-weight: bold; }
      .ui.modal > .wrap > .header .subtxt {
      	margin-top:13px;
      	display:inline-block;
      }
      .ui.modal > .wrap > .header .subtxt span {
        font-size:11px;
        color: #718c96;
        line-height:18px;
      }
      .ui.modal > .wrap > .header .subtxt span.red {
        color: #f41f1f !important;
      }
      .ui.modal > .wrap > .header .close {
        font-size: 20px;
        text-align: right;
        cursor: pointer; }
    .ui.modal > .wrap > .body .tabs {
      margin: 20px;
      padding: 0;
      list-style: none; }
      .ui.modal > .wrap > .body .tabs .item {
        display: inline-block;
        margin-right: 10px;
        font-size: 18px;
        vertical-align: bottom; }
        .ui.modal > .wrap > .body .tabs .item.active {
          font-size: 18px;
          font-weight: 500;
          color: black;}
          .ui.modal > .wrap > .body .tabs .item.active a {
            color: #222; }
        .ui.modal > .wrap > .body .tabs .item a {
          color: #bbc4c8; }
    .ui.modal > .wrap > .body .table-wrap table.outside {
      border-left: 0;
      border-right: 0; }
    .ui.modal > .wrap > .body .table-wrap.detail .column.label {
      padding-left: 25px; }
    .ui.modal > .wrap > .body .table-wrap.detail .column.content {
      /*padding-right: 25px;*/ }
.ui.modal .message-default {
	padding:40px 0;
	text-align:center;
}
.ui.modal .message-default .black {
	color: #000 !important;
}
.ui.modal .message-default .tit-wrap {
	padding-bottom:25px;
	font-size:20px; font-weight:bold;
	color:#3fd2d1;
}
.ui.modal .message-default .contents-wrap p {
	padding:5px 0;
	margin:0;
}
.ui.modal .message-default .contents-wrap span {
	font-size:15px; color:#718c96;
	line-height:27px;
}
.ui.modal.alert .message, .ui.modal.confirm .message {
  padding-left: 25px;
  padding-right: 25px;
  padding-top: 70px;
  padding-bottom: 25px;
  text-align: center;
  font-size: 13px;   }
 .ui.modal.alert .message, .ui.modal.confirm .message.simple {
 padding:50px 0 !important;
 font-size: 14px;   }

.ui.modal.saleMemo .message {
  padding-left: 25px;
  padding-right: 25px;
  padding-top: 30px;
  padding-bottom: 25px;
  text-align: center;
  font-size: 13px;
  letter-spacing: 0.5px;
  line-height: 20px; }

.ui.modal.send-sms .overflow-wrap {
	overflow-y: scroll;
	overflow-x: hidden;
    height: 80px;
    white-space: normal !important;
}
.ui.modal .pop-btn-area .column {
  width: 50%;
}

.ui.modal .pop-btn-area {
  display: flex;
  width: 100%;
}

.pop-message-body {
	width:100%;
	overflow-y:auto;
	overflow-x:hidden;
	text-align:center;
	color:#718c96;
	font-size:14px;
	line-height:24px;
	padding:20px;
    height: auto;
}

.pop-message-body a {
   padding: 10px 40px;
   background: #1b1818;
   border-radius: 4px;
   color: #fff;
   display: block;
   width: 200px;
   margin: 0 auto;
   margin-top: 20px;
 }

.pop-message-body p {
  margin-block-start: inherit;
  margin-block-end: inherit;
  margin-inline-start: inherit;
  margin-inline-end: inherit;
}
.pop-message-body p img {
  border-radius: 4px;
  max-width: 100%;
}
.pop-checkbox-area {
	width:100%;
	height:30px;
	webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
    padding: 20px 10px;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.quantity-picker {
  display: inline-table;
  border: 1px solid #d8e5e7;
  line-height: 30px;
  background: #ffffff; }
  .quantity-picker .decr, .quantity-picker .number, .quantity-picker .incr {
    width: 30px;
    line-height: 30px;
    display: table-cell;
    text-align: center;
    color: #37454a; }
  .quantity-picker .decr, .quantity-picker .incr {
    cursor: pointer;
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently supported by Chrome and Opera */ }
    .quantity-picker .decr.inactive, .quantity-picker .incr.inactive {
      color: #bbc4c8; }
  .quantity-picker .number {
    font-weight: bold; }

.float-header {
  overflow: hidden; }

.sub-page-header-wrap {
  display: inline-block;
  margin-bottom: 20px }
  .sub-page-header-wrap .sub-page-header .item {
    display: inline-block;
    margin-right: 20px;
    padding-bottom: 5px;
    font-size:15px;
    font-weight:bold;
  }
    .sub-page-header-wrap .sub-page-header .item:last-child {
      margin-right: 0; }
    .sub-page-header-wrap .sub-page-header .item a {
      color: var(--color-gray-200); }

    .sub-page-header-wrap .sub-page-header .item span {
      color: #cedade;
      cursor: pointer;
    }
    .sub-page-header-wrap .sub-page-header .item.active {
      border-bottom: 3px solid #000; }
      .sub-page-header-wrap .sub-page-header .item.active a {
        color: #000; }
      .sub-page-header-wrap .sub-text-wrap {
        margin-top: 5%;
      }
      .sub-page-header-wrap .sub-text-wrap .sale-guide {
        font-family: "Spoqa Han Sans Neo";
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 20px;
        display: block;
        color: #9FA1A4;
      }
      .sub-page-header-wrap .sub-text-wrap .sale-guide .emphasize {
        color: #227EFF;
      }

.on-hover-underline:hover {
  text-decoration: underline; }

.ui.tags {
  display: inline-block; }
  .ui.tags > .tag {
    display: inline-block;
    margin-bottom: 4px;
    padding: 5px;
    border: 1px solid #d8e5e7;
    background: #fafcfc; }
    .ui.tags > .tag .text {
      margin-right: 5px; }
    .ic-tags-xls {
      display:inline-block;
      width:14px; height:16px;
      vertical-align: middle;
      margin:0 2px;
      background:url('/resources/static/img/icon/ic-tags-xls-3c29ee84fa08d4d77fe4e58a716e4e70.png') no-repeat;
    }

.ui.list-card ul li .list-card-wrap {
	position:relative;
	width:100%;
	border:1px solid #d8e5e7;
	display:inline-block;
	padding:2px 10px;
	webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
.ui.list-card ul li .list-card-wrap .close {margin-top:5px}
.ui.list-card ul li .list-card-wrap .name {
	display:inline-block;
	margin:0 10px;
	line-height:25px;
	color:#37454a;
}
.ui.list-card ul li .list-card-wrap .line {
	position:absolute;
	top:0;
	left:50%;
	display:block;
	width:1px;
	height:31px;
	background:#d8e5e7;
}
.ui.list-card ul li .list-card-wrap .price input {
	width:76px; height:25px;
	text-align:right;
	float:left;
	background:#fff;
	padding:0 5px;
}
.ui.list-card ul li .list-card-wrap .price .txt {
	float:left;
	margin-left:5px;
	color:#7e959d;
	line-height:25px;
}

.visible {
  display: block; }

.hidden {
  display: none; }

.fluid {
  width: 100%; }

.clearfix {
  clear: both; }

.landing {
  line-height: 1.4; }
  .landing > .first {
    position: relative; }
    .landing > .first img.background {
       	width: 100%;
		height:770px;
      }
    .landing > .first .title {
      position: absolute;
      top: 120px;
      left: 0;
      right: 0;
      text-align: center;
      color: #ffffff;
      font-weight: 300; }
      .landing > .first .title > .title1 {
        font-size: 30px;
		font-weight: 500;
        line-height: 1;				}
      .landing > .first .title > .title2 {
        font-size: 40px;
        font-weight: 500;
        line-height: 1;
        margin-top: 5px; }
      .landing > .first .title > .description1 {
        margin-top: 30px;
        font-size: 30px;
        line-height: 1.2; }
      .landing > .first .title > .description2 {
        margin-top: 20px;
        font-size: 16px; }
        .landing > .first .title > .description2 > .emphasize {
          display: inline-block;
          margin-left: 2px;
          font-weight: 500;
          text-decoration: underline; }
      .landing > .first .title > .start-wrap .start {
        display: block;
        margin: 30px auto 0;
        width:236px; height:60px; line-height:58px;
        border:1px solid #4f69ea;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#715eff+0,975eff+100 */
		background: #4f69ea; /* Old browsers */
		background: -moz-linear-gradient(top, #4195e2 0%, #4f69ea 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, #4195e2 0%,#4f69ea 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, #4195e2 0%,#4f69ea 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4195e2', endColorstr='#4f69ea',GradientType=0 ); /* IE6-9 */
        color: #fff;
        font-weight:bold;
        font-size: 20px; }
       .landing > .first .title > .appdown-wrap {
        margin-top:50px;
        }
       .landing > .first .title > .appdown-wrap a {
       display:inline-block;
       margin:0 3px;
       padding:0 25px; border-radius:50px;
       background:rgba(255,255,255,0.3);
       box-shadow:0 0 10px #6dace7;
       }
    .landing > .first > .image-wrap {
      text-align: center;
      position: absolute;
      top: 600px;
      left: 0;
      right: 0; }
  .landing > .second {
    background: #ffffff; }
    .landing > .second > .wrap {
      padding-top: 700px;
      padding-bottom: 100px;
      margin: 0 auto;
      width: 1000px;
      position: relative; }
      .landing > .second > .wrap > .text {
        margin-top: -150px;
        font-weight: 200; }
        .landing > .second > .wrap > .text > .title {
          font-size: 40px;
		  font-weight: 400;		  }
        .landing > .second > .wrap > .text > .description {
          font-size: 16px;
          margin-top: 30px;
          font-weight: 400; }
      .landing > .second > .wrap > img {
        position: absolute;
        bottom: 0;
        right: -20px; }
  .landing > .third > .wrap {
    padding-top: 300px;
    padding-bottom: 50px;
    margin: 0 auto;
    width: 800px;
    position: relative; }
    .landing > .third > .wrap > .text {
      font-weight: 200;
      position: absolute;
      right: 0;
      top: 100px; }
      .landing > .third > .wrap > .text > .title {
        font-size: 40px;
		font-weight: 400;		}
      .landing > .third > .wrap > .text > .description {
        font-size: 16px;
        margin-top: 30px;
        font-weight: 400; }
    .landing > .third > .wrap > img {
      position: absolute;
      top: 120px;
      left: 0; }
  .landing > .fourth {
    background: #ffffff; }
    .landing > .fourth > .wrap {
      padding-top: 120px;
      padding-bottom: 150px;
      margin: 0 auto;
      width: 1000px;
      position: relative; }
      .landing > .fourth > .wrap > .text {
        font-weight: 200; }
        .landing > .fourth > .wrap > .text > .title {
          font-size: 40px;
		  font-weight: 400;		  }
        .landing > .fourth > .wrap > .text > .description {
          font-size: 16px;
          margin-top: 30px;
          font-weight: 400; }
      .landing > .fourth > .wrap > img {
        position: absolute;
        top: 120px;
        right: -20px; }
  .landing > .fifth > .wrap {
    padding-top: 300px;
    padding-bottom: 100px;
    margin: 0 auto;
    width: 1000px;
    position: relative; }
    .landing > .fifth > .wrap > .text {
      font-weight: 200;
      position: absolute;
      right: 0;
      top: 120px; }
      .landing > .fifth > .wrap > .text > .title {
        font-size: 40px;
		font-weight: 400; }
      .landing > .fifth > .wrap > .text > .description {
        font-size: 16px;
        margin-top: 30px;
        font-weight: 400; }
    .landing > .fifth > .wrap > img {
      position: absolute;
      top: 100px;
      left: 0; }
  .landing > .usage {
    background: #ffffff;
    padding: 100px 0; }
    .landing > .usage > .wrap {
      width: 1000px;
      margin: 0 auto; }
      .landing > .usage > .wrap > .title {
        text-align: center;
        font-size: 40px;
        margin-bottom: 30px;
        font-weight: 400; }
      .landing > .usage > .wrap .grid .column {
        padding-right: 10px;
        padding-bottom: 10px; }
        .landing > .usage > .wrap .grid .column .wrap {
          background: #ffffff;
          border: 1px solid #d8e5e7; }
          .landing > .usage > .wrap .grid .column .wrap .title {
            padding: 15px;
            border-bottom: 1px solid #d8e5e7;
            font-size: 18px; }
          .landing > .usage > .wrap .grid .column .wrap .list {
            padding: 15px;
            line-height: 30px;
            background: #f9fbfb; }
            .landing > .usage > .wrap .grid .column .wrap .list li a {
              cursor: pointer;
              vertical-align: middle;
              font-size: 14px; }
            .landing > .usage > .wrap .grid .column .wrap .list li:before {
              content: "·";
              font-size: 20px;
              margin-right: 10px;
              line-height: 30px;
              vertical-align: middle; }
      .landing > .usage > .wrap .float-video-wrap {
        position: fixed;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.3);
        z-index: 100; }
        .landing > .usage > .wrap .float-video-wrap .wrap {
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translateX(-50%) translateY(-50%); }

.signup-container {
  width: 800px;
  height: 850px;
  margin: 0 auto;
  margin-top: 100px;
  color: #37454a; }
  .signup-container .signup-title1 {
    margin:0 0 15px 0;
    font-size: 26px;
    text-align: center;
    color:#718c96}
  .signup-container .signup-title2 {
    margin: 0;
    font-size: 40px;
    text-align: center;
    cursor:pointer;
    color: #000;
  }
  .signup-container .controls {
    width: 800px;
    margin: 0 auto;
    margin-top: 50px;
    background: #fff;
    padding: 80px 50px;
    border-radius: 0;
    /* box-shadow: 0px 2px 10px 0px #edeff1; */
    border: 1px solid #dae6e8;
  }
  .signup-container .controls .section-shop {
    margin-bottom: 20px;
    width: 450px;
    margin: 0 auto;
  }
    .signup-container .controls .type {
      margin-top: 8px;
      color: white;
      appearance: none;
      box-shadow: none;
      border-radius: 2px;
      border: none;
      background: #227eff;
      cursor: pointer;
      padding: 20px 40px 20px;
      line-height: 20px;
      height: 110px;
      cursor: pointer;
    }
      .signup-container .controls .type .inner-text1 {
        font-size: 20px;}
      .signup-container .controls .type .inner-text2 {
        font-size: 12px;
        padding-top: 10px;}
    .signup-container .controls .step-title {
      text-align: center;
      font-size: 26px;
      font-weight: 600;
      position: relative;
      width: fit-content;
      margin: 0 auto;
      margin-bottom: 50px; }

    .signup-container .controls .step-title span.line {
      background: #227eff;
      width: 100%;
      height: 13px;
      position: absolute;
      bottom: -5px;
      left: 0;
      opacity: 0.3;
    }

    .signup-container .controls .agreements {
      margin: 30px 0; }
      .signup-container .controls .agreements a.show-content {
        float: right;
        color: #bbc4c8;
        text-decoration: underline; }
    .signup-container .controls .ui.field {
      position: relative;
      margin: 0.6em 0; }
    .signup-container .options {
      margin-top:20px; text-align:center}
    .signup-container .options a {
      /*font-size:14px;*/ color:#969ea0; text-decoration:underline; font-weight:bold}
      .ui-field-tit {font-size:16px; font-weight:bold; color:#8ba0a8; margin:30px 0 10px 0;}
      .ui-field-tit.first {margin-top:0;}
      .ui-field-select .frm_select {width:100%; height:48px;border: 1px solid #d9e6e8;}
      .ui-field-select .frm_select select {height:46px;
    	background-image: url(/resources/static/img/icon/ic_frm_arrow-177b976353957143b1caa18b825bf461.png);
    	background-repeat: no-repeat;
		background-position: 95% 50%;
		padding: 0.67857143em 1em;}
	  .ui-field-dropdown-check {
	    position:relative;
	    }
	  .ui-field-dropdown-check .ui.dropdown-check {
	 	width: 100%;
   		height: 48px;
   		background: #fff;
    	border: 1px solid #d9e6e8;}
   	  .ui-field-dropdown-check .ui.dropdown-check .text {
   	  	line-height: 48px;
    	width: calc(100% - 35px);
    	font-size: 13px;
    	padding-left: 13px;}
      .ui-field-dropdown-check .ui.dropdown-check .dropdown-items-wrap {
      	width: 100%;
    	left: 0;
      	top:47px;
    	}
      .ui.field .ui.tags {margin-top:6px}
      .signup-container .controls .ui.field input {
        width: 100%; }
    .signup-container .ui.checkbox{display:block;}
    .signup-container .ui.field .tags {
      padding: 16px;
      background: #f9f9fb;
      width: 100%;
      border-radius: 4px;
      margin: 10px 0;
      display: block;
      align-items: center;
    }
    .signup-container .controls .error {
      padding-top: 5px;
      color: #ff8585;
      /*display: block;*/ }
    .signup-container .controls .phone-number {
      width: 60%; }
    .signup-container .controls .request-phone-authorization {
      position: absolute;
      top: 16px;
      right: 12px;
      color: inherit;
      font-size: 12px;
      font-weight: bold;
      text-decoration: underline; }
    .signup-container .controls .ui.field.address-container {
      margin-top: 30px;
      text-align: center; }
      .signup-container .controls .ui.field.address-container a {
        color: #37454a;
        text-decoration: underline;
        font-weight: 600; }
    .signup-container .controls .ui.field.image-container {
      margin-top: 30px;
      margin-bottom: 50px; }
      .signup-container .controls .ui.field.image-container img {
        width: 120px;
        height: 120px;
        border: 1px solid #d9e6e8; }
      .signup-container .controls .ui.field.image-container .options {
        display: inline-block;
        vertical-align: top;
        margin-left: 20px;
        margin-top: 30px;
        text-align: left;
        font-size: 12px;
      }
        .signup-container .controls .ui.field.image-container .options .item {
          display: block;
          margin: 10px 0;
          color: #37454a;
          text-decoration: underline;
          font-weight: 600; }
    .signup-container .controls .ui.field.find-shop {
      margin: 30px 0; }
      .signup-container .controls .ui.field.find-shop .text {
        text-align: center; }
        .signup-container .controls .ui.field.find-shop .text .number-of-shops {
          margin-bottom: 20px;
          font-weight: bold; }
        .signup-container .controls .ui.field.find-shop .text .description {
          margin-bottom: 20px;
          color: #207eff;
          font-size: 12px;
          line-height: 18px;
        }

      .signup-container .controls .ui.field.find-shop .items {
        min-height: 200px;
        height: 200px;
        padding: 0;
        margin: 0;
        background: #ffffff;
        border: 1px solid #d9e6e8;
        list-style: none;
        overflow-y: hidden; }
        .signup-container .controls .ui.field.find-shop .items .item {
          position: relative;
          min-height: 60px;
          padding: 10px;
          display: block;
          position: relative;
          cursor: pointer; }
        .signup-container .controls .ui.field.find-shop .items .item .thumbnail {
          border: 0px;
          width:40px;
          height:40px;
          display:inline-block;}
          .signup-container .controls .ui.field.find-shop .items .item:not(:last-child) {
            border-bottom: 1px solid #eff5f7; }
          .signup-container .controls .ui.field.find-shop .items .item.selected .dimmer {
            display: block;
            border: 2px solid #207eff;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 20px;
            color: #207eff; }
          .signup-container .controls .ui.field.find-shop .items .item .left1 {
            float: left; }
          .signup-container .controls .ui.field.find-shop .items .item .left2 {
            float: left;
            margin-left: 10px;
            max-width: 170px; }
            .signup-container .controls .ui.field.find-shop .items .item .left2 .shop-name {
              font-size: 12px;
              text-align: left;
              font-weight: bold; }
            .signup-container .controls .ui.field.find-shop .items .item .left2 .address {
              margin-top: 5px;
              margin-bottom: 10px;
              font-size: 12px;
              text-align: left; }
          .signup-container .controls .ui.field.find-shop .items .item .right {
            float: right; }
            .signup-container .controls .ui.field.find-shop .items .item .right .owner-name {
              margin-top: 10px;
              font-size: 12px;
              text-align: right;
              font-weight: bold;
              color: #718c96; }
          .signup-container .controls .ui.field.find-shop .items .item .dimmer {
            display: none;
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            background: rgb(52 53 53 / 22%);
            text-align: center; }
            .signup-container .controls .ui.field.find-shop .items .item .dimmer .icon-check {
              display: block;
              position: absolute;
              left: 50%;
              top: 50%;
              margin-left: -12px;
              margin-top: -9px;
              color: #3fd2d1; }
      .signup-container .controls .ui.field.find-shop .more {
        text-align: center;
        color: #c2d1d3;
        background: #f7f9fb; }

.ui.modal.service-agreement .body, .ui.modal.private-privacy-agreement .body {
  padding-bottom: 20px; }
.ui.modal.service-agreement .content-wrap, .ui.modal.private-privacy-agreement .content-wrap {
  margin: 20px;
  margin-bottom: 0; }
  .ui.modal.service-agreement .content-wrap .content, .ui.modal.private-privacy-agreement .content-wrap .content {
    height: 280px;
    overflow: scroll;
    line-height:14px; }

.ui.modal.select-shop-confirm .text {
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px; }

.find-id-complete .found-id {
  color: #227EFF; }
.find-id-complete .buttons {
  margin-top: 40px; }
  .find-id-complete .buttons .ui.button {
    margin-top: 5px; }

.navbar {
  font-weight: 500;
  position: static;
  background-color: #ffffff; }
.navbar.full {
  position: sticky;
  top: 0;
  z-index: 99;
}
  .navbar .wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 1140px;
    margin: 0 auto; }
  .navbar.full .wrap {
    width: 100%;
    padding: 4px 32px;
    gap: 20px;
  }
  .navbar .wrap > div {
    display: flex;
    align-items: center; }
    .navbar .wrap .title-logo {
      width: 160px;
      padding: 10px 0;
      text-align: center;
      font-weight: bold;
      font-size: 12px;
      display: inline-block;
      border: 1px solid #d9e6e8;
      border-collapse: collapse;
      border-top: 0;
      border-bottom: 0;
      color: #acb6ba; }
    .navbar .wrap .navbar-title-icon {
      margin-right: 8px;}
    .navbar .wrap .navbar-title {
      font-size: 16px;
      font-weight: 700;
      color: var(--grayscale-gray-700);
    }
    .navbar.full .wrap .mypage-link {
      font-size: 12px;
      line-height: 18px;
      color: var(--grayscale-gray-700);
      font-weight: 500;
      letter-spacing: initial;
      padding: 3px 16px;
      border: 1px solid var(--grayscale-gray-100);
      border-radius: 100px;
    }
    .navbar.full .wrap .gongbiz-store {
      display: flex;
      align-items: center;
      padding: 3px 16px;
      height: 28px;
      border: 1px solid var(--color-primary-100);
      border-radius: 100px;
      background-color: var(--color-primary-100);
    }
    .navbar.full .wrap .gongbiz-store:hover {
      border: 1px solid var(--color-primary-300);
    }
    .navbar.full .wrap .divider {
      height: 20px;
      width: 1px;
      background: var(--color-gray-100);
      margin: 0 4px;
    }
    .navbar .wrap ul.menu {
      display: flex;
      align-items: center;
      padding-right: 20px;
      padding-top: 10px;
      padding-bottom: 10px;
      font-size: 11px; }
    .navbar.full .wrap ul.menu {
      padding-right: 0;}
      .navbar .wrap ul.menu li {
        margin-right: 8px;
        display: inline-block;
        word-break: keep-all;

      }
        .navbar .wrap ul.menu li a {
          color: #acb6ba; }
        .navbar .wrap ul.menu li:last-child {
          margin-right: 0; }
        .navbar .wrap ul.menu li.active a {
          color: #227EFF; }
        .navbar .wrap ul.menu li.payment-link.active a {
          color:#222222;
          font-weight:500;
        }

.menu-alarm {position:relative; display: inline-block; margin-left: 8px; padding: 3px; border: 1px solid var(--grayscale-gray-100); border-radius: 50%; cursor: pointer; /*border-right:1px solid #d9e6e8; border-left:1px solid #d9e6e8;*/ background: #f9f9fb;}
.menu-alarm.active { background-color: var(--primary-300); border-color: var(--primary-300); }
.menu-alarm.hidden { display: none; }
.menu-alarm .bell-icon { display: inline-block; width: 20px; height: 20px; vertical-align: text-top; }
.menu-alarm.active .bell-icon { filter: invert(100%); }
.menu-alarm .alarm-btn {padding:0 15px 2px 15px; height:32px; font-size:13px; font-weight:bold; color:#292f33; cursor:pointer;}
/*.menu-alarm .alarm-numwrap {position:absolute; top:25px; left:0; z-index:110; width:100%; text-align:center; }*/
.menu-alarm .alarm-numwrap {position:absolute; top: 10px; right: 10px; z-index:110; width: 5px; height: 5px; border-radius: 50%; }
.menu-alarm .alarm-numwrap i.blt_new {background-color: #227eff; display: block; width: 100%; height: 100%; border-radius: 50%;}
.menu-alarm .alarm-num {color:#fff; font-weight:bold; padding:1px 9px 2px 9px; font-size:10px; line-height:18px; border-radius:10px; letter-spacing:0;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#5edddf+0,0d96d9+100 */
background: #FF0000; /* Old browsers */
/*background: -moz-linear-gradient(top,  #5edddf 0%, #0d96d9 100%);*/ /* FF3.6-15 */
/*background: -webkit-linear-gradient(top,  #5edddf 0%,#0d96d9 100%);*/ /* Chrome10-25,Safari5.1-6 */
/*background: linear-gradient(to bottom,  #5edddf 0%,#0d96d9 100%);*/ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5edddf', endColorstr='#0d96d9',GradientType=0 );*/ /* IE6-9 */
}
.notifications-area {
  position: fixed;
  top: 50px;
  right: 20px;
  z-index: 100;
  background: var(--background-200);
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  padding: 20px; }

.main-container {
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0 auto; }
  .main-container > .sidebar {
    font-weight: 500;
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 240px;
    width:240px;
    color: var(--grayscale-white);
    background-color: var(--grayscale-gray-700); }
  .main-container > .sidebar .sidebar-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    overflow-y: auto; }
    .main-container > .sidebar .profile {
      display: flex;
      flex-direction: column;
      position: relative;
      margin: 0 20px 16px 20px; }
      .main-container > .sidebar .profile .background {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: -1; }
        .main-container > .sidebar .profile .background img {
          width: 180px;
          height: 150px; }
        .main-container > .sidebar .profile .background.no-image {
          background: var(--grayscale-gray-700);
          /* For browsers that do not support gradients */
          /*background: -webkit-linear-gradient(left, #3fdcdb, #4ab0e3);*/
          /* For Safari 5.1 to 6.0 */
          /*background: -o-linear-gradient(right, #3fdcdb, #4ab0e3);*/
          /* For Opera 11.1 to 12.0 */
          /*background: -moz-linear-gradient(right, #3fdcdb, #4ab0e3);*/
          /* For Firefox 3.6 to 15 */
          /*background: linear-gradient(to right, #3fdcdb, #4ab0e3);*/
          /* Standard syntax */ }
        .main-container > .sidebar .profile .space-between {
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          align-items: center;
        }
        .main-container > .sidebar .profile .space-between > *:nth-child(1) {
          min-width: 70px;
          flex-grow: 1;
          font-weight: 500;
          text-align: left;
        }
        .main-container > .sidebar .profile .space-between > *:nth-child(2) {
          width: 50px;
          flex-grow: 2;
          font-weight: 400;
          text-align: left;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
        }
        .main-container > .sidebar .profile .shop-container {
          position: relative;
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-top: 20px;
          gap:24px;
        }
      .main-container > .sidebar .profile .shop-name {
        display: block;
        color: var(--primary-300);
        font-size: 16px;
        font-weight: 700;
        line-height: 24px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden; }
      .main-container > .sidebar .setting-icon-container {
        position: relative;
        display: inline-block;
      }

      .main-container > .sidebar .profile-info-wrapper {
        display:flex;
        flex-direction:column;
        width:100%;
        gap:4px;
        margin-top:10px;
      }
      .main-container > .sidebar .profile .owner-container {
      }
      .main-container > .sidebar .profile .owner {
        font-size: 14px;
        white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis; }
      .main-container > .sidebar .profile .divider {
        height: 1px;
        margin-top: 10px;
        background: rgba(0, 0, 0, 0.1); }
      .main-container > .sidebar .profile .members {
        display: flex;
        justify-content: space-between;
        padding: 10px 20px;
        color: #ffffff; }
        .main-container > .sidebar .profile .members .label {
          line-height: 16px;
          font-size: 12px; }
        .main-container > .sidebar .profile .members .thumbnails {
          display: inline-block;
          vertical-align: middle;
          margin-left: 15px; }
          .main-container > .sidebar .profile .members .thumbnails .item {
            display: inline-block; }
            .main-container > .sidebar .profile .members .thumbnails .item img {
              width: 24px;
              height: 24px;
              margin-left: -10px;
              border-radius: 50%;
              border: 1px solid #ffffff; }
        .main-container > .sidebar .profile .members .count {
          float: right;
          font-family: 'Segoe UI';
          font-size: 12px; }
          .main-container > .sidebar .profile .members .count img {
            margin-left: 5px; }
    .main-container > .sidebar .action-album {
      display: block;
      margin: 4px 0;
      padding: 15px 20px;
      background: #f9f9fb;
      color: #718c96;
      font-size: 13px;
      font-weight: bold;
      border: 1px solid #e4e8ec;
      border-collapse: collapse; }
      .main-container > .sidebar .action-album i {
        float: right; }

      .main-container > .sidebar .message-container {
        text-align: center;
        font-size: 14px;
      }
      .main-container > .sidebar .message-container .message-link {
        display: inline-block;
        padding: 3px 16px;
        font-size: 14px;
        color: var(--grayscale-white);
        border: 1px solid var(--grayscale-white);
        border-radius: 100px;
        cursor: pointer;
        line-height: 20px;
      }

      .main-container > .sidebar .profile .message-text-link {
        text-decoration: underline;
        color:var(--color-gray-white);
        font-size:inherit;
        font-weight:inherit;
        line-height: inherit;
      }
    .main-container > .sidebar .menu {
      position: relative;
      border-collapse: collapse; }
      .main-container > .sidebar .menu .list {
        width: calc(100% - 16px);
        margin: 0 auto;
        font-size: 12px;
        padding-right:0!important;}
        .main-container > .sidebar .menu .list li {
          position: relative;
          margin-top: 4px; }
          .main-container > .sidebar .menu .list li.header {
            margin: 8px 0;}
          .main-container > .sidebar .menu .list li.header.active {
            margin-bottom: 12px;
          }
          .main-container > .sidebar .menu .list li a {
            display: flex;
            font-size: 14px;
            padding: 8px 0 8px 12px;
            border-radius: 8px;
            color: var(--grayscale-white);
            align-items: center;
            gap: 8px;
          }
          .main-container > .sidebar .menu .list li.header > a::after {
            content: '';
            display: inline-block;
            position: absolute;
            top: 50%;
            right: 10px;
            transform: translate(0, -50%);
            width: 20px;
            height: 20px;
            background-image: url('/resources/static/img/figma/icon-chevron-white-99e51575095b21a2b6ac03f7907d4efa.svg');
            background-repeat: no-repeat;
            background-position: center;
          }
          .main-container > .sidebar .menu .list li.header:not(.active) > ul {
            display: none;
          }
          .main-container > .sidebar .menu .list li.header > a {
            position: relative;
            border: 1px solid transparent;
            margin-bottom: 8px;
            padding-top: 12px;
            padding-bottom: 12px;}
          .main-container > .sidebar .menu .list li.active > a {
            background: var(--grayscale-gray-600); }
          .main-container > .sidebar .menu .list li:not(.current-tab) a:hover {
            background-color: var(--grayscale-gray-600);
            text-decoration: none;}
          .main-container > .sidebar .menu .list li.header.current-tab:not(.active) > a {
            border: 1px solid var(--primary-300);}
          .main-container > .sidebar .menu .list li.header.active > a::after {
            transform: translate(0  , -50%) rotate(90deg);}
          .main-container > .sidebar .menu .list li:not(.header).active a {
            background-color: var(--primary-300);}
            .main-container > .sidebar .menu .list li.active a {
              color: var(--grayscale-white);}
            .main-container > .sidebar .menu .list li.active a:hover {
              color: var(--grayscale-white);}
        .main-container > .sidebar .menu .list .header {
          font-size: 16px;
        }
          /* 210504 공비서 예약서비스 new 아이콘 추가 */
          .main-container > .sidebar .menu .list .list-new {
            display:flex;
            align-items:center;
          }
          .main-container > .sidebar .menu .list .list-new img {
            margin-left: 5px;
          }
          .main-container > .sidebar .sidebar-bottom-container {
            display: flex;
            width: 100%;
            padding: 20px;
          }
          .main-container > .sidebar .sidebar-bottom-container .promotion-banner-swiper {
            height: 122px;
          }
          .main-container > .sidebar .sidebar-bottom-container .swiper-slide {
            border-radius: 8px;
            overflow: hidden;
            height: 122px;
          }
          .main-container > .sidebar .sidebar-bottom-container .swiper-pagination {
            text-align: start;
            left: 18px;
            bottom: 20px;
          }
          .main-container > .sidebar .sidebar-bottom-container .swiper-pagination .swiper-pagination-bullet {
            background: transparent;
            border: 1px solid var(--color-gray-100);
            width: 6px;
            height: 6px;
            opacity: 40%;
            margin: 0 2px;
          }
          .main-container > .sidebar .sidebar-bottom-container .swiper-pagination .swiper-pagination-bullet-active {
            background: var(--color-gray-100);
            width: 6px;
            height: 6px;
            opacity: 40%;
            margin: 0 2px;
          }
            /*        */
  .main-container > .content-container {
    display: flex;
    width: 100%;
    flex-direction: column;
    overflow-y: auto;
  }
  .main-container > .content-container > .content {
    width: 100%;
    margin: 0 auto;
    padding-top: 30px;
    overflow-x: auto;
     }
    .content.pop-area-wrap {
    width:880px; margin:25px auto 85px;}
    .content.pop-area-wrap .wrap {
      padding-bottom: 70px;
    }
    .main-container > .content-container > .content > .page {
      width: 950px;
      margin: 0 auto 30px auto; }
    .main-container > .content-container > .content > .page.page--container-1140 {
      width: 1140px;
    }
      .main-container > .content-container > .content > .page > .page-top-menu-wrap,
      .main-container .content .page .page-content-wrap .page-top-menu-wrap {
        /*height: 80px 20200401 daeun*/
        position:relative;
        width:100%;
        margin-bottom:40px;
        display:inline-block
      }
        .main-container > .content-container > .content > .page > .page-top-menu-wrap .left,
        .main-container .content .page .page-content-wrap .page-top-menu-wrap .left {
          width:100%;
          display:flex;
          align-items: center;
          height: 42px;
        }
          .main-container > .content-container > .content > .page > .page-top-menu-wrap .left .page-title,
          .main-container .content .page .page-content-wrap .page-top-menu-wrap .page-title {
            float:left;
            display: inline-block;
            font-size: 24px;
            font-weight: bold;
          }
          .main-container > .content-container > .content > .page > .page-top-menu-wrap .left .page-text, .warning-box-to-update {
            padding: 8px 12px;
            font-weight: 500;
            font-size: 14px;
            background-color: var(--color-red-100);
            border-radius: 8px;
           }
          .main-container > .content-container > .content > .page > .page-top-menu-wrap .left .page-text {
            margin-left: 8px;
          }
          .main-container > .content-container > .content > .page > .page-top-menu-wrap .left .page-text span, .warning-box-to-update .highlight {
            color: var(--color-red-300);
          }
          .cust-search-bar,
          .main-container > .content-container > .content > .page > .page-top-menu-wrap .right,
          .main-container .content .page .page-content-wrap .page-top-menu-wrap right {
            position:absolute; top:0; right:0;
          }
      .main-container > .content-container > .content > .page > .page-content {
      	position:relative
      }
      .page-content-header-wrap {
        height: 50px;
        padding-top: 10px;
        font-size: 18px;
        /*overflow: hidden;*/
        display:inline-block;
        width:100% }
        .page-content-header-wrap.type02 {
            position: absolute;
		    top: 0;
		    right: 0;
        }
        .page-content-header-wrap .left {
          float: left;
          color: #37454a; }
        .page-content-header-wrap .left .label {
            margin-left: 10px; }
        .page-content-header-wrap .subtxt {
        	color:#9FA1A4;
        	font-size:12px;
        }
        .page-content-header-wrap .subtxt p {
        	padding:5px 0;
        	margin:0;
        }
        .page-content-header-wrap .subtxt p:first-child {padding-top:0;}
        .page-content-header-wrap .subtxt p:last-child {padding-bottom:0;}
        .page-content-header-wrap .right {
          float: right;
          color: #37454a; }
        .page-content-header-wrap .right .label {
            margin-left: 10px; }
      .main-container > .content-container > .content > .page > .page-content > .pagination {
        margin-top: 20px;
        margin-bottom: 30px; }

.footer {
  width: 100%;
  height: 140px;
  padding-top: 30px;
  padding-bottom: 10px;
  background-color: #f7f7fb;
  font-size: 12px;
  border-top: 1px solid #efeff1; }
  .footer .wrap {
    /*padding-left: 30px;*/
    width: 1140px;
    margin: 0 auto;
    position: relative; }
    .footer .wrap ul {
      margin: 20px 0;
      color: #969ea1; }
      .footer .wrap ul li {
        display: inline;
        position: relative;
        margin-right: 28px; }
        .footer .wrap ul li a {
          text-decoration: none;
          color: #969ea1; }
        .footer .wrap ul li :after {
          position: absolute;
          right: -18px;
          top: 4px;
          bottom: 1px;
          width: 1px;
          content: " ";
          background: #d4d9d9; }
        .footer .wrap ul li:last-child :after {
          width: 0; }
    .footer .wrap .second li {
      margin-right: 20px; }
      .footer .wrap .second li :after {
        right: -14px; }

    /* footer SNS */
    .footer .wrap .customer-link {position: absolute; left:360px; top: -25px;}
    .footer .wrap .customer-link li {display: inline-block; vertical-align: middle; margin-right: 10px;}
    .footer .wrap .customer-link li :after {display: none;}
    .footer .wrap .customer-link li a { display: block; width: 22px; height: 22px; background: url(/resources/static/assets/img/common/ic_foot_sns2-826bdd8030a2c1b4c5c5086c5f0c2d37.png) no-repeat; text-indent: -500em;}
    .footer .wrap .customer-link li a.instagram {background-position: -22px 0;}
    .footer .wrap .customer-link li a.facebook {background-position: 0 0;}
    .footer .wrap .customer-link li a.blog {background-position: -44px 0;}

.close-button-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url('/resources/static/img/figma/icon-round-x-c0f4af470cddc4c452179ae59c1c5524.svg');
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 100%;
  cursor: pointer;
}

.notifications.new-area {right:0 !important; border:none; width:auto; position:relative; }
.notifications.new-area > .header { margin-bottom: 20px; }
.notifications.new-area > .header .title { font-size: 14px; line-height: 20px; font-weight: 700; color: var(--grayscale-gray-700); }
.notifications.new-area > .content {margin-left:0;}
.notifications {
  width: 5px;
  height:100%; /* 2018-10-10 dehwang*/
  position: absolute;
  right: 0;
  top: 0; /* 2018-10-10 dehwang*/
  bottom:0; /* 2018-09-13 dehwang */
  /*bottom: 140px;*/
  border-left: 1px solid #cddddf;
  z-index: 100; }
.notifications #noti-pagination {
  position: relative;
  margin-top: 20px;
  width: 260px;
}
#noti-pagination .pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#noti-pagination .pagination .item {
  margin: 0;
}
#noti-pagination .pagination .paging-index-group {
  display: flex;
  align-items: center;
  gap: 12px;
}
#noti-pagination .pagination .paging-index-group .item {
  width: 20px;
  height: 20px;
  font-size: 14px;
  line-height: 20px;
  color: var(--grayscale-gray-300);
  text-align: center;
}
#noti-pagination .pagination .paging-index-group .item.active {
  color: var(--grayscale-gray-700);
}
.notifications > .opener {
  width: 12px;
  height: 50px;
  position: fixed;
  top: calc(50% - 50px);
  /*left: -12px;*/
  right:4px;
  background: #f7f9fb;
  border-left: 1px solid #cddddf;
  border-top: 1px solid #cddddf;
  border-bottom: 1px solid #cddddf;
  cursor: pointer; }
.notifications > .opener .float.button {
  width: 60px;
  height: 60px;
  position: absolute;
  left: -70px;
  top: -5px;
  background: #5ee4e2;
  border-radius: 50%;
  text-align: center; }
.notifications > .opener .float.button .badge {
  display: inline-block;
  width: 20px;
  height: 20px;
  position: absolute;
  right: -3px;
  top: -3px;
  padding: 3px;
  color: #ffffff;
  border-radius: 50%;
  background: #fc6063; }
.notifications > .opener .float.button img {
  margin-top: 18px; }
.notifications > .opener .icon-chevron-left-light-blue, .notifications > .opener .icon-chevron-right-light-blue {
  margin-top: 18px;
  color: #cddddf; }
.notifications > .opener .icon-chevron-left-light-blue {
  margin-left: 3px;
  display: none; }
.notifications > .opener .icon-chevron-right-light-blue {
  margin-left: 4px;
  display: inline-block; }
.notifications.open {
  right: 260px;
  /*border-right: 1px solid #cddddf;*/ }
.notifications.open .opener {
  right:264px;
}
.notifications.open .content {
  display: block; }
.notifications.open .icon-chevron-left-light-blue {
  display: inline-block; }
.notifications.open .icon-chevron-right-light-blue {
  display: none; }
.notifications > .content {
  display: none;
  width: 260px;
  height:100%;
  margin-left: 4px; }
.notifications .content-area {
  width:100%;
  top:0 !important;
  overflow: hidden;
  padding: 0;
  height: auto;
}
.notifications > .content .items {
  list-style: none;
  margin: 0;
  padding: 0; }
.notifications > .content .items .item {
  margin: 0 0 8px 0;
  padding: 16px;
  background: #ffffff;
  border-radius: 8px;
  filter: drop-shadow(0px 3px 3px rgba(34, 126, 255, 0.1)); }
.notifications > .content .items .item .action {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: none;
  cursor:pointer; }
.notifications > .content .items .item .action .header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.notifications > .content .items .item .action .header .title {
  max-width: calc(100% - 30px);
  font-weight: 500;
  display: -webkit-box;
  word-wrap: break-word;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
}

.notifications > .content .items .item .action .header .title i.icon {
  vertical-align: top;
  margin-right: 4px;
}

.notifications > .content .items .item .action .content {
  color: var(--grayscale-gray-700) !important;
  display: -webkit-box;
  word-wrap: break-word;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
}
.notifications > .content .items .item .action .header .close-button-icon {
  width: 20px;
}
.notifications > .content .items .item .action .header .close-button-icon.hidden {
  display: none;
}
.notifications > .content .items .item.yellow .title {
  color: #efbc79; }
.notifications > .content .items .item.blue .title {
  color: var(--primary-300); }
.notifications > .content .items .item.purple .title {
  color: var(--secondary-300); }
.notifications > .content .items .item.green .title {
  color: #48d2d0; }
.notifications > .content .items .item.red .title {
  color: var(--red-300); }
.notifications > .content .items .item.gray .title {
  color: var(--grayscale-gray-700); }
.notifications > .content .items .item.naver .title {
  color: #26b30e; }
.notifications > .content .items .item.zero-b2c .title {
  color: var(--color-secondary-300) }

/* S : B2C 예약서비스 알림박스 추가 */
/*.notifications > .content .items .item.pink {*/
/*  background: #FFF9E4; }*/
.notifications > .content .items .item.pink .title {
  color: #FE556F; }
/* E : B2C 예약서비스 알림박스 추가 */

.notifications > .content .items .item .close-wrap {
  text-align: right; }
.notifications > .content .items .item .text {
  max-width: 245px;
  font-size:13px;
  margin-left: 10px;
  margin-right: 10px; }

.content .home .page-top-menu-wrap .left {
  /*margin-top: 10px;*/ }

.content .home .calendar .owner-color {
  color: #58e5e4; }
.content .home .calendar .member-color {
  color: #fff; }
.content .home .calendar .member1-color {
  color: #6ab9f1; }
.content .home .calendar .member2-color {
  color: #897bf6; }
.content .home .calendar .member3-color {
  color: #ffcf8b; }
.content .home .calendar .member4-color {
  color: #f16aa3; }
.content .home .calendar .member5-color {
  color: #ffae8b; }
.content .home .calendar .member6-color {
  color: #9be484; }
.content .home .calendar .summary-wrap {
  height: 80px;
  background: #ffffff; }
  .content .home .calendar .summary-wrap table .date {
    width: 80px;
    background: #90b0ce;
    color: #ffffff;
    text-align: center;
    border-bottom: 1px solid #90b0ce;
    font-size: 12px; }
    .content .home .calendar .summary-wrap table .date .day {
      font-weight: bold;
      font-size: 26px; }
  .content .home .calendar .summary-wrap table .information {
    padding-left: 20px;
    border-top: 1px solid #d9e6e8;
    border-bottom: 1px solid #d9e6e8; }
    .content .home .calendar .summary-wrap table .information .label {
      display: inline-block;
      margin-top: -5px;
      font-size: 16px;
      font-weight: bold; }
    .content .home .calendar .summary-wrap table .information .meta-items {
      display: inline-block;
      margin-left: 20px;
      color: #718c96; }
      .content .home .calendar .summary-wrap table .information .meta-items .item {
        display: inline-block; }
        .content .home .calendar .summary-wrap table .information .meta-items .item b {
          margin-left: 5px; }
        .content .home .calendar .summary-wrap table .information .meta-items .item:not(:first-child) {
          position: relative;
          margin-left: 20px; }
          .content .home .calendar .summary-wrap table .information .meta-items .item:not(:first-child):before {
            position: absolute;
            width: 1px;
            content: " ";
            left: -12px;
            top: 2px;
            bottom: 2px;
            background: #bbc4c8; }
  .content .home .calendar .summary-wrap table .action {
    width: 200px;
    padding-right: 30px;
    text-align: right;
    line-height: 78px;
    border-top: 1px solid #d9e6e8;
    border-right: 1px solid #d9e6e8;
    border-bottom: 1px solid #d9e6e8; }
    .content .home .calendar .summary-wrap table .action a {
      color: #000;
      /*text-decoration: underline;*/
      font-size: 14px;
      font-weight: 600; }
      .content .home .calendar .summary-wrap table .action a img {
        margin-left: 10px; }
.content .home .calendar .calendar-wrap {
  margin-top: 30px; }
  .content .home .calendar .calendar-wrap .year-month {
    margin-bottom: 15px;
    text-align: center; }
    .content .home .calendar .calendar-wrap .year-month i {
      display: inline-block;
      color: #caced4;
      cursor: pointer;
      line-height: 24px;
      vertical-align: top; }
    .content .home .calendar .calendar-wrap .year-month span {
      display: inline-block;
      margin-left: 10px;
      margin-right: 10px;
      font-size: 24px;
      font-weight: bold;
      line-height: 24px; }
  .content .home .calendar .calendar-wrap table.month-calendar {
    border: 1px solid #dae6e8;
    margin-bottom: 50px; }
    .content .home .calendar .calendar-wrap table.month-calendar > thead td.day-of-week {
      position: static;
      padding-left: 10px;
      padding-top: 9px;
      padding-bottom: 9px;
      color: #37454a;
      background-color: #f7fafb;
      border-right: 1px solid #f0f6f7; }
      .content .home .calendar .calendar-wrap table.month-calendar > thead td.day-of-week:last-child {
        border-right: 0; }
      .content .home .calendar .calendar-wrap table.month-calendar > thead td.day-of-week.holiday {
        color: #718c96; }
    .content .home .calendar .calendar-wrap table.month-calendar > tfoot {
      border-top: 1px solid #dae6e8; }
      .content .home .calendar .calendar-wrap table.month-calendar > tfoot .calendar-label {
        padding: 20px 20px;
        display: flex;
        justify-content: space-between; }
        .content .home .calendar .calendar-wrap table.month-calendar > tfoot .calendar-label ul {
          display: inline-block;
          /*margin-left: 20px;*/
          width: 798px;}
          .content .home .calendar .calendar-wrap table.month-calendar > tfoot .calendar-label ul li {
            display: inline-block;
            margin-right: 20px;
            line-height: 20px;}
        .content .home .calendar .calendar-wrap table.month-calendar > tfoot .calendar-label .title {
          font-weight: bold;
          color: #37454a;
          width: 75px;
          line-height: 20px;}
        .content .home .calendar .calendar-wrap table.month-calendar > tfoot .calendar-label .icon {
          display: inline-block;
          width: 10px;
          height: 10px;
          margin-right: 5px; }
        .content .home .calendar .calendar-wrap table.month-calendar > tfoot .calendar-label .name {
          color: #718c96; }
    .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week {
      position: relative;
      height: 110px; }
      .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > .background {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background: #ffffff; }
        .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > .background table {
          height: 100%; }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > .background table td {
            border-top: 1px solid #f0f6f7;
            border-right: 1px solid #f0f6f7; }
            .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > .background table td.today {
              background-color: #f9fbfb; }
            .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > .background table td:last-child {
              border-right: 0; }
      .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0; }
        .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content td {
          position: relative;
          height: 110px; }
        .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content div.ui.more {
          position: absolute;
          left: 1px;
          right: 0;
          bottom: -1px; }
        .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap {
          position: absolute;
          overflow: hidden;
          height: 110px;
          left: 1px;
          right: 0;
          top: 1px;
          bottom: 0; }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap.inactive {
            background-color: #e9ecef;
          }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap.today {
            background:#fff5c1}
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .background {
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0; }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .header:after {
            display: block;
            content: " ";
            clear: both; }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .header .day-number {
            display: block;
            font-weight: 200;
            margin: 5px 5px 3px 8px;
            float: left; }
            .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .header .day-number.inactive {
              color: #bec1c2; }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .header .day-holiday {
            float:left; margin:5px 5px 0 5px;
            color:#f41f1f; font-size:11px}
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .header .additional-bands {
            display: block;
            font-weight: 300;
            margin: 5px 5px 3px 5px;
            float: right;
            color: #227eff; }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .band {
            display: block;
            margin: 1px 3px;
            padding: 4px;
            color: black;
            font-weight: 200;
            font-size: 11px;
            cursor: pointer;
            z-index: 2; }
            .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .band b {
              margin-right: 2px; }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .summary {
            margin-top: 7px;
            margin-bottom: 7px;
            text-align: center;
            font-size: 12px;
            color: #37454a; }
            .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap .summary b {
              margin-left: 5px; }
          .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap.has-more:hover {
            left: 0px;
            right: -1px;
            bottom: initial;
            z-index: 1;
            border: 1px solid #cedddf;
            background: #ffffff;
            overflow: visible;
            height:auto;
            position: relative; }
            .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap.has-more:hover .day-number {
              margin-left: 8px;
              margin-top: 4px; }
            .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap.has-more:hover .additional-bands {
              display: none; }
            .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .bands-wrap.has-more:hover .band {
              margin-left: 3px;
              margin-right: 2px; }
        .content .home .calendar .calendar-wrap table.month-calendar > tbody div.week > table.week-content .ui.more {
          line-height: 9px; }

.content .home .dashboard {
  padding-bottom: 50px; }
  .content .home .dashboard .grid > .column {
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: 10px; }
    .content .home .dashboard .grid > .column:first-child {
      padding-left: 0px; }
    .content .home .dashboard .grid > .column:last-child {
      padding-right: 0px; }
    .content .home .dashboard .grid > .column .segmentation.with-header > .header {
      border-bottom: 1px solid var(--color-gray-100);
      background: var(--color-bg-100);
      color: var(--color-gray-700);
    }
.content .home .dashboard .grid > .column .segmentation.with-header > .header table {
  height:78px;
}
      .content .home .dashboard .grid > .column .segmentation.with-header > .header table .date {
        width: 78px;
        background: var(--color-primary-200);
        color: var(--color-gray-white);
        text-align: center;
      }
.content .home .dashboard .grid > .column .segmentation.with-header > .header table .year-month {
  font-size: var(--font-size-s);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-s);
}
        .content .home .dashboard .grid > .column .segmentation.with-header > .header table .date .day {
          font-size: var(--font-size-xxl);
          font-weight: var(--font-weight-bold);
          line-height: var(--line-height-xxl);
        }
      .content .home .dashboard .grid > .column .segmentation.with-header > .header table .information {
        padding-left: 20px;
      }
        .content .home .dashboard .grid > .column .segmentation.with-header > .header table .information .label {
          margin-bottom: 4px;
          font-size: var(--font-size-m);
          font-weight: var(--font-weight-bold);
          line-height: var(--line-height-m-20);
        }
        .content .home .dashboard .grid > .column .segmentation.with-header > .header table .information .description {
          font-size: var(--font-size-s);
          font-weight: var(--font-weight-medium);
          line-height: var(--line-height-s);
          color: var(--color-gray-500);
        }
          .content .home .dashboard .grid > .column .segmentation.with-header > .header table .information .description b {
            margin-left: 4px;
            font-weight: var(--font-weight-bold);
          }
      .content .home .dashboard .grid > .column .segmentation.with-header > .header table .emphasize {
        padding-right: 20px;
        text-align: right;
      }
      .content .home .dashboard .grid > .column .segmentation.with-header > .header table .emphasize .label {
        font-size: var(--font-size-s);
        font-weight: var(--font-weight-medium);
        line-height: var(--line-height-s);
        color: var(--color-gray-500);
        margin-right: 4px;
        vertical-align: middle;
      }
      .content .home .dashboard .grid > .column .segmentation.with-header > .header table .emphasize .price {
        font-size: var(--font-size-xl);
        font-weight: var(--font-weight-bold);
        line-height: var(--line-height-xl);
        vertical-align: middle;
      }

.content .home .dashboard .grid > .column .segmentation-body .detail-button {
  display:inline-flex;
  align-items: center;
  justify-content: center;
  height:24px;
  border-radius:24px;
  padding:0 12px;
  border:1px solid var(--color-gray-100);
  color:var(--color-gray-700);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
}
.content .home .dashboard .grid > .column .segmentation-body .detail-button:hover {
  border-color:var(--color-gray-300);
}
    .content .home .dashboard .grid > .column .segmentation .grid .column.section {
      padding: 30px 40px; }
    .content .home .dashboard .grid > .column .segmentation .grid.two.wide .column.section:first-child {
      padding-right: 20px; }
    .content .home .dashboard .grid > .column .segmentation .grid.two.wide .column.section:nth-child(2) {
      padding-left: 20px; }
    .content .home .dashboard .grid > .column .segmentation .title-wrap {
      height: 30px;
      margin-bottom: 10px; }
      .content .home .dashboard .grid > .column .segmentation .title-wrap > .title {
        float: left;
        color: #37454a;
        font-size: 15px;
        font-weight: bold; }
      .content .home .dashboard .grid > .column .segmentation .title-wrap > .action {
        float: right; }
        .content .home .dashboard .grid > .column .segmentation .title-wrap > .action > a {
          color: #000;
          font-weight: 300; }
          .content .home .dashboard .grid > .column .segmentation .title-wrap > .action > a > img {
            margin-left: 5px; }
  .content .home .dashboard .data dl, .content .home .dashboard .data dd {
    margin: 0;
    padding: 0; }
  .content .home .dashboard .data .fill.green {
    background: #5fe5e3; }
  .content .home .dashboard .data .fill.blue {
    background: #6dbaef; }
  .content .home .dashboard .data .fill.purple {
    background: #897ff3; }
  .content .home .dashboard .data .fill.orange {
    background: #fece8f; }

   .content .home .dashboard .data .fill.owner-color {
	  background: #58e5e4; }
	.content .home .dashboard .data .fill.member1-color {
	  background: #6ab9f1; }
	.content .home .dashboard .data .fill.member2-color {
	  background: #897bf6; }
	.content .home .dashboard .data .fill.member3-color {
	  background: #ffcf8b; }
	.content .home .dashboard .data .fill.member4-color {
	  background: #f16aa3; }
	.content .home .dashboard .data .fill.member5-color {
	  background: #ffae8b; }
	.content .home .dashboard .data .fill.member6-color {
	  background: #9be484; }

  .content .home .dashboard .data.member-sales {
    line-height: 40px;
    color: #37454a; }
    .content .home .dashboard .data.member-sales .item {
      padding: 10px 0;
      position: relative; }
      .content .home .dashboard .data.member-sales .item:first-child {
        padding-top: 0; }
      .content .home .dashboard .data.member-sales .item:last-child {
        padding-bottom: 0; }
      .content .home .dashboard .data.member-sales .item .thumbnail {
        width: 40px;
        height: 40px;
        float: left; }
      .content .home .dashboard .data.member-sales .item .name {
        margin-left: 10px;
        float: left; }
      .content .home .dashboard .data.member-sales .item .graph {
        width: 190px;
        height: 12px;
        position: relative;
        float: left;
        margin-top: 15px;
        margin-left: 10px; }
        .content .home .dashboard .data.member-sales .item .graph .background {
          width: 100%;
          position: absolute;
          left: 0;
          right: 0;
          top: 0;
          bottom: 0;
          background: #f5f7f7; }
        .content .home .dashboard .data.member-sales .item .graph .fill {
          position: absolute;
          left: 0;
          right: 0;
          top: 0;
          bottom: 0; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-0 {
            left: 0;
            right: 99%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-1 {
            left: 0;
            right: 99%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-2 {
            left: 0;
            right: 98%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-3 {
            left: 0;
            right: 97%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-4 {
            left: 0;
            right: 96%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-5 {
            left: 0;
            right: 95%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-6 {
            left: 0;
            right: 94%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-7 {
            left: 0;
            right: 93%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-8 {
            left: 0;
            right: 92%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-9 {
            left: 0;
            right: 91%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-10 {
            left: 0;
            right: 90%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-11 {
            left: 0;
            right: 89%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-12 {
            left: 0;
            right: 88%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-13 {
            left: 0;
            right: 87%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-14 {
            left: 0;
            right: 86%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-15 {
            left: 0;
            right: 85%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-16 {
            left: 0;
            right: 84%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-17 {
            left: 0;
            right: 83%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-18 {
            left: 0;
            right: 82%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-19 {
            left: 0;
            right: 81%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-20 {
            left: 0;
            right: 80%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-21 {
            left: 0;
            right: 79%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-22 {
            left: 0;
            right: 78%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-23 {
            left: 0;
            right: 77%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-24 {
            left: 0;
            right: 76%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-25 {
            left: 0;
            right: 75%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-26 {
            left: 0;
            right: 74%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-27 {
            left: 0;
            right: 73%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-28 {
            left: 0;
            right: 72%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-29 {
            left: 0;
            right: 71%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-30 {
            left: 0;
            right: 70%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-31 {
            left: 0;
            right: 69%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-32 {
            left: 0;
            right: 68%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-33 {
            left: 0;
            right: 67%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-34 {
            left: 0;
            right: 66%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-35 {
            left: 0;
            right: 65%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-36 {
            left: 0;
            right: 64%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-37 {
            left: 0;
            right: 63%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-38 {
            left: 0;
            right: 62%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-39 {
            left: 0;
            right: 61%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-40 {
            left: 0;
            right: 60%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-41 {
            left: 0;
            right: 59%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-42 {
            left: 0;
            right: 58%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-43 {
            left: 0;
            right: 57%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-44 {
            left: 0;
            right: 56%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-45 {
            left: 0;
            right: 55%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-46 {
            left: 0;
            right: 54%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-47 {
            left: 0;
            right: 53%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-48 {
            left: 0;
            right: 52%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-49 {
            left: 0;
            right: 51%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-50 {
            left: 0;
            right: 50%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-51 {
            left: 0;
            right: 49%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-52 {
            left: 0;
            right: 48%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-53 {
            left: 0;
            right: 47%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-54 {
            left: 0;
            right: 46%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-55 {
            left: 0;
            right: 45%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-56 {
            left: 0;
            right: 44%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-57 {
            left: 0;
            right: 43%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-58 {
            left: 0;
            right: 42%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-59 {
            left: 0;
            right: 41%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-60 {
            left: 0;
            right: 40%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-61 {
            left: 0;
            right: 39%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-62 {
            left: 0;
            right: 38%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-63 {
            left: 0;
            right: 37%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-64 {
            left: 0;
            right: 36%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-65 {
            left: 0;
            right: 35%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-66 {
            left: 0;
            right: 34%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-67 {
            left: 0;
            right: 33%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-68 {
            left: 0;
            right: 32%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-69 {
            left: 0;
            right: 31%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-70 {
            left: 0;
            right: 30%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-71 {
            left: 0;
            right: 29%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-72 {
            left: 0;
            right: 28%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-73 {
            left: 0;
            right: 27%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-74 {
            left: 0;
            right: 26%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-75 {
            left: 0;
            right: 25%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-76 {
            left: 0;
            right: 24%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-77 {
            left: 0;
            right: 23%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-78 {
            left: 0;
            right: 22%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-79 {
            left: 0;
            right: 21%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-80 {
            left: 0;
            right: 20%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-81 {
            left: 0;
            right: 19%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-82 {
            left: 0;
            right: 18%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-83 {
            left: 0;
            right: 17%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-84 {
            left: 0;
            right: 16%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-85 {
            left: 0;
            right: 15%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-86 {
            left: 0;
            right: 14%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-87 {
            left: 0;
            right: 13%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-88 {
            left: 0;
            right: 12%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-89 {
            left: 0;
            right: 11%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-90 {
            left: 0;
            right: 10%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-91 {
            left: 0;
            right: 9%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-92 {
            left: 0;
            right: 8%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-93 {
            left: 0;
            right: 7%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-94 {
            left: 0;
            right: 6%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-95 {
            left: 0;
            right: 5%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-96 {
            left: 0;
            right: 4%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-97 {
            left: 0;
            right: 3%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-98 {
            left: 0;
            right: 2%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-99 {
            left: 0;
            right: 1%; }
          .content .home .dashboard .data.member-sales .item .graph .fill.percentage-100 {
            left: 0;
            right: 0%; }
      .content .home .dashboard .data.member-sales .item .sales {
        margin-left: 10px;
        float: left; }
  .content .home .dashboard .table-wrap.each-customer table.outside {
    border-left: 0;
    border-right: 0; }
  .content .home .dashboard .table-wrap.each-customer .name {
    width: 100px; }
  .content .home .dashboard .table-wrap.each-customer .price {
    width: 100px; }
  .content .home .dashboard .table-wrap.noshow-customers table.outside {
    border-left: 0;
    border-right: 0; }
  .content .home .dashboard .table-wrap.today-new-customer table.outside {
    border-left: 0;
    border-right: 0; }
  .content .home .dashboard .table-wrap.today-new-customer .name {
    width: 100px; }
  .content .home .dashboard .table-wrap.today-new-customer .birthday {
    width: 100px; }
  .content .home .dashboard .table-wrap.today-purchase-product table.outside {
    border-left: 0;
    border-right: 0; }

.ui.modal.customer-chart .body {
  padding-top: 40px;
  background: #f7f9fb; }
  .ui.modal.customer-chart .body .name-wrap {
    margin-bottom: 15px;
    text-align: center;
    font-size: 32px;
    padding: 0 20px; }
    .ui.modal.customer-chart .body .name-wrap .name {
      position: relative;
      display: inline-block; }
      .ui.modal.customer-chart .body .name-wrap .name .customer-class {
        position: absolute;
        right: -14px;
        top: 0; }
  .ui.modal.customer-chart .body .phone-number {
    margin-bottom: 15px;
    text-align: center;
    font-size: 16px;
    padding: 0 20px; }
  .ui.modal.customer-chart .body .memo {
    margin-bottom: 15px;
    text-align: center;
    font-size:13px;
    color: #718c96;
    padding: 0 20px; }
  .ui.modal.customer-chart .body .detail {
    display: block;
    margin-bottom: 15px;
    font-size:14px;
    text-align: center;
    color: #227EFF;
    text-decoration: underline; }
    .ui.modal.customer-chart .body .detail img {
      margin-left: 10px; }
  .ui.modal.customer-chart .body .prepaid-wrap {
    text-align: center; }
    .ui.modal.customer-chart .body .prepaid-wrap .prepaid-block {
      display: inline-block;
      margin-right: 10px;
      padding: 12px 15px;
      color: #ffffff;
      background: #3f4d5e;
      border-radius: 3px;
      font-size: 14px; }
      .ui.modal.customer-chart .body .prepaid-wrap .prepaid-block .text {
        display: inline-block;
        margin-right: 25px; }
      .ui.modal.customer-chart .body .prepaid-wrap .prepaid-block .balance {
        display: inline-block;
        position: relative; }
        .ui.modal.customer-chart .body .prepaid-wrap .prepaid-block .balance:before {
          content: " ";
          position: absolute;
          left: -15px;
          top: 0px;
          bottom: 0px;
          width: 1px;
          background: rgba(255, 255, 255, 0.5); }
  .HisRever-wrap {
  margin-top:20px; background:#fff;
  height:350px; overflow-y:auto}
  .HisRever-wrap .reservation-wrap .title {
	padding: 20px 0 13px 0;
	font-size: 20px;
	text-align: center; }
  .HisRever-wrap .reservation-wrap .reservation {
  	font-size: 13px;
    padding: 0;
    list-style: none;
    border-top:1px solid #eff5f7;}
  .HisRever-wrap .reservation-wrap .reservation .item {
  	position:relative;
  	display: table;
    width: 100%;
    height: 45px;
    padding: 10px 15px;
    border-bottom: 1px solid #eff5f7;
  }
  .HisRever-wrap .reservation-wrap .reservation .item:last-child {
  	/*border-bottom:0;*/}
  .HisRever-wrap .reservation-wrap .reservation .item .btn-viewMore {
  	cursor: pointer;
    display: none;
  	position:absolute; top:0; left:0;
  	width:100%; height:45px;
  	line-height:45px;
  	background:rgba(216,229,231,0.5);
  	color: #718c96;
    font-weight: bold;
    z-index: 10;
    letter-spacing: 1px;
    font-size: 12px;
  }
  .HisRever-wrap .reservation-wrap .reservation .item:hover .btn-viewMore {
  	display:block;
  }
  .HisRever-wrap .reservation-wrap .reservation .status {
  	display: table-cell;
    width: 17%;
    vertical-align: middle;
  	text-align:left;
  }
  .HisRever-wrap .reservation-wrap .reservation .status .text-blue {color:#18ccbd;}
  .HisRever-wrap .reservation-wrap .reservation .status .text-red {color:#fc6063;}
  .HisRever-wrap .reservation-wrap .reservation .status .text-yellow {color:#ffa500;}
  .HisRever-wrap .reservation-wrap .reservation .status .text-default {color:#3E74C1;}
  .HisRever-wrap .reservation-wrap .reservation .status .text-gray {color:#495A6B;}
  .HisRever-wrap .reservation-wrap .reservation .project {
    display: table-cell;
    width: 45%;
    vertical-align: middle;
    text-align: left;
    font-weight: bold;
    font-size:13px;}
  .HisRever-wrap .reservation-wrap .reservation .employee-wrap {
  	display: table-cell;
    width: 16%;
    vertical-align: middle;
    text-align: center;}
  .HisRever-wrap .reservation-wrap .reservation .employee {
  	width: 50px;
    margin: 0 auto;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .HisRever-wrap .reservation-wrap .reservation .date {
  	display: table-cell;
    width: 22%;
    vertical-align: middle;
    text-align: right;
    color: #718c96;
  }
  .HisRever-wrap .reservation-wrap div.ui.more {
	border: 1px solid #d8e5e7;}


  .ui.modal.customer-chart .body .history-wrap {
    color: #37454a; }
    .ui.modal.customer-chart .body .history-wrap > .title {
      padding: 25px 0 13px 0;
      font-size: 20px;
      text-align: center; }
    .ui.modal.customer-chart .body .history-wrap > .history {
      font-size:13px;
      padding: 0;
      list-style: none;
      border-top: 1px solid #eff5f7; }
      .ui.modal.customer-chart .body .history-wrap > .history .item {
      	display:table;
      	width:100%;
      	height:45px;
        padding: 10px 15px;
        border-bottom: 1px solid #eff5f7; }
        .ui.modal.customer-chart .body .history-wrap > .history .item:last-child {
         /*border-bottom: 0; */}
        .ui.modal.customer-chart .body .history-wrap > .history .item img.thumbnail {
          width: 40px;
          height: 40px;
          float: left; }
        .ui.modal.customer-chart .body .history-wrap > .history .item .title {
          display:table-cell; width:50%;
          vertical-align:middle;
          text-align:left;
          font-weight: bold; }
        .ui.modal.customer-chart .body .history-wrap > .history .item .sale-memo {
          display:table-cell;width:12%;
          vertical-align:middle;
          color: #718c96;
          position: relative;
          text-align:center; }
          .ui.modal.customer-chart .body .history-wrap > .history .item .sale-memo .ribon {
          	position: absolute;
		    top: 3px;
		    left: 3px;
		    width: 0;
		    height: 0;
		    border-top: 10px solid #3f4d5e;
		    border-right: 10px solid transparent;
          }
          .ui.modal.customer-chart .body .history-wrap > .history .item .sale-memo .prepaid-block {
		    display: none;
		    position: absolute;
		    width: 200px;
		    left: -50px;
		    top: -25px;
		    margin-right: 10px;
		    padding: 8px 6px;
		    color: #ffffff;
		    background: #404e5d;
		    border-radius: 3px;
		    z-index: 999; }
		  .ui.modal.customer-chart .body .history-wrap > .history .item .sale-memo:hover .prepaid-block {
		    display: inline-block; }
		    .ui.modal.customer-chart .body .history-wrap > .history .item .sale-memo .prepaid-block .text{
		    	display: inline-block;
        		margin-right: 25px; }
        .ui.modal.customer-chart .body .history-wrap > .history .item .employee-wrap {
          display:table-cell; width:16%;
          vertical-align:middle;
          text-align:center;
          }
        .ui.modal.customer-chart .body .history-wrap > .history .item .employee {
          width:50px;
          margin:0 auto;
          vertical-align:middle;
          overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
        }
        .ui.modal.customer-chart .body .history-wrap > .history .item .date {
          display:table-cell; width:22%;
          vertical-align:middle;
          text-align:right;
          color: #718c96;
          }
        .ui.modal.customer-chart .body div.ui.more {
		  border: 1px solid #d8e5e7;}

.reservation {
  position: relative; }
  .reservation .right-menu-wrap {
    width: 60px;
    margin-top:118px;
    margin-left: 10px;
  }
    .reservation .right-menu-wrap .menus {
      margin: 0;
      padding: 0;
      list-style: none; }
      .reservation .right-menu-wrap .menus .item {
        position: relative;
        height: 100px;
        margin-bottom: 10px;
        text-align: center; }
        .reservation .right-menu-wrap .menus .item a.container {
          display: block; }
        .reservation .right-menu-wrap .menus .item .icon {
          position: relative;
          width: 60px;
          height: 60px; }
          .reservation .right-menu-wrap .menus .item .icon .background {
            width: 100%;
            height: 100%;
            position: absolute;
            border-radius: 50%;
            background: #364549; }
          .reservation .right-menu-wrap .menus .item .icon img {
            display: block;
            position: absolute;
            left: calc(50% - 12px);
            top: calc(50% - 12px); }
        .reservation .right-menu-wrap .menus .item .text {
          margin-top: 10px;
          color: #37454a; }
  .reservation .calendar-wrap {
    border: 1px solid #e4e8ec; }
	.reservation .calendar-wrap .owner-color {
	  background: #58e5e4; }
	.reservation .calendar-wrap .member1-color {
	  background: #6ab9f1; }
	.reservation .calendar-wrap .member2-color {
	  background: #897bf6; }
	.reservation .calendar-wrap .member3-color {
	  background: #ffcf8b; }
	.reservation .calendar-wrap .member4-color {
	  background: #f16aa3; }
	.reservation .calendar-wrap .member5-color {
	  background: #ffae8b; }
	.reservation .calendar-wrap .member6-color {
	  background: #9be484; }
    .reservation .calendar-wrap .color.red {
      background: #fc6063; }
    .reservation .calendar-wrap .color.gray {
      background: #495A6B; }
    .reservation .calendar-wrap .color.green {
      background: #3E74C1; }
    .reservation .calendar-wrap .color.blue {
      /*background: #0085ef;*/
      /*background: #289cf9;*/
      background: #18ccbd;}
    .reservation .calendar-wrap .color.purple {
      background: #897ff3; }
    .reservation .calendar-wrap .color.yellow {
      background: #fece8f; }
    .reservation .calendar-wrap .color.orange {
      background: #ffa500; }
    .reservation .calendar-wrap .inactive {
      color: #bbc4c8 !important;
      background: #f9f9fb !important; }
    .reservation .calendar-wrap .header {
      position: relative;
      text-align: center;
      background: transparent;
      background-clip: padding-box;
      padding: 18px 20px;
      border-bottom: 1px solid #e4e8ec; }
      .reservation .calendar-wrap .header .calendar-type {
        position: absolute;
        left: 20px;
        top: 13px; }
        .reservation .calendar-wrap .header .calendar-type .item {
          display: inline-block;
          border: 1px solid #e4e8ec;
          padding: 10px 20px;
          color: #d9dfe4;
          background: #f9f9fb; }
          .reservation .calendar-wrap .header .calendar-type .item:not(:first-child) {
            border-left: 0; }
          .reservation .calendar-wrap .header .calendar-type .item.active {
            color: #000;
            background: #ffffff;
            border: 1px solid #20232B;}
      .reservation .calendar-wrap .header .date a {
        display: inline-block;
        color: #caced4;
        line-height: 24px;
        vertical-align: top; }
      .reservation .calendar-wrap .header .date .text {
        display: inline-block;
        margin: 0 25px;
        font-size: 24px;
        font-weight: bold;
        line-height: 24px; }
      .reservation .calendar-wrap .header .date .calHeader-holiday {
        display:inline-block;
        margin:0 2px;
        vertical-align:4px;
        border-radius:5px;
        font-weight:400;
        padding:0 5px; height:18px; line-height:18px;
        background:#fc6063; color:#fff;
        font-size:11px}
      .reservation .calendar-wrap .header .label {
        position: absolute;
        top: -42px;
        bottom: 0;
        right: -15px;}
        .reservation .calendar-wrap .header .label .items {
          margin: 0;
          padding: 0;
          list-style: none; }
          .reservation .calendar-wrap .header .label .items .item {
			display: inline-block;
		    line-height: 20px;
			margin-right: 15px; }
            .reservation .calendar-wrap .header .label .items .item .icon {
              display: inline-block;
              width: 10px;
              height: 10px;
              margin-right: 5px;
              border-radius: 1px;}
            .reservation .calendar-wrap .header .label .items .item .text {
              color: #718c96; }
    .reservation .calendar-wrap .body {
      position: relative; }
      .reservation .calendar-wrap .body .background, .reservation .calendar-wrap .body .spans {
        position: relative;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0; }
      /* calendar table scroll */
      .reservation .calendar-wrap .body .background.time-tbl {
        width:60px;
        position:absolute;
        top:0;
        z-index:10;
        background-color:#fff;
      }
      .reservation .calendar-wrap .body .scroll-tbl-box {
        position:relative;
        width:890px;
        overflow-x:overlay;
        margin-left:59px;
        border-right:1px solid #e4e8ec;
      }
      .reservation .calendar-wrap .body .table-scroll-wrap {
        display:flex;
      }
      .reservation .calendar-wrap .body .scroll-tbl-box .background tr:not(.inactive) td {
        background: #ffffff;
      }
      .reservation .calendar-wrap .body .scroll-tbl-box .spans {
        left:0;
      }
      .reservation .calendar-wrap .body .scroll-tbl-box .spans > table,
      .reservation .calendar-wrap td.body > div.spans > table {
        overflow:hidden;
      }
      .reservation .calendar-wrap .body .scroll-tbl-box table.first.level td.first.level {
        width: 89px;
      }

      /* calendar table scroll end */
      .reservation .calendar-wrap .body .background {
        background: #ffffff; }
        .reservation .calendar-wrap .body .background tr.column-label, .reservation .calendar-wrap .body .background tr.first.level.timespan {
          height: 40px; }
        .reservation .calendar-wrap .body .background tr.first.level.timespan > td.first.level.time {
          vertical-align: top; }
        .reservation .calendar-wrap .body .background td.first.level {
          border: 1px solid #eff6f7;
/*           padding: 10px; */
          padding-left: 10px;
    	  padding-bottom: 3px;
    	  padding-top: 3px; }
          .reservation .calendar-wrap .body .background td.first.level.time {
            width: 60px; }
          .reservation .calendar-wrap .body .background td.first.level.no-top-border {
            border-top: 0; }
          .reservation .calendar-wrap .body .background td.first.level.no-bottom-border {
            border-bottom: 0; }
          .reservation .calendar-wrap .body .background td.first.level.no-left-border {
            border-left: 0; }
          .reservation .calendar-wrap .body .background td.first.level.no-right-border {
            border-right: 0; }
          .reservation .calendar-wrap .body .background td.first.level.strong-border-bottom {
            border-bottom-color: #e4e8ec; }
          .reservation .calendar-wrap .body .background td.first.level.strong-border-top {
            border-top-color: #e4e8ec; }
          .reservation .calendar-wrap .body .background .holiday-humen {
            margin-left:3px; vertical-align:1px;
            display:inline-block; border-radius:20px; text-align:center;
            width:18px; height:18px; line-height:18px; background:#0085ef; color:#fff; font-size:11px;}
      .reservation .calendar-wrap .body .spans {
        position: absolute;
        left: 60px;
        top: 40px; }
      .reservation .calendar-wrap .body .background thead td.first.level.yesterday {
        border-right: 1px solid #cedddf; }
      .reservation .calendar-wrap .body .background thead td.first.level.today {
        border-left: 1px solid #cedddf;
        border-right: 1px solid #cedddf; }
      .reservation .calendar-wrap .body .spans .first.level.today {
        border-left: 1px solid #cedddf;
        border-bottom: 1px solid #cedddf; }
      .reservation .calendar-wrap .body table.first.level {
        height: 100%; }
        .reservation .calendar-wrap .body table.first.level td.first.level {
          position: relative;
        }
      .reservation .calendar-wrap .body table.first.level thead td.first.level {
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
        word-wrap: break-word;
      }
      .reservation .calendar-wrap .body table.second.level {
        height: 100%; }
        .reservation .calendar-wrap .body table.second.level td {
          position: relative; }
      .reservation-span .book-time {
        font-size:10px;
        letter-spacing: -0.17px;
        opacity: 0.5;
        margin-top:3px;
      }
      .book-info-tooltip {
        display:none;
        position:absolute;
        min-width:93px;
        max-width:171px;
        border:1px solid #fff;
        border-radius:4px;
        color:#202224;
        font-weight:300;
        padding:8px 8px 4px;
        box-shadow: 5px 4px 20px 0 rgba(40, 46, 52, 0.22);
        z-index:20;
        background-color:#fff;
        letter-spacing: -0.17px;
      }
      .book-info-tooltip .name {
        font-weight:500;
      }

      .book-info-tooltip .blacklist {
        display:none;
        width:15px;
        height:15px;
        background-image:url('/resources/static/img/icon/ic_blacklist-ce12cdf1f947ee39a26bacfe37a6ca8c.png');
        background-repeat:no-repeat;
      }
      .book-info-tooltip .naver-book,
      .book-info-tooltip .b2c-book {
        display:none;
        vertical-align:middle;
        margin-left:3px;
      }
      .book-info-tooltip p {
        margin:0 0 4px;
      }
      .book-info-tooltip p.time {
        font-size:10px;
      }
      .book-info-tooltip p.memo {
        overflow:hidden;
        text-overflow:ellipsis;
        display: -webkit-box;
        line-height:normal;
        margin-top:8px;
        -webkit-line-clamp: 10;
        -webkit-box-orient:vertical
      }
      .book-info-tooltip p.badge {
        display:inline-block;
        position:relative;
        margin-top:2px;
      }
      .book-info-tooltip span.badge-bg {
        position: absolute;
        left:0;
        width:100%;
        box-sizing: border-box;
        height:20px;
        display:inline-block;
        margin:1px 0 0;
        border-radius:10px;
        opacity:0.2;
      }
      .book-info-tooltip span.badge-label {
        display: inline-block;
        margin-top: 6px;
        padding: 0px 8px 0 7px;
        white-space:nowrap;
        font-weight:500;
        font-size:10px;
      }
      .book-info-tooltip p:first-child {
        font-weight:bold;
      }
          .reservation .calendar-wrap .body table.second.level .prepaid-block .text {
        display: inline-block;
        margin-right: 10px; }
        .reservation .calendar-wrap .body table.second.level .reservation-span:hover .prepaid-block {
      display: inline-block; }


      .reservation .calendar-wrap .body .reservation-data {
        display: none; }
      .reservation .calendar-wrap .body .reservation-wrap {
        position: relative;
        height: 100%;
        width: calc(100% - 16px);
      }
      .reservation .calendar-wrap .body .reservation-span {
        position: absolute;
        width:100%;
        left: 0px;
        padding: 5px;
        border:1px solid #fff;
        color: #ffffff;
        line-height: 1.4;
        border-radius: 4px;
        overflow:hidden;
        z-index: 1;
      }
        .reservation .calendar-wrap .body .reservation-span.none-drag {
          user-drag: none;
          user-select: none;
          -moz-user-select: none;
          -webkit-user-drag: none;
          -webkit-user-select: none;
          -ms-user-select: none; }
        .reservation .calendar-wrap .body .reservation-span.strike {
          text-decoration: line-through; }
        .reservation .calendar-wrap .body .reservation-span .one-line {
          display: inline-block; }
        .reservation .calendar-wrap .body .reservation-span .name {
          font-weight:bold;
        }
        .reservation .calendar-wrap .body .reservation-span .name,
        .reservation .calendar-wrap .body .reservation-span .description {
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }
        .reservation .calendar-wrap .body .reservation-span .name img{vertical-align:middle;}
      .reservation .calendar-wrap .body .lunchtime {
        position: absolute;
        left: 0;
        right: 0;
        text-align: center;
        color: #a5abac;
        font-size: 12px; }
      .reservation .calendar-wrap .body .current-timeline {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 1px;
        background: #207efe; }

.ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap {
  height: 300px;
  overflow-y: auto;
  padding-bottom: 50px;}
  .ui.modal .pop-inner-wrap {
  	height: 300px;
  	overflow-x:hidden;
    overflow-y: auto;
  }
  .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name {
    position: relative; }
    .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name .ribon {
      position: absolute;
      top: 0;
      width: 0;
      height: 0;
      border-top: 10px solid #3f4d5e;
      border-right: 10px solid transparent; }
    .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name .name {
      position: relative; }
    .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name .name a {
      text-decoration:underline}
    .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name .prepaid-block {
      display: none;
      position: absolute;
      width: 170px;
      left: 0;
      top: 44px;
      padding: 8px 6px;
      color: #fff;
      background: #3f4d5e;
      border-radius: 3px;
      z-index: 1;
      white-space: nowrap;
      overflow: hidden;
      word-break: keep-all;
      text-overflow: ellipsis;
      max-height: 90px;
    }

      .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name .prepaid-block:before {
        position: absolute;
        top: 0;
        width: 0;
        height: 0;
        border-top: 10px solid #3f4d5e;
        border-right: 10px solid transparent;
      }
      .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name .prepaid-block .text {
        display: inline-block;
        margin-right: 25px;
        white-space: pre-wrap;
        text-align: left;
      }
      .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name .prepaid-block .balance {
        display: inline-block;
        position: relative; }
        .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name .prepaid-block .balance:before {
          content: " ";
          position: absolute;
          left: -15px;
          top: 0px;
          bottom: 0px;
          width: 1px;
          background: rgba(255, 255, 255, 0.5); }
    .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-name:hover .prepaid-block {
      display: inline-block; }
  .ui.modal.register-reservation .body > .step.one > .tab-content.exist-customer > .table-wrap .customer-contact {
    width: 120px; }
.ui.modal.register-reservation .body > .step.one > .tab-content.new-customer,
.ui.modal.register-reservation .body > .step.one > .tab-content.without-register {
  padding: 50px 0px;
  background: #f9f9fb; }
  .ui.modal.register-reservation .body > .step.one > .tab-content.new-customer .inputs,
  .ui.modal.register-reservation .body > .step.one > .tab-content.without-register .inputs {
    width: 300px;
    margin: 0 auto; }
  .ui.modal.register-reservation .body > .step.one > .tab-content.new-customer .pet-area {
    height:48px;
  }
  .ui.modal.register-reservation .body > .step.one > .tab-content.new-customer .pet-area .pet-area-in,
  .ui.modal.register-reservation .body > .step.one > .tab-content.without-register .pet-area .pet-area-in {
    float:left; width:33.33%; position:relative;
  }
  .ui.modal.register-reservation .body > .step.one > .tab-content.new-customer .pet-area .pet-area-in .subtxt,
  .ui.modal.register-reservation .body > .step.one > .tab-content.without-register .pet-area .pet-area-in .subtxt {
    position:absolute; top:14px; right:10px;
  }
  .ui.modal.register-reservation .body > .step.one > .tab-content.new-customer .description,
  .ui.modal.register-reservation .body > .step.one > .tab-content.without-register .description {
    margin-top: 20px;
    text-align: center;
    font-size: 12px; }
    .ui.modal.register-reservation .body > .step.one > .tab-content.new-customer .description .msg.error,
    .ui.modal.register-reservation .body > .step.one > .tab-content.without-register .description .msg.error {
      margin-top: 5px;
      color: #58e5e4; }
.ui.modal.register-reservation .body > .step.two > .date {
  border-top:1px solid #dce8ea;
  border-bottom:1px solid #dce8ea;
  /*margin-bottom: 20px;*/ }
  .ui.modal.register-reservation .body > .step.two > .date .date-area01 {
    padding:14px 0;
    border-bottom:1px solid #dce8ea;
  }
  .ui.modal.register-reservation .body > .step.two > .date .sub-title {
    float:left;
    padding-left:20px;
    width:30%;
    font-size: 13px;
    color:#718c96;
    font-weight: bold; }
  .ui.modal.register-reservation .body > .step.two > .date .ui.choose-date .text {
    font-size: 13px; }
  .ui.modal.register-reservation .body > .step.two > .date .ui.dropdown .text {
    font-size: 13px; }
.ui.modal.register-reservation .body > .step.two > .detail-options {
  background: #ffffff; }
  .ui.modal.register-reservation .body > .step.two > .detail-options td.content {
    color: #37454a; }
  .ui.modal.register-reservation .body > .step.two > .detail-options .tags-wrap {
    margin-top: 10px; }
  .ui.modal.register-reservation .body > .step.two > .detail-options .memo textarea {
    width: 100%;
    height: 50px; }

.ui.modal.set-opening-hours .body > .tab-content.opening-hours .table-wrap .available-time div.block {
  display: inline-block;
  color: #37454a; }
.ui.modal.set-opening-hours .body > .tab-content.opening-hours .table-wrap .available-time div.prefix {
  display: inline-block;
  margin-right: 10px;
  color: #222; }

.ui.modal.set-opening-hours .body > .tab-content.opening-hours .table-wrap .content .wrap {
  padding-bottom: 20px; }
  .ui.modal.set-opening-hours .body > .tab-content.opening-hours .table-wrap .content .wrap .exist-lunch-wrap {
    margin-bottom: 15px;
    color: #37454a; }
    .ui.modal.set-opening-hours .body > .tab-content.opening-hours .table-wrap .content .wrap .exist-lunch-wrap .checkbox {
      margin-right: 15px; }
.ui.modal .body > .tab-content .table-wrap .available-time div.line:first-child {
	padding-bottom:10px;
}
.ui.modal .body > .tab-content .table-wrap .available-time div.prefix {
  display: inline-block;
  margin-right: 10px;
  color: #3fd2d1; }
.ui.modal .body > .tab-content .text {
	color:#37454a !important;
}
.ui.modal.set-opening-hours .body > .tab-content.holiday > .input-wrap {
  padding: 20px 20px;
  background: #f9fbfb; }
  .ui.modal.set-opening-hours .body > .tab-content.holiday > .input-wrap > .left {
    float: left;
    margin-top: 10px; }
  .ui.modal.set-opening-hours .body > .tab-content.holiday > .input-wrap > .input {
    margin-left: 45px; }
  .ui.modal.set-opening-hours .body > .tab-content.holiday > .input-wrap > .input > div {
    margin-bottom:8px;}
    .ui.modal.set-opening-hours .body > .tab-content.holiday > .input-wrap > .input .block {
      display: inline-block;
      font-size:13px;
      margin-right: 10px; }
      .ui.modal.set-opening-hours .body > .tab-content.holiday > .input-wrap > .input .block.description {
        margin-right: 10px;
        color: #434f53; }
    .ui.modal.set-opening-hours .body > .tab-content.holiday > .input-wrap > .input input.reason {
      margin-top: 10px;
      width: 100%;
      border: 0;
      background: #f9fbfb; }
.ui.modal.set-opening-hours .body > .tab-content.holiday > .submit {
  display: block;
  text-align: center;
  color: #fff;
  font-weight:bold;
  background: #3f4d5e;
  height:43px; line-height:41px; font-size:13px; }
  .ui.modal.set-opening-hours .body > .tab-content.holiday > .submit i {
    margin-left: 10px; }
.ui.modal.set-opening-hours .body > .tab-content.holiday > .holiday-list {
  position: relative; }
  .ui.modal.set-opening-hours .body > .tab-content.holiday > .holiday-list > .table-wrap {
    height: 160px;
    overflow-y: auto;
    color: #37454a; }
    .ui.modal.set-opening-hours .body > .tab-content.holiday > .holiday-list > .table-wrap .reason {
      text-align: left;
      padding-left:0;
      /*font-weight: bold;
      color: #37454a; */}
    .ui.modal.set-opening-hours .body > .tab-content.holiday > .holiday-list > .table-wrap .reason .line {
    padding:4px 0;
    }
    .ui.modal.set-opening-hours .body > .tab-content.holiday > .holiday-list > .table-wrap .reason .line:first-child {
    padding-top:0;
    }
    .ui.modal.set-opening-hours .body > .tab-content.holiday > .holiday-list > .table-wrap .reason .line:last-child {
    padding-bottom:0;
    }
    .ui.modal.set-opening-hours .body > .tab-content.holiday > .holiday-list > .table-wrap .period {
      text-align: center; }
  .ui.modal.set-opening-hours .body > .tab-content.holiday > .holiday-list .ui.more {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -13px; }

.ui.modal.set-prohibition .body > .tab-content.prohibition .table-wrap .available-time div.block {
  display: inline-block;
  color: #37454a; }
.ui.modal.set-prohibition .body > .tab-content.prohibition .table-wrap .available-time div.prefix {
  display: inline-block;
  margin-right: 10px;
  color: #222; }
.ui.modal.set-prohibition .body > .tab-content.prohibition .table-wrap .content .wrap {
  padding-bottom: 20px; }
  .ui.modal.set-prohibition .body > .tab-content.prohibition .table-wrap .content .wrap .exist-rest-wrap {
    margin-bottom: 15px;
    color: #37454a; }
    .ui.modal.set-prohibition .body > .tab-content.prohibition .table-wrap .content .wrap .exist-rest-wrap .checkbox {
      margin-right: 15px; }
.ui.modal.set-prohibition .body > .tab-content.emp-holiday > .input-wrap {
  padding: 20px 20px;
  background: #f9fbfb; }
  .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .input-wrap > .left {
    float: left;
    margin-top: 10px; }
  .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .input-wrap > .input {
    margin-left: 45px; }
    .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .input-wrap > .input .block {
      display: inline-block;
      margin-right: 10px; }
      .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .input-wrap > .input .block.description {
        margin-right: 10px;
        color: #222; }
    .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .input-wrap > .input input.reason {
      margin-top: 10px;
      width: 100%;
      border: 0;
      background: #f9fbfb; }
.ui.modal.set-prohibition .body > .tab-content.emp-holiday > .submit {
  display: block;
  text-align: center;
  color: #fff;
  font-weight: bold;
  background: #3f4d5e;
  height: 43px;
  line-height: 41px;
  font-size: 13px;}
  .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .submit i {
    margin-left: 10px; }
.ui.modal.set-prohibition .body > .tab-content.emp-holiday > .holiday-list {
  position: relative; }
  .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .holiday-list > .table-wrap {
    height: 160px;
    overflow-y: auto;
    color: #37454a; }
    .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .holiday-list > .table-wrap .reason {
      text-align: left;
      padding-left: 0;
      /*font-weight: bold;
      color: #37454a; */}
    .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .holiday-list > .table-wrap .reason .line {
      padding:4px 0;
    }
    .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .holiday-list > .table-wrap .reason .line:first-child {
      padding-top:0;
    }
    .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .holiday-list > .table-wrap .reason .line:last-child {
      padding-bottom:0;
    }
    .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .holiday-list > .table-wrap .period {
      text-align: center; }
  .ui.modal.set-prohibition .body > .tab-content.emp-holiday > .holiday-list .ui.more {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0px; }
.ui.modal.set-prohibition .body > .submit {
  display: block;
  text-align: center;
  color: #37454a;
  background: #ffffff;
  padding: 15px 0; }
  .ui.modal.set-prohibition .body > .submit i {
    margin-left: 10px; }
.ui.modal.set-prohibition .body > .prohibition-list {
  position: relative; }
  .ui.modal.set-prohibition .body > .prohibition-list > .table-wrap {
    height: 160px;
    overflow-y: auto;
    color: #37454a; }
    .ui.modal.set-prohibition .body > .prohibition-list > .table-wrap .rest {
      text-align: left; }
    .ui.modal.set-prohibition .body > .prohibition-list > .table-wrap .period {
      text-align: left; }
  .ui.modal.set-prohibition .body > .prohibition-list .ui.more {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -13px; }


.ui.modal.reservation-information .body > .ui.checkbox {
  margin-left: 25px; }
.ui.modal.reservation-information .body .radiobox-wrap {
  margin-left: 25px; margin-top: 20px; }
.ui.modal.reservation-information .body .radiobox-wrap .ui.checkbox {
  margin-right:10px}
.ui.modal.reservation-information .body .radiobox-wrap .ui.checkbox.disabled , .disabled em{
  color:#9aa1a4 !important}
.ui.modal.reservation-information .body > .table-wrap {
  margin-top: 15px; }
  .ui.modal.reservation-information .body > .table-wrap .treatment .input-wrap .dropdown-wrap {
    margin-bottom: 5px; }
  .ui.modal.reservation-information .body > .table-wrap .memo .content-wrap, .ui.modal.reservation-information .body > .table-wrap .memo .input-wrap {
    width: 250px;
    height: 90px;
    overflow-y: auto;
    line-height: 1.2; }
  .ui.modal.reservation-information .body > .table-wrap .memo .input-wrap textarea {
    width: 100%;
    height: 100%;
    line-height: 1.2;
    vertical-align: top; }
.action-overview {
	cursor: pointer;
	display:inline-block;
	background:none;
	border:none;
	padding:0;
	margin-left:5px}
	.action-overview i {
	display:block;
	width:9px; height:9px;
	background-image:url('/resources/static/img/icon/overview-328e063462af28ecea95af438eea4267.png');}
.manage-product .page-content.list .table-wrap .add-new-item-form1 {
  background: #f9fbfb;
  border-bottom: 0; }
  .manage-product .page-content.list .table-wrap .add-new-item-form1 input {
    background: #f9fbfb; }
.manage-product .page-content.list .table-wrap .add-new-item-form2 {
  background: #f9fbfb;
  border-bottom: 1px solid #dce8ea; }
  .manage-product .page-content.list .table-wrap .add-new-item-form2 td {
    padding: 14px 0; }
    .manage-product .page-content.list .table-wrap .add-new-item-form2 td .ui.checkbox:first-child {
      margin-right: 40px; }
    .manage-product .page-content.list .table-wrap .add-new-item-form2 td input {
      background: #f9fbfb; }
.manage-product .page-content.list .table-wrap .product-name a {
  color: #718c96; }

.manage-product .page-content.detail .table-wrap {
  margin-bottom: 20px; }
  .manage-product .page-content.detail .table-wrap .overflow-wrap {
    overflow: hidden;
    max-height: 200px; }
  .manage-product .page-content.detail .table-wrap .ui.more {
    border: 1px solid #d8e5e7;
    border-top: 0; }
  .manage-product .page-content.detail .table-wrap table.outside tfoot.outside td {
    text-align: left; }
  .manage-product .page-content.detail .table-wrap table.outside tfoot.outside .action.modify {
    color: #37454a; }
.manage-product .page-content.detail .table-wrap.information td.label {
  width: 170px; }
.manage-product .page-content.detail .table-wrap.information td.content input {
  width: 100px; }
.manage-product .page-content.detail .table-wrap.information .product-name .content input {
  width: 200px; }

.manage-art .page-content.album .new-item {
  display: block;
  text-align: center; }
  .manage-art .page-content.album .new-item a {
    color: #37454a; }
  .manage-art .page-content.album .new-item .icon-circle-plus {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle; }
  .manage-art .page-content.album .new-item .text {
    display: inline-block;
    font-size: 24px;
    vertical-align: middle; }
.manage-art .page-content.album .cards {
  margin-top: 20px; }
  .manage-art .page-content.album .cards .column {
    padding-right: 15px;
    padding-bottom: 15px; }
  .manage-art .page-content.album .cards .card {
    position: relative;
    height: 300px; }
    .manage-art .page-content.album .cards .card.selected:after {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      content: "";
      border: 4px solid #58e5e4; }
    .manage-art .page-content.album .cards .card img.background {
/*       position: absolute; */
/*       left: 0; */
/*       right: 0; */
/*       top: 0; */
/*       bottom: 0;  */
/*       width: auto; */
/*       height: auto; */
      max-height:100%;
      max-width:100%;
      vertical-align: middle;}
     .manage-art .page-content.album .cards .card .img-container {
      width: 100%;
      height: 200px;
      line-height: 200px;
      text-align:center;
       background: #fff;
       border: 1px solid #e4e8ec;
     }
    .manage-art .page-content.album .cards .card .right-top-label {
      position: absolute;
      top: 10px;
      right: 10px;
      color: #ffffff; }
      .manage-art .page-content.album .cards .card .right-top-label span {
        margin-left: 5px; }
    .manage-art .page-content.album .cards .card .bottom-panel {
      position: absolute;
      height: 100px;
      left: 0;
      right: 0;
      bottom: 0;
      padding-top: 30px;
      padding-left: 15px;
      padding-right: 15px;
      color: #ffffff;
      background: #3a4144; }
      .manage-art .page-content.album .cards .card .bottom-panel .time {
        margin-top: 5px;
        font-size: 12px;
        color: #a2a1a0; }
      .manage-art .page-content.album .cards .card .bottom-panel .price {
        position: absolute;
        left: 15px;
        bottom: 10px; }
      .manage-art .page-content.album .cards .card .bottom-panel .price-for-member {
        position: absolute;
        right: 10px;
        bottom: 10px;
        font-size: 12px;
        color: #a2a1a0; }

.manage-art .page-content.month .new-item {
  display: block;
  text-align: center; }
  .manage-art .page-content.month .new-item a {
    color: #37454a; }
  .manage-art .page-content.month .new-item .icon-circle-plus {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle; }
  .manage-art .page-content.month .new-item .text {
    display: inline-block;
    font-size: 24px;
    vertical-align: middle; }
.manage-art .page-content.month .items {
  margin-top: 20px; }
  .manage-art .page-content.month .items .item {
    margin-bottom: 10px;
    padding-top: 20px;
    background: #ffffff;
    border: 1px solid #d8e5e7; }
    .manage-art .page-content.month .items .item .month {
      margin-left: 15px;
      font-size: 18px;
      color: #37454a; }
    .manage-art .page-content.month .items .item .images {
      height: 210px;
      margin-top: 10px;
      overflow-x: auto;
      overflow-y: hidden;
      white-space: nowrap; }
      .manage-art .page-content.month .items .item .images .image {
        margin-right: 10px;
        border: 1px solid #d8e5e7;
        width: auto;
    	height: auto;
    	max-width: 200px;
    	max-height: 200px;
    	vertical-align: middle; }
        .manage-art .page-content.month .items .item .images .image:first-child {
          margin-left: 15px; }
        .manage-art .page-content.month .items .item .images .image:last-child {
          margin-right: 15px; }

.ui.modal.new-art .body > .add-file {
  margin-top: 20px;
  display: block;
  margin-left: 25px;
  margin-right: 25px;
  text-decoration: underline;
  color: #37454a; }
.ui.modal.new-art .body > .images {
  margin-left: -5px;
  margin-top: 15px;
  margin-bottom: 15px;
  padding-left: 25px;
  padding-right: 25px; }
  .ui.modal.new-art .body > .images .column {
    padding: 5px; }
    .ui.modal.new-art .body > .images .column .image {
      position: relative;
      width: 100%;
      height: 128px;
      line-height: 128px;
      text-align: center; }
      .ui.modal.new-art .body > .images .column .image img.background {
      width: auto;
      height: auto;
      max-height: 125px;
      max-width:125px;
      vertical-align: middle;}
      .ui.modal.new-art .body > .images .column .image.selected:after {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        content: "\00d7";
        text-align: center;
        line-height: 128px;
        color: #58e5e4;
        border: 4px solid #58e5e4;
        font-size: 42px;
        font-weight: 900;
        background: rgba(0, 0, 0, 0.4); }
/*
.ui.modal.new-art .body > .table-wrap {
  margin-top: 20px; }*/

.btn-folding-wrap {width:100%; border-bottom:1px solid #b3bcbe}
.btn-folding-wrap button {
	width:70px; height:25px;
	margin:0 auto; padding:0; display:block;
	line-height:25px; background:#fff;
	font-family:"Noto Sans KR"; font-size:13px;
	border-top:1px solid #b3bcbe; border-right:1px solid #b3bcbe; border-left:1px solid #b3bcbe; border-bottom:none
	}
.ui.modal.art-detail .body > .images {
  margin-left: -5px;
  padding-left: 25px;
  padding-right: 25px; }
  .ui.modal.art-detail .body > .images .column {
    padding: 5px; }
    .ui.modal.art-detail .body > .images .column .image {
      position: relative;
      width: 100%;
      height: 128px;
      line-height: 128px;
      text-align: center; }
      .ui.modal.art-detail .body > .images .column .image img.background {
      width: auto;
      height: auto;
      max-height: 125px;
      max-width:125px;
      vertical-align: middle;}
.ui.modal.art-detail .body > .table-wrap {
  margin-top: 20px; }

.ui.modal.modify-art .body > .images {
  margin-left: -5px;
  margin-bottom:20px;
  padding-left: 25px;
  padding-right: 25px; }
  .ui.modal.modify-art .body > .images .column {
    padding: 5px; }
    .ui.modal.modify-art .body > .images .column .image {
      position: relative;
      width: 100%;
      height: 128px;
      line-height: 128px;
      text-align: center; }
      .ui.modal.modify-art .body > .images .column .image img.background {
      width: auto;
      height: auto;
      max-height: 125px;
      max-width:125px;
      vertical-align: middle;}
      .ui.modal.modify-art .body > .images .column .action {
        margin-top: 10px;
        text-align: center;
        color: #37454a;
        text-decoration: underline; }
        .ui.modal.modify-art .body > .images .column .action.delete {
          display: block; }
        .ui.modal.modify-art .body > .images .column .action.browse {
          display: none; }
      .ui.modal.modify-art .body > .images .column.blank .action.delete {
        display: none; }
      .ui.modal.modify-art .body > .images .column.blank .action.browse {
        display: block; }
        /*
.ui.modal.modify-art .body > .table-wrap {
  margin-top: 20px; }*/

.ui.modal.new-month-art .body > .date {
  float: right;
  margin-right: 25px; }
.ui.modal.new-month-art .body > .cards-wrap {
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 20px; }
  .ui.modal.new-month-art .body > .cards-wrap .cards .column {
    padding: 5px; }
  .ui.modal.new-month-art .body > .cards-wrap .cards .card {
    position: relative;
    height: 180px;
    line-height: 180px;
    text-align: center; }
    .ui.modal.new-month-art .body > .cards-wrap .cards .card img.background {
/*       position: absolute; */
/*       left: 0; */
/*       right: 0; */
/*       top: 0; */
/*       bottom: 0; */
/*       width: 100%; */
/*       height: 100%; */
      width: auto;
      height: auto;
      max-width: 100%;
      max-height: 100%;
      vertical-align: middle }
    .ui.modal.new-month-art .body > .cards-wrap .cards .card .left-top-label {
      position: absolute;
      top: 10px;
      left: 10px;
      cursor: pointer;
      line-height: 20px; }
      .ui.modal.new-month-art .body > .cards-wrap .cards .card .left-top-label .symbol {
        color: #f54356; }
        .ui.modal.new-month-art .body > .cards-wrap .cards .card .left-top-label .symbol.normal {
          display: inline-block; }
        .ui.modal.new-month-art .body > .cards-wrap .cards .card .left-top-label .symbol.selected {
          display: none; }
    .ui.modal.new-month-art .body > .cards-wrap .cards .card.selected .left-top-label .symbol.selected {
      display: inline-block; }
    .ui.modal.new-month-art .body > .cards-wrap .cards .card.selected .left-top-label .symbol.normal {
      display: none; }
    .ui.modal.new-month-art .body > .cards-wrap .cards .card .bottom-panel {
      position: absolute;
      height: 115px;
      left: 0;
      right: 0;
      bottom: 0;
      padding-top: 30px;
      padding-left: 15px;
      padding-right: 15px;
      color: #ffffff;
      background: rgba(0, 0, 0, 0.7); }
      .ui.modal.new-month-art .body > .cards-wrap .cards .card .bottom-panel .time {
        margin-top: 5px;
        font-size: 12px;
        color: #a2a1a0; }
      .ui.modal.new-month-art .body > .cards-wrap .cards .card .bottom-panel .price {
        position: absolute;
        left: 15px;
        bottom: 10px;
        font-size: 12px; }
      .ui.modal.new-month-art .body > .cards-wrap .cards .card .bottom-panel .price-for-member {
        position: absolute;
        right: 10px;
        bottom: 10px;
        font-size: 10px;
        color: #a2a1a0; }
.ui.modal.new-month-art .body > .pagination {
  margin-top: 20px;
  padding-bottom: 20px; }

.manage-shop .page-content.treatment-menu .new-item {
  display: block;
  margin-bottom: 20px;
  text-align: center; }
  .manage-shop .page-content.treatment-menu .new-item a {
    color: #37454a; }
  .manage-shop .page-content.treatment-menu .new-item .icon-circle-plus {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle; }
  .manage-shop .page-content.treatment-menu .new-item .text {
    display: inline-block;
    font-size: 24px;
    vertical-align: middle; }
.manage-shop .page-content.treatment-menu table {
  table-layout: auto; }
.manage-shop .page-content.treatment-menu .table-wrap {
  margin-bottom: 20px; }
  .manage-shop .page-content.treatment-menu .table-wrap .fat-header {
    position: relative;
    padding: 19px 19px 19px 15px; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header .content-wrap {
      display: block; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header .input-wrap {
      display: none; }
      .manage-shop .page-content.treatment-menu .table-wrap .fat-header .input-wrap .close {
        cursor: pointer;
        margin-right: 10px; }
        .manage-shop .page-content.treatment-menu .table-wrap .fat-header .input-wrap .close img {
          vertical-align: top;
          margin-top: 4px; }
      .manage-shop .page-content.treatment-menu .table-wrap .fat-header .input-wrap input {
        color: #37454a;
        font-size: 16px;
/*         height: 16px; bada */
		height: 20px;
        margin: 0;
        padding: 0;
        border: 0; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header .action.edit {
      display: none;
      cursor: pointer;
      float:right; margin:0 5px;
      opacity: 0.5; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header .action.submit {
      display: none;
      cursor: pointer;
      float:right; margin:3px 5px; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header .circle-close {
      display: none;
      float:right; margin:0 5px; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header:hover {
      background: #f5f7f7; }
      .manage-shop .page-content.treatment-menu .table-wrap .fat-header:hover input, .manage-shop .page-content.treatment-menu .table-wrap .fat-header:hover textarea {
        background: #f5f7f7; }
      .manage-shop .page-content.treatment-menu .table-wrap .fat-header:hover .action.edit {
        display: inline-block; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .content-wrap {
      display: none; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .input-wrap {
      float:left; width:60%; display:block; margin-top:7px; padding-left:2% }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .select-wrap {
      float:left; width:18%; display:block;
    }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .select-wrap .frm_select {
      width:100%;
    }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .selectinput-wrap {
      float:left; width:18%; display:block; padding-left:0.5%;
    }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .selectinput-wrap input {
      width: 100%;height: 35px;background:#fff; border: 1px solid #dee2e6;box-sizing: border-box; font-size: 13px; padding-left:10px;
    }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .icon-wrap {
      position:absolute;top:27px; right:25px;
    }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .action.edit {
      display: none; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .action.submit {
      display: inline-block; }
    .manage-shop .page-content.treatment-menu .table-wrap .fat-header.editting .circle-close {
      display: inline-block; }
  .manage-shop .page-content.treatment-menu .table-wrap .row {
    background: #f7fafb; }
  .manage-shop .page-content.treatment-menu .table-wrap tr.add-new-item-form {
    background: #f7fafb; }
    .manage-shop .page-content.treatment-menu .table-wrap tr.add-new-item-form input {
      background: #f7fafb; }
  .manage-shop .page-content.treatment-menu .table-wrap tr.add-new-item-action {
    background: #f7fafb;
    cursor: pointer; }
    .manage-shop .page-content.treatment-menu .table-wrap tr.add-new-item-action.inputting:hover {
      background: #37454a; }
  .manage-shop .page-content.treatment-menu .table-wrap .remove {
    white-space: nowrap; }
    .manage-shop .page-content.treatment-menu .table-wrap .remove .ui.close.button {
      padding-left: 5px;
      padding-right: 5px; }
  .manage-shop .page-content.treatment-menu .table-wrap .name {
    text-align: left;
    font-size: 13px;
    color: #37454a;
    /*white-space: nowrap;*/
    min-width: 150px; }
  .manage-shop .page-content.treatment-menu .table-wrap .duration {
    width: 99%;
    text-align: left; }
  .manage-shop .page-content.treatment-menu .table-wrap .price {
    text-align: right;
    font-size: 13px;
    font-weight: bold;
    white-space: nowrap; }
    .manage-shop .page-content.treatment-menu .table-wrap .price input {
      width: 100px;
      text-align: right; }
  .manage-shop .page-content.treatment-menu .table-wrap .edit {
    font-weight: bold; }
    .manage-shop .page-content.treatment-menu .table-wrap .edit .icon-pencil {
      cursor: pointer; }

.manage-shop > .page-content.discount-product .table-wrap tbody .row {
  cursor: pointer; }

.manage-shop .page-content.manage-member .table-wrap .pending {
  color: #718c96; }
  .manage-shop .page-content.manage-member .table-wrap .pending a.action, .manage-shop .page-content.manage-member .table-wrap .pending a.mailto {
    color: #718c96;
    text-decoration: underline; }
.manage-shop .page-content.manage-member .table-wrap .in-office {
  color: #37454a; }
  .manage-shop .page-content.manage-member .table-wrap .in-office a.action, .manage-shop .page-content.manage-member .table-wrap .in-office a.mailto {
    color: #37454a;
    text-decoration: underline; }
.manage-shop .page-content.manage-member .table-wrap .permission a {
  color: #37454a;
  text-decoration: underline; }
.manage-shop .page-content.manage-member .table-wrap .caption {
  font-weight: 400;
  font-size: 13px;
  line-height: 1.5;
}
.manage-shop .page-content.manage-member .table-wrap .caption li {
  list-style: disc;
  margin-left:20px;
}
.manage-shop .page-content.manage-member .table-wrap table.outside {
  margin-top:25px;
}

.manage-shop .page-content.manage-member .profile-image__wrapper {
  width:28px;
  height:28px;
  display:inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  overflow: hidden;
  background:var(--color-gray-100);
}
.manage-shop .page-content.manage-member .profile-image__wrapper .profile-image {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: center;
}

.manage-shop .page-content.manage-member .profile-image__wrapper .profile-empty-image {
  width:12px;
  height:12px;
}

.manage-shop .page-content.manage-member .b2c-reservation-switch .b2c-reservation-switch__input {
  cursor:pointer;
  appearance: none;
  position: relative;
  background:var(--color-gray-300);
  border-radius:100px;
  width:36px;
  height:24px;
}

.manage-shop .page-content.manage-member .b2c-reservation-switch .b2c-reservation-switch__input::before {
  content:"";
  position: absolute;
  border-radius: 50%;
  left:4px;
  width:16px;
  height:16px;
  top:50%;
  transform:translateY(-50%);
  background:var(--color-gray-white);
  transition: 0.1s;
}

.manage-shop .page-content.manage-member .b2c-reservation-switch .b2c-reservation-switch__input:checked {
  background:var(--color-primary-300);
}
.manage-shop .page-content.manage-member .b2c-reservation-switch .b2c-reservation-switch__input:checked::before {
  left:16px;
}

.manage-shop .page-content.manage-member .color-primary-300 {
  color:var(--color-primary-300) !important;
}

.manage-shop .page-content.manage-member .color-gray-300 {
  color:var(--color-gray-300) !important;
}

.modal.manage-member.member-info input {
  width:100%;
}

.modal.manage-member.member-info .profile-image__wrapper {
  font-size:var(--font-size-s);
  font-weight:var(--font-weight-regular);
  line-height:var(--line-height-s);
}

.modal.manage-member.member-info .profile-image__add-image {
  color:var(--color-primary-300);
  text-decoration: underline;
  cursor:pointer;
}

.modal.manage-member.member-info .profile-image__complete-image__wrapper {
    display:flex;
    justify-content: space-between;
    align-items: center;
    gap:8px;
}

.modal.manage-member.member-info .profile-image__name {
  display: inline-block;
  color:var(--color-gray-700);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.modal.manage-member.member-info .profile-image__delete {
  background:transparent;
  color:var(--color-red-300);
  white-space: nowrap;
  margin-left:auto;
}

.ui.modal.manage-member.confirm-fire .body > .message {
  margin:20px; }

.customer-chart > .page-content.list .cards {
	min-height:600px;}
.customer-chart > .page-content.list .cards .column {
  padding: 5px; }
.customer-chart > .page-content.list .cards .card {
  position: relative;
  display: block;
  height: 290px;
  background: #ffffff;
  border: 1px solid #d9e5e7;
  text-align: center; }
  .customer-chart > .page-content.list .cards .card .label {
    margin-left: 10px;
    margin-right: 10px; }
  .customer-chart > .page-content.list .cards .card .name {
    margin-top: 20px;
    color: #37454a;
    font-size: 24px;
    height: 30px; }
  .customer-chart > .page-content.list .cards .card .contact {
    margin-top: 13px;
    color: #37454a;
    font-size: 16px;
    height: 20px; }
  .customer-chart > .page-content.list .cards .card .birthday {
    margin-top: 15px;
    color: #718c96;
    font-size: 12px;
    height: 15px; }
  .customer-chart > .page-content.list .cards .card .job {
    margin-top: 15px;
    color: #718c96;
    font-size: 12px;
    height: 15px; }
  .customer-chart > .page-content.list .cards .card .memo {
    height: 40px;
    margin-top: 15px;
    color: #718c96;
    font-size: 12px;
    position: relative; }
    .customer-chart > .page-content.list .cards .card .memo .overflow-wrap {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      overflow: hidden; }
      .customer-chart > .page-content.list .cards .card .memo .overflow-wrap .content {
        overflow-y: auto;
        padding-right: 15px;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: -17px; }
    .customer-chart > .page-content.list .cards .card .memo .ui.more {
      position: absolute;
      left: 0;
      right: 0;
      bottom: -18px; }
  .customer-chart > .page-content.list .cards .card .member {
    margin-top: 25px; }
  .customer-chart > .page-content.list .cards .card .member-wrap {
    margin-top: 25px;
    color: #718c96;
    font-size: 12px;
    height: 15px; }
  .customer-chart > .page-content.list .cards .card .empty, .customer-chart > .page-content.list .cards .card .bottom, .customer-chart > .page-content.list .cards .card .prepaid-only, .customer-chart > .page-content.list .cards .card .ticket-only {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0; }
  .customer-chart > .page-content.list .cards .card .empty {
    padding: 14px;
    font-size: 12px;
    text-align: center;
    color: #718c96;
    background: #f4f6f5; }
  .customer-chart > .page-content.list .cards .card .bottom td {
    padding: 14px 0px;
    color: #ffffff;
    font-size: 12px; }
  .customer-chart > .page-content.list .cards .card .bottom .cash {
    background: #3fd2d1; }
  .customer-chart > .page-content.list .cards .card .bottom .ticket {
    background: #45a1ce; }
  .customer-chart > .page-content.list .cards .card .prepaid-only td, .customer-chart > .page-content.list .cards .card .ticket-only td {
    color: #ffffff;
    font-size: 12px;
    padding-top: 14px;
    padding-bottom: 14px; }
    .customer-chart > .page-content.list .cards .card .prepaid-only td.label, .customer-chart > .page-content.list .cards .card .ticket-only td.label {
      position: relative;
      text-align: left;
      padding-left: 10px; }
      .customer-chart > .page-content.list .cards .card .prepaid-only td.label:after, .customer-chart > .page-content.list .cards .card .ticket-only td.label:after {
        position: absolute;
        top: 10px;
        bottom: 10px;
        right: 0;
        width: 1px;
        background: rgba(0, 0, 0, 0.1);
        content: " "; }
    .customer-chart > .page-content.list .cards .card .prepaid-only td.content, .customer-chart > .page-content.list .cards .card .ticket-only td.content {
      text-align: right;
      padding-right: 10px; }
  .customer-chart > .page-content.list .cards .card .prepaid-only tr {
    background: #3fd2d1; }
  .customer-chart > .page-content.list .cards .card .prepaid-only .pipe {
    color: #1ee0d7; }
  .customer-chart > .page-content.list .cards .card .ticket-only tr {
    background: #6ab9f1; }
  .customer-chart > .page-content.list .cards .card .ticket-only .pipe {
    color: #578ebe; }
.customer-chart > .page-content.list .cards .add-new-item-action {
  text-align: center;
  cursor: pointer;
  min-height: 240px; }
  .customer-chart > .page-content.list .cards .add-new-item-action .icon {
    display: inline-block;
    margin-top: 60px;
    background: #ffffff;
    border-radius: 50%; }
  .customer-chart > .page-content.list .cards .add-new-item-action .message {
    margin-top: 30px;
    font-size: 18px;
    line-height: 1.2; }
.customer-chart > .page-content.list .cards .add-new-item-form .input-wrap {
  margin-left: 10px;
  margin-right: 10px; }
.customer-chart > .page-content.list .cards .add-new-item-form .memo {
  display: block;
  resize: none; }
.customer-chart > .page-content.list .cards .add-new-item-form .bottom td.action {
  cursor: pointer;
  font-weight: bold; }
  .customer-chart > .page-content.list .cards .add-new-item-form .bottom td.action.cancel {
    background: #f7f9fb;
    color: #92a5ac; }
  .customer-chart > .page-content.list .cards .add-new-item-form .bottom td.action.submit {
    background: #37454a;
    color: #ffffff; }
.customer-chart > .page-content.list .cards .add-new-item-form input, .customer-chart > .page-content.list .cards .add-new-item-form textarea {
  padding: 0;
  border: 0;
  text-align: center; }
.customer-chart > .page-content.list .cards .add-new-item-form td.action {
  font-size: 12px; }

.customer-chart > .page-content.detail .wrap .left {
  float: left; }
  .customer-chart > .page-content.detail .wrap .left.profile {
    width: 180px; }
    .customer-chart > .page-content.detail .wrap .left.profile .card {
      position: relative;
      padding-bottom: 40px;
      display: block;
      background: #ffffff;
      border: 1px solid #d9e5e7;
      text-align: center; }
      .customer-chart > .page-content.detail .wrap .left.profile .card input, .customer-chart > .page-content.detail .wrap .left.profile .card textarea {
        border: 0;
        padding: 0;
        margin: 0;
        text-align: center; }
      .customer-chart > .page-content.detail .wrap .left.profile .card textarea {
        display: block;
        resize: none; }
      .customer-chart > .page-content.detail .wrap .left.profile .card .input-wrap {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: -1px; }
      .customer-chart > .page-content.detail .wrap .left.profile .card .name {
        margin-top: 30px;
        color: #37454a;
        font-size: 24px; }
      .customer-chart > .page-content.detail .wrap .left.profile .card .contact {
        margin-top: 15px;
        color: #37454a;
        font-size: 16px; }
      .customer-chart > .page-content.detail .wrap .left.profile .card .birthday {
        margin-top: 15px;
        color: #718c96;
        font-size: 12px; }
      .customer-chart > .page-content.detail .wrap .left.profile .card .job {
        margin-top: 15px;
        color: #718c96;
        font-size: 12px; }
      .customer-chart > .page-content.detail .wrap .left.profile .card .memo {
        margin-top: 15px;
        color: #718c96;
        font-size: 12px;
        overflow: hidden; }
      .customer-chart > .page-content.detail .wrap .left.profile .card .member-wrap {
        margin-top: 15px;
        margin-bottom: 20px;
        color: #718c96;
        font-size: 12px; }
      .customer-chart > .page-content.detail .wrap .left.profile .card .bottom {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0; }
        .customer-chart > .page-content.detail .wrap .left.profile .card .bottom td.action {
          padding: 14px;
          font-size: 12px;
          font-weight: bold;
          cursor: pointer; }
          .customer-chart > .page-content.detail .wrap .left.profile .card .bottom td.action.cancel {
            background: #f7f9fb; }
            .customer-chart > .page-content.detail .wrap .left.profile .card .bottom td.action.cancel a {
              color: #92a5ac; }
          .customer-chart > .page-content.detail .wrap .left.profile .card .bottom td.action.submit {
            background: #37454a; }
            .customer-chart > .page-content.detail .wrap .left.profile .card .bottom td.action.submit a {
              color: #ffffff; }
    .customer-chart > .page-content.detail .wrap .left.profile .prepaid-information, .customer-chart > .page-content.detail .wrap .left.profile > .ticket-information {
      line-height: 40px;
      color: #ffffff;
      font-size: 12px; }
      .customer-chart > .page-content.detail .wrap .left.profile .prepaid-information td.label, .customer-chart > .page-content.detail .wrap .left.profile > .ticket-information td.label {
        position: relative;
        text-align: left;
        padding-left: 10px; }
        .customer-chart > .page-content.detail .wrap .left.profile .prepaid-information td.label:after, .customer-chart > .page-content.detail .wrap .left.profile > .ticket-information td.label:after {
          position: absolute;
          top: 10px;
          bottom: 10px;
          right: 0;
          width: 1px;
          background: rgba(0, 0, 0, 0.1);
          content: " "; }
      .customer-chart > .page-content.detail .wrap .left.profile .prepaid-information td.content, .customer-chart > .page-content.detail .wrap .left.profile > .ticket-information td.content {
        text-align: right;
        padding-right: 10px; }
    .customer-chart > .page-content.detail .wrap .left.profile .prepaid-information {
      margin-top: 15px; }
      .customer-chart > .page-content.detail .wrap .left.profile .prepaid-information table {
        border: 1px solid #1ee0d7; }
      .customer-chart > .page-content.detail .wrap .left.profile .prepaid-information tr {
        background: #58e5e4; }
      .customer-chart > .page-content.detail .wrap .left.profile .prepaid-information .pipe {
        color: #1ee0d7; }
    .customer-chart > .page-content.detail .wrap .left.profile .ticket-information {
      margin-top: 5px; }
      .customer-chart > .page-content.detail .wrap .left.profile .ticket-information table {
        border: 1px solid #578ebe; }
      .customer-chart > .page-content.detail .wrap .left.profile .ticket-information tr {
        background: #6ab9f1; }
      .customer-chart > .page-content.detail .wrap .left.profile .ticket-information .pipe {
        color: #578ebe; }
    .customer-chart > .page-content.detail .wrap .left.profile > .action {
      display: block;
      margin-top: 5px;
      line-height: 40px;
      text-align: center;
      font-size: 13px; }
      .customer-chart > .page-content.detail .wrap .left.profile > .action.charge-prepaid {
        color: #37454a; }
        .customer-chart > .page-content.detail .wrap .left.profile > .action.charge-prepaid .text {
          text-decoration: underline;
          font-weight: bold; }
        .customer-chart > .page-content.detail .wrap .left.profile > .action.charge-prepaid img {
          margin-left: 10px; }
      .customer-chart > .page-content.detail .wrap .left.profile > .action.send-sms {
        background: #37454a;
        color: #ffffff;
        font-weight: bold; }
  .customer-chart > .page-content.detail .wrap .left.data {
    width: 640px;
    margin-left: 20px; }
    .customer-chart > .page-content.detail .wrap .left.data .overflow-wrap {
      overflow: hidden;
      max-height: 250px; }
    .customer-chart > .page-content.detail .wrap .left.data .ui.more {
      border: 1px solid #d8e5e7;
      border-top: 0; }
    .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap {
      background: #ffffff;
      border: 1px solid #d8e5e7;
      position:relative;}

      .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .title {
        padding: 20px;
        font-size: 16px;
        color: #37454a; }
      .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history {
        padding: 10px 20px 0px 20px;
        border-bottom: 1px solid #dce8ea; }
        .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .select-wrap {
        float:left; margin-top:6px}
        .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history:first-child {
          padding-top: 0; }
        .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history:last-child {
          border-bottom: 0; }
        .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .thumbnail {
          float: left;
          width: 40px;
          height: 40px; }
        .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left {
          float: left;
          margin-left: 10px;
          /*line-height: 20px;*/}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .name-wrap {
          display:inline-block;
          }
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .pet-name span {
          color:#718c96;
          }
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .name {
            display: inline-block;
            margin-top: 3px;
            margin-bottom: 5px;
            color: #37454a;
            /*font-weight: bold;*/
            width: 140px;
            overflow: hidden;
            text-overflow: ellipsis;
    		white-space: nowrap; }
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .description {
            display: inline-block;
            font-size: 12px;
            color: #718c96;
            width: 50px;
            height:20px;
            vertical-align: -10px;
/*			overflow: hidden;*/
/*     		margin-top: 3px; */
            margin-bottom: 5px;
/*             text-overflow: ellipsis; */
/*     		white-space: nowrap; */
    		position: relative;
    		top: -10px;}
    	  	.customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .description	.ribon {
		      position: absolute;
		      top: 0;
		      width: 0;
		      height: 0;
		      border-top: 10px solid #58e5e4;
		      border-right: 10px solid transparent; }
		    .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .description	.prepaid-block {
		      display: none;
		      position: absolute;
		      width: 300px;
		      left: 28px;
		      bottom: 0;
		      margin-right: 10px;
		      padding: 8px 6px;
		      color: #ffffff;
		      background: #3fd2d1;
		      border-radius: 3px;
		      z-index: 999; }
		      .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .description .prepaid-block .text{
		        display: inline-block;
        		margin-right: 25px; }
		    .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .description:hover .prepaid-block {
		      display: inline-block; }
		  .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-left .image {
          	display: inline-block;
    		top: -8px;
    		left: -8px;
    		width: 30px;
    		position: relative;
    		text-align: center;
    		cursor:pointer; }
        .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right {
          float: right;
          /*line-height: 30px; */}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .member-name {
            display: inline-block;
            width: 90px; /*width: 50px;*/
            margin-right: 10px;
            color: #37454a;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .amt {
            display: inline-block;
            margin-right: 10px;
            width:70px;
            color: #37454a; }
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .amt-price {
          	display:inline-block;
          	margin-right:15px;}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .amt-price .price-first {
          	color: #37454a;
          	font-weight:bold;
          	text-decoration:line-through;}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .amt-price .price-discount {
          	display:inline-block;
          	position:relative;
          	margin-left:5px;
          	padding-right:10px;
          	color:#eb3e3e;
          	font-weight:bold;}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .amt-price .price-plus {
          	display:inline-block;
          	position:relative;
          	margin-left:5px;
          	padding-right:10px;
          	color:#37b7f7;
          	font-weight:bold;}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .amt-price .ic_price-discount {
          	display:block;
          	position:absolute;
          	top:4px; right:0;
          	width:8px; height:6px;
          	background-image:url('/resources/static/img/icon/ic_price-discount-853281bcc1b89c2210cc0c8759821128.png');background-repeat:no-repeat;}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .amt-price .ic_price-plus {
          	display:block;
          	position:absolute;
          	top:4px; right:0;
          	width:8px; height:6px;
          	background-image:url('/resources/static/img/icon/ic_price-plus-b3e9d3ac2c05c55079c219c33a78ea25.png');background-repeat:no-repeat;}
          .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .histories .history .wrap-right .date {
            display: inline-block;
            font-size: 12px;
            color: #718c96; }
      .customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .ui.more {
        border: 0; }
      /*.customer-chart > .page-content.detail .wrap .left.data .treatment-history-wrap .ui.more:after {
    	content: "";}*/
    .customer-chart > .page-content.detail .wrap .left.data .prepaid-history, .customer-chart > .page-content.detail .wrap .left.data .ticket-history {
      margin-top: 20px;
      margin-bottom: 20px; }
      .ticket-history .TabSelect-area {width:588px}
      .ticket-history .TabSelect-area ul li {width:98px}
      .customer-chart > .page-content.detail .wrap .left.data .prepaid-history .fat-header, .customer-chart > .page-content.detail .wrap .left.data .ticket-history .fat-header {
        position:relative;
        font-size: 16px; }
      .customer-chart > .page-content.detail .wrap .left.data .prepaid-history .id, .customer-chart > .page-content.detail .wrap .left.data .prepaid-history .diff, .customer-chart > .page-content.detail .wrap .left.data .prepaid-history .remaining, .customer-chart > .page-content.detail .wrap .left.data .ticket-history .id, .customer-chart > .page-content.detail .wrap .left.data .ticket-history .diff, .customer-chart > .page-content.detail .wrap .left.data .ticket-history .remaining {
        width: 100px; }
      .customer-chart > .page-content.detail .wrap .left.data .prepaid-history .date, .customer-chart > .page-content.detail .wrap .left.data .ticket-history .date {
        width: 100px; }
    .customer-chart > .page-content.detail .wrap .left.data .prepaid-history .action.charge, .customer-chart > .page-content.detail .wrap .left.data .ticket-history .action.charge {
      position:absolute;
      top:24px; right:20px;
      color: #37454a;
      font-size: 12px; }
      .customer-chart > .page-content.detail .wrap .left.data .prepaid-history .action.charge span, .customer-chart > .page-content.detail .wrap .left.data .ticket-history .action.charge span {
        text-decoration: underline;
        font-weight: bold; }
      .customer-chart > .page-content.detail .wrap .left.data .prepaid-history .action.charge i, .customer-chart > .page-content.detail .wrap .left.data .ticket-history .action.charge i {
        margin-left: 10px; }

.customer-membership .table-wrap.customers td.prepaid a, .customer-membership .table-wrap.customers td.ticket a {
  text-decoration: underline; }
.customer-membership .table-wrap.customers .action a, .customer-membership .table-wrap.customers .name a {
  text-decoration: underline; }

.customer-membership .page-content .left .page-content-header-title {
	display: inline-block;
	margin-right: 10px;
	font-weight: 500;
}
.customer-membership .page-content .left .page-content-header-content {
	display: inline-block;
	margin-right: 16px;
}
.customer-membership .page-content .left .input-no-visit{
	width: 40px;
    border: 0;
    text-align: right;
    position: relative;
    font-size: 14px

}
.customer-membership .page-content .left .left-content {
	font-size:14px;
}
.customer-membership .page-content .remaining {
  margin-bottom:10px;
  font-size: 12px;
  color: #718c96;
}
.customer-membership .page-content .right {
	text-align: right;
}
.customer-membership .page-content .right .setting {
    cursor: pointer;
    margin-bottom: 5px;
    margin-top: -3px;
}

/* 매출등록 최종결제 수정 */
div.Newsale_table_div {padding:20px;}
table.Newsale_table {border:0;}
table.Newsale_table td {height: 25px; font-size: 13px; vertical-align: top; line-height: 22px; padding: 0 0 10px 0;}
table.Newsale_table td.type {font-weight: bold; color: #37454a;}
table.Newsale_table td.content {color: #718c96;}
table.Newsale_table td.count {width:10%; text-align: center; font-weight: bold;}
table.Newsale_table td.price {text-align: right; font-weight: bold;}
table.Newsale_table td.red {color: #da5251;}
/* 매출등록 최종결제 수정 191204*/

.modal.customer-membership-history .overflow-wrap {
  max-height: 250px;
  overflow: auto; }

.modal.customer-charge-membership .table-wrap input.money, .modal.customer-charge-membership .table-wrap input.times {
  text-align: right; }
.modal.customer-charge-membership .table-wrap .date-suffix {
  display: inline-block;
  margin-right: 5px;
  color: #3fd2d1; }
.modal.customer-charge-membership .table-wrap .range-types {
  margin-top: 10px; }
.modal.customer-charge-membership .table-wrap .range-type {
  color: #718c96;
  margin-right: 5px;
  text-decoration: underline; }
.modal.customer-charge-membership .membership-cashinput input {
  float:left; width:90px; height:28px; border:1px solid #d9e6e8; padding:0 10px; text-align:right;
}
.modal.customer-charge-membership .membership-cashinput .subtxt {
  float:left; line-height:28px; margin:0 13px 0 5px; color:#718c96;
}
.modal.customer-charge-membership .membership-cashinput .btn-area {
  float:left;
}
.modal.customer-charge-membership .membership-cashinput .btn-area button {
  float:left; width:40px; height:28px;line-height:26px; border:1px solid #d9e6e8; color:#718c96;
}
.modal.customer-charge-membership .membership-cashinput .btn-area button.active {
  background:#37454a; border:none; color:#fff;
}
.modal.customer-charge-membership .membership-cashinput .btn-area button:first-child {
  border-right:none;
}

.manage-sales .page-content.list-of-member > .page-content-header-wrap .inactive, .manage-sales .page-content.list-of-customer > .page-content-header-wrap .inactive {
  color: #bbc4c8; }
.manage-sales .page-content.list-of-member > .page-content-header-wrap .tilde, .manage-sales .page-content.list-of-customer > .page-content-header-wrap .tilde {
  display: inline-block;
  margin-right: 10px; }
.manage-sales .page-content.list-of-member > .pagination, .manage-sales .page-content.list-of-customer > .pagination {
  margin-top: 30px;
  margin-bottom: 30px; }

.manage-sales .page-content.list .new-item {
  display: block;
  text-align: center; }
  .manage-sales .page-content.list .new-item a {
    color: #37454a; }
  .manage-sales .page-content.list .new-item .icon-circle-plus {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle; }
  .manage-sales .page-content.list .new-item .text {
    display: inline-block;
    font-size: 24px;
    vertical-align: middle; }
.manage-sales .page-content.list .unregistered-list {
  margin-top: 20px; }
  .manage-sales .page-content.list .unregistered-list .overflow-wrap {
    overflow: hidden;
    max-height: 120px; }
  .manage-sales .page-content.list .unregistered-list .ui.more {
    border: 1px solid #d8e5e7;
    border-top: 0; }
  .manage-sales .page-content.list .unregistered-list table .column {
    padding-left: 10px;
    padding-right: 10px;
    background: #fafcfc;
    text-align: left; }
  .manage-sales .page-content.list .unregistered-list table .remove {
    padding-left: 20px; }
  .manage-sales .page-content.list .unregistered-list table .meta {
    color: #3fd2d1;
    font-weight: bold; }
  .manage-sales .page-content.list .unregistered-list table .name {
    font-weight: bold; }
  .manage-sales .page-content.list .unregistered-list table .name a {
    word-break: break-word; }
  .manage-sales .page-content.list .unregistered-list table .price {
    font-weight: bold; }
  .manage-sales .page-content.list .unregistered-list table .action {
    text-align: right; }
    .manage-sales .page-content.list .unregistered-list table .action a {
      color: #37454a; }
    .manage-sales .page-content.list .unregistered-list table .action .text {
      text-decoration: underline;
      margin-right: 10px;
      font-weight: bold; }
.manage-sales .page-content.list .registered-list {
  margin-top: 30px; }
  .manage-sales .page-content.list .registered-list > .header {
    height: 40px; }
    .manage-sales .page-content.list .registered-list > .header .left {
      float: left; }
    .manage-sales .page-content.list .registered-list > .header .right {
      float: right;
      margin-top: 10px;
      font-size: 18px;
      color: #bbc4c8; }
      .manage-sales .page-content.list .registered-list > .header .right .tilde {
        display: inline-block;
        margin-right: 10px; }
  .manage-sales .page-content.list .registered-list .table-wrap {
    margin-top: 10px; }
    .manage-sales .page-content.list .registered-list .table-wrap td.payment-type {
      /*text-align: left;*/ }
    .manage-sales .page-content.list .registered-list .table-wrap td a {
      display: inline-block;
      padding: 10px 10px;
      font-weight: bold;
      color: #20232B;
      word-break: break-word; }
    .manage-sales .page-content.list .registered-list .table-wrap td a.modify {
      background: #58e5e4;
      color: #ffffff;
      margin-right: 5px;}
    .manage-sales .page-content.list .registered-list .table-wrap td a.delete {
      background: #f16aa3;
      color: #ffffff;}
    .manage-sales .page-content.list .registered-list .table-wrap td a.action {
      margin-right: 10px;
      font-weight: bold;
      text-decoration: underline;
      padding: 0;
      margin: 0; }
    .manage-sales .page-content.list .registered-list .table-wrap td button {
       border:none; border-radius:2px; paddiing:0 12px; height:22px; line-height:18px; font-size:11px;color:#fff; margin:0 2px;
       }
    .manage-sales .page-content.list .registered-list .table-wrap td  button.btn-save {
       background:#37454a;
       }
    .manage-sales .page-content.list .registered-list .table-wrap td  button.btn-print {
       background:#717c7f;
       }
.manage-sales .page-content.list .pagination {
  margin-top: 20px;
  margin-bottom: 30px; }

.manage-sales .page-content.register .date {
  margin-left: 20px;
  margin-bottom: 20px; }
  .manage-sales .page-content.register .date .sub-title {
    margin-right: 20px;
    font-size: 18px;
    font-weight: bold; }
  .manage-sales .page-content.register .date .ui.choose-date .text {
    font-size: 18px; }
.manage-sales .page-content.register .search-customer-wrap {
  background: #ffffff;
  border: 1px solid #d8e5e7;
  padding: 20px 20px; }
  .manage-sales .page-content.register .search-customer-wrap .title {
    display: inline-block;
    margin-right: 20px;
    font-size: 18px; }
  .manage-sales .page-content.register .search-customer-wrap .input-wrap {
    display: inline-block;
    margin-right: 10px; }
    .manage-sales .page-content.register .search-customer-wrap .input-wrap input {
      width: 120px;
      font-size: 18px;
      border: 0;
      padding: 0; }
  .manage-sales .page-content.register .search-customer-wrap .search-results {
    display: inline-block; }
    .manage-sales .page-content.register .search-customer-wrap .search-results .item {
      display: inline-block;
      margin-right: 5px;
      padding: 5px;
      border: 1px solid #d8e5e7;
      background: #fafcfc; }
      .manage-sales .page-content.register .search-customer-wrap .search-results .item .text {
        margin-right: 5px; }
.manage-sales .page-content.register .table-wrap.treatment,
.manage-sales .page-content.register .table-wrap.product,
.manage-sales .page-content.register .table-wrap.etc,
.manage-sales .page-content.register .table-wrap.result,
.manage-sales .page-content.register .table-wrap.member,
.manage-sales .page-content.register .table-wrap.payment,
.manage-sales .page-content.register .table-wrap.point-ready {
  margin-top: 15px; }
  .manage-sales .page-content.register .table-wrap.treatment .fat-header .title,
  .manage-sales .page-content.register .table-wrap.product .fat-header .title,
  .manage-sales .page-content.register .table-wrap.etc .fat-header .title,
  .manage-sales .page-content.register .table-wrap.result .fat-header .title,
  .manage-sales .page-content.register .table-wrap.member .fat-header .title,
  .manage-sales .page-content.register .table-wrap.payment .fat-header .title,
  .manage-sales .page-content.register .table-wrap.point-ready .fat-header .title {
    display: inline-block;
    margin-right: 20px;
    font-size: 18px; }
  .manage-sales .page-content.register .table-wrap.treatment .fat-header .ui.dropdown,
  .manage-sales .page-content.register .table-wrap.product .fat-header .ui.dropdown,
  .manage-sales .page-content.register .table-wrap.etc .fat-header .ui.dropdown,
  .manage-sales .page-content.register .table-wrap.result .fat-header .ui.dropdown,
  .manage-sales .page-content.register .table-wrap.member .fat-header .ui.dropdown,
  .manage-sales .page-content.register .table-wrap.payment .fat-header .ui.dropdown,
  .search-customer-wrap .ui.dropdown {
    font-size: 16px;
    font-weight: normal; }
  .manage-sales .page-content.register .table-wrap.treatment .column,
  .manage-sales .page-content.register .table-wrap.product .column,
  .manage-sales .page-content.register .table-wrap.etc .column,
  .manage-sales .page-content.register .table-wrap.result .column,
  .manage-sales .page-content.register .table-wrap.member .column,
  .manage-sales .page-content.register .table-wrap.payment .column {
    background: #f9fbfb; }
  .manage-sales .page-content.register .table-wrap .column .memo {
    width: 100%;
    border: 1px solid #dce8ea;
    height: 100px;
    padding: 10px;
  }
.manage-sales .page-content.register .table-wrap.treatment .category, .manage-sales .page-content.register .table-wrap.product .category {
  text-align: left;
  font-weight: bold;
  width: 15%; }
.manage-sales .page-content.register .table-wrap.treatment .name, .manage-sales .page-content.register .table-wrap.product .name {
  text-align: left;
  font-weight: bold;
  color: #37454a;
  width:20%; }
.manage-sales .page-content.register .table-wrap.treatment .price, .manage-sales .page-content.register .table-wrap.product .price {
  text-align: left; }
.manage-sales .page-content.register .table-wrap.treatment .quantity, .manage-sales .page-content.register .table-wrap.product .quantity {
  text-align: right; }
.manage-sales .page-content.register .table-wrap.treatment .calculated-price, .manage-sales .page-content.register .table-wrap.product .calculated-price {
  text-align: right;
  font-weight: bold;
  color: #37454a; }
.manage-sales .page-content.register .table-wrap.etc .type {
  width: 70px;
  text-align: left;
  color: #37454a;
  font-weight: bold; }
.manage-sales .page-content.register .table-wrap.etc .price {
  text-align: right;
  color: #718c96; }
  .manage-sales .page-content.register .table-wrap.etc .price input {
    text-align: right;
    background: white;
    margin-right: 3px;
    border: 1px solid #dce8ea;
    width: 100px;
    height: 30px;
    padding: 5px; }
.manage-sales .page-content.register .table-wrap.result tbody.outside ul {
  margin: 0;
  padding: 20px;
  list-style: none; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li {
    height: 25px; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.sell div {
    display: inline-block;
    line-height: 25px; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.sell .type {
    font-weight: bold;
    color: #37454a;
    vertical-align: top; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.sell .content {
    margin-left: 5px;
    color: #718c96;
    padding-left: 40px;
    max-width: 513px;
    width: auto;
    /*white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;*/
    vertical-align: top; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.sell .count {
    float: right;
    font-weight: bold; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.sell .price {
    float: right;
    margin-left: 70px;
    font-weight: bold; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.discount div {
    display: inline-block;
    line-height: 25px; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.discount .type {
    color: #da5251;
    font-weight: bold;
    vertical-align: top; }
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.discount .content {
    margin-left: 13px;
    color: #718c96;}
  .manage-sales .page-content.register .table-wrap.result tbody.outside ul li.discount .price {
    float: right;
    color: #da5251;
    font-weight: bold; }
.manage-sales .page-content.register .table-wrap.result tfoot.outside {
  background: #f9fbfb;
  color: #000;
  font-size: 16px;
  font-weight: 500;}
  .manage-sales .page-content.register .table-wrap.result tfoot.outside td {
    padding: 20px; }
  .manage-sales .page-content.register .table-wrap.result tfoot.outside .left {
    float: left; }
  .manage-sales .page-content.register .table-wrap.result tfoot.outside .right {
    float: right;
    color: #207eff;
    font-weight: 900;}
.manage-sales .page-content.register .table-wrap.member .name {
  text-align: left;
  color: #37454a; }
.manage-sales .page-content.register .table-wrap.member .price {
  text-align: right;
  color: #718c96; }
  .manage-sales .page-content.register .table-wrap .price input {
    text-align: right;
    background: white;
    margin-right: 3px;
    border: 1px solid #dce8ea;
    width: 100px;
    height: 30px;
    padding: 5px; }
.deposit {
  display:flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 30px;
  border-bottom: 1px solid #dce8ea;
  height: 71px;
  background-color: #f9fbfb;
  color: #000;
  font-size: 16px;}
.deposit-payment {
  display: flex;
  align-items: center;
  gap: 8px;
}
.deposit .over-deposit-noti {
  margin-left: 8px;
  font-size: 14px;
  color: #227EFF;
  font-weight: 400;
}
.deposit-payment .frm_select {
  font-size: 11px;
  height: auto;
}
.deposit-payment .price-wrap {
  font-size: 13px;
  color: #718c96;
}
.deposit-payment .price-wrap input {
  text-align: right;
  background: white;
  margin-right: 3px;
  border: 1px solid #dce8ea;
  width: 100px;
  height: 30px;
  padding: 5px;
}
.deposit-payment .price-wrap input[type=number][type=number] {
  -moz-appearance: textfield; }
.deposit-payment .price-wrap input[type=number][type=number]::-webkit-inner-spin-button, .table-wrap.list td.column input[type=number][type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0; }
.manage-sales .page-content.register .table-wrap.payment .column {
  padding: 25px 30px;
  text-align: left; }
.manage-sales .page-content.register .table-wrap.payment ul li {
  height: 35px;
  margin-bottom: 20px; }
  .manage-sales .page-content.register .table-wrap.payment ul li:last-child {
    margin-bottom: 0; }
  .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap {
    display: inline-block; }
    .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap .ui.checkbox input + label {
      padding-left: 40px; }
    .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap .prepaid-option-content {
      display: inline-block; }
      .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap .prepaid-option-content .prepaid-block {
        display: inline-block;
        margin-right: 10px;
        padding: 8px 12px;
        color: #ffffff;
        background: #227eff;
        border-radius: 2px;
        font-size: 12px; }
        .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap .prepaid-option-content .prepaid-block .text {
          display: inline-block;
          margin-right: 15px; }
        .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap .prepaid-option-content .prepaid-block .balance {
          display: inline-block;
          position: relative; }
          .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap .prepaid-option-content .prepaid-block .balance:before {
            content: " ";
            position: absolute;
            left: -10px;
            top: 0px;
            bottom: 0px;
            width: 1px;
            background: #ffffff; }
    .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap .action {
      color: #37454a;
      font-size: 13px; }
      .manage-sales .page-content.register .table-wrap.payment ul li .checkbox-wrap .action .text {
        text-decoration: underline;
        margin-right: 5px;
        font-weight: bold; }
  .manage-sales .page-content.register .table-wrap.payment ul li .price-wrap {
    float: right; }
    .manage-sales .page-content.register .table-wrap.payment ul li .price-wrap input {
      text-align: right;
      background: white;
      margin-right: 3px;
      border: 1px solid #dce8ea;
      width: 100px;
      height: 30px;
      padding: 5px; }
    .manage-sales .page-content.register .table-wrap.payment ul li .price-wrap.active {
      color: #37454a;
      font-weight: bold; }
      .manage-sales .page-content.register .table-wrap.payment ul li .price-wrap.active input {
        font-weight: bold; }
   .manage-sales .page-content.register .table-wrap .ready-txt {
   	display:inline-block;
   }
   .manage-sales .page-content.register .table-wrap .ready-txt span {
    display:inline-block; margin-right:5px;
   }
   .manage-sales .page-content.register .table-wrap .ready-check {
   position:absolute; top:50%; right:135px; margin-top:-10px;
   }
   .manage-sales .page-content.register .table-wrap .title-btn {
    float:right;
   }
   .manage-sales .page-content.register .table-wrap .title-btn button {
   	padding:0 20px;
   	height:30px; line-height:30px;
   	border:1px solid #37454a;
   	font-weight:bold;
   	margin:-5px 0;
   }
.table-wrap.point {
	margin-bottom:10px;
}
.table-wrap.point td.column {
    background: #fafcfc;
}
.table-wrap.point td.column.tit {
	text-align:left;
	font-size:14px;
	color:#37454a;
	padding-left:20px;
}
.table-wrap.point .price input {
    text-align: right;
    background: white;
    margin-right: 3px;
    border: 1px solid #dce8ea;
    width: 100px;
    height: 30px;
    padding: 5px;
}
.table-wrap.point .price .sub-tit {
	display:inline-block;
	margin-right:10px;
	font-size:14px;
	font-weight:bold;
}
.table-wrap.point .price .unit {
	display:inline-block;
	margin-left:5px;
	color:#718c96;
}

.register-action-wrap {
  margin-top: 40px;
  margin-bottom: 40px;
  text-align: center; }
  .register-action-wrap .action {
  	display:inline-block;
  	font-size:14px;
    min-width:124px; height:48px; line-height:48px; padding:0 20px;
    background: #000;
    color: #ffffff;
    border-radius: 2px;}

.manage-sales > .page-content.shop > .today .summary-wrap {
  border: 1px solid var(--color-gray-100);
  background:var(--color-bg-100);
  border-radius:8px;
  overflow:hidden;
  color:var(--color-gray-700);
}
.manage-sales > .page-content.shop > .today .summary-wrap table {
  height:78px;
}
.manage-sales > .page-content.shop > .today .summary-wrap table .date {
  width: 78px;
  background: var(--color-primary-200);
  color: var(--color-gray-white);
  text-align: center;
}
.manage-sales > .page-content.shop > .today .summary-wrap table .date .year-month {
  font-size:var(--font-size-s);
  font-weight:var(--font-weight-medium);
  line-height: var(--line-height-s);
}
.manage-sales > .page-content.shop > .today .summary-wrap table .date .day {
  font-size:var(--font-size-xxl);
  font-weight:var(--font-weight-bold);
  line-height: var(--line-height-xxl);
}
.manage-sales > .page-content.shop > .today .summary-wrap table .information {
  padding-left: 20px;
}
.manage-sales > .page-content.shop > .today .summary-wrap table .information .label {
  margin-bottom: 4px;
  font-size:var(--font-size-m);
  font-weight:var(--font-weight-bold);
  line-height: var(--line-height-m-20);
}
.manage-sales > .page-content.shop > .today .summary-wrap table .information .description {
  font-size:var(--font-size-s);
  font-weight:var(--font-weight-medium);
  line-height: var(--line-height-s);
  color: var(--color-gray-500);
}
.manage-sales > .page-content.shop > .today .summary-wrap table .information .description b {
  margin-left: 4px;
  font-weight:var(--font-weight-bold);
}
.manage-sales > .page-content.shop > .today .summary-wrap table .sales {
  padding-right: 20px;
  text-align: right;
}

.manage-sales > .page-content.shop > .today .summary-wrap table .sales .label {
  font-size:var(--font-size-s);
  font-weight:var(--font-weight-medium);
  line-height: var(--line-height-s);
  color: var(--color-gray-500);
  margin-right:4px;
  vertical-align: middle;
}
.manage-sales > .page-content.shop > .today .summary-wrap table .sales .price {
  font-size:var(--font-size-xl);
  font-weight:var(--font-weight-bold);
  line-height: var(--line-height-xl);
  vertical-align: middle;
}
.manage-sales > .page-content.shop > .today .period-wrap {
  margin-top: 20px;
  display:flex;
  justify-content: space-between;
  align-items: center;
}
  .manage-sales > .page-content.shop > .today .period-wrap .right {
    font-size:var(--font-size-m);
    font-weight:var(--font-weight-bold);
    line-height: var(--line-height-m-24);
    color: var(--color-gray-300);
  }
    .manage-sales > .page-content.shop > .today .period-wrap .right .tilde {
      display: inline-block;
      margin-right: 10px; }

/* S: 통계 도넛 차트 CSS */
.sales-doughnut-chart {
  display:flex;
  align-items: center;
  justify-content: space-between;
  background: var(--color-gray-white);
  padding:20px 80px 40px;
  color:var(--color-gray-700);
}

.sales-doughnut-chart--box {
  border-radius:8px;
  box-shadow: 0 3px 10px var(--color-shadow-2);
}

.sales-doughnut-chart__title {
  font-size:var(--font-size-l);
  font-weight:var(--font-weight-bold);
  line-height: var(--line-height-l);
  margin:0;
}

.sales-doughnut-chart__content {
  margin-top:20px;
  display:flex;
  align-items:center;
  gap:40px;
}

.sales-doughnut-chart__table {
  text-align: left;
  max-width: 220px;
}

.sales-doughnut-chart__table th, sales-doughnut-chart__table td {
  padding:0;
}

.sales-doughnut-chart__table tbody tr:not(:last-child) th, .sales-doughnut-chart__table tbody tr:not(:last-child) td {
  padding-bottom:4px;
}

.sales-doughnut-chart__table tbody th {
  font-size:var(--font-size-m);
  font-weight:var(--font-weight-bold);
  line-height: var(--line-height-m-20);
}

.sales-doughnut-chart__table .label-bullet {
  display:inline-block;
  vertical-align: middle;
  width:8px;
  height:8px;
  border-radius:8px;
  background:var(--label-bullet-color);
  margin-right:4px;
}

.sales-doughnut-chart__table tbody td {
  text-align: right;
  font-size:var(--font-size-m);
  font-weight:var(--font-weight-regular);
  line-height: var(--line-height-m-20);
}

/* E: 통계 도넛 차트 CSS */

.manage-sales > .page-content.shop > .today .statistic-calc-information {
  background:var(--color-bg-300);
  border-radius: 8px;
  padding:12px;
  color:var(--color-gray-700);
  margin-top:20px;

}
.manage-sales > .page-content.shop > .today .statistic-calc-information__title {
  font-size:var(--font-size-s);
  font-weight:var(--font-weight-medium);
  line-height: var(--line-height-s);
  color:var(--color-primary-300);
  margin:0;
  display: inline-flex;
  align-items: center;
  gap:4px;
}

.manage-sales > .page-content.shop > .today .statistic-calc-information__title-icon {
  filter: brightness(0) saturate(100%) invert(33%) sepia(75%) saturate(2069%) hue-rotate(205deg) brightness(103%) contrast(101%);
}
.manage-sales > .page-content.shop > .today .statistic-calc-information__list {
  display: flex;
  flex-direction: column;
  gap:4px;
  margin-top:8px;
}
.manage-sales > .page-content.shop > .today .statistic-calc-information__list-item {
  display:flex;
  align-items: center;
  margin:0;
  font-size:var(--font-size-s);
  font-weight:var(--font-weight-regular);
  line-height: var(--line-height-s);
}

.manage-sales > .page-content.shop > .today .table-wrap {
  margin-top: 10px; }
.manage-sales > .page-content.shop > .today .pagination {
  margin-top: 30px;
  margin-bottom: 30px; }

.manage-sales > .page-content.shop > .report .graph-wrap {
  position:relative;
  background: #ffffff;
  border: 1px solid #dde8ea; }
  .manage-sales > .page-content.shop > .report .graph-wrap .header {
    position: relative;
    text-align: center;
    padding: 30px 20px;
    border-bottom: 1px solid #dde8ea; }
    .manage-sales > .page-content.shop > .report .graph-wrap .header .ui.choose-date {
      font-size: 20px;
      color: #37454a; }
    .manage-sales > .page-content.shop > .report .graph-wrap .header .range {
      position: absolute;
      top: 23px;
      right: 25px; }
      .manage-sales > .page-content.shop > .report .graph-wrap .header .range .item {
        display: inline-block;
        border: 1px solid #d8e5e7;
        padding: 10px 15px;
        color: #718c96;
        background: #f7f9fb; }
        .manage-sales > .page-content.shop > .report .graph-wrap .header .range .item:not(:first-child) {
          border-left: 0; }
        .manage-sales > .page-content.shop > .report .graph-wrap .header .range .item.active {
          color: #37454a;
          background: #ffffff; }
  .manage-sales > .page-content.shop > .report .graph-wrap .body {
    padding-bottom:30px;
    line-height: 200px;
    text-align: center; }
  .manage-sales > .page-content.shop > .report .graph-wrap .footer {
    height: auto;
    padding: 10px;
    background: #ffffff;
    text-align: center; }
    .manage-sales > .page-content.shop > .report .graph-wrap .footer ul.items {
      display: inline-block;
      padding: 0;
      list-style: none; }
      .manage-sales > .page-content.shop > .report .graph-wrap .footer ul.items li.item {
        display: inline-block;
        margin-right: 20px; }
        .manage-sales > .page-content.shop > .report .graph-wrap .footer ul.items li.item .icon {
          display: inline-block;
          width: 10px;
          height: 10px;
          margin-right: 5px; }
          .manage-sales > .page-content.shop > .report .graph-wrap .footer ul.items li.item .icon.color1 {
            background: #6ab9f1; }
          .manage-sales > .page-content.shop > .report .graph-wrap .footer ul.items li.item .icon.color2 {
            background: #897bf6; }
          .manage-sales > .page-content.shop > .report .graph-wrap .footer ul.items li.item .icon.color3 {
            background: #ffcf8b; }
          .manage-sales > .page-content.shop > .report .graph-wrap .footer ul.items li.item .icon.color4 {
            background: #f16aa3; }
        .manage-sales > .page-content.shop > .report .graph-wrap .footer ul.items li.item .text {
          color: #718c96; }
.manage-sales > .page-content.shop > .report .table-wrap {
  margin-top: 10px; }
.manage-sales > .page-content.shop > .report .pagination {
  margin-top: 30px;
  margin-bottom: 30px; }

.manage-sales .page-content.list-of-member .table-wrap .member .indicator-wrap {
  margin-top: 10px; }
.manage-sales .page-content.list-of-member .table-wrap .member .column-option-selectable .options {
  margin-top: 23px; }
.manage-sales .page-content.list-of-member .table-wrap .service-header {
  width: 210px; }
.manage-sales .page-content.list-of-member .table-wrap .product-header {
  width: 140px; }
.manage-sales .page-content.list-of-member .table-wrap th.service-sales, .manage-sales .page-content.list-of-member .table-wrap th.service-prepaid, .manage-sales .page-content.list-of-member .table-wrap th.service-ticket,
.manage-sales .page-content.list-of-member .table-wrap th.product-sales, .manage-sales .page-content.list-of-member .table-wrap th.product-prepaid {
  padding-left: 0px;
  padding-right: 0px; }
.manage-sales .page-content.list-of-member .table-wrap td.column {
  padding-left: 5px;
  padding-right: 5px; }

.manage-sales .page-content.list-of-customer .table-wrap th, .manage-sales .page-content.list-of-customer .table-wrap td {
  padding-left: 10px;
  padding-right: 10px; }

.manage-sales .page-content.list-of-customer .table-wrap td.name{color:#37454a;font-weight:bold;}

.modal.select-product .options {
  padding: 20px;
  height:250px;
  overflow-y:auto;
  overflow-x:hidden;
  background: #ffffff; }

.page.sms .page-content.send .table-wrap .sms-content {
  vertical-align: top; }
  .page.sms .page-content.send .table-wrap .sms-content td.content .input-wrap {
    margin-bottom: 5px; }
    .page.sms .page-content.send .table-wrap .sms-content td.content .input-wrap textarea {
      min-height: 100px; }
  .page.sms .page-content.send .table-wrap .sms-content td.content .character-counter-wrap {
    color: #bbc4c8; }
.page.sms .page-content.send .table-wrap .recipient {
  vertical-align: top; }
  .sendnum-txt {display:inline-block; font-size:11px; color:#7e959d; margin-left:5px; font-weight:500}
  .page.sms .page-content.send .table-wrap .recipient .action-wrap .action {
    font-weight: bold;
    text-decoration: underline; }
  .page.sms .page-content.send .table-wrap .recipient .tags-wrap {
    margin-top: 15px;
    height: auto;
    white-space: normal;
    max-height: 200px;
    overflow-x: hidden;
    overflow-y: scroll; }
.page.sms .page-content.send .send-action-wrap {
  margin-top: 15px;
  text-align: right; }
  .page.sms .page-content.send .send-action-wrap a {
      display: inline-block;
      padding: 15px 40px;
      background: #20232B;
      color: #ffffff;
      font-weight: bold;
  }

.page.sms .page-content.send-history .table-wrap td.content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }

.page.sms .page-content.setting-auto .options .option {
  padding: 32px 20px;
  background: #ffffff;
  border: 1px solid #DFE0E1;
  border-radius: 8px;
  margin-bottom: 10px;
  overflow: auto;
  color: #20232B;
  position:relative; /* 20180203 */}
  .page.sms .page-content.setting-auto .options .option:last-child {
    margin-bottom: 0; }
  .page.sms .page-content.setting-auto .options .option:after {
    display: block;
    content: " ";
    clear: both; }
  .page.sms .page-content.setting-auto .options .option .left {
    float: left; }
    .page.sms .page-content.setting-auto .options .option .left .ui.checkbox label {
      padding-left: 40px; }
    .page.sms .page-content.setting-auto .options .option .left .description {
      margin-top: 10px;
      margin-left: 40px; }
    .page.sms .page-content.setting-auto .options .option .left .emphasize {
      margin-top: 5px;
      margin-left: 40px;
      color: #FF503B; }
  .page.sms .page-content.setting-auto .options .option .right {
    position:absolute; top:50%; right:30px; margin-top:-10px;}
    .page.sms .page-content.setting-auto .options .option .right span {
      text-decoration: underline;
      font-weight: bold; }
    .page.sms .page-content.setting-auto .options .option .right img {
      margin-left: 10px; }
    .option-tit {
    	position:relative;
    	font-size:24px;
    	line-height:24px;
    	text-align:center;
    	margin:35px 0 15px 0;
    }
   .option-tit i {
    	display:inline-block;
    	margin:0 20px;
    	width:5px; height:5px;
    	background:#718c96;
    	border-radius:10px;
    	vertical-align:6px;
    }
    .option-tit .btn-area {
    	position:absolute; top:-5px; right:0;
    }
    .btn-round {
    	padding:0 15px 0 10px;
    	height:28px; line-height:28px;
    	background:#fff;
    	border:1px solid #dce8ea;
    	font-size:12px;
    	font-weight:bold;
    	border-radius:50px;
    }
    .btn-round .icon {
    	display:inline-block;
    	width:14px; height:13px;
    	vertical-align:-2px;
    	margin-right:3px;
    }
    .btn-round .icon.ic-reset {
    	background:url('/resources/static/img/icon/ic-reset-e123832bd59c8230d0a45912ae2c151b.png') no-repeat;
    }

.modal.sms-find-recipient .table-wrap {
  max-height: 200px;
  overflow: auto; }
  .modal.sms-find-recipient .table-wrap .name {
    padding-left: 0; }
  .modal.sms-find-recipient .table-wrap .contact {
    width: 140px; }

.modal.sms-charge .table-wrap .radio-wrap:not(:last-child) {
  margin-bottom: 10px; }

.modal.sms-auto-preview .message {
  text-align: left;
  padding: 20px; }

.page.customer-service-center .page-content.usage .grid .column {
  padding-right: 10px;
  padding-bottom: 10px; }
  .page.customer-service-center .page-content.usage .grid .column .wrap {
    background: #ffffff;
    border: 1px solid #d8e5e7; }
    .page.customer-service-center .page-content.usage .grid .column .wrap .title {
      padding: 15px;
      border-bottom: 1px solid #d8e5e7;
      font-size: 18px; }
    .page.customer-service-center .page-content.usage .grid .column .wrap .list {
      padding: 15px;
      line-height: 30px;
      background: #f9fbfb; }
      .page.customer-service-center .page-content.usage .grid .column .wrap .list li a {
        vertical-align: middle;
        font-size: 14px; }
      .page.customer-service-center .page-content.usage .grid .column .wrap .list li:before {
        content: "·";
        font-size: 20px;
        margin-right: 10px;
        line-height: 30px;
        vertical-align: middle; }
.page.customer-service-center .page-content.usage .float-video-wrap {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 100; }
  .page.customer-service-center .page-content.usage .float-video-wrap .wrap {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%); }

.page.customer-service-center .page-content.notice-list .table-wrap .title a {
  color: #718c96; }

.page.customer-service-center .page-content.inquiry-list .table-wrap .title a {
  color: #718c96; }

.page.customer-service-center .page-content.inquiry-write .table-wrap .attachment {
  margin-right: 20px; }
.page.customer-service-center .page-content.inquiry-write .table-wrap .action {
  margin-right: 10px;
  font-weight: bold;
  text-decoration: underline; }
.page.customer-service-center .page-content.inquiry-write .table-wrap .content-input-wrap {
  height: 300px; }
  .page.customer-service-center .page-content.inquiry-write .table-wrap .content-input-wrap textarea {
    width: 100%;
    height: 100%; }
.page.customer-service-center .page-content.inquiry-write .actions {
  margin-top: 30px;
  margin-bottom: 30px;
  text-align: center; }
  .page.customer-service-center .page-content.inquiry-write .actions .action {
    display: inline-block;
    padding: 15px 40px; }
    .page.customer-service-center .page-content.inquiry-write .actions .action.emphasize {
      background: #37454a;
      color: #ffffff; }
    .page.customer-service-center .page-content.inquiry-write .actions .action.normal {
      margin-left: 4px;
      background: #f7fafb;
      color: #37454a; }

.page.customer-service-center .page-content.inquiry-view .actions {
  margin-top: 30px;
  margin-bottom: 30px;
  text-align: center; }
  .page.customer-service-center .page-content.inquiry-view .actions .action {
    display: inline-block;
    padding: 15px 40px; }
    .page.customer-service-center .page-content.inquiry-view .actions .action.emphasize {
      background: #37454a;
      color: #ffffff; }
    .page.customer-service-center .page-content.inquiry-view .actions .action.normal {
      margin-left: 4px;
      background: #f7fafb;
      color: #37454a; }
.page.customer-service-center .subtext {
  font-size: 14px;
  font-weight:400;
  line-height:20px;
  color: var(--color-gray-700);
}

.page.customer-service-center .subtext .color-gray-500 {
    color: var(--color-gray-500);
}
.page.customer-service-center .subtext .color-red-300{
    color: var(--color-red-300);
}

.mypage-container {
  margin: 100px auto; }
  .mypage-container > .title {
    text-align: center;
    font-size: 24px;
    font-weight: bold; }
  .mypage-container > .sub-page-header-wrap-wrap {
    margin-top: 40px;
    text-align: center;
  }
  .mypage-container .sub-page.update-shop-information, .mypage-container .sub-page.update-profile {
    width: 800px;
    margin: 0 auto;
    margin-top: 50px;
    background: #fff;
    padding: 80px 50px;
    border-radius: 0;
/*    box-shadow: 0px 2px 10px 0px #edeff1;*/
    border: 1px solid #dae6e8;
    border-radius: 4px;
  }
  .mypage-container .input-wrap {
    margin-bottom: 10px; }
    .mypage-container .input-wrap .error-message {
      margin-top: 3px;
      margin-left: 5px;
      color: #3fd2d1;
      text-align: left; }
    .mypage-container .input-wrap a{
      position: absolute;
      top: 16px;
      right: 12px;
      color: inherit;
      font-size: 12px;
      font-weight: bold;
      text-decoration: underline; }

.mypage-container .sub-page-header-wrap .sub-page-header .item {
  font-size:16px;
  font-weight:700;
  line-height:24px;
}
.sub-page.update-profile .section-shop {
  margin-bottom: 20px;
  width: 450px;
  margin: 0 auto;
}
.sub-page.update-profile .section-shop .sub-title {
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  position: relative;
  width: fit-content;
  margin: 0 auto;
  margin-bottom: 50px;
}

.sub-page.update-profile .section-shop .sub-title span.line {
  background: #227eff;
  width: 100%;
  height: 13px;
  position: absolute;
  bottom: -5px;
  left: 0;
  opacity: 0.3;
}

.mypage-container .sub-page.update-shop-information .section-shop {
  margin-bottom: 20px;
  width: 450px;
  margin: 0 auto;}

.mypage-container .sub-page.update-shop-information .sub-title {
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  position: relative;
  width: fit-content;
  margin: 0 auto;
  margin-bottom: 50px;
    }
.mypage-container .sub-page.update-shop-information .sub-title span.line {
  background: #227eff;
  width: 100%;
  height: 13px;
  position: absolute;
  bottom: -5px;
  left: 0;
  opacity: 0.3;
}
.mypage-container .sub-page.update-shop-information .search-address-wrap {
  margin-top: 20px;
  text-align: center; }
  .mypage-container .sub-page.update-shop-information .search-address-wrap .search-zipcode {
    display: block;
    margin-bottom: 10px;
    text-decoration: underline;
    font-weight: bold;
    font-size: 12px; }
.mypage-container .sub-page.update-shop-information .shop-image-wrap {
  margin-top: 20px;
  overflow: hidden;
  background: #fff;
  padding: 10px;
  border: 1px solid #dae6e8;
  border-radius: 2px;}
  .mypage-container .sub-page.update-shop-information .shop-image-wrap:after {
    display: block;
    content: " ";
    clear: both; }
  .mypage-container .sub-page.update-shop-information .shop-image-wrap .thumbnail-wrap {
    position: relative;
    float: left; }
    .mypage-container .sub-page.update-shop-information .shop-image-wrap .thumbnail-wrap .thumbnail {
      width: 120px;
      height: 120px; }
      .mypage-container .sub-page.update-shop-information .shop-image-wrap .thumbnail-wrap .thumbnail.blank {
        border: 1px solid #d8e5e7;
        background: #f9fbfb; }
    .mypage-container .sub-page.update-shop-information .shop-image-wrap .thumbnail-wrap .thumbnail-blank-message {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      text-align: center;
      line-height: 120px;
      color: #bbc4c8; }
  .mypage-container .sub-page.update-shop-information .shop-image-wrap .actions {
    float: left;.ui.modal.B2C_Res_wait .ui.modal-close.buttonmargin-top: 10px;
    margin-left: 20px;
    font-size: 12px; }
    .mypage-container .sub-page.update-shop-information .shop-image-wrap .actions .action {
      margin-top: 20px;
      font-weight: bold;
      text-decoration: underline; }

.mypage-container .sub-page.update-profile .phone-number {
  position: relative; }
  .mypage-container .sub-page.update-profile .phone-number input {B2C_Res_waitpadding-right: 95px; }
  .mypage-container .sub-page.update-profile .phone-number .request-phone-authorization {
    position: absolute;
    top: 18px;
    right: 8px;
    font-size: 12px;
    font-weight: bold;
    text-decoration: underline; }

.mypage-container .sub-page.member-shop-header {
	width:300px; margin:50px auto 0;
}
.mypage-container .sub-page.member-shop-header .sub-text-wrap {
	font-size:12px; line-height:20px; letter-spacing:-0.8px;
}
.lastpoint-wrap {
	margin-top:30px;
}
.lastpoint-wrap .point-wrap {
	width:100%; height:50px; border:1px solid #d9e6e8; padding:0 15px;
}
.lastpoint-wrap .point-wrap span {
	line-height:48px; font-size:14px;
}
.lastpoint-wrap .point-wrap .tit {
	float:left;
}
.lastpoint-wrap .point-wrap .num {
	float:right; font-weight:bold;
}
.lastpoint-wrap .point-wrap.last-point {
	background:#fff;
}
.lastpoint-wrap .point-wrap.soondie-point {
	background:#f7f9fb; margin-top:5px;
}
.lastpoint-wrap .point-wrap.last-point .tit {
	font-weight:bold;
}
.lastpoint-wrap .point-wrap.last-point .num {
	color:#0093db;
}
.lastpoint-wrap .point-wrap.soondie-point .tit {
	color:#718c96;
}
.lastpoint-wrap .point-wrap.soondie-point .tit span {
	margin-right:5px;
}

.mypage-container .sub-page.member-shop-list {
/*   width: 600px; */
  max-width: 800px;
  margin: 50px auto; }
  .mypage-container .sub-page.member-shop-list .new-item {
    display: block;
    text-align: center;
    margin-top: 30px;}
    .mypage-container .sub-page.member-shop-list .new-item a {
      color: #fff;
      display: inline-block;
      background: #227eff;
      padding: 16px 40px;
      border-radius: 8px;
      font-weight: 500;
      font-size: 14px;
    }
    .mypage-container .sub-page.member-shop-list .new-item .icon-circle-plus {
      display: inline-block;
      margin-right: 10px;
      vertical-align: middle; }
    .mypage-container .sub-page.member-shop-list .new-item .text {
      display: inline-block;
      font-size: 24px;
      vertical-align: middle; }
  .mypage-container .sub-page.member-shop-list .items {
    margin-top:20px;
    border: 1px solid #d8e5e7;
    font-size: 12px;
    background: #ffffff; }
    .mypage-container .sub-page.member-shop-list .items .item {
      border-bottom: 1px solid #dce8ea;
      line-height: 16px;
      height: 80px;}
      .mypage-container .sub-page.member-shop-list .items .item td {
        text-align: center;
        padding: 8px; }
      .mypage-container .sub-page.member-shop-list .items .item .thumbnail {
        text-align: left;
        width: 100px;
        text-align: center;}
        .mypage-container .sub-page.member-shop-list .items .item .thumbnail img {
          border: 0px;
          width: 50px;
          height: 50px;
          border-radius: 50%;}
      .mypage-container .sub-page.member-shop-list .items .item .name-address {
        width: 300px;
        text-align: left;
        padding-left: 5px; }
        .mypage-container .sub-page.member-shop-list .items .item .name-address .name {
          font-weight: bold;
          margin-bottom: 5px; }
      .mypage-container .sub-page.member-shop-list .items .item .owner-name {
        width: 80px;
        color: #222; }
      .mypage-container .sub-page.member-shop-list .items .item .status {
        font-weight: bold; }
        .mypage-container .sub-page.member-shop-list .items .item .status.accepted {
          color: #3fd2d1; }
        .mypage-container .sub-page.member-shop-list .items .item .status.pending {
          color: #718c96; }
      .mypage-container .sub-page.member-shop-list .items .item .action1.goto-shop a {
        color: #000000;
        background-color: #e3e9ef;
        padding: 6px 9px;
        border-radius: 4px;
        /* border: 1px solid #d8e4e6; */
        font-weight: 500; }
        .mypage-container .sub-page.member-shop-list .items .item .action1.goto-shop a span {
          /*text-decoration: underline;*/
          margin-right: 5px;}
        .mypage-container .sub-page.member-shop-list .items .item .action1.goto-shop a .fa-chevron-right:before {
          color: #227EFF;}
.mypage-container .sub-page.member-shop-list .items .item .action1.goto-shop a img {
          margin-left: 5px; }
      .mypage-container .sub-page.member-shop-list .items .item .action1.cancel a {
        color: #bbc4c8;
        text-decoration: underline; }
      .mypage-container .sub-page.member-shop-list .items .item .action2 {
        font-weight: bold;
        text-decoration: underline; }

.mypage-container .sub-page.member-album {
  width: 600px;
  margin: 50px auto; }
  .mypage-container .sub-page.member-album .new-item {
    display: block;
    text-align: center; }
    .mypage-container .sub-page.member-album .new-item a {
      color: #37454a; }
    .mypage-container .sub-page.member-album .new-item .icon-circle-plus {
      display: inline-block;
      margin-right: 10px;
      vertical-align: middle; }
    .mypage-container .sub-page.member-album .new-item .text {
      display: inline-block;
      font-size: 24px;
      vertical-align: middle; }
  .mypage-container .sub-page.member-album .cards {
    margin-top: 20px; }
    .mypage-container .sub-page.member-album .cards .column {
      padding-right: 15px;
      padding-bottom: 15px; }
    .mypage-container .sub-page.member-album .cards .card {
      position: relative;
      height: 300px; }
      .mypage-container .sub-page.member-album .cards .card img.background {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0; }
      .mypage-container .sub-page.member-album .cards .card .bottom-panel {
        position: absolute;
        height: 115px;
        left: 0;
        right: 0;
        bottom: 0;
        padding-top: 30px;
        padding-left: 15px;
        padding-right: 15px;
        color: #ffffff;
        background: rgba(0, 0, 0, 0.7); }
        .mypage-container .sub-page.member-album .cards .card .bottom-panel .memo {
          height: 45px;
          margin-top: 5px;
          font-size: 12px;
          color: #a2a1a0;
          overflow: auto; }

.modal.member-add-picture .table-wrap .image .action.browse {
  text-decoration: underline;
  font-weight: bold; }
.modal.member-add-picture .table-wrap .image-wrap {
  margin-top: 20px; }

.components {
  width: 1100px;
  margin: 0 auto; }
  .components .table-wrap {
    margin-bottom: 20px; }


/* 아트등록 > 카테고리 추가 */
.category-wrap {padding:15px}
.category-tit {position:relative;margin-bottom:10px}
.category-tit .tit {font-weight:bold; display:block; margin-bottom:5px}
.category-tit .subtxt {font-size:12px; color:#aaaab0}
.category-area {width:100%; display:inline-block; border:1px solid #d8e5e7; height:138px; overflow:hidden}
.category-area.type02 .category-area-left , .category-area.type02 .category-area-right {width:50%}
.category-area.type02 .category-area-right li {width:100%}
.category-area.type02 .category-area-left {overflow-y:auto}
.category-area-left {float:left; width:33.33%;height:135px; overflow-y:hidden; background:#f2f6f7}
.category-area-left li {width:100%; height:34px;}
.category-area-left li button {width:100%; height:34px; background:none; border:none; border-bottom:1px solid #d8e5e7 ;padding:7px 10px; box-sizing: border-box; font-family:"Noto Sans KR"; text-align:left; letter-spacing:-0.5px; }
.category-area-left li button.active {background:#fff}
.category-area-left li button.last {border-bottom:none}
.category-area-right {float:left; width:66.66%; height:135px; overflow-y:auto; background:#fff;}
.category-area-right li {position:relative; float:left; width:50%; height:34px; padding:10px; box-sizing: border-box; border-bottom:1px solid #d8e5e7; color:#7e959d; cursor:pointer}
.category-area-right li input[type="checkbox"] {position:absolute; visibility:hidden;}
.category-select {margin-top:10px}
.category-tit .toggle-btn-wrap {position:absolute; top:0;right:0;}
.toggle-btn-wrap .switch {position: relative; display: inline-block; width: 45px; height: 26px;}
.toggle-btn-wrap .switch input {outline: none;  opacity: 0; width: 0; height: 0;}
.toggle-btn-wrap .slider {outline: none;  position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #bbc4c8; -webkit-transition: .4s; transition: .4s;}
.toggle-btn-wrap .slider:before {outline: none;  position: absolute; content: ""; height: 20px; width: 20px; left: 3px; bottom: 3px; background-color: white; -webkit-transition: .4s; transition: .4s;}
.toggle-btn-wrap input:checked + .slider {outline: none; background-color: #227eff;}
.toggle-btn-wrap input:focus + .slider {outline: none; box-shadow: 0 0 1px #2196F3;}
.toggle-btn-wrap input:checked + .slider:before {outline: none;
  -webkit-transform: translateX(20px);
  -ms-transform: translateX(20px);
  transform: translateX(20px);
}
/* Rounded sliders */
.toggle-btn-wrap .slider.round {border-radius: 34px;}
.toggle-btn-wrap .slider.round:before {border-radius: 50%;}

/*# sourceMappingURL=styles.css.map */

/* 팝업- 예약등록 */
.date .date-area02 {padding:16px 0 15px 0;}
.reser-list {width:100%; display:inline-block; margin:5px 0;}
.reser-list:first-child {margin-top:0}
.reser-list:last-child {margin-bottom:0}
.reser-list .tit {float:left;padding-left:20px; width:30%;font-size: 13px;color:#718c96;font-weight: bold;}
.reser-list .list {float:left; width:70%; }
.reser-list .list ul {width:100%; display:inline-block;}
.reser-list .list ul li {float:left; width:18%; }
.reser-list .list ul li.last {width:28%}
.reser-list .list ul li .selectRadio-wrap {float:left;}
.reser-list .list ul li .label-txt {float:left; font-size:13px; margin-top:-1px}
.reser-list .list .frm_select {height:20px; width:80px; background-color:transparent; }
.reser-list .list .frm_select select {height:17px; background-color:transparent; }

/* 카카오톡배너 & 네이버배너 */
.btn-float-wrap {position:fixed; bottom:30px; right:25px; z-index:90}
.btn-float-wrap a {display:block; margin-top:10px; width:50px; height:50px; border-radius:50%; box-shadow:0 4px 6px 0 rgba(81,99,120,0.2);     -webkit-transition: box-shadow 0.2s ease-out;
    transition: box-shadow 0.2s ease-out; animation: eLtMsx 0.2s cubic-bezier(0.1,0,0.6,1);cursor: pointer;}
.btn-float-wrap a .ic-area {display:block; margin:8px auto; width:38px; height:38px; border-radius: 50%;}
.btn-float-kako .ic-area , .btn-float-ios .ic-area , .btn-float-android .ic-area, .btn-float-naver .ic-area, .btn-float-naver-tok .ic-area {background:url('/resources/static/img/icon/ic-floatbtn-index-f45626e7744662052842dbc3a4f3700d.png') no-repeat;}
.btn-float-kako {border:1px solid #e3c000; background:#fbe300; }
.btn-float-kako .ic-area {background-position:0 0;}
.btn-float-ios {border:1px solid #c8d9e0; background:#fff; }
.btn-float-ios .ic-area {background-position:0 -38px;}
.btn-float-android {border:1px solid #c8d9e0; background:#fff; }
.btn-float-android .ic-area {background-position:0 -76px;}
.btn-float-naver, .btn-float-naver-tok {
  border: 1px solid #13953a;
  background: #00c73c
}

.btn-float-naver .ic-area {
  background-position: 0 -114px;
}

.btn-float-naver-tok .ic-area {
  background-position: 1px -158px;
}

.Detail-page .btn-float-wrap {
  bottom: 90px;
}

.maxscroll200 {
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* B2C 예약서비스 예약 알림 */
#div-b2c-reserv {
  position: fixed;
  bottom: 0;
  right: 111px;
  width: 300px;
  z-index: 99;
  box-shadow: 0 -3px 10px rgba(0, 0, 0, .1);
  -webkit-box-shadow: 0 -3px 10px rgba(0, 0, 0, .1);
  border-radius:8px 8px 0 0;
  overflow: hidden;
}

#div-b2c-reserv,
#div-b2c-reserv > *:first-child a {
  border-radius: 8px 8px 0 0;
}

#div-b2c-reserv > * {
  display: flex;
  position: relative;
  border-top: 1px solid var(--grayscale-gray-100);
  background: #ffffff;
}

#div-b2c-reserv > *:first-child {
  border-top: 0;
}

#div-b2c-reserv > * a {
  display: flex;
  flex-direction: column;
  padding: 20px 40px 20px 68px;
  gap: 4px;
  background-size: 52px 52px;
}

#div-b2c-reserv > * .tit {
  letter-spacing: 0;
  font-size:var(--font-size-l);
  font-weight:var(--font-weight-bold);
  line-height: var(--line-height-l);
}

#div-b2c-reserv > * .txt {
  letter-spacing: 0;
  color: var(--grayscale-gray-300);
  font-size:var(--font-size-m);
  font-weight:var(--font-weight-medium);
  line-height: var(--line-height-m-20);
}

#div-b2c-reserv > * p {
  margin: 0;
}

#div-b2c-reserv > * button {
  position:absolute;
  top:20px;
  right:12px;
  cursor:pointer;
  width:24px;
  height:24px;
  background-image: url('/resources/static/img/figma/icon-round-x-c0f4af470cddc4c452179ae59c1c5524.svg');
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 100%;
}

.b2c-reserv a {
  background: #fff url(/resources/static/img/figma/icon-gongbiz-white-27a6ec70da24adec1ee6704fb110f5d1.svg) no-repeat 12px 50%;
}

.b2c-reserv .tit {
  color: var(--primary-300);
}

.b2c-reserv .txt {
  color: var(--grayscale-gray-300);
}

/* 네이버 예약 알림 */
.naver-reserv a {
  background: #fff url(/resources/static/img/figma/icon-naver-6dfdcead6b2913b603ecf491231ea96f.svg) no-repeat 12px 50%;
}

.naver-reserv .tit {
  color: #03CF5D;
}

/* 공비서 B2C 예약 알림 */
.zero-b2c-reserv .tit {
  color: var(--color-secondary-300);
}

.zero-b2c-reserv a {
  background: #fff url(/resources/static/img/figma/icon-zero-b2c-9c51abbaf8f6c23128c3e3630c1449cc.svg) no-repeat 12px 50%;
}

/* cms */
.cms-list-wrap {width:840px; margin:40px auto 0;}
.cms-infoTop-area {border:1px solid #dae6e8}
.cms-infoTop-area ul {display:table; width:100%; }
.cms-infoTop-area ul li {width:33.3%; display:table-cell; background:#f7fafb; border-right:1px solid #dae6e8; text-align:center; padding:30px 0}
.cms-infoTop-area ul li:last-child {border-right:0}
.cms-infoTop-area ul li dt {color:#718c96; font-size:18px; vertical-align:top; margin-bottom:10px}
.cms-infoTop-area ul li dd {width:80%; display:block; margin:0 auto; padding:15px 0; background:#fff; border:1px solid #dae6e8}
.cms-infoTop-area ul li dd span {color:#37454a; font-size:22px; font-weight:bold}
.cms-list-subtxt {margin-top:15px; }
.cms-list-subtxt li {position:relative; padding:5px 0 5px 10px; font-size:12px; color:#718c96;  }
.cms-list-subtxt li:before {content:"*"; position:absolute; top:50%; left:0; margin-top:-3px}
.cms-list-subtxt.type02 {margin-top:10px}
.cms-list-subtxt.type02 li {font-size:13px; padding:0 0 0 10px}
.cms-list-subtxt.type02 li:before {margin-top:-4px}
.cms-list-subtxt a.btn-otherpage {display:inline-block; margin-left:8px; padding:0 10px; height:20px; line-height:20px; background:#718c96; color:#fff; font-size:12px}
.cms-info-wrap {margin-top:60px}
.cms-info-wrap.type02 {margin-top:0}
.cms-info-wrap .tit-wrap {position:relative; margin-bottom:12px}
.cms-info-wrap .tit-wrap h1 {font-size:18px; color:#37454a;}
.cms-info-wrap .tit-wrap h1.type02 {font-size:22px; font-weight:normal}
.cms-info-wrap .tit-wrap .info-txt {position:absolute; bottom:0; right:0; }
.cms-info-wrap .tit-wrap .info-txt ul li {float:left; margin-left:30px;}
.cms-info-wrap .tit-wrap .info-txt ul li span {color:#718c96; font-size:15px; }
.cms-info-wrap .tit-wrap .info-txt ul li span.num {font-weight:bold; color:#37454a;}
.cms-info-wrap .tit-wrap .info-txt ul li span.subtxt {font-size:12px; color:#37454a; margin-left:3px}

.cms-notice-wrap {border-top:1px solid #dae6e8; border-bottom:1px solid #dae6e8; padding:50px 0; text-align:center}
.cms-notice-wrap span {font-size:22px; color:#718c96; font-weight: 300;}

.listType-card-wrap {border-top:1px solid #000}
.listType-card-wrap table {border-right: 1px solid #d8e5e7;border-bottom: 1px solid #d8e5e7;border-left: 1px solid #d8e5e7; font-size: 13px; background: #fff; text-align:center}
.listType-card-wrap table tr.row {border-bottom:1px solid #d8e5e7; }
.listType-card-wrap table td {padding:15px;}
.listType-card-wrap table td.thumnail img {
  border: 0px;
  width:40px;
  height:40px;
  display:inline-block;
}
.listType-card-wrap table td.name-address {padding-left:0; text-align:left;}
.listType-card-wrap table td.name-address .name {font-weight:bold; margin-bottom:5px}
.listType-card-wrap table td.name-address .address {font-size:12px}

.cms-priceview-wrap {margin-top:20px; display:table; width:100%; border-top:1px solid #d8e5e7; border-bottom:1px solid #d8e5e7}
.cms-priceview-wrap .article {position:relative; display:table-cell; padding:30px 0; text-align:center}
.cms-priceview-wrap .price-wrap {width:57%;}
.cms-priceview-wrap .price-wrap li {display:inline-block; margin:0 15px; }
.cms-priceview-wrap .price-wrap li span {font-size:18px; color:#bbc4c8; }
.cms-priceview-wrap .price-wrap li span.num {color:#37454a; font-weight:bold}
.cms-priceview-wrap .price-wrap li span.subtxt {color:#37454a;font-size:15px; margin-left:3px}
.cms-priceview-wrap .point-wrap {width:43%; background:#f7fafb; border-left:1px solid #d8e5e7}
.cms-priceview-wrap .point-wrap .icon-arrow {position:absolute; top:50%; left:0; width:23px; height:23px; background:#d8e5e7; border-radius:23px; margin:-11.5px 0 0 -11.5px}
.cms-priceview-wrap .point-wrap .icon-arrow i {position:absolute; top:7px; left:9px; display:block; width:6px; height:9px; background:url(/resources/static/img/icon/ic-cms-arrow-37cad6ba13668b41c33ec072b6144c21.png)no-repeat;}
.cms-priceview-wrap .point-wrap span {font-size:18px; color:#718c96; }
.cms-priceview-wrap .point-wrap span.num {color:#37454a; font-weight:bold}
.cms-terms-wrap {width:100%; border-top:1px solid #000; border-right:1px solid #d8e5e7; border-bottom:1px solid #d8e5e7; border-left:1px solid #d8e5e7; }
.cms-terms-wrap ul {display:table; width:100%;}
.cms-terms-wrap ul li {display:table-cell; width:33.33%; border-right:1px solid #d8e5e7; text-align:left}
.cms-terms-wrap ul li:last-child {border-right:0;}
.cms-terms-wrap ul li dt {width:100%; padding:13px 0 13px 20px; font-size:13px; color:#37454a; font-weight:bold; background:#f9fbfb; border-bottom:1px solid #d8e5e7}
.cms-terms-wrap ul li dd {width:100%; padding:15px 20px; background:#fff; color:#718c96; font-size:13px; line-height:23px; height:170px; overflow-y:auto}
.cms-terms-wrap ul li .checkbox-area {width:100%; padding:12px 10px; background:#f4f5f5; border-top:1px solid #d8e5e7; text-align:right}
.cms-terms-wrap ul li .checkbox-area > div {margin-top:-2px;}

.cms-input-wrap {border-top:1px solid #000; border-right:1px solid #d8e5e7; border-left:1px solid #d8e5e7; background:#fff;}
.cms-input-wrap.type02 {margin-top:10px; border-top:1px solid #d8e5e7}
.cms-input-wrap li {width:100%; border-bottom:1px solid #d8e5e7; height:60px; display:table}
.cms-input-article {position:relative; display:table-cell; vertical-align:middle}
.cms-input-article dl {display:table; width:100%}
.cms-input-article dt {display:table-cell; vertical-align:middle; font-size:14px; color:#718c96; padding:0 20px}
.cms-input-article dt.text3 {width:80px;}
.cms-input-article dt.text4 {width:90px;}
.cms-input-article dt.text7 {width:130px;}
.cms-input-article dt.text9 {width:165px;}
.cms-input-article dt.line2 {line-height:18px}
.cms-input-article dt span {font-size:12px; color:#aeb1b3}
.cms-input-article dd {display:table-cell; vertical-align:middle;float:left; width:100%}
.cms-input-article dd input[type="text"] {vertical-align:middle; font-size:16px;width:100%; border:0}
.cms-input-article dd input.donttouch {background:#f5f7f7;color:#718c96}
.cms-input-article dd .frm_select {width:160px; border:none}
.cms-input-article dd .frm_select select {padding-left:0; font-size:16px; background-position: 95% 50%;}
.cms-input-article.infotxt-plus {padding-right:130px;}
.cms-input-article.infotxt-plus .infotxt {position:absolute; top:50%; right:15px; font-size:12px; color:#aeb1b3; margin-top:-6px}

.cms-final-wrap {border-top:1px solid #d8e5e7; border-bottom:1px solid #d8e5e7; background:#f7fafb; padding:35px 0; text-align:center}
.cms-final-wrap .tit {display:block; font-size:22px; margin-bottom:15px; color:#37454a}
.cms-final-wrap .subtxt {font-size:16px; color:#bbc4c8;}

.cms-textbox-wrap {text-align:center; font-size:16px;color:#37454a;}
.cms-textbox-01 {margin-top:40px; color:#718c96; font-size:14px; text-align:center; line-height:25px}
.cms-textbox-02 {color:#718c96; line-height:26px; }
.cms-textbox-03 {display:inline-block; margin:25px 0; padding:15px 40px; background:#fff; border:1px solid #dce8ea;font-weight:bold}

.cms-direct-wrap {margin-top:30px; padding:25px 0; background:#fff; border-top:1px solid #dae6e8; text-align:center;}
.cms-direct-wrap .txt {font-size:15px; line-height:23px; }
.cms-direct-wrap .register-action-wrap {margin:25px 0 0 0}
.cms-direct-wrap.type02 {padding:40px 0;}
.cms-direct-wrap .tit {font-size: 20px; margin-bottom: 10px; color: #37454a;}
.cms-direct-wrap .subtit {font-size: 14px; color: #bbc4c8;}
.cms-direct-wrap .info {width:400px; margin:0 auto; padding:15px 0; margin-top:25px; border-top:1px solid #d8e5e7; border-bottom:1px solid #d8e5e7}
.cms-direct-wrap .info dl {display:inline-block; width:100%; padding:8px 0; font-size:16px}
.cms-direct-wrap .info dt {float:left; width:30%; color:#718c96}
.cms-direct-wrap .info dd {float:left; width:70%; text-align:left;}

.cms-productChoose-wrap {width:100%; display:inline-block;}
.productChoose-area {width:415px; }
.productChoose-tit .ui.checkbox {display:block; margin:0 auto; font-size:22px; text-align:center }
.productChoose-tit .ui.checkbox input + label {padding:0}
.productChoose-tit .ui.checkbox input + label > span {display:block; margin: 0 auto 10px; position:relative; top:auto; left:auto; }
.productChoose-cont {margin-top:23px; border-top:1px solid #37454a; border-bottom:1px solid #d8e5e7}
.productChoose-cont .price-area {background:#fff; text-align:center; padding:30px 0; }
.productChoose-cont .price-area span.price {font-size:26px; font-weight:bold; }
.productChoose-cont .price-area span.vat {display:inline-block; vertical-align: text-bottom; margin-left:10px; padding:6px 8px; background:#e9ecef; color:#868e96; font-weight:bold}
.productChoose-cont .info-area {position:relative; width:240px; margin:0 auto; padding:25px 0; height:185px; }
.productChoose-cont .info-area li {padding:5px 0; font-size:14px; }
.productChoose-cont .info-area li.last {color:#718c96; position:absolute; bottom:25px; left:0;}
.productChoose-cont .info-area .btn-product-detail {position:absolute; top:30px; left:210px; z-index:10; display:block; width:74px; height:74px; background:url('/resources/static/img/icon/btn-product-detail-fbb00fb5bb4ba916b7c25e8cfe0ca226.png')no-repeat;}

/* 팝업 - 시술알림 상세설정 */
.messageBell-wrap {padding:20px; border-top:1px solid #d9e5e7}
.messageBell-area .tit {margin-bottom:10px; }
.messageBell-area .tit label {font-weight:bold}
.messageBell-textarea {width:100%; }
.messageBell-textarea textarea {width:100%; height:80px; background:#fff; padding:10px; font-size:13px}
.messageBell-textarea.type01 textarea {border-top:none; border-left:1px solid #d8e5e7; border-right:1px solid #d8e5e7; border-bottom:1px solid #d8e5e7; }
.messageBell-textarea.type02 textarea {border:1px solid #d8e5e7; }
.TabSelect-wrap {width:100%; webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.TabSelect-tab {position:relative;}
.TabSelect-tab .tab-btn {float:left; display:table; width:25px; border:1px solid #DFE0E1; background:#fff; text-align:center}
.TabSelect-tab .tab-btn div {display:table-cell; vertical-align:baseline; text-align:center}
.TabSelect-tab .tab-btn i {display:inline-block; width:5px; height:9px; }
.TabSelect-tab .tab-btn.btnright i {background:url('/resources/static/img/icon/ic-tabSelect-arrow-right-cbe4fd7ac8c683d2926fc48dc3a240c8.png') no-repeat;}
.TabSelect-tab .tab-btn.btnleft i {background:url('/resources/static/img/icon/ic-tabSelect-arrow-left-d1e14cb9f4c78576f4e8f48923bb021a.png') no-repeat;}
.TabSelect-area {float:left; width:360px; overflow:hidden }
.TabSelect-area ul {position:relative; display:inline-block; width:100%}
.TabSelect-area ul li {float:left; position:relative; width:90px; border-top:1px solid #DFE0E1; border-right:1px solid #DFE0E1;border-bottom:1px solid #DFE0E1; background:#fff}
.TabSelect-area ul li:last-child { border-right: none; }
.TabSelect-area ul li .remove {position:absolute; top:0; right:0; }
.TabSelect-area ul li .remove i {display:block; width:8px; height:8px; margin:5px; background:url('/resources/static/img/icon/cross-75d340e618d6845b2319d2327ae066d8.png')no-repeat;}
.TabSelect-area ul li .tab {display:table; width:100%; }
.TabSelect-area ul li .tab .txt {display:table-cell; width:100%; vertical-align:middle; text-align:center}
.TabSelect-area ul li .tab .txt .item {display:block; font-size:13px; margin:2px auto; color:#9FA1A4;text-overflow: ellipsis; width:90%;
    -o-text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    word-wrap: normal !important;
}
@media screen and (-webkit-min-device-pixel-ratio:0){
	.TabSelect-tab .tab-btn div {display:inline-block}
	.TabSelect-area ul li .tab .txt {display:inline-block}

}

.TabSelect-area ul li .tab.active {background:#fff}
/* seha */
/* .TabSelect-area ul li .tab .txt {vertical-align:middle; text-align:center} */
/* .TabSelect-area ul li .tab .txt .item {display:block; font-size:13px; line-height:13px; margin:2px 0; color:#718c96} */
/* .TabSelect-area ul li .tab.active {background:#fff;} */

.TabSelect-area ul li .tab.active .txt .item {color:#20232B;}
.TabSelect-area ul li .tab.desabled {background:#EFF0F0}
.TabSelect-area ul li .tab.desabled .txt .item {color:#bacdd4}
.TabSelect-wrap.type01 .TabSelect-tab ,
.TabSelect-wrap.type01 .TabSelect-tab .tab-btn ,
.TabSelect-wrap.type01 .TabSelect-area ul {height:55px;}
.TabSelect-wrap.type01 .TabSelect-area ul li .tab {height:53px;}

.TabSelect-wrap.type02 .TabSelect-tab ,
.TabSelect-wrap.type02 .TabSelect-tab .tab-btn ,
.TabSelect-wrap.type02 .TabSelect-area ul {height:35px;}
.TabSelect-wrap.type02 .TabSelect-area ul li .tab {height:33px;}
.TabSelect-wrap.full .TabSelect-area {width:900px;}
.TabSelect-wrap.full .TabSelect-area ul li {width:17%;}
.TabSelect-wrap.type03 .TabSelect-tab ul li {width:120px}

.ic-question-wrap {position:relative; float:left; }
.ic-question-wrap.type2 {float:none; display:inline-block}
.ic-question-wrap .ic-Q {display:block;margin-left:5px; width:18px; height:18px; background:url('/resources/static/img/icon/ic-question-0b3c30ddf20fff09432b95cfd3cb0cc9.svg') no-repeat;}
/*.ic-question-cont {position:relative; width:100%; margin-top:10px}*/
.ic-question-cont {position:absolute; width:100%; margin-top:10px; z-index: 99; box-shadow: 10px 10px 30px 0 rgba(52, 58, 64, 0.1);}
.ic-question-cont .arrow {position:absolute; z-index:15; display:block; width:10px; height:9px; background:url('/resources/static/img/icon/ic-pop-arrow-top-7be2a7f8acf3499a0da4dad5c3dc5524.png')no-repeat;}
.ic-question-cont.type2 {width:840px; margin:10px auto 0; text-align:center}
.ic-question-cont .cont {width:100%; display:inline-block; font-size:13px; line-height:22px; color:#718c96; border:1px solid #d8e5e7; background:#fff;padding:20px 15px;}
.ic-question-cont .cont span {display:block}
.ic-question-cont .cont li {list-style:none; width:100%; margin:2px 0;}
.ic-question-cont .cont li:first-child {margin-top:0;}
.ic-question-cont .cont li:last-child {margin-bottom:0}
.ic-question-cont .cont .link-wrap {margin-top:10px;}
.ic-question-cont .cont .text-alink {display:inline-block; margin-right:15px; font-weight:700; color:#37454a; text-decoration:underline}
/* S : cms 자동결제 및 결제내역 말풍선 스타일 추가 */
.ic-question-cont.type2.cms-question {left: 50%; transform: translate(-50%); Text-align:left;}
/* E : cms 자동결제 및 결제내역 말풍선 스타일 추가 */

/* 직원 인센티브설정 */
.set-under-top {padding:20px 20px 10px 20px}
.set-under-cont {height:350px; overflow-y:auto; padding:0 10px 20px 20px}
.set-under-cont .num-set {width:37px; height:25px !important; line-height:25px !important; border:1px solid #d9e6e8 !important; margin-right:5px !important}
.set-under-tit {display:inline-block; width:100%; margin:20px 0 10px 0; }
.set-under-tit .tit {font-size:14px; float:left}

/* 고객그룹설정 */
.groupSet-add-wrap{margin:20px;}
.groupSet-add input {width:312px; height:40px; line-height:40px; padding:10px; background:#ff; border:1px solid #d9e6e8}
.groupSet-add button {width:98px; height:40px; line-height:40px; color:#fff; font-weight:bold; font-size:14px; background:#227eff; text-align:center;}
.groupSet-add button:hover {background:#267af1;}
.groupSet-btn-wrap {padding:20px 20px 15px 20px; text-align:center;}
.groupSet-btn-wrap button {margin:0 10px; bakcground:none; border:none; font-size:12px; font-weight:bold}
.groupSet-btn-wrap button i {display:inline-block; vertical-align:2px; margin-right:8px; width:9px; height:5px; background:url('/resources/static/img/icon/ic-updown-arrow-52469d46ec0c8715f627ad6a111676c8.png') no-repeat;}
.groupSet-btn-wrap button.up i {background-position:0 0}
.groupSet-btn-wrap button.down i {background-position:0 -5px;}
.groupSet-list-wrap{margin:0 20px 20px; height:161px; overflow-y:auto}
.groupSet-list-wrap ul {border-top:1px solid #d9e6e8; background:#fff;}
.groupSet-list-wrap ul li {position:relative; border-left:1px solid #d9e6e8; border-right:1px solid #d9e6e8; border-bottom:1px solid #d9e6e8; width:100%; height:40px; display:table; padding:0 10px}
.groupSet-list-wrap ul li:hover{background:#f9f9f9;}
.groupSet-list-wrap ul li .input-area {margin-top:5px;width:70%; float:left; display:none;  border:none; background:#f7f9fb; padding:5px 10px;}
.groupSet-list-wrap ul li .groupname {display:block; height:39px; line-height:39px; margin-right:90px; color:#718c96; font-size:14px; width: 250px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.groupSet-list-wrap ul li .btn-area {position:absolute; top:0; right:30px; border:none; background:none; height:38px; width:60px; font-size:13px; font-weight:bold}
.groupSet-list-wrap .ui.checkbox {margin-top:13px}
.groupSet-list-wrap .ui.button {position:absolute; top:50%; right:10px; margin-top:-4.5px; width:20px; height:9px; text-align:center; font-size:0; height:0;}

/* 받는사람 팝업 */
.sendlist-pop {padding:0 20px 20px 20px}
.sendlist-search {display:inline-block; width: 100%;padding:7px; background:#fff;}
.sendlist-search .search-form-wrap {width:250px}
.sendlist-search .search-form-wrap .ui.search.form {height:35px}
.sendlist-search .ui.checkbox {margin-top:10px;}

/* 상세조건 검색 */
.detail-condition-wrap{position:relative;clear:both;padding-top:6px;z-index:99}
.detail-condition-wrap .detail-btn{width:100%;margin:0}
.detail-condition-wrap .detail-btn a{display:block;height:36px;line-height:34px;padding:0 10px}
.detail-condition-wrap .detail-btn.open a{color:#adadaf;border:1px solid #d9e5e7;background:url('/resources/static/assets/img/common/dropdown-arrow-open-db73d5296b271245423f9e45eb86d52d.gif') no-repeat right 50%}
.detail-condition-wrap .detail-btn.close a{color:#28282c;border-bottom:1px solid #d9e5e7;background:url('/resources/static/assets/img/common/dropdown-arrow-close-bbd365cf10979237529e817cbc8355b9.gif') no-repeat right 50%}
.detail-condition-wrap .detail-cont{position:absolute;top:6px;left:0;width:100%;background:#fff;border:1px solid #28282c}
.detail-condition-wrap .detail-cont .detail-cont-inp{position:relative;margin:15px 20px;padding-right:68px}
.detail-condition-wrap .detail-cont .detail-cont-inp dl{display:inline-block;width:100%;margin:4px 0 0}
.detail-condition-wrap .detail-cont .detail-cont-inp dl:first-child{margin:0}
.detail-condition-wrap .detail-cont .detail-cont-inp dl dt{float:left;line-height:30px;font-size:12px;color:#37454a}
.detail-condition-wrap .detail-cont .detail-cont-inp dl dd{float:right;width:215px}
.detail-condition-wrap .detail-cont .detail-cont-inp dl dd select,
.detail-condition-wrap .detail-cont .detail-cont-inp dl dd input{display:inline-block;vertical-align:middle;height:30px;border:1px solid #dee2e6;border-radius:3px;font-size:12px;color:#37454a;padding:0 8px}
.detail-condition-wrap .detail-cont .detail-cont-inp dl dd select{width:105px}
.detail-condition-wrap .detail-cont .detail-cont-inp dl dd input{width:100px}
.detail-condition-wrap .detail-cont .detail-cont-inp dl dd span{display:inline-block;margin:0 1px;color:#c2c6ca}
.detail-condition-wrap .detail-cont .detail-cont-inp .detail-cont-btn{position:absolute;top:0;right:0;width:58px}
.detail-condition-wrap .detail-cont .detail-cont-inp .detail-cont-btn a{display:block;border-radius:3px;font-size:12px;font-weight:bold;color:#fff;text-align:center}
.detail-condition-wrap .detail-cont .detail-cont-inp .detail-cont-btn a.detail-btn-blue{height:66px;line-height:66px;background:#29a0da}
.detail-condition-wrap .detail-cont .detail-cont-inp .detail-cont-btn a.detail-btn-gray{margin-top:4px;height:30px;line-height:30px;background:#698491}

/* 발송 문구 설정 */
.sendtxt-pop {position:relative; padding:20px;}
.sendtxt-addbtn {background:#718c96; border-radius:30px; padding:0 13px; height:28px;font-size:12px;line-height:28px; color:#fff; margin-bottom: 10px;}
.sendtxt-cont {margin-top:10px;}
.sendtxt-tit {margin-bottom:5px; height:32px;position:relative}
.sendtxt-tit .tit input {width:100%; height:32px; padding-right:40px; border:1px solid #d8e5e7; background:#fff; padding:0 10px}
.sendtxt-tit .tit-txt {display:inline-block; color:#000;line-height:32px; font-size:14px}
.sendtxt-tit .titedit-submit {position:absolute; top:50%;right:15px; font-weight:bold; color:#000;margin-top: -9px;}
.sendtxt-tit .edit {display:inline-block; margin-left:10px}
.sendtxt-txtarea textarea {width:100%;padding:20px 10px; height:180px; border:1px solid #d8e5e7;}
.sendtxt-submit button {width:100%;height:32px; line-height:30px; border:1px solid #000; text-align:center; color:#37454a; font-weight:bold}

/* 문자충전 상세 */
.pop-sms-detail-wrap li {display:inline-block; width:100%;}
.pop-sms-detail-wrap li .text-area {float:left; width:60%; height:30px; }
.pop-sms-detail-wrap li .text-area span {display:inline-block; font-size:13px; color:#718c96; line-height:30px}
.pop-sms-detail-wrap li .input-area {float:left; padding:6px 10px; width:40%; height:30px; box-sizing:border-box; border:1px solid #d9e6e8;}
.pop-sms-detail-wrap li .input-area input {float:left; width:70px; font-size:13px}
.pop-sms-detail-wrap li .input-area input:fosus {outline: none}
.pop-sms-detail-wrap li .input-area .sub {float:right; font-size:13px;}

/* 발신자번호표시서비스 */
.numservice-wrap {margin-bottom:100px}
.numservice-table .tit {font-size:14px;color:#37454a !important;text-align:left !important; padding-left:25px !important}
.numservice-table .cont {background:#fafcfc; text-align:left !important}
.numservice-table .ui.button { width:90px; height:30px; line-height:30px; border:1px solid #37454a; color:#37454a; font-weight:bold; background:#fff}
.numservice-table .ui.button.onebtn {float:right;}
.numservice-input .subtxt:first-child {margin-left:0}
.numservice-input .subtxt {float:left; display:inline-block; width:55px; margin-left:15px; line-height:30px}
.numservice-input input {float:left; border:1px solid #dce8ea !important; height:30px !important; text-indent:10px;}
.numservice-input.small input {text-align:center; text-indent:0}
.numservice-input .frm_select {height:30px; border:1px solid #dee2e6}
.numservice-textarea {border:1px solid #dce8ea !important; margin-top:10px !important; width:100%; padding:10px !important;}
.numservice-input .frm_select select {height:28px}

/* 발신자번호표시서비스 팝업 */
.header-cellphone {padding:45px 0 40px 0; text-align:center;}
.header-cellphone .icon-call i {display:block; margin:0 auto 25px; width:37px; height:38px; background:url('/resources/static/img/icon/ic-cellphone-popup-e5fbc0badc9fa84d4ff837e1a295a3f9.png')no-repeat;}
.header-cellphone .name-area span {display:inline-block; margin-right:3px; vertical-align:middle; font-size:18px; font-weight:bold; }
.header-cellphone .name-area .card-icon-area {vertical-align:middle}
.header-cellphone .number-area {font-size:22px; color:#718c96; margin-top:18px; }
.callpop-inlist li {width:100%; display:inline-block; padding:4px 0;}
.callpop-inlist li span {display:block; float:left}
.callpop-inlist li span.date {width:19%; color:#37454a; }
.callpop-inlist li span.cont { width:70%; text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.callpop-inlist li span.etc {width:11%; text-align:right}

/* 직원인센티브 매출목표설정 */
.set-undergoal-area {display:inline-block; width:100%; border:1px solid #d9e6e8; padding:5px 5px 5px 10px; margin-bottom:10px; background:#fff}
.set-undergoal-area .ui.checkbox {color:#718c96;}
.set-undergoal-area .goalset input {float:left; border:none; padding:0 10px; width:100px; height:28px; text-align:right;font-size:13px;}
.set-undergoal-area .goalset .subtxt {float:left; color:#718c96; margin-right:15px; font-size:13px; line-height:28px;}
.set-undergoal-area .goalset .btn-goal {float:left; width:47px; height:28px; line-height:26px; font-size:13px; font-weight:bold}
.set-undergoal-area .goalset .btn-submit {background:#718c96; color:#fff}
.set-undergoal-area .goalset .btn-edit {border:1px solid #718c96; color:#718c96}

/* 제품선택 */
.product-wrap{padding:0 19px;margin-top:15px;border:1px solid #d8e5e7;background:#fff;}
.product-wrap .tit-wrap{width:100%;display:inline-block;cursor:pointer;}
.product-wrap .tit-wrap span.tit{float:left;line-height:65px;height:65px;font-size: 24px;}
.product-wrap .tit-wrap span.icon{float:right;margin:26px 0 0;}
.product-wrap .table-wrap{margin-top:0 !important;margin-bottom:15px;}
.product-wrap .table-wrap table.outside{border-left:0;border-right:0;}
.product-wrap .table-wrap.fat-header th.fat-header{padding:20px 10px;}

/* onoff체크박스 */
.onoff-checkbox{display:inline-block;width:36px;vertical-align:top}
.onoff-checkbox input{display:none}
.onoff-checkbox input + label{position:relative;display:block;background:#f0f0f0;width:36px;height:20px;border-radius:30px;padding:2px;transition:all .4s ease;font-size:0;line-height:0;text-indent:-9999px;cursor:pointer}
.onoff-checkbox input + label:after{position:relative;display:block;left:0;width:50%;content:"";height:100%;border-radius:50%;background:#fff;transition:all .2s ease;}
.onoff-checkbox input:checked + label{background:#227EFF}
.onoff-checkbox input:checked + label:after{left:50%}

/* 자동문자설정 추가(191029) */
.option-tab{overflow:hidden;margin:40px 0 10px}
.option-tab ul{padding-left:1px; display: flex;}
.option-tab ul li{float:left; width:100%; margin-left:-1px;}
.option-tab ul li a{display:block;text-align:center;border:1px solid #d8e5e7;height:50px;line-height:48px;color:#718c96;font-size:15px;background:#fafcfc; width: 100%;}
.option-tab ul li a.on{font-weight:500;color:#000;border-top:1px solid #000;background:#fff;}

.option.sms{overflow:visible !important;height:320px}
.option .option-left{float:left}
.option .option-left .checkbox-wrap{height:35px}
.option .option-left .ui.checkbox input + label{padding-left:40px}
.option .option-left .op-select-area{width:100px; /*margin-left:40px*/}
.option .option-left .op-select-area .frm_select{width:100%;border:1px solid #dee2e6;margin-bottom:5px}
.option .option-right{float:right;padding-right:20px}
.option .option-right .sms-inp-area{float:left;width:180px;margin-left:12px}
.option .option-right .sms-inp-area:first-child{margin-left:0}
.option .option-right .sms-inp-area .sms-inp-date{width:100%;clear:both;overflow:hidden;height:35px}
.option .option-right .sms-inp-area .sms-inp-date .inp-date{float:left;}
.option .option-right .sms-inp-area .sms-inp-date .inp-date p{float:left;margin:0}
.option .option-right .sms-inp-area .sms-inp-date .inp-date .num{padding:0 8px 0 0;color:#37454a;font-size:14px;}
.option .option-right .sms-inp-area .sms-inp-date .inp-date .date{margin-top:-3px;border-bottom:1px solid #b8c4d0;width:60px;font-size:13px;color:#37454a;padding-bottom:3px}
.option .option-right .sms-inp-area .sms-inp-date .inp-date .date input{width:40px;border:0;text-align:center;font-size:14px;font-weight:600;color:#37454a}
.option .option-right .sms-inp-area .sms-inp-date .onoff-checkbox{float:right}
.option .option-right .sms-inp-area .textarea-w textarea{border:1px solid #dee2e6;width:100%;resize:none;padding:8px 12px;font-size:12px;line-height:18px;color:#666}
.option .option-right .sms-inp-area .timeSelect-area{position:relative;top:0;left:0;right:0;text-align:right;margin-top:9px}
.option .btn-area{position:absolute;bottom:32px;left:0;width:100%;text-align:right;font-size:0;padding-right:40px}
.option .btn-area span.line{position:absolute;left:0;top:50%;width:100%;height:1px;background:#DFE0E1}
.option .btn-area a{position:relative;display:inline-block;margin-left:5px;font-size:14px;font-weight:400;color:#20232B;text-align:center;border-radius:100px;padding: 0 20px;height:28px;line-height:20px;border:1px solid #DFE0E1;background:#fff}
.option .btn-area a.btn-delete span{padding-left:22px;background:url(/resources/static/assets/img/common/trash-1d288c2473bb71933ee98fe9dacd22d4.svg) no-repeat left 50%;vertical-align:middle}
.option .btn-area a.btn-plus span{padding-left:22px;background:url(/resources/static/assets/img/common/plus-e1c498c993879c006deecf4b99700420.svg) no-repeat left 50%; background-size: 20px 20px;vertical-align:middle}
/* .option .btn-area a:hover{border:1px solid #d5e4e6;background:#f6fafa} */

/* 예약현황 팝업 */
.pop-calendar-wrap {position:fixed; top: 60px; right:20px; z-index:130;}
.pop-calendar-icon { background: var(--grayscale-gray-700); border-radius: 50%; margin-left: 8px; padding: 4px; cursor: pointer; }
.pop-calendar-icon i { display: inline-block; width: 20px; height: 20px; vertical-align: text-top; }
.pop-calendar-area {width:250px; position:absolute; top:0; right:0; z-index:131; border-radius:12px; box-shadow:0px 2px 10px #d9e6e8; }
.pop-calendar-top {width:100%; height:45px; padding:11px 15px; background:#272d35; border-radius:10px 10px 0 0; overflow:hidden;}
.pop-calendar-top .top-title {margin:4px 10px 0 0; font-size:14px; color:#fff; float:left; display:inline-block;}
.pop-calendar-top .top-togglebtn {float:left; border-radius:10px; border:1px solid #738083}
.pop-calendar-top .top-togglebtn button {position:relative;float:left; padding:0 10px; height:20px; border-radius:10px; color:#fff; }
.pop-calendar-top .top-togglebtn button .bg-area {width:0; display:none}
.pop-calendar-top .top-togglebtn button span {position:relative; z-index:2; line-height:19px; font-weight:bold; font-size:10px;}
.pop-calendar-top .top-togglebtn button.active span {color:#3a5965}
.pop-calendar-top .top-togglebtn button.active .bg-area {position:absolute; width:0; top:0;left:0; z-index:1; display:block; height:20px; border-radius:10px; background:#fff; -webkit-transition: 0.5s;transition: 0.5s}
.pop-calendar-top .top-togglebtn button.toggle-btn01.active .bg-area {width:38px;}
.pop-calendar-top .top-togglebtn button.toggle-btn02.active .bg-area {width:47px;}
.pop-calendar-top .top-togglebtn button.toggle-btn02 {margin-left:-3px;}
.pop-calendar-top .btn-close {position:absolute; top:9px; right:9px; padding:7px; }
.pop-calendar-top .btn-close i {display:block; width:12px; height:12px; background:url('/resources/static/img/icon/ic-close-white-cd20d66752476770a7ac757852f8dddd.png') no-repeat;}
.content-list-wrap {display:none;}
.content-list-wrap.active {display:block;}
.content-top-date {position:relative; background:#fff; border-bottom:1px solid #d9e6e8; padding:12px 20px;}
.content-top-date .cont-date-btn {position:absolute; top:50%; z-index:10; margin-top:-10px; width:20px; height:20px; background:#fff; border:1px solid #dbe3e3; border-radius:10px;}
.content-top-date .cont-date-btn.btn-left {left:-10px;}
.content-top-date .cont-date-btn.btn-right {right:-10px;}
.content-top-date .cont-date-btn i {display:block; margin:6px 7px; width:4px; height:7px; background:url('/resources/static/img/icon/ic-calendar-arrow-3b87f1ddc1550953f5827524a2040eea.png') no-repeat;}
.content-top-date .cont-date-btn.btn-right i {transform:rotate(180deg);}
.content-top-date ul {display:inline-block; width:100%;}
.content-top-date ul li {float:left; cursor:pointer; width:42px; text-align:center;}
.content-top-date ul li span {display:inline-block; width:100%; color:#aeb8bc; font-weight:bold;  margin-bottom:4px;}
.content-top-date ul li span.sn-day {color:#fda0a0;}
.content-top-date ul li span.st-day {color:#92c6f3;}
.content-top-date ul li.active span {color:#364549}
.content-top-date ul li.active span.sn-day {color:#DE2E2E;}
.content-top-date ul li.active span.st-day {color:#2D6FE8;}
.content-top-date ul li .li-txt {font-size:10px; line-height:10px;}
.content-top-date ul li .li-num {font-size:16px; line-height:16px;}
.content-top-total ul {display:inline-block; width:100%; border-bottom:1px solid #d9e6e8}
.content-top-total ul li {float:left; width:25%; background:#fff;}
.content-top-total ul li a {display:block; width:100%; padding:10px 0; border-bottom:2px solid #fff; text-align:center;}
.content-top-total ul li a span {font-size:11px; color:#87969c}
.content-top-total ul li a span.num {font-size:10px;}
.content-top-total ul li a.active {border-bottom:2px solid #364549}
.content-top-total ul li a.active span {color:#364549; font-weight:bold}
.content-list-area {background:#f5f7f7; padding-top:5px; border-radius: 0 0 10px 10px; overflow:hidden}
.content-list-area .list-wrap {border-top:1px solid #d9e6e8}
.content-list-area .list-wrap li {position:relative; background:#fff; display:inline-block; padding:15px 0; width:100%; border-bottom:1px solid #d9e6e8; margin-bottom: -1px;}
.content-list-area .list-wrap li .list-left {float:left; width:30%; border-right:1px solid #d9e6e8; text-align:center}
.content-list-area .list-wrap li .txt-date {padding-bottom:5px;}
.content-list-area .list-wrap li .txt-date span {font-size:10px; color:#9ca8ad;}
.content-list-area .list-wrap li .txt-time span {font-size:13px; color:#364549; font-weight:bold}
.content-list-area .list-wrap li .list-right {float:left; width:70%; padding:0 45px 0 12px;}
.content-list-area .list-wrap li .txt-name {padding-bottom:5px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.content-list-area .list-wrap li .txt-name span {font-size:12px; color:#333;}
.content-list-area .list-wrap li .txt-info {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.content-list-area .list-wrap li .txt-info span {font-size:10px; color:#888;}
.content-list-area .list-wrap li .txt-info .info-time {display:inline-block; font-weight:bold; padding-right:7px;}
.content-list-area .list-wrap li .txt-info .info-blue {color:#17ccbd}
.content-list-area .list-wrap li .txt-info .info-purple {color:#8a4bba}
.content-list-area .list-wrap li .txt-info .info-gray {color:#495A6B}
.content-list-area .list-wrap li .txt-info .info-green {color:#3f74c0}
.content-list-area .list-wrap li .txt-info .info-yellow {color:#ffa500}
.content-list-area .list-wrap .btn-edit {position:absolute; top:50%; right:10px; margin-top:-13px; width:26px; height:26px; border-radius:26px; background:#ebecec; }
.content-list-area .list-wrap .btn-edit i {display:block; width:10px; height:10px; margin:7px; background:url('/resources/static/img/icon/ic-edit-pen-71618ddc43658cdfe2baecb8d67faad1.png') no-repeat;}
.content-list-area .pagination {position:relative; margin:13px 0 15px; width:100%;}

.cms-info-txtbox {margin-top:60px; background:#fff; padding:35px 0; text-align:center}
.cms-info-txtbox p {font-size:13px; color:#718c96; line-height:23px; margin:0}
.cms-info-txtbox .pay-btn-area {margin-top:30px; display:inline-block; text-align:center}
.cms-info-txtbox .pay-btn-area li {display:inline-block; width:200px; border-right:1px solid #d8e5e7}
.cms-info-txtbox .pay-btn-area li:last-child {border-right:0}
.cms-info-txtbox .pay-btn-area li button {margin:0 auto; }
.pay-btn-area li button i {float:left; display:inline-block; width:48px; height:28px; background:url('/resources/static/img/icon/ic-cms-pay-4db9a982c212addbdf3c88c47fe7b37c.png') no-repeat;}
.pay-btn-area li.pay-card button i {background-position:0 0}
.pay-btn-area li.pay-cash button i {background-position:0 -28px}
.pay-btn-area li.pay-auto button i {background-position:0 -56px}
.pay-btn-area li.pay-card.active button i , .pay-btn-area li.pay-card:hover button i {background-position:-48px 0}
.pay-btn-area li.pay-cash.active button i , .pay-btn-area li.pay-cash:hover button i {background-position:-48px -28px}
.pay-btn-area li.pay-auto.active button i , .pay-btn-area li.pay-auto:hover button i {background-position:-48px -56px}
.pay-btn-area li.active span , .pay-btn-area li:hover span {color:#37454a}
.pay-btn-area li button span {float:left; margin-top:3px; font-size:16px; font-weight:bold; color:#bbc4c8; display:inline-block; padding-left:5px;}
.pay-btn-area li.pay-auto button span {padding-left:10px;}

.cms-reg-in .pay-btn-area {display:table; width:100%; background:#fff}
.cms-reg-in .pay-btn-area li {display:table-cell; width:33.33%; border:1px solid #d8e5e7; text-align:center;}
.cms-reg-in .pay-btn-area li.active , .cms-reg-in .pay-btn-area li:hover {border:1px solid #37454a}
.cms-reg-in .pay-btn-area li button {text-align:center; padding:23px 70px; }

/* 영업시간 설정 수정 2020.01.07 Joomi */
.available-time .new_time_week {display:flex; width:100%; border-bottom: 1px solid #f2f2f2; padding: 6px 0;}
.available-time .new_time_week:last-child {border-bottom: 0;}
.available-time .timeSpace {height:30px; line-height:30px; margin-left:10px;}

/* 요금 및 이용권 > 결제내역 무통장 입금 정보변경 팝업 */
.btn-wrap .action { width:100%; display: inline-block; font-size: 14px; height: 50px; line-height: 50px; padding: 0 20px; background: #37454a; color: #ffffff; text-align: center;}

/* 이벤트 팝업 */
.eventpopup_Dimmer {z-index: 999;}
.eventpopup_Dimmer .popup_Area {position:relative;}
.eventpopup_Dimmer .popup_Area a.close{color:#fff; position: absolute; width: 20px; height: 20px; right:15px; top:15px;}
.eventpopup_Dimmer .popup_Area a.close img {width: 100%; height: auto;}
.eventpopup_Dimmer {background: rgba(0, 0, 0, 0.3); width: 100%; height: 100%; left: 0; top: 0; position: fixed; display: block;}
.eventpopup_Dimmer .popup_Area {width: 400px; position:relative; margin: 0 auto; top:8%; height: 588px; box-shadow: 20px 20px 20px 0px rgba(113, 140, 150, 0.3)}
.eventpopup_Dimmer .popup_Area .popup_Box {background: #ffffff; width: 400px; height: 512px; border-radius: 8px 8px 0 0;}
.eventpopup_Dimmer .popup_Area .popup_Box img {width:100%; border-radius: 8px 8px 0 0;}
.eventpopup_Dimmer .popup_Area .popup_Box map#event_popup area {outline:none;}
.eventpopup_Dimmer .popup_Area .popup_Btn-wrapper {display: flex; justify-content: center; align-items: center; background-color: #fff; gap: 8px; height: 76px; border-radius: 0 0 8px 8px;}
/* .eventpopup_Dimmer .popup_Area .popup_Btn {text-align: center; margin-top:50px;} */
.eventpopup_Dimmer .popup_Area .popup_Btn-wrapper .popup_Btn {width: 180px; height: 44px; line-height: 44px; text-align: center; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; text-decoration: none;}
.eventpopup_Dimmer .popup_Area .popup_Btn-wrapper .popup_Btn.close {border: 1px solid #DFE0E1; color: #20232B;}
.eventpopup_Dimmer .popup_Area .popup_Btn-wrapper .popup_Btn.close:hover {border: 1px solid #BFC0C2; color: #404249;}
.eventpopup_Dimmer .popup_Area .popup_Btn-wrapper .popup_Btn.temporary-off {background-color: #20232B; color: #fff; }
.eventpopup_Dimmer .popup_Area .popup_Btn-wrapper .popup_Btn.temporary-off:hover {background-color: #404249; }


/* 공비즈 튜토리얼 */
.tutorial-wrap {width:100%; height:100%; position:fixed; top:0; left:0; z-index:300}
.tutorial-area {width:100%; height:100%; position:absolute; top:0; left:0; z-index:302}
.tutorial-wrap .pop-bg {width:100%; height:100%; position:absolute; background:rgba(0,0,0,0.5);top:0; left:0; z-index:301}
.tutorial-wrap .close-txt {position:absolute; bottom:100px; left:50%; z-index:305; margin-left:-50px; }
.tutorial-wrap .close-txt input + label {color:#fff;}
.tutorial-list .list {position:absolute; left:50%; z-index:305}
.tutorial-list .area01 {margin-left:-549px; top:445px}
.tutorial-list .area02 {margin-left:-549px; top:127px}
.tutorial-list .area03 {margin-left:-549px; top:203px}

/* 댓글쓰기,보기 */
.reply-write-wrap {
    display: inline-block;
    width: 100%;
    border: 1px solid #dce8ea;
    background: #fff;
    padding: 10px;
    margin-top: 10px
}

.reply-write-area {
    position: relative;
}

.reply-write-area textarea {
    float: left;
    border: 0;
    width: 708px;
    height: 88px;
    margin-right: 10px;
    padding: 5px;
    font-size: 13px;
    color: #718c96;
    letter-spacing: -0.5px;
}

.reply-write-area span {
    position: absolute;
    top: 8px;
    left: 5px;
    font-size: 13px;
    color: #c1cbcc
}

.reply-write-wrap .btn-reply-submit {
    float: left;
    width: 100px;
    height: 88px;
    background: #37454a;
    color: #fff;
    font-size: 13px;
}

.reply-wrap {
    margin-top: 10px
}

.reply-wrap td.date, .reply-wrap td.btn-area {
    vertical-align: top
}

.reply-wrap td.content {
    line-height: 19px;
}

.reply-wrap td.content.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reply-wrap .label {
    font-weight: normal !important
}

.reply-wrap .admin-reply td {
    background: #f9fbfb !important;
}

.reply-wrap .admin-reply .admin-txt {
    float: right;
    font-weight: bold;
}

.reply-wrap .admin-reply .admin-txt i {
    float: left;
    width: 7px;
    height: 7px;
    margin-right: 5px;
    display: block;
    background: url('/resources/static/img/icon/ic-reply-admin-674f33350d379e086a60971bc628c8f0.png') no-repeat;
}

.reply-wrap .btn-text {
    color: #37454a;
    border: 0;
    background: none;
    padding: 0 5px;
}

.reply-wrap .user-replyedit textarea {
    width: 100%;
    height: 88px;
    border: 1px solid #d8e5e7 !important;
    padding: 10px
}

.popin-excelbtn-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 20px;
}

.popin-excelbtn {
    height: 30px;
    border: 1px solid #d9e6e8;
    padding: 0 12px;
    background: #fff;
    color: #37454a;
    display: inline-block;
    margin: 10px;
}

.popin-excelbtn .ic-tags-xls {
    margin: 0 5px 0 0
}

.popin-excelbtn span {
    display: inline-block;
    line-height: 28px;
    vertical-align: middle
}

/* 시술상세내역 */
.treatment-history {
    position: relative;
}

.treatment-history td.num {
    padding: 14px 0 14px 14px !important;
}

.treatment-history td.tit {
    text-align: left;
}

/*.treatment-history .name-wrap {width:100%; overflow:hidden; text-overflow: ellipsis; white-space: nowrap;}*/
.treatment-history .image {
    margin: 0 auto;
    position: relative;
    text-align: center;
    cursor: pointer;
}

.detail-info {
    position: absolute;
    top: 20px;
    right: 20px;
}

.detail-info .tit {
    float: left;
    display: inline-block;
    font-size: 12px;
    line-height: 22px;
    margin-right: 8px;
    color: #718c96;
}

.detail-info button {
    border: none;
    border-radius: 2px;
    padding: 0 12px;
    height: 22px;
    line-height: 18px;
    font-size: 11px;
    color: #fff;
    margin: 0 2px;
}

.detail-info button.btn-save {
    background: #37454a;
}

.detail-info button.btn-save:disabled {
    background: var(--color-gray-50);
    cursor: default;
}

.detail-info button.btn-print {
    background: #717c7f;
}

.detail-info button.btn-edit {
    border: 1px solid #37454a;
    color: #37454a;
}

.table-description {
    margin: 0 auto;
    color: #718c96;
    width: 50px;
    position: relative
}

.table-description.cosmetic-name {
    margin: 0;
    color: #718c96;
    width: 50px;
    position: relative
}

.table-description .contents {
    width: 50px;
    height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.table-description .contents.cosmetic-name {
    width: 135px;
    height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.table-description .ribon {
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    border-top: 10px solid #3f4d5e;
    border-right: 10px solid transparent;
}

.table-description .prepaid-block {
    display: none;
    position: absolute;
    width: 120px;
    left: 50%;
    top: 0;
    margin-left: -25px;
    margin-right: 10px;
    padding: 8px 6px;
    color: #ffffff;
    background: #3f4d5e;
    border-radius: 3px;
    z-index: 999;
}

.table-description .prepaid-block.cosmetic-name {
    display: none;
    position: absolute;
    width: 135px;
    left: 50%;
    top: 0;
    margin-left: -25px;
    margin-right: 10px;
    padding: 8px 6px;
    color: #ffffff;
    background: #3f4d5e;
    border-radius: 3px;
    z-index: 999;
}

.table-description .prepaid-block .text {
    display: inline-block;
}

.table-description:hover .prepaid-block {
    display: inline-block;
}

.treatment-history .amt {
    color: #37454a;
}

.treatment-history .amt-price {
    font-size: 12px;
}

.treatment-history .amt-price .price-first {
    color: #37454a;
    font-weight: bold;
    text-decoration: line-through;
}

.treatment-history .amt-price .price-discount {
    display: inline-block;
    position: relative;
    margin-left: 5px;
    padding-right: 10px;
    color: #fc6063;
    font-weight: bold;
}

.treatment-history .amt-price .price-plus {
    display: inline-block;
    position: relative;
    margin-left: 5px;
    padding-right: 10px;
    color: #0085ef;
    font-weight: bold;
}

.treatment-history .amt-price .ic_price-discount {
    display: block;
    position: absolute;
    top: 5px;
    right: 0;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid #fc6063;
}

.treatment-history .amt-price .ic_price-plus {
    display: block;
    position: absolute;
    top: 5px;
    right: 0;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid #0085ef;
}

.treatment-history .member-name {
    width: 100%;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 예약내역 */
.reservation-history {
    margin-top: 20px;
}

.reservation-history td {
    position: relative;
}

.reservation-history .btn-viewMore {
    cursor: pointer;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 638px;
    height: 44px;
    background: rgba(216, 229, 231, 0.5);
    text-align: center;
    line-height: 44px;
    color: #718c96;
    font-weight: bold;
    z-index: 10;
    letter-spacing: 1px;
    font-size: 12px
}

.reservation-history .table-description, .reservation-history .table-description .contents {
    width: 80px
}

.status-wrap.text-blue, .status-wrap .text-blue {
    color: #18ccbd;
}

.status-wrap.text-default, .status-wrap .text-default {
    color: #3E74C1;
}

.status-wrap.text-red, .status-wrap .text-red {
    color: #fc6063;
}

.status-wrap.text-gray, .status-wrap .text-gray {
    color: #495A6B;
}

.status-wrap.text-yellow, .status-wrap .text-yellow {
    color: #ffa500;
}

.reservation-status {
    display: table;
    width: 100%;
    height: 35px;
    margin-top: 15px;
    border: 1px solid #dce8ea;
}

.reservation-status .status-wrap {
    display: table-cell;
    width: 25%;
    border-right: 1px solid #dce8ea;
    font-size: 13px;
}

.reservation-status .status-wrap dl {
    display: table;
    width: 100%;
    height: 33px
}

.reservation-status .status-wrap dt {
    display: table-cell;
    width: 50%;
    background: #f9fbfb;
    color: #37454a;
    font-weight: bold;
    text-align: center;
    vertical-align: middle
}

.reservation-status .status-wrap dd {
    display: table-cell;
    width: 50%;
    text-align: center;
    vertical-align: middle
}

/* 선납권결제 환불 규정 추가 */
.cms-info-wrap .refund-info-wrap {margin-top:25px; line-height: 20px; color:#718c96; padding:15px 20px; border:1px solid #d8e5e7;}
.cms-info-wrap .refund-info-wrap .info-title {font-size:13px; margin-bottom:3px;}
.cms-info-wrap .refund-info-wrap .info-title span {font-weight: 500; font-size:13px; text-decoration: underline;}

/* sms 문자발송 페이지 수정 */
div.sms-info-subtxt li { position: relative; padding: 5px 0 5px 15px; font-size: 12px; color: #718c96; }
div.sms-info-subtxt li:before { content: "※"; position: absolute; top: 8px; left: 0; margin-top: -3px;}

/* signup */
.signup-container.new-signup-wrap {position:relative; width:750px; height:auto; left:auto; margin:100px auto;}
.signup-container.new-signup-wrap .controls.new-signup {width: auto; background: transparent; border: 0; padding: 0; width: auto; margin: 0 auto; margin-bottom: auto;}
.signup-container.new-signup-wrap .controls.new-signup .step-title {width: auto; margin-top: 70px; font-size: 20px; padding-bottom: 20px; font-weight: 600; text-align: left !important;}
.new-signup .step-title:first-child {margin-top:0}
.new-signup .step-title {margin-top:70px; font-size:20px; padding-bottom:20px; font-weight:600; text-align:left !important;}
.new-signup .etc-li {margin-bottom:45px}
.new-signup .etc-li.first {margin-top:15px}
.new-signup .etc-li.last {margin-bottom:0;}
.new-signup .submit-button {width:300px; margin:0 auto}
.new-signup-li {display:inline-block; width:100%; margin-bottom:6px}
.new-signup-li .li-title {width:140px; float:left; height:48px; font-size:16px; font-weight:bold; color:#8ba0a8; line-height:16px; padding-top:17px; text-align:left;}
.new-signup-li .li-title.etc {padding-top:0}
.new-signup-li .ui.field {width:610px; float:left; margin:0 !important }
.new-signup-li.pw .ui.field {width:300px; }
.new-signup-li.pw .ui.field:last-child {margin:0 0 0 10px !important}
.new-signup-li .recommend-text span {font-size:13px; color:#aeb1b3; line-height:18px; display:inline-block; margin-bottom:6px; }
.new-signup-li .recommend-text span.point {color:#8ba0a8; margin-bottom:0}
.signup-check {width:610px; float:left;}
.signup-check-tit {font-size:13px; color:#aeb1b3; margin-bottom:15px;}
.signup-check-area {width:100%; display:inline-block;}
.signup-check-area li {width:33.33%; float:left; height:48px; padding:15px 0;}
.signup-check-area li.full {width:100%;}
.signup-check-area li.write-input .ui.checkbox {width: 95px;float: left;}
.signup-check-area li.write-input .ui.input {float:right; width:510px; margin-top:-15px}
.signup-agree-area {display:flex; align-items:center; width:100%; margin:70px 0;}
.signup-agree-area .step-title {width:140px; float:left;}
.signup-agree-area .agreements {width:610px; float:left; margin:0 !important}
.signup-agree-area .agreements .ui.field {float:left; width:50%}
.signup-agree-area .agreements .ui.field a.show-content {float:none; display:inline-block; margin-left:15px}
.store-select-area {width:610px; float:left; }
.store-select-area .text span {display:inline-block; font-size:13px; line-height:18px; color:#aeb1b3; margin-bottom:6px;}
.store-select-area .ui.input {position:relative;}
.store-select-area .ui.input .fa-search {position:absolute; top:18px; right:20px;}
.select-table {width:100%; margin-top:20px; border-top:1px solid #d9e6e8;}
.select-table td {text-align:left; padding:10px 0; border-bottom:1px solid #d9e6e8;}
.select-table td .thumbnail {width:40px; height:40px; border:0px solid #999999}
.select-table td .shop-name {font-size:12px; font-weight:bold}
.select-table td .address , .select-table td .master {font-size:12px;}

/* top 공비서스토어 버튼 추가 */
.navbar .wrap .store-logo {width: 160px; padding: 6px 15px; position: relative; font-size: 12px; display: flex; align-items: center; border-top: 0; border-bottom: 0; color: #18292e; cursor: pointer;}
.navbar .wrap .store-logo i.store-logo-icon {background:url('/resources/static/img/figma/icon-gongbizstore-bc06a261288bfc6cf42a80040c40e3bf.svg') no-repeat; background-size:100%; display: inline-block; width: 14px; height: 14px; position: absolute;}
.navbar .wrap .store-logo span.text {margin-left: 20px;}
.navbar .wrap .store-logo i.arrow-right {background:url('/resources/static/img/icon/gstore_arrow_right-87519a02c8ccc4fde283993f8ad16f11.png') no-repeat; display: inline-block; width: 7px; height: 7px; margin-left: 6px; margin-bottom: 1px;}


/* 그룹예약 기능 추가 - 예약정보 팝업 수정 */
.relative {position: relative;}
div.modal.reservation-information td.column.content div.ui.search.form {width: 100%; height:100%; position: absolute; left: 0; top: 0; }
div.modal.reservation-information td.column.content div.ui.search.form input {border:0;}
div.modal.reservation-information td.column.content.list .list {height: 40px; width: 100%; line-height: 40px; display: block;}
div.modal.reservation-information td.column.content.list {padding:0; height: 161px;}

div.modal.reservation-information em.status-blt {width: 6px; height: 6px; display: inline-block; border-radius: 100px; margin-bottom: 2px;}
div.modal.reservation-information em.status-blt.skyblue {background-color: #58e5e4;}
div.modal.reservation-information em.status-blt.blue {background-color: #44a0ce;}
div.modal.reservation-information em.status-blt.yellow {background-color: #fea500;}
div.modal.reservation-information em.status-blt.red {background-color: #f3211e;}
div.modal.reservation-information em.status-blt.gray {background-color: #879497;}

div.modal.reservation-information span.status-name { display: inline-block; margin-right:10px; float: left;}
div.modal.reservation-information span.status-name select.status-edit {border:0; padding:3px;}
div.modal.reservation-information span.name-area {width: 70px; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; float: left; }
div.modal.reservation-information span.number-data {width: 80px; display: inline-block; float: left; padding-left:5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
div.modal.reservation-information a.ui.close.button {float: right; cursor:pointer; display: inline-block; float: right;}

.content-area {width: 100%; height: 100%; overflow: auto; padding: 0 10px 0 14px;}
div.modal.reservation-information td.content.editable .action.submit {right:0 !important;}
div.modal.reservation-information td.content.editable .action.edit {right: 0 !important;}
div.modal.reservation-information td.content.editable .circle-close {right: 20px!important;}


/* 그룹예약 기능 추가 - 개별/그룹예약 선택 팝업 */
div.modal.groupOne-selectPop .button-area {padding: 20px; background: #f7fafb;}
div.modal.groupOne-selectPop .button-area a{ padding: 24px 30px; box-sizing: border-box; border:2px solid #dce8ea; position: relative; display: block;
  background-color:#fff; color:#37454a; font-size: 14px; letter-spacing: -0.5px; margin-bottom: 10px; border-radius: 10px; line-height: normal;}
div.modal.groupOne-selectPop .button-area a:hover {border: 2px solid #227eff; box-sizing: border-box;}
div.modal.groupOne-selectPop .button-area a.one-class p.title i.title-icon {width: 30px; height: 30px; background:url('/resources/static/assets/img/common/ic-individual-f82775b77e3513515c6e41c2d82f1a7d.svg') no-repeat; display: inline-block; float: left;}
div.modal.groupOne-selectPop .button-area a.one-class p.title span {height: 30px; width: auto; float: left; left: 30px; margin-left: 10px;}
div.modal.groupOne-selectPop .button-area a.group-class p.title i.title-icon {width: 30px; height: 30px; background:url('/resources/static/assets/img/common/ic-bygroup-b17fe1f74c869e3e87538d9d0491ad57.svg') no-repeat; display: inline-block; float: left;}
div.modal.groupOne-selectPop .button-area a.group-class p.title span {height: 30px; width: auto; float: left; left: 30px; margin-left: 10px;}
div.modal.groupOne-selectPop .button-area p.title {height: 30px; line-height: 30px; font-weight: bold; font-size: 18px; color:#37454a; letter-spacing: -0.24px; margin-block-start: 0; margin-block-end: 10px;}
div.modal.groupOne-selectPop .button-area p.text {margin-block-start: 0; margin-block-end: 0;}
div.modal.groupOne-selectPop .button-area a span.arrow-right {position: absolute; line-height: 90px; right: 20px;}


/* 그룹 신규수업등록 UI 수정 */
div.register-reservation-group div.new-class.group .input-wrap .ui.dropdown {width: 100%; padding: 0 1em; border: 1px solid #d9e6e8; font-size: 14px; height: 48px; line-height: 48px; position: relative; }
div.register-reservation-group  div.new-class.group .input-wrap .ui.dropdown span.fa.fa-caret-down {float: right; height: 48px; line-height: 48px;}
div.register-reservation-group  div.new-class.group .input-wrap .ui.dropdown .dropdown-items {width: 100%; left: 0; }
.ui.modal.register-reservation-group .body > .step.one > .tab-content.new-class, .ui.modal.register-reservation-group .body > .step.one > .tab-content.without-register {
  padding: 50px 0px;
  background: #FFFFFF;
}
.ui.modal.register-reservation-group .body > .step.one > .tab-content.new-class .inputs, .ui.modal.register-reservation-group .body > .step.one > .tab-content.without-register .inputs {
  width: 300px;
  margin: 0 auto;
}
.ui.modal.register-reservation-group .body > .step.one > .tab-content.new-class .description, .ui.modal.register-reservation-group .body > .step.one > .tab-content.without-register .description {
  margin-top: 20px;
  text-align: center;
  font-size: 12px;
  line-height: 16px;
}
.ui.modal.register-reservation-group .body > .step.two > .date {
  border-top:1px solid #dce8ea;
  border-bottom:1px solid #dce8ea;
  margin-bottom: 20px; }
.ui.modal.register-reservation-group .body > .step.two > .date .date-area01 {
  padding:14px 0;
  border-bottom:1px solid #dce8ea;
}
.ui.modal.register-reservation-group .body > .step.two > .date .sub-title {
  float:left;
  padding-left:20px;
  width:30%;
  font-size: 13px;
  color:#718c96;
  font-weight: bold; }
.ui.modal.register-reservation-group .body > .step.two > .date .ui.choose-date .text {
  font-size: 13px; }
.ui.modal.register-reservation-group .body > .step.two > .date .ui.dropdown .text {
  font-size: 13px; }

/* 예약수정 > 매출등록new 수정 */
.font-size-18 {font-size: 18px;}



/* 요금 및 이용권 > 결제정보 */
.cms-info-wrap.type02 .productChoose-cont .price-area {position: relative;}
.cms-info-wrap.type02 .productChoose-cont .price-area span.img-belt-small {background:url('/resources/static/assets/img/common/img-cash2-belt-small-ae433f8d5befbe9e2a6afa00a63d5c3c.svg')no-repeat; display: block; position: absolute; width: 80px; height: 80px; top:-3px;}
.cms-info-wrap.type02 .cms-productChoose-wrap.advantage {margin-top: 20px; display: block; font-size: 14px; color: #364549;}

/* 요금 및 이용권 > 선납권결제 */
.cms-info-wrap .productChoose-cont .price-area {position: relative;}
.cms-info-wrap .productChoose-cont .price-area span.img-belt-small {background:url('/resources/static/assets/img/common/img-cash2-belt-small-ae433f8d5befbe9e2a6afa00a63d5c3c.svg')no-repeat; display: block; position: absolute; width: 80px; height: 80px; top:-3px;}
.cms-info-wrap .cms-productChoose-wrap.advantage {margin-top: 20px; display: block; font-size: 14px; color: #364549;}

/***** 회원가입 > 그룹예약 사용여부 추가설명팁 ******/
.ic-question-cont.group_booking {position: absolute; z-index: 1; top: 16px; box-shadow: 10px 10px 30px 0 rgba(52, 58, 64, 0.1);}



/* 잠금화면 : 비밀번호 설정 화면 */
.in-block {display: inline-block; position: relative;}
.w100 {width: 100%;}
.mt50 {display: block; height: 50px;}
.no-bottom-border {border-bottom: 0!important;}
i.lock_icon {width: 20px; height: 20px; background:url('/resources/static/assets/img/common/lock_icon_2-6ef65f32bf68b9b06a65e1973a0b3da7.svg') no-repeat; display: inline-block; margin-bottom: -1px; margin-right: 6px;}

.page-content.lock_setting .sub-page-header-wrap .top_set {border: 1px solid #D7E4E6; width: 100%; line-height: 70px; padding: 0 24px; height: 70px;}
.page-content.lock_setting .sub-page-header-wrap .top_set span.title {font-size:15px; font-weight: 500; color:#34454A;}
.page-content.lock_setting .sub-page-header-wrap .top_set .toggle-btn-wrap {display: inline-flex; line-height: 70px; position: absolute!important; top: 23px; margin-left: 20px; height: 26px;}
.page-content.lock_setting .option-tab ul li:first-child {width: 50% !important;}
.page-content.lock_setting .option-tab ul li:first-child a.on {border-right:0!important;}
.page-content.lock_setting .option-tab ul li:last-child a.on {border-left:0!important;}
.page-content.lock_setting .option-tab ul li {width: 50% !important; margin-left: 0;}
.page-content.lock_setting .option-tab ul li a.on {border-bottom-color:#fff;}
.page-content.lock_setting .option-tab {margin: 17px 0 0px!important;}
.page-content.lock_setting .form-area {padding:60px 0; background-color: #fff; border: 1px solid #d8e5e7; border-top: 0; box-sizing: border-box;}
.page-content.lock_setting .option-tab ul {padding-left:0;}
.page-content.lock_setting .form-area-box {width: 280px; margin: 0 auto;}
.page-content.lock_setting .error-message {margin-top:6px; color:#FF8585;}
.page-content.lock_setting .form-title {font-size:18px; font-weight: bold; display: block; margin-bottom: 24px;}
.page-content.lock_setting .ui input {border-bottom:0;}
.page-content.lock_setting .ui input.last {border-bottom: 1px solid #d9e6e8;}
.page-content.lock_setting .form-area.step2 input {border-bottom:1px solid #d9e6e8;}
.page-content.lock_setting .form-area.step2 span.discription {margin-top: 6px; display: block; color:#718C96;}
.page-content.lock_setting div.ui.input {position: relative;}
.page-content.lock_setting .form-area.step3 span.discription {margin-bottom: 22px; display: block; color:#718C96;}
.page-content.lock_setting a.btn-num {background-color: #718C96; width: 94px; height: 48px; line-height: 48px; color:#fff; position: absolute; right:0; font-size: 12px; text-align: center;}
.page-content.lock_setting span.fr.time {position: absolute; right: 14px; color:#FF8585; font-size: 11px; line-height: 48px;}


/* 잠금화면 : 잠금영역 설정 화면 */
.page-content.areaSetting .sub-page-header-wrap .top_set {border: 1px solid #D7E4E6; width: 100%; line-height: 70px; padding: 0 24px; height: 70px;}
.page-content.areaSetting .sub-page-header-wrap .top_set span.title {font-size:15px; font-weight: 500; color:#34454A;}
.page-content.areaSetting .sub-page-header-wrap .top_set .toggle-btn-wrap {display: inline-flex;line-height: 70px; position: absolute!important; top: 23px; margin-left: 20px; height: 26px;}
.page-content.areaSetting .option-tab ul li:first-child {width: 50% !important;}
.page-content.areaSetting .option-tab ul li:first-child a.on {border-right:0!important;}
.page-content.areaSetting .option-tab ul li:last-child a.on {border-left:0!important;}
.page-content.areaSetting .option-tab ul li {width: 50% !important; margin-left: 0;}
.page-content.areaSetting .option-tab ul li a.on {border-bottom-color:#fff;}
.page-content.areaSetting .option-tab {margin: 17px 0 0px!important;}
.page-content.areaSetting .form-area {padding:60px 0; background-color: #fff; border: 1px solid #d8e5e7; border-top: 0; box-sizing: border-box;}
.page-content.areaSetting .form-area-box {width: 280px; margin: 0 auto;}
.page-content.areaSetting .error-message {margin-top:6px; color:#FF8585;}
.page-content.areaSetting .form-title {font-size:18px; font-weight: bold; display: block; margin-bottom: 24px;}
.page-content.areaSetting .input-wrap {display: flex;width: 100%; height: 48px; padding: 0 1em; align-items: center; border: 1px solid #d9e6e8; font-size: 14px; line-height: 48px; color:#bdc5d0;}


/* 잠금화면 : 잠금비밀번호 입력 화면 */
.page-content.pwdForm .form-area {padding:60px 0; background-color: #fff; border: 1px solid #d8e5e7; box-sizing: border-box;}
.page-content.pwdForm .form-area-box {width: 280px; margin: 0 auto;}
.page-content.pwdForm .form-area-box span.form-title {font-size:18px; font-weight: bold; display: block; margin-bottom: 24px;}


/* 잠금화면 : 자동잠금 시간 노출 */
.page-title span.lock-time {font-size: 12px; color: #ff413c; position: absolute; right: 0; font-weight: normal;}
.page-content-header-wrap span.lock-time {
  font-size: 12px;
  color: #ff413c;
  position: absolute;
  font-weight: normal;
}

.sub-page-header-wrap span.lock-time {
  font-size: 12px;
  color: #ff413c;
  position: absolute;
  margin-left: 720px;
  font-weight: normal;
}

/* 예약캘린더 오른쪽 버튼 */
.right-menu-wrap.b2capp ul.menus .item .icon-area {position: relative; width: 60px; height: 60px;}
.right-menu-wrap.b2capp ul.menus .item .icon-area i.icon_setting {background: url('/resources/static/assets/img/common/icon_setting_blt-9b950d7f899793b5bdbd54b8574c88e3.svg') no-repeat;
  width: 23px; height: 23px; background-position: 0 0; position: absolute; right: 0; bottom: 0; box-shadow: 0 0 2px #CFD7D9; border-radius: 100px;}
.right-menu-wrap.b2capp ul.menus .item .icon-area span.new {background: #227eff; color: #fff; font-weight: 500; padding: 5px 10px; position: absolute; right: -8px; bottom: 0; border-radius: 100px;}

/* 예약서비스 연동 예약대기중 팝업 백업(신규) */
.ui.modal.B2C_Res_wait {width: 425px;}
.ui.modal.B2C_Res_wait .header {padding: 17px 100px 0; height: 60px; background: url('/resources/static/img/B2C_Res_wait_title_ICO-2130a054c0814fac7d85c651d34862d9.svg') no-repeat #227EFF !important; background-position: 20px 0 !important;}
.ui.modal.B2C_Res_wait .header .title {font-size: 12px!important; color:#fff!important; font-weight: bold; line-height: 18px; padding-left: 70px;}
.ui.modal.B2C_Res_wait .header a.ui.modal-close.button i.close {display: block; width: 12px; height: 12px; background: url('/resources/static/img/icon/ic-close-white-cd20d66752476770a7ac757852f8dddd.png') no-repeat;}
.ui.modal.B2C_Res_wait .body {height: 360px; overflow: overlay; background: #f4f7f7; border-radius: 0 0 4px 4px;}
.ui.modal.B2C_Res_wait .body .content-list-area {padding: 20px !important; background: transparent;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap {border-top: 0!important;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li {position: relative; display: flex; align-items: center; padding: 16px 0; width: 100%; border-bottom: 0; margin-bottom: 8px; border-radius: 4px; box-shadow: 0 2px 4px 0 #D9DDE3; background: url('/resources/static/img/B2C_list_line-5bb248f4eccb7810c2bc85eef7f7437a.svg') repeat-y #fff;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li:last-child {margin-bottom: 15px;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li .list-left {width:85px; color: #000; border-right: 1px solid #EFEFEF;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li .list-right {width:calc(100% - 190px); margin-right:13px; padding-right:0;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li .txt-date span {font-size: 12px;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li .txt-time span {font-size: 16px;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li .txt-name {padding-bottom: 8px; line-height: 17px;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li .txt-info span {font-size: 12px;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li .txt-name i.info-time {background: url('/resources/static/assets/img/common/icon_wait-a5a74d9178a56f5f43fd74b0906c4bea.svg') no-repeat !important; display: inline-block; width: 36px; height: 14px; float: left; margin-top: 2px; margin-left: 8px;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap li .txt-name span {font-size: 12px; color: #333; float: left; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.ui.modal.B2C_Res_wait .body .content-list-area .list-wrap span.list_more {width: 95px; height: 26px; line-height: 26px; color: #000; font-size: 11px; box-shadow: 0 2px 4px 0 #D9DDE3; border-radius: 100px; display: inline-block; background: #fff; text-align: center; margin: 0 auto;}
.ui.modal.B2C_Res_wait .body .content-list-area .booking-null {text-align: center;}
.ui.modal.B2C_Res_wait .body .content-list-area .booking-null img {margin-top: 70px; margin-bottom: 12px;}
.ui.modal.B2C_Res_wait .body .content-list-area .booking-null span {color:#6B7381; font-size: 12px;}
.ui.modal.B2C_Res_wait .body .btn-confirm {width:70px; height:auto; padding:6px 5px 7px; background-color:#000; margin-right:20px; text-align:center; border-radius:15px; font-size:10px; color:#fff; cursor:pointer;}
.ui.modal.B2C_Res_wait .body .btn-confirm i {margin-left:2px;}
.align-center {text-align: center;}

/* b2c-notice */
i.b2c-notice {display: inline-block; width: 15px; height: 15px; background: url('/resources/static/img/ico-b2c-2-c97de314ff4dbc5fa2c2bae67525e678.svg') no-repeat; margin-right: 3px; margin-bottom: -2px; }

/* 베타 아이콘 */
i.beta_icon {background: url('/resources/static/assets/img/common/beta_icon-ccb929de0d6bef2420a3d1dadc1b5a0c.svg') no-repeat; display: inline-block; width: 23px; height: 11px; margin-bottom: 9px;}
i.beta_icon2 {background: url('/resources/static/assets/img/common/beta_icon-ccb929de0d6bef2420a3d1dadc1b5a0c.svg') no-repeat; display: inline-block; width: 23px; height: 11px;}

/* 활성화 토글버튼 영역 디자인통일 */
.toggleBox {display: flex; align-items: center; font-size: 15px;
  border: 1px solid #D7E4E6; width: 100%; padding: 0 24px; height: 70px; margin: 20px 0; font-weight: 500; line-height: 26px; color:#000;}

/* 입력필드 에러메시지 컬러 */
.ui.modal.register-reservation .body > .step.one > .tab-content.new-customer .description .msg.error, .ui.modal.register-reservation .body > .step.one > .tab-content.without-register .description .msg.error {
  color: #ff8585;
}

/* 샵 대표 이미지 썸네일 기본 이미지 */
img.thumbnail.default {
  border: 0;
  background: url('/resources/static/img/icon/store-f33a9101a8f67d232fe4d7f2e4e329d7.svg') no-repeat #c4c5c5;
  background-size: 40%;
  background-position: center center;
}


/* 캘린더 페이지 UI 수정 */
.main-container .content .calendar-wrap .empl-select {
  max-width:150px;
  height:34px;
  border: 1px solid #d8e5e7;
  border-radius: 2px;
  padding:5px 30px 5px 5px;
  margin-left:5px;
  appearance: none;
}
.main-container .content .calendar-wrap .label .items i.fa-chevron-right {
  position: absolute;
  right: 12px;
  top: 12px;
  transform: rotate(90deg);

}
.main-container .content .page.reservation {
  display:flex;
}
.main-container .content .page.reservation .right-menu-wrap.week {
  margin-top:81px;
}
.main-container .content .page .page-content.calendar {
  width:950px;
}

@media (max-width:1440px){
  .main-container > .content-container > .content {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media (max-width: 1290px) {
  .main-container .content .page .page-content.calendar {
    width: 900px;
  }
}

@media (max-width:1140px) {

  .mypage-container {
    width:1140px;
  }
  .mypage-container .sub-page.member-shop-list .items .item td.address {
    width:100px;
  }
  .mypage-container .sub-page.member-shop-list .items .item td.goto-shop {
    width:100px;
    white-space:nowrap;
  }
  .mypage-container .sub-page.member-shop-list .items .item td.leave {
    width:50px;
  }
}
/* */

/* 버튼 표준화 */
.header-right-btn-wrap {
  display:flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom:15px;
}
.btn-print-icon {
  background-image:url('/resources/static/img/icon/ic-print-651c8ca52738e4d089ad0679b1b5d0d9.svg');
}
.btn-upload-icon {
  background-image:url('/resources/static/img/icon/ic-upload-c59b0b4b8faecf0020c6b6522628a6f1.svg');
}
.btn-upload-icon.black {
  background-image:url('/resources/static/img/icon/ic-upload-w-7ed16ffafa3b1ff2175c4f1f1f7c4984.svg');
}
.btn-set-icon {
  background-image:url('/resources/static/img/icon/ic-setting-67d17de9e2d358c432686e151a17f9f3.svg');
}
.btn-set-icon.black {
  background-image:url('/resources/static/img/icon/ic-setting-w-90473022c49cabf5e9e5795ef0c45a12.svg');
}
.btn-member-icon {
  background-image:url('/resources/static/img/icon/ic-ticket-w-fd4b2acb20d78f508ff740e1c378a9a2.svg');
}
.btn-plus-icon {
  background-image:url('/resources/static/img/icon/ic-plus-w-95f6f7afe3c1753b2f753e7548ca38ac.svg');
}
.btn-download-icon {
  background-image:url('/resources/static/img/icon/ic-download-2e73a9c3864a6c68270fdeb236caa98d.svg');
}

.btn-card-icon.black {
    background-image: url('/resources/static/img/icon/ic-credit-w-d096a49f971a5e582a1363a5abce03c8.svg');
}

.btn-reject-icon {
    background-image: url('/resources/static/img/icon/ic-ban-w-cf84232567d7db8543911949ef079613.svg');
}

.btn-qna-icon.black {
    background-image: url('/resources/static/img/icon/ic-question-w-ca9a6b8a2c8ccd6d48c8ed37a953dd3e.svg');
}
.btn-del-icon {
  background-image:url('/resources/static/img/icon/ic-del-aa4331428fd405c6207e87cd0af09e54.svg');
}
.btn-del-icon.black {
  background-image:url('/resources/static/img/icon/ic-del-w-93594de83a1c4b48cd3665fb7230a985.svg');
}
.standard-btn-wrap a {
    padding: 12px 12px 12px 36px;
    font-size: 13px;
    border-radius: 3px;
    cursor: pointer;
    border: 1px solid #e3e8ec;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: 12px center;
}
.standard-btn-wrap a.black {
  background-color:#20232b;
  border:none;
  color:#fff;
  background-position: 6px center;
}

/* 목록 테이블 색상 */
.page.customer-service-center .page-content .table-wrap .text-color-tbl td.column {
  color:#000;
}
.page.customer-service-center .page-content .table-wrap .text-color-tbl .title a {
  color:#37454a;
}
.loading-background {
  position:fixed;
  width:100%;
  height:100%;
  top:0;
  left:0;
  background-color:rgba(0,0,0,0.3);
  z-index:1000;
}
.loading-background .loading-icon  {
  display: flex;
  flex-direction: column;
  background-color: #fff;
  align-items: center;
  position: absolute;
  top: 50%;
  text-align: center;
  line-height: 22px;
  border-radius: 5px;
  left: 50%;
  transform: translate(-50%,-50%);
  padding: 15px 20px;
  box-shadow: 4px 4px 11px 3px rgba(0,0,0,0.2);
}

.page.gallery header {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0 0 40px;
}

.page.gallery .title {
  font-size: 24px;
  font-weight: bold;
  height: 42px;
  line-height: 42px;
  margin: 0;
}

.page.gallery .question-icon {
  display: block;
  margin-left: 5px;
  width: 18px;
  height: 18px;
  background: url('/resources/static/img/icon/ic-question-0b3c30ddf20fff09432b95cfd3cb0cc9.svg') no-repeat;
}

.page.gallery .question-content {
  position: absolute;
  display: none;
  top: calc(100% + 10px);
  left: 0;
  font-size: 13px;
  line-height: 22px;
  color: #718c96;
  border: 1px solid #d8e5e7;
  background: #fff;
  padding: 20px 15px;
  width: 100%;
  z-index: 99;
  box-shadow: 10px 10px 30px 0 rgb(52 58 64 / 10%);
}

.page.gallery .question-content::after {
  content: "";
  position: absolute;
  left: 130px;
  top: -6px;
  z-index: 15;
  width: 10px;
  height: 9px;
  background: url(/resources/static/img/icon/ic-pop-arrow-top-7be2a7f8acf3499a0da4dad5c3dc5524.png)no-repeat;
}

.page.gallery .gallery-notice {
  padding: 30px;
  background-color: #707a820C;
  margin-bottom: 30px;
}

.page.gallery .gallery-notice.import-modal {
  background-color: #ECF1F8;
  width: 100%;
  max-width: 1140px;
}

.page.gallery .gallery-notice.import-modal li {
  display: flex;
  align-items: center;
}

.page.gallery .gallery-notice.import-modal .export,
.page.gallery .gallery-notice.import-modal .no-export {
  display: flex;
  align-items: center;
}

.page.gallery .gallery-notice.import-modal .no-export {
  margin-left: 10px;
}

.page.gallery .gallery-notice.import-modal .export div,
.page.gallery .gallery-notice.import-modal .no-export div {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-right: 8px;
  background-color: #ADB5BD;
  border-radius: 50%;
}

.page.gallery .gallery-notice.import-modal .export div {
  background-color: #227EFF;
}

.page.gallery .gallery-notice li {
  font-size: 13px;
  line-height: 19px;
  color: #20232b;
  letter-spacing: -0.27px;
}

.page.gallery .gallery-import {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 490px;
  background-color: #fff;
}

.page.gallery .gallery-import-desc {
  color: #20232b;
  font-size: 13px;
  line-height: 19px;
  letter-spacing: -0.27px;
  text-align: center;
}

.page.gallery .gallery-import-generate-btn {
  padding: 10px 20px;
  background-color: #227EFF;
  box-shadow: 0px 2px 13px rgba(34, 126, 255, 0.232162);
  border-radius: 4px;
  font-size: 13px;
  line-height: 19px;
  letter-spacing: -0.27px;
  color: #fff;
}

.page.gallery .gallery-list ul{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-auto-rows: minmax(auto, calc(950px / 5));
  row-gap: 10px;
  column-gap: 10px;
}

.page.gallery .gallery-list li {
  position: relative;
}

.page.gallery .gallery-list.select ul {
  grid-template-columns: repeat(auto-fill, minmax(217px, 1fr));
  grid-auto-rows: minmax(auto, 217px);
}

.page.gallery .gallery-list.select li > input[type="checkbox"] {
  display: none;
}

.page.gallery .gallery-list.select li > label {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  background-color: #ECF1F8;
  transition: padding 0.2s ease-out;
  cursor: pointer;
}

.page.gallery .gallery-list.select li > input:checked ~ label {
  padding: 10px;
}

.page.gallery .gallery-list img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 3px;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

.page.gallery .gallery-item-btn {
  position: absolute;
  display: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-size: contain;
}

.page.gallery .gallery-item-btn.select {
  top: 8px;
  left: 8px;
  background-color: #ADB5BD;
  padding: 8px 6px;
}

.page.gallery .gallery-item-btn.delete {
  background: url(/resources/static/img/icon/icon-gallery-delete-0114756464f60ccc2e35e543bfb8b2ae.svg) no-repeat center;
  top: -4px;
  right: -4px;
}

.page.gallery .gallery-list.select li > input[type="checkbox"]:checked ~ label .gallery-item-btn.select {
  background-color: #227EFF;
}

.page.gallery .gallery-list.select .gallery-item-btn.select {
  display: block;
}

.page.gallery .gallery-list .gallery-item-btn.delete {
  display: block;
}

.page.gallery .pagenation {
  display: flex;
  align-items: center;
}

.page.gallery .pagenation button {
  width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
}

.page.gallery .pagenation-number-list {
  display: flex;
  align-items: center;
}

.page.gallery .pagenation-number-list li {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.page.gallery .pagenation-number-list li button{
  color: #ADB5BD;
}

.page.gallery .pagenation-number-list li.active {
  background-color: #ADB5BD;
  margin: 0 5px;
}

.page.gallery .pagenation-number-list li.active button {
  color: #fff;
}

.page.gallery .tooltip {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #20232B;
  border-radius: 35px;
  max-width: 500px;
  min-width: 148px;
  height: 50px;
  font-size: 13px;
  color: #fff;
  position: fixed;
  bottom: 15%;
  left: 50%;
  padding: 15px;
}

.page.gallery .user-info {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
  font-size: 14px;
  font-weight: 700;
  font-family: "Spoqa Han Sans Neo";
}

.page.gallery .user-info span {
  font-weight: 400;
  margin-right: 5px;
}

.page.gallery .gallery-edit {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 20px;
}

.page.gallery .gallery-edit-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  border: 1px solid #DEE2E6;
  box-sizing: border-box;
  box-shadow: 0px 2px 4px rgba(73, 87, 98, 0.1);
  border-radius: 4px;
  width: 88px;
  height: 40px;
}

.page.gallery .gallery-edit-btn img {
  margin-right: 8px;
}

.page.gallery .modal.import-image {

  width: 100%;
  height:100vh;
  background-color: #F2F2F2;

  /* cascading modal */
  top: 0;
  transform: translateX(-50%);
}

.page.gallery .modal.import-image .content-wrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 0 20px 0;
  overflow-y: auto;
  /* 브라우저 높이 - 상단 여백 - 연결된 계정 영역 높이 - 헤더 높이*/
  height: calc(100vh - 94px - 54px);
}

.page.gallery .modal.import-image header {
  box-shadow: 0px 2px 4px #DADCE0;
  padding: 15px;
  background-color: #fff;

  /* cascading components.scss header style */
  margin-bottom: 0;
}

.page.gallery .modal.import-image .header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
}

.page.gallery .modal.import-image header .modal-title {
  display: flex;
  font-weight: bold;
  margin: 0;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.33px;
  color: #20232B;
}

.page.gallery .modal.import-image .modal-title img {
  margin-right: 10px;
}

.page.gallery .modal.import-image .instagram {
  background-color: #fff;
  border-bottom: 1px solid #DEE2E6;
  padding: 0 15px;
}

.page.gallery .modal.import-image .instagram .instagram-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: 24px 0;
}

.page.gallery .modal.import-image .instagram .instagram-content > div:last-child {
  display: flex;
}

.page.gallery .modal.import-image .instagram .instagram-account {
  margin-left: 10px;
}


.page.gallery .modal.import-image .instagram .instagram-btn {
  display: flex;
  align-items: center;
  padding: 12px 20px;
  border: 1px solid #DEE2E6;
  border-radius: 3px;
  margin-left: 16px;
}

.page.gallery .modal.import-image .instagram .instagram-btn img {
  margin-right: 10px;
}

.page.gallery .modal.import-image .instagram .instagram-btn.apply {
  background: #227EFF;
  box-shadow: 0px 3px 5px rgba(0, 106, 255, 0.2);
  border: none;
  color: #fff;
}

#feed-image-empty {
  display: flex;
  margin-top: 100px;
  height: 60%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#feed-image-empty .empty-image-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 102px;
  height: 102px;
  background-color: #fff;
  border-radius: 50%;
  margin-bottom: 34px;
}

#feed-image-empty > p:nth-child(2) {
  font-weight: bold;
  font-size: 24px;
  line-height: 36px;
  text-align: center;
  letter-spacing: -0.5px;
  margin: 0 0 20px 0;
}

#feed-image-empty > p:last-child {
  font-size: 13px;
  line-height: 19px;
  text-align: center;
  letter-spacing: -0.270833px;
  margin: 0;
}

.page.gallery .modal.import-image .empty {
  display: flex;
  height: 60%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /*flex: 1;*/
}

.page.gallery .modal.import-image .empty .empty-image-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 102px;
  height: 102px;
  background-color: #fff;
  border-radius: 50%;
  margin-bottom: 34px;
}

.page.gallery .modal.import-image .empty > p:nth-child(2) {
  font-weight: bold;
  font-size: 24px;
  line-height: 36px;
  text-align: center;
  letter-spacing: -0.5px;
  margin: 0 0 20px 0;
}

.page.gallery .modal.import-image .empty > p:last-child {
  font-size: 13px;
  line-height: 19px;
  text-align: center;
  letter-spacing: -0.270833px;
  margin: 0;
}

.page.gallery .modal.import-image .loading {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex: 1;
}

.page.gallery .modal.import-image .loading .loading-image-wrap {
  display: flex;
  position: relative;
  margin-bottom: 50px;
  width: 90px;
}

.page.gallery .modal.import-image .loading .loading-image-wrap img:nth-child(2) {
  margin-left: 16px;
}

.page.gallery .modal.import-image .loading > p:nth-child(2) {
  font-weight: bold;
  font-size: 24px;
  line-height: 36px;
  text-align: center;
  letter-spacing: -0.5px;
  margin: 0 0 20px 0;
}

.page.gallery .modal.import-image .loading > p:last-child {
  font-size: 13px;
  line-height: 19px;
  text-align: center;
  letter-spacing: -0.27px;
  margin: 0;
}

@keyframes leftToRight {
  0% {
    left: calc(100% - 34px);
  }
  100% {
    left: 0;
  }
}

@keyframes rightToLeft {
  0% {
    right: calc(100% - 34px);
  }
  100% {
    right: 0;
  }
}

.page.gallery .modal.import-image .loading .loading-image-wrap img {
  position: absolute;
}

.page.gallery .modal.import-image .loading .loading-image-wrap .loading-icon-left {
  animation: leftToRight 0.6s linear alternate infinite ;
}

.page.gallery .modal.import-image .loading .loading-image-wrap .loading-icon-right {
  animation: rightToLeft 0.6s linear alternate infinite;
}

/*
 디자인 시스템 셀렉트 박스 스타일
*/
.ds-select-box {
  padding: 12px 16px 12px 12px;
  width: 100%;
  background-image: url('/resources/static/assets/img/common/triangle-0ab89cafffcdbe373cfa73dc4b02b10a.svg');
  background-repeat: no-repeat;
  background-position: calc(100% - 12px) 50%;
  appearance: none;
  border-radius: 8px;
  border: 1px solid #DFE0E1;
  color: #20232B;
  cursor: pointer;
}

.ds-select-box.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.ds-select-box:not(:disabled):active,
.ds-select-box:not(:disabled):hover {
  border: 1px solid #227EFF;
}

.ds-select-box:disabled {
  border: 1px solid #20232B;
  opacity: 0.1;
}

/*
  디자인 시스템 textarea
*/

.ds-textarea {
  padding: 12px 16px 12px 12px;
  border-radius: 8px;
  color: #20232B;
  line-height: 20px;
  resize: none;
  box-sizing: border-box;
  width: 100%;
}

.ds-textarea:placeholder-shown {
  border: 1px solid #DFE0E1;
}

.ds-textarea:not(:placeholder-shown) {
  border: 1px solid #20232B;
}

.ds-textarea:not(:disabled):focus,
.ds-textarea:not(:disabled):hover {
  border: 1px solid #227EFF;
}

/*
  autoproc css
*/
.op-select-area .autoproc-select-wrapper {
  width: 104px;
}

.op-select-area .autoproc-select-wrapper:last-child {
  margin-top: 8px;
}

.autoproc-input-wrapper {
  width: 44px;
  border-bottom: 1px solid #DFE0E1;
  font-size: 14px;
  color: #37454a;
  padding-bottom: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -3px !important;
}

.autoproc-input {
  width: 20px;
  font-size: 14px;
  line-height: 20px;
  color: #227EFF;
  border: none;
}

.autoproc-input:placeholder-shown {
  color: #9FA1A4;
}

.autoproc-save-button {
  display: block;
  width: 500px;
  padding: 16px 0;
  text-align: center;
  color: #fff;
  font-size: 16px;
  margin: 40px auto;
  background: #20232B;
  border-radius: 8px;
}

.autoproc-ban-button {
  padding: 12px 20px 12px 42px;
  background-color: #20232B;
  background-image: url('/resources/static/assets/img/common/ban-a074bba7b82aa07dd9770401e02698c7.svg');
  background-repeat: no-repeat;
  background-position: 18px 56%;
  border-radius: 8px;
  color: #fff;
    font-size: 14px;
    line-height: 20px;
}

.autoproc.onoff-checkbox {
    display: inline-block;
    width: 44px;
    vertical-align: top
}

.autoproc.onoff-checkbox input {
    display: none
}

.autoproc.onoff-checkbox input + label {
    position: relative;
    display: block;
    background: #f0f0f0;
    width: 44px;
    height: 28px;
    border-radius: 30px;
    padding: 2px;
    transition: all .4s ease;
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    cursor: pointer
}

.autoproc.onoff-checkbox input + label:after {
    position: relative;
    display: block;
    top: 50%;
    left: 2px;
    transform: translateY(-50%);
    width: 20px;
    content: "";
    height: 20px;
    border-radius: 50%;
    background: #fff;
    transition: all .2s ease;
}

.autoproc.onoff-checkbox input:checked + label {
    background: #227EFF
}

.autoproc.onoff-checkbox input:checked + label:after {
    left: calc(50% - 2px)
}

.ui.modal.welcome-card {
    border-radius: 8px;
}

.modal.welcome-card header {
    padding-top: 31px;
    padding-bottom: 28px;
    text-align: center;
}

.modal.welcome-card header h3 {
    font-size: 24px;
    line-height: 36px;
    font-weight: 700;
    color: #20232b;
    margin: 0 0 8px;
}

.modal.welcome-card .welcome-card__endDate {
    width: 253px;
    padding: 4px 20px;
    border-radius: 100px;
    border: 1px solid #227eff;
    color: #227eff;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    text-align: center;
    margin: 0 auto 0;
}

.modal.welcome-card .body {
    padding: 24px 32px 32px;
    background-color: #f9f9fb;
    border-radius: 0px 0px 8px 8px;
}

.modal.welcome-card .body h4 {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    text-align: center;
    color: #20232b;
    margin: 0 0 20px;
}

.modal.welcome-card .body .steps {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 24px;
}

.modal.welcome-card .body .steps .steps__next-img {
    margin: -29px 8px 0;
}

.modal.welcome-card .body .steps figure {
    margin: 0;
}

.modal.welcome-card .body .steps .steps__img-wrapper {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #9FA1A4;
    margin-bottom: 12px;
}

.modal.welcome-card .body .steps .steps__img-wrapper.blue {
    background-color: #227EFF;
}

.modal.welcome-card .body .steps figcaption {
    color: #20232B;
    font-size: 12px;
    line-height: 20px;
    font-weight: 700;
    text-align: center;
}

.modal.welcome-card .body .welcome-card__cosmetic-link {
    display: block;
    background-color: #20232b;
    border-radius: 8px;
    text-align: center;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #fff;
    padding: 16px 0;
}

/* 모달 */
.modal-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9998;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  place-items: center;
}
.modal-dimmer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9998;
  background-color: rgba(0, 0, 0, 0.1);
  opacity: 0;
}

.modal-dimmer.isActiveDimmed {
  background-color: rgba(0, 0, 0, 0.3);
  opacity: 1;
}
.modal-content {
  z-index: 9999;
  grid-column: 2 / 3;
  grid-row: 2 / 3;
}
.notice-popup-wrapper {
  position: relative;
  width: 100%;
}
.notice-popup-wrapper p img {
  border-radius: 12px;
}
.notice-popup-wrapper img {
  max-width: 400px;
}
.notice-popup-close-button-wrapper {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: 12px;
  top: 12px;
  cursor: pointer;
  width: 36px;
  height: 36px;
  background: rgb(32, 35, 43, 0.4);
  border-radius: 50%;
}
.notice-popup-close-button-wrapper svg path {
  fill: #FFF;
}
.notice-popup-footer-wrapper {
  position: absolute;
  bottom: -36px;
  right: 0;
}
.notice-popup-footer-wrapper > h4 {
  color: #FFFFFF;
  text-decoration: underline;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  margin: 0;
}