@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css");
/***************************************************************************************
   기본설정, 공통 SCSS
***************************************************************************************/
/***************************************************************************************
   Mixin
***************************************************************************************/
/***************************************************************************************
   Responsive
***************************************************************************************/
/***************************************************************************************
   px to vw
***************************************************************************************/
/***************************************************************************************
   px to rem
***************************************************************************************/
/***************************************************************************************
   Dark Mode
***************************************************************************************/
/***************************************************************************************
   12 Grid Layout
***************************************************************************************/
/***************************************************************************************
   Setting
***************************************************************************************/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

*:before, *:after {
  box-sizing: border-box;
}

body, button, input, select, table, textarea, h1, h2, h3, h4 {
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Apple SD Gothic Neo", sans-serif;
  color: #1B1A1A;
}

html, body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-overflow-scrolling: touch;
  background-color: #fff;
}

ul, ol {
  list-style: none;
}

img, button, fieldset {
  border: 0 none;
}

table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

em, address, i {
  font-style: normal;
}

a, u {
  text-decoration: none;
}

fieldset, legend {
  border: 0;
}

legend {
  height: 0;
  visibility: hidden;
}

button {
  background: none;
}

button * {
  position: relative;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

input::-ms-clear,
input[type=password]::-ms-reveal {
  display: none;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  margin: 0;
}

input {
  box-sizing: border-box;
}

textarea {
  resize: none;
}

a, button, input, select, textarea, [contenteditable] {
  outline: 0;
}

button, select, input[type=checkbox], input[type=radio] {
  cursor: pointer;
}

button:disabled, input:disabled {
  cursor: default;
}

/***************************************************************************************
   component
***************************************************************************************/
.hover-info {
  position:relative;
}
.component-table2 tr td.type-info {position:relative; padding-right:40px;}
.component-table2 tr td.type-info .hover-info {
  position:absolute;
  top:10px;
  right:10px;
  cursor:pointer;
}
.hover-info .icon-info {
  display:inline-block;
  width:15px;
  height:15px;
  background:url(../images/svg/icon-info.svg) no-repeat;
  background-size:100% 100%;
}
.component-table2 tr td.type-info .hover-info:hover .popup-info {display:block;}
.hover-info .popup-info {display:none; position:absolute; top:100%; right:0; border-radius:3px; border:1px solid #E4E4E4; white-space: nowrap; padding:6px 10px; min-width:50px;max-width:200px; background-color:#fff;}
/***************************************************************************************
   Input
***************************************************************************************/
.component-input input {
  display: block;
  width: 100%;
  font-size: 14px;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  padding: 10px 16px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
}

.component-input textarea {
  width: 100%;
  height: 90px;
  padding: 12px 16px;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
}

.component-input + .component-message {
  margin-top: 5px;
}

.component-input.type-s input {
  font-size: 12px;
  padding: 10px 16px;
}

.component-input.type-s input[type="file"] {
  padding: 0 16px;
  line-height: 34px;
}
.component-form .flex-info {
  width:70%;
  display:flex;
  align-items: center;
}
.component-form .flex-info + .component-table2 {
  margin-top:20px;
}
.component-form .flex-info .info-label {
  font-size:14px;
  font-weight:bold; margin-right:10px;
}
.component-form .flex-info .type-add {
  margin-left:10px;
}
.component-form .list-form {
  padding:20px 0 0 0;
}
.component-form .list-form li {
  display:flex;
  align-items: center;


}
.component-form .list-form li .txt-name {
  width:50%;
  font-size:14px;
}
.component-form .flex-info .component-input {
  width:200px;
}
.component-form .flex-info .txt-bar {
  margin:0 10px;

}
.component-form .flex-info .component-checkbox {
  margin-left:20px;
}
.component-form .flex-info .txt-link {
  color:#FF6A29;
  font-size:14px;
  font-weight:600;
  margin-left:20px;
}
.component-form.type-inline {
  display: flex;
  align-items: center;
}

.component-form.type-inline .label-form {
  color: #303030;
  font-size: 12px;
  font-weight: normal;
  padding: 0 5px 0 0;
  flex: none;
}

.component-form.type-inline .form-multi {
  flex: auto;
  width: 100%;
}

.component-form + .component-message {
  margin-top: 5px;
}

.component-form .component-message {
  margin: 5px 0 0 0;
}

.component-form .txt-form {
  color: #1B1A1A;
  font-size: 14px;
  line-height: 20px;
  display: flex;
  align-items: center;
  min-height: 42px;
}

.component-form .label-form {
  color: #1B1A1A;
  font-weight: 600;
  font-size: 14px;
  float: left;
  padding: 10px;
  padding-bottom: 12px;
  width: 150px;
}
.component-form .ui-message {
  display:flex;
  align-items: center;
  padding-top: 10px;
}
.component-form .ui-message.img-wrap {
  flex-wrap: wrap;
  gap: 10px;
}

.component-form .ui-message .txt-form,
.component-form .ui-message [class^="component"]{width:75%}
.component-form .ui-message .form-multi {flex:auto;}
.component-form .label-form.type-title {
  padding-top:12px;
  text-align:center;
}

.component-form .area-banner img {
  height: 150px;
}

.form-multi {
  display: flex;
  align-items: center;
}

.form-multi .component-input {
  flex: auto;
}

.form-multi button {
  flex: none;
  margin-left: 12px;
}

/***************************************************************************************
   Checkbox
***************************************************************************************/
.component-checkbox {
  display: inline-flex;
  align-items: center;
}

.component-checkbox input:checked + i {
  display: inline-block;
  width: 20px;
  height: 21px;
  background: url("../images/svg/icon-checkbox-selected.svg") no-repeat 0 0;
  vertical-align: top;
}

.component-checkbox input {
  display: none;
}

.component-checkbox i {
  display: inline-block;
  width: 20px;
  height: 21px;
  background: url("../images/svg/icon-checkbox.svg") no-repeat 0 0;
  vertical-align: top;
}

.component-checkbox .txt-checkbox {
  font-size: 14px;
  margin-left: 12px;
  font-weight: 500;
  color: #1B1A1A;
}

.checkbox-inline {
  padding-left: 0;
  display: flex;
  flex-wrap: wrap;
  margin: -2px -12px;
}

.checkbox-inline .component-checkbox {
  margin: 2px 12px;
}

/***************************************************************************************
   Datepicker
***************************************************************************************/
.component-datepicker {
  display: block;
  width: 100%;
  font-size: 14px;
  border: 1px solid #E4E4E4;
  padding: 0 16px;
  line-height: 36px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
}

/***************************************************************************************
   Radio
***************************************************************************************/
.radio-inline {
  display: flex;
  flex-wrap: wrap;
  margin: -2px -12px;
  padding: 0;
}

.radio-inline .component-radio {
  margin: 2px 12px;
}

.radio-inline + .component-input {
  margin-top: 12px;
}

.radio-inline.inline-half .component-radio {
  flex: auto;
}

.component-checkbox {
  display: inline-flex;
  align-items: center;
}

.component-checkbox .component-input {
  margin: 0 4px 0 16px;
}

.component-checkbox .component-input input {
  display: block;
  width: 225px;
  font-weight: normal;
}

.component-checkbox .component-input input[type="number"] {
  width: 100px;
}

.component-radio {
  display: inline-flex;
  align-items: center;
}

.component-radio input:checked + i {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../images/svg/icon-radio-selected.svg") no-repeat 0 0;
  vertical-align: top;
}
.component-radio.type-s input:checked + i,
.component-radio.type-s i {
  width: 15px;
  height: 15px;
  background-size:100% 100%;

}
.component-radio.type-s .txt-radio {
  margin-left:5px;
  font-size:12px;
}

.component-radio input {
  display: none;
}

.component-radio i {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../images/svg/icon-radio.svg") no-repeat 0 0;
  vertical-align: top;
}

.component-radio .component-input {
  margin: 0 4px 0 16px;
}

.component-radio .component-input input {
  display: block;
  width: 225px;
  font-weight: normal;
}

.component-radio .component-input input[type="number"] {
  width: 100px;
}

.component-radio .txt-radio {
  margin-left: 12px;
  font-size: 14px;
  font-weight: 500;
  color: #1B1A1A;
}

/***************************************************************************************
   Tag box
***************************************************************************************/
.component-tag-box {
  display: flex;
  flex-wrap: wrap;
  padding: 8px 16px;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
}

.component-tag-box .ui-tag {
  position: relative;
  font-weight: 500;
  padding: 2px 20px 3px 4px;
  background-color: #FAFAFA;
  color: #1B1A1A;
  font-size: 13px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
}

.component-tag-box .ui-tag + .ui-tag {
  margin-left: 8px;
}

.component-tag-box .btn-del {
  position: absolute;
  top: 50%;
  right: 2px;
  margin: -8px 0 0 0;
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("../images/svg/icon-tag-del.svg") no-repeat 0 0;
  vertical-align: top;
}

/***************************************************************************************
   Unit
***************************************************************************************/
.component-unit {
  display: flex;
  align-items: center;
}

.component-unit .component-input.type-s input {
  width: 100px;
}

.component-unit .component-datepicker + .component-datepicker {
  margin-left: 10px;
}

.component-unit input {
  width: 225px;
}

.component-unit .txt-unit {
  display: inline-block;
  font-weight: 500;
  color: #1B1A1A;
  font-size: 14px;
  margin-left: 16px;
}

.component-unit .txt-unit + .component-input {
  margin-left: 16px;
}

/***************************************************************************************
   Message
***************************************************************************************/
.component-message {
  color: #FF6A29;
  font-size: 12px;
  line-height: 160%;
}

/***************************************************************************************
   Box Form
***************************************************************************************/
.component-box-form {
  padding: 24px;
  background-color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
  position:relative;
}
.component-box-form.type-gridly {
  display:flex;
  align-items: center;;
  flex-direction: column;;
}

.component-box-form + .component-box-form {
  margin-top: 32px;
}

.component-box-form .form-image {
  display: flex;
  align-items: start;
  flex-wrap: wrap;
  margin: -15px -5px 0 -5px;;
}

.component-box-form .form-image .component-form {
  width: 24%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 15px 5px  0 5px;
}

.component-box-form .form-image .component-form + .component-form {
  margin-top: 15px;
}

.component-box-form .form-image .component-form .component-input {
  max-width: 300px;
  width: 100%;
}

.component-box-form .form-photo {
  display: flex;
  flex-wrap: wrap;
  margin: -5px;
}

.component-box-form .form-photo .view-photo {
  width: 25%;
  padding: 5px;
}

.component-box-form .form-photo .view-photo .ui-photo {
  max-width: 300px;
  width: 100%;
}

.component-box-form .form-photo .view-photo .txt-photo {
  display: block;
  text-align: center;
}

.component-box-form .form-photo .view-photo img {
  max-width: 300px;
  width: 100%;
  height: 300px;
}

.component-box-form .component-form + .component-form {
  margin-top: 16px;
}

.component-box-form .component-form + .form-photo {
  margin-top: 15px;
}
.component-box-form .component-form {
  background-color:#fff;
}
.component-box-form .area-image {
  width: 100%;
  max-width: 300px;
  height: 300px;
  margin-bottom: 10px;
  border: 1px solid #e5e5e5;
  position:relative;
}
.component-box-form .area-image img {
  width:100%;
  display:block;
}
.component-box-form .area-image input {
  display:block;
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  opacity:0;
}
.component-box-form .area-image.type-create:before {position:absolute; top:50%; left:50%; margin:-7px 0 0 -7px; display:inline-block; width:15px; height:15px; background:url(../images/svg/icon-plus.png) no-repeat; background-size:100% 100%; content:'';}

.component-box-form .image-buttons {display:flex; margin:0 -5px;}
.component-box-form .image-buttons button {margin:0 5px;}
.component-box-form .image-buttons button {flex:auto; justify-content: center;}
.component-box-form .image-buttons .btn-create {position:relative;}
.component-box-form .image-buttons .btn-create input {position:absolute; top:0; left:0; right:0;
  bottom:0; opacity:0; z-index:1;}
.wrap-gridly {
  width:1292px;
  position:relative;
}

.brick {
  width:300px;
  height:370px;
}

.component-box-form .area-image img {
  max-width: 300px;
  max-height: 300px;
}
.component-box-form .wrap-form + .wrap-form {
  margin:20px 0 0 0;
  padding:20px 0 0 0;
  border-top:1px solid #E4E4E4
}
.component-box-form .box-bottom {
  text-align:right;
  padding:16px 0 0 0;
}

.component-box-form .label-box {
  padding-bottom: 32px;
  color: #1B1A1A;
  font-size: 20px;
  font-weight: 600;
}
.component-box-form .label-box.type-flex .type-right {
  margin-left:auto;
}
.component-box-form .label-box.type-sub {
  font-size:16px;
  padding-bottom:20px;
  margin-top:20px;
}
.component-box-form .label-box + .type-sub {
  margin-top:0;
}

.component-box-form .label-box.type-flex {
  display: flex;
  align-items: center;
}

.component-box-form .label-box.type-flex button {
  margin-left: 10px;
}

.component-box-form .label-box .txt-strong {
  color: #FD4F4F;
  font-size: 20px;
  font-weight: 600;
}

.component-box-form .label-box .icon-help {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-help.svg") no-repeat 0 0;
  vertical-align: top;
}

/***************************************************************************************
   Button
***************************************************************************************/
.btn-solid,
.btn-line {
  display: inline-flex;
  align-items: center;
  padding: 15px 32px;
  border: 1px solid #E4E4E4;
  font-size: 14px;
  color: #1B1A1A;
  font-weight: 600;
  background-color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}

.btn-solid.type-full,
.btn-line.type-full {
  display: block;
  width: 100%;
  text-align: center;
}

.btn-solid.type-m-size,
.btn-line.type-m-size {
  padding: 8px 20px;
  font-weight: 500;
  line-height: 160%;
}

.btn-solid.type-dark,
.btn-line.type-dark {
  background-color: #696969;
  border: 1px solid #696969;
  color: #fff;
}

.btn-solid.type-s,
.btn-line.type-s {
  padding: 8px 16px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
}
.btn-solid.type-s2,
.btn-line.type-s2 {
  padding:5px 10px;
  font-size:11px;
  border-radius:4px;
}
.btn-line.type-s-size {
  border-radius: 8px;
  padding:6px 8px;
  font-size:12px;
}
.btn-line .icon-timeline {
  display:inline-block;
  width:20px;
  height:20px;
  background:url(../images/icon-timeline.svg) no-repeat;
  margin-right:4px;

}
.btn-solid.type-s3 {
  padding:2px 5px;
  font-size:10px;
  border-radius:2px;
}
.btn-solid .icon-exel,
.btn-line .icon-exel {
  margin-right: 5px;
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../images/svg/icon-exel.svg") no-repeat 0 0;
  vertical-align: top;
}

.btn-solid {
  color: #fff;
  background-color: #FF6A29;
  border: 1px solid #FF6A29;
}
.btn-solid.type-gray {
  background-color:gray;
  border:1px solid gray;
}
.btn-solid.type-light-gray {
  color:#696969;
  background-color:#F4F4F4;
  border:1px solid #F4F4F4;
}
/***************************************************************************************
   Selectbox
***************************************************************************************/
.component-selectbox {
  position: relative;
  padding-right: 50px;
  height: 40px;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}
.component-selectbox .txt-select {
  padding:0 16px;
  line-height:38px;
  font-size:14px;
}
.component-selectbox .popup-search {
  position:absolute;
  top:100%;
  left:0;
  min-width:100%;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  border-radius: 12px;
  margin:5px 0 0 0;
  z-index:20;
  padding:10px; display:none;
  overflow:hidden;

}
.component-selectbox.type-selected .popup-search {
  display:block !important;
}
.component-selectbox .popup-search .ui-search {
  border:1px solid #E4E4E4;
  width:100%;
  border-radius:10px;
  display:flex;
  align-items: center;
  overflow:hidden;
}
.component-selectbox .popup-search .ui-search input {
  display:block;
  font-size:13px;
  line-height:35px;
  width:100%;
  border:none;
  padding:0 10px 0 0;
}
.component-selectbox .popup-search .ui-search:before {
  flex: none;
  margin: 0 8px 0 8px;
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("../images/svg/icon-search.svg") no-repeat 0 0;
  background-size:100% 100%;
  vertical-align: top;
  content:'';

}
.component-selectbox .popup-search .list-selectbox  {margin:10px -10px -10px -10px; padding-bottom:10px; max-height:150px; overflow:auto;}
.component-selectbox .popup-search .list-selectbox li a {
  display:block;
  padding:6px 20px;;
  color:#000;
  font-size:13px;
}
.component-selectbox .popup-search .list-selectbox li a:focus {
  text-decoration: none;
}
.component-selectbox .popup-search .list-selectbox li a:hover {
  text-decoration: none;
  background-color:#efefef;
}

.component-selectbox.type-s {
  height: 38px;
  font-size: 12px;
}

.component-selectbox:after {
  display: inline-block;
  width: 20px;
  height: 20px;
  content: '';
  position: absolute;
  top: 50%;
  right: 12px;
  margin-top: -8px;
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("../images/svg/arrow-selectbox.svg") no-repeat 0 0;
  vertical-align: top;
}

.component-selectbox select {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 0 50px 0 16px;
  background: none;
  border: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  font-size: 14px;
  color: #1B1A1A;
  background-color: transparent;
  z-index: 10;
}

/***************************************************************************************
   Search
***************************************************************************************/
.component-search {
  display: flex;
  align-items: center;
}

.component-search + .wrap-table {
  margin: 15px 0 0 0;
}

.component-search .form-search {
  display: flex;
  width: 272px;
  align-items: center;
  position: relative;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}

.component-search .form-search input {
  display: block;
  flex: auto;
  padding: 12px 0;
  border: none;
  background: none;
  font-size: 14px;
  width:100%;
}

.component-search .form-search .icon-search {
  flex: none;
  margin: 0 8px 0 12px;
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-search.svg") no-repeat 0 0;
  vertical-align: top;
}

.component-search .btn-solid {
  margin-left: 12px;
}

.form-option {
  padding: 16px 0;
  display: flex;
  align-items: center;
}
.form-option .btn-solid + .component-selectbox {
  margin-left:12px;
}
.component-list {
  display: flex;
  gap: 10px;
}
.btn_submit-wrap {
  /*margin-top: 20px;*/
}
.btn_submit-wrap .btn_submit {
  margin-left: 0;
}
.ui-message:first-child {
    padding-left: 0;
}
.component-list .component-selectbox {
  width: 325px;
  flex: none;
}

.hotel-name-search > input {
  height: 38px;
  border: 1px solid #E4E4E4;
  padding: 0 16px;
  border-radius: 12px;
}
.wrap-radio {
  display:flex;
}
.wrap-radio .label-radio {
  margin-left:8px;
}
.label-radio input:checked + span {
  background-color:#FF6A29;
  color:#fff;
}
.label-radio input {display:none;}
.label-radio span {
  display:inline-block;
  border-radius: 12px;
  font-weight: 500;
  padding: 9px 16px;
  background: #F0F0F0;
  font-size:14px;
  color:#1B1A1A;
}
.label-room
.form-option + .form-option {
  padding-top:0;
}
.form-option + .component-box-table {
  margin-top: 10px;
}

.form-option .form-right {
  margin-left: auto;
  display: flex;
  align-items: center;
}
.form-option .form-right [class^="btn"] {
  margin-left:10px;
}

.form-option .option-right {
  display: flex;
  margin-left: auto;
  align-items: center;
}

.form-option .option-right .option-buttons {
  margin-left: 32px;
}

.form-option [class^="component"] + [class^="component"] {
  margin-left: 12px;
}

.form-option .component-datepicker {
  width: 155px;
  flex: none;
}

.form-option .component-selectbox {
  width: 155px;
  flex: none;
}
.form-option .component-selectbox .popup-search {
  width:200px;
}

.form-option .component-selectbox.type-month {
  width: 93px;
}

.form-option .component-selectbox + .btn-solid {
  margin-left: 12px;
}

.form-option .component-datepicker + .btn-solid {
  margin-left: 12px;
}

/***************************************************************************************
   Top Option
***************************************************************************************/
.top-option {
  padding: 12px 0 20px 0;
  min-height: 40px;
  display: flex;
  align-items: center;
}

.top-option .component-checkbox + .component-checkbox {
  margin-left: 24px;
}

.top-option .top-right {
  display: flex;
  margin-left: auto;
}

.top-option .top-right button + button {
  margin-left: 12px;
}

.form-flex {
  display: flex;
  align-items: flex-start;
  margin: 0 -6px;
}
.form-flex .flex-message {
  width:30%;
  flex:none;
  padding-left:10px;
  font-size:13px;
  color:#8c8a8a;
  display:flex;
  word-break:break-all;
}
.form-flex .flex-message i {position:relative; top:2px; display:inline-block; width:13px; height:13px; background:url(../images/svg/icon-info-g.svg) no-repeat; background-size:100% 100%; margin-right:5px; content:''; flex:none;}
.form-flex + .form-flex {
  margin-top: 16px;
}
.form-flex + .component-form {
  margin-top: 16px;
}

.form-flex + .component-form + .component-form {
  margin-top: 16px;
}

.form-flex .flex-right {
  margin-left: auto;
}

.form-flex > .component-form {
  flex: auto;
  width: 100%;
  margin: 0 6px;
}

.form-flex > .component-form + .component-form {
  margin-top: 0;
}

/***************************************************************************************
   Select Sub
***************************************************************************************/
.select-sub {
  display: none;
  margin-top: 12px;
}

/***************************************************************************************
   buttons
***************************************************************************************/
.ui-buttons {
  padding: 75px 0 20px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 -6px;
}
.ui-buttons.type-fix {
  position:relative;
  padding:20px 0 20px 0;
  margin-bottom:-40px;
  background-color:#fafafa;
}

.ui-buttons button {
  margin: 0 6px;
}

/***************************************************************************************
   Tag
***************************************************************************************/
.tag-best {
  display: inline-block;
  padding: 4px 8px;
  background: rgba(85, 199, 144, 0.2);
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
}

.area-chart {
  height: 530px;
}

.show-sub {
  display: block;
}

.url-sub {
  display: none;
}

table {
  word-break: keep-all;
  word-wrap: break-word;
}

/***************************************************************************************
   Table
***************************************************************************************/
.table-scroll {
  overflow:auto;
}
.table-flex {
  display:flex;
}
.table-flex .component-table {
  flex:none;
  width:auto;
  min-width:100%;
}
.table-flex .component-table + .component-table  {
  border-left:1px solid #ddd;

}
.component-table {
  table-layout: fixed;
}
.component-table tr th.line-right,
.component-table tr td.line-right {
  border-right:1px solid #E4E4E4;
}

.component-table.type-center tr th,
.component-table.type-center tr td {
  text-align:center;
  white-space:nowrap;
}
.component-table.type-size tr td {
  padding-top: 20px;
  padding-bottom: 20px;
}

.component-table tr:last-of-type td {
  border-bottom: none;
}

.component-table tr:first-of-type td {
  border-top: none;
}

.component-table tr.is-selected td {
  background-color: rgba(255, 106, 41, 0.2);
}

.component-table tr.tr-dropdown td {
  padding: 0;
  border: none;
}
.component-table tr.form-th th {
  border-left:1px solid #E4E4E4;
  border-bottom:1px solid #E4E4E4;
  background:none;
}
.component-table tr.form-th th:first-of-type {
  border-left:none;
}
.component-table tr td.color-orange {
  color: #FD4F4F;
  font-weight:500;

}
.component-table tr td.color-gray {
  color:#696969;
  font-weight:500;
}
.component-table tr th {
  padding: 12px;
  font-size: 14px;
  font-weight: 500;
  color: #696969;
  text-align: left;
  line-height: 160%;
  border-bottom: 1px solid #F0F0F0;
}


.component-table tr th.txt-center {
  text-align: center;
  padding-left: 12px;
}

.component-table tr th .component-checkbox {
  margin: -4px 0;
  display: inline-block;
}

.component-table tr td {
  padding: 12px;
  line-height: 160%;
  font-size: 14px;
  color: #303030;
  border-top: 1px solid #F0F0F0;
}
.component-table tr td .type-option {
  color:#FF6A29;
}

.component-table tr td .tag-label {
  display: inline-block;
  position: relative;
  top: 1px;
  border-radius: 3px;
  margin-left: 5px;
  padding: 0 3px;
  background-color: #d9534f;
  font-size: 12px;
  line-height: 20px;
  color: #fff;
  font-weight: 500;
  vertical-align: top;
}

.component-table tr td.txt-right {
  text-align: right;
}

.component-table tr td .txt-link {
  display: inline-flex;
  align-items: center;
  color: #ae1605;
}

.component-table tr td .txt-link:after {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("../images/svg/icon-link.svg") no-repeat 0 0;
  vertical-align: top;
}

.component-table tr td .txt-red {
  color: red;
}

.component-table tr td .txt-blue {
  color: blue;
}

.component-table tr td .img-photo {
  width: 100%;
}

.component-table tr td .img-write {
  width: 50px;
  vertical-align: middle;
  margin-right: 10px;
}

.component-table tr td a {
  color: #FF6A29;
}
.component-table tr td a.type-line {
  text-decoration: underline;;
}
.component-table tr td:first-of-type {
  padding-left: 24px;
}
.component-table.type-center tr td:first-of-type {
  padding-left:12px;
}

.component-table tr td.txt-center {
  text-align: center;
  padding-left: 12px;
}

.component-table tr td .link-view {
  display: inline-block;
  position: relative;
  padding: 4px 30px 4px 8px;
  margin: -2px 0;
  color: #1B1A1A;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  background-color: #F0F0F0;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
}

.component-table tr td .link-view:after {
  position: absolute;
  top: 50%;
  right: 8px;
  margin-top: -8px;
  content: '';
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("../images/svg/arrow-dropdown.svg") no-repeat 0 0;
  vertical-align: top;
}

/***************************************************************************************
   Table List
***************************************************************************************/
.table-list {
  margin-top: 10px;
}

.table-list tr td {
  padding: 10px;
  background-color: rgba(255, 106, 41, 0.2);
}

.table-list tr td:first-of-type {
  padding-left: 24px;
}

.table-list tr td:last-of-type {
  padding-right: 24px;
}

.table-list tr td.txt-right {
  text-align: right;
}

.table-list tr td.txt-right button {
  display: inline-block;
}

/***************************************************************************************
   Table2
***************************************************************************************/
.select-sub {
  display: none;
}

.select-sub .hr-line {
  margin: 10px 0;
  border-bottom: 1px solid #F0F0F0;
}
.component-table2 {
  border:1px solid #F0F0F0;
}
.component-table2.type-size-m {
  width:70%;
}
.component-table2 tr th {
  padding: 6px 13px;
  text-align: center;
  font-size: 12px;
  color: #1B1A1A;
  font-weight: 500;
  line-height: 160%;
  background: #FAFAFA;
}
.component-table2 tr td.txt-center {text-align:center;}

.component-table2 tr td .txt-data {display:inline-flex; color:#222; font-size:14px; font-weight:500; line-height:22px; align-items: center;}
.component-table2 tr td .txt-data .tag-check2,
.component-table2 tr td .txt-data .tag-check {border-radius:2px; background-color:#222; padding:2px 4px; display:inline-block; color:#fff; font-size:10px; line-height:12px; margin-right:4px; border-radius:4px;}
.component-table2 tr td .txt-data .tag-check2 {background-color:#FF6A29;}
.component-table2 tr.txt-center td {
  text-align:center;
  padding:6px 5px;
}

.component-table2 tr th.txt-left {
  text-align: left;
}

.component-table2 tr td {
  position: relative;
  word-break: break-all;
  padding: 6px 24px;
  color: #1B1A1A;
  font-size: 12px;
  font-weight: 500;
  line-height: 160%;
}
.component-table2 tr td .flex-info {
  display:flex;
  align-items: center;

}
.component-table2 tr td .btn-right {
  margin-left:auto;
}

.component-table2 tr td .table-flex {
  display: flex;
  align-items: center;
}

.component-table2 tr td .form-right {
  margin-left: auto;
  display: flex;
}

.component-table2 tr td .form-right button + button {
  margin-left: 10px;
}

.component-table2 tr td.txt-left {
  text-align: left;
}

.component-table2 tr + tr th,
.component-table2 tr + tr td {
  border-top: 1px solid #F0F0F0;
}
.component-table2 tr + tr td img {
  max-width:100%;
}

.component-table2.type-table tr td,
.component-table2.type-table tr th {color:#696969; font-size:14px; border-left:1px solid #f1f1f1;}
.component-table2.type-table tr td:first-of-type,
.component-table2.type-table tr th:first-of-type {border-left:none;}
.component-table2.type-table tr td .component-selectbox {border-radius:4px;}
.component-table2.type-table tr th,
.component-table2.type-table tr td {padding-left:8px; padding-right:8px;}
.component-table2 tr td .component-tag {position:absolute; top:50%; right:0; margin-top:-10px; right:6px;}
/***************************************************************************************
   Box Table
***************************************************************************************/
.component-box-table {
  background-color: #fff;
  border: 1px solid #E4E4E4;
  overflow: hidden;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}
.component-box-table.type-scroll {
  overflow:auto;
}

.component-box-table .table-dropdown {
  border-top: 1px solid #f0f0f0;
}

.component-box-table .table-dropdown:first-of-type {
  border-top: none;
}

.component-box-table .component-table tr th {
  background-color: #FAFAFA;
  text-align:center;
}

/***************************************************************************************
   No data
***************************************************************************************/
.data-nodata {
  height: 444px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
}

.data-nodata:before {
  margin-bottom: 12px;
  content: '';
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url("../images/svg/icon-warning.svg") no-repeat 0 0;
  vertical-align: top;
}

/***************************************************************************************
   Table Dropdown
***************************************************************************************/
.component-table .dropdown-contents {
  display: none;
  padding: 24px 28px;
  font-size: 12px;
  margin-left: -24px;
  line-height: 160%;
  color: #303030;
  font-weight: normal;
  border-top: 1px solid #f0f0f0;
}

.component-table .dropdown-contents hr {
  margin: 8px 0;
  border: none;
  border-bottom: 1px solid #F0F0F0;
}

.component-table .dropdown-contents .form-buttons {
  display: flex;
  padding: 10px 0 0 0;
}

.component-table .dropdown-contents .form-buttons button + button {
  margin-left: 5px;
}

/***************************************************************************************
   List Footer
***************************************************************************************/
.component-list-footer {
  padding: 34px 0;
  display: flex;
  align-items: center;
}

.component-list-footer .list-select {
  display: flex;
  align-items: center;
}

.component-list-footer .list-select .label-select {
  display: inline-block;
  margin-right: 10px;
  color: #888;
  font-weight: 500;
  font-size: 14px;
}

.component-list-footer .list-select .component-selectbox {
  width: 93px;
}

.component-list-footer .component-paging {
  margin-left: auto;
}

.component-list-footer .component-paging .list-paging {
  display: flex;
}

.component-list-footer .component-paging .list-paging li a {
  display: inline-block;
  width: 40px;
  line-height: 40px;
  text-align: center;
  color: #888;
  font-size: 14px;
  font-weight: 500;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}

.component-list-footer .component-paging .list-paging li a:hover {
  background-color: #FFF3EB;
  color: #FF6A29;
  font-weight: 700;
  -webkit-transition: background 0.3s ease, color 0.3s ease;
  -moz-transition: background 0.3s ease, color 0.3s ease;
  -ms-transition: background 0.3s ease, color 0.3s ease;
  transition: background 0.3s ease, color 0.3s ease;
}

.component-list-footer .component-paging .list-paging li.is-selected a {
  background-color: #FFF3EB;
  color: #FF6A29;
  font-weight: 700;
}

.component-list-footer .component-paging .list-paging li.list-next a, .component-list-footer .component-paging .list-paging li.list-prev a {
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url("../images/svg/arrow-paging-prev.svg") no-repeat 0 0;
  vertical-align: top;
}

.component-list-footer .component-paging .list-paging li.list-next a {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.box-calen {
  padding: 26px 30px 57px 30px;
  background-color: #fff;
  border: 1px solid #F0F0F0;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
  position:relative;
}
.box-calen .ui-left {
  position:absolute;
  top:24px;
  left:16px;
  display:flex;

}

.box-calen .ui-left .txt-info {
  margin-left:8px;
  font-size:12px;
}
.box-calen .ui-left .btn-solid {
  width:60px;
  text-align:center;
  display:inline-block;
  margin-left:10px;
}
.box-calen .box-basic {
  padding: 9px 12px;
  border-radius:12px;
  background: #EBFFF0;
  color:#00BD35;
  font-size:14px;
}

.box-calen .table-info {
  padding-bottom:10px;
}
.box-calen .table-info span{
  display:inline-block;
  padding:0 10px;
  color:#000;
  font-size:14px;

}
.box-calen .ui-day {
  padding-bottom: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.box-calen .ui-day .arrow-next,
.box-calen .ui-day .arrow-prev {
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url("../images/svg/arrow-calen-prev.svg") no-repeat 0 0;
  vertical-align: top;
}

.box-calen .ui-day .arrow-next {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.box-calen .ui-day .txt-day {
  position:relative;
  display: inline-block;
  margin: 0 40px;
  color: #2D2D2D;
  font-weight: 700;
  font-size: 24px;
}
.table-calen {
  margin:0 -5px;
}
.table-calen tr th {
  padding:0 5px;
  font-weight: 500;
  line-height: 150%;
  text-align: center;
}
.table-calen tr th .label-check {
  padding: 10px 0;
  background-color: #FAFAFA;
  font-size: 16px;
  display:flex;
  align-items: center;;
  justify-content: center;
}
.table-calen tr th .label-check .component-checkbox {
  margin-right:5px;
}

.table-calen tr th:first-of-type {
  color: #FD4F4F;
}

.table-calen tr th:last-of-type {
  color: #0062FF;
}

.table-calen tr td {
  padding:0 5px 5px 5px;
  position:relative;
  vertical-align: top;
}

.table-calen tr td .td-calen {
  position:relative;

  border: 1px solid #F0F0F0;
}

.table-calen tr td.is-disabled .txt-day {
  color: #ABABAB;
}

.table-calen tr td .txt-day {
  display: flex;
  flex-direction: column;;
  align-items: center;
  justify-content: center;
  padding: 9px 12px 6px 12px;
  font-size: 14px;
  text-align: left;
  font-weight: 500;
  line-height: 160%;
  border-bottom: 1px solid #F0F0F0;
  position:relative;
}
.table-calen tr td .txt-day .component-checkbox {
  margin-bottom:5px;
}
.table-calen tr td .txt-day .data-day.type-dash {
  text-decoration: line-through;
  text-decoration-color: red;
}
.table-calen tr td a.day-open,
.table-calen tr td a.day-close {
  display:inline-block;
  position:absolute;
  color:#fff;
  top:0;
  right:0;
  background-color:gray;
  font-size:10px;
  padding:4px 4px;
  z-index:10;
}
.table-calen tr td a.day-open {
  background-color:#000;
}
.table-calen tr td .wrap-data {
  padding: 12px;
}

.table-calen tr td .data-detail {
  display: flex;
  align-items: center;
}

.table-calen tr td .data-detail + .data-detail {
  margin-top: 6px;
}
.table-calen tr td .center-button {
  padding:10px 0 0 0;
  text-align:center;
}

.table-calen tr td .data-detail .label-det {
  font-size: 12px;
  line-height: 160%;
  color: #454647;
}

.table-calen tr td .data-detail .data-num {
  margin-left: auto;
  font-size: 12px;
  font-weight: 500;
  line-height: 160%;
  color: #1B1A1A;
}

.table-calen tr td .data-detail .data-num .data-status {display:flex; align-items: center;;}
.table-calen tr td .data-detail .data-num .data-status.type-yellow:before,
.table-calen tr td .data-detail .data-num .data-status.type-blue:before,
.table-calen tr td .data-detail .data-num .data-status.type-red:before {
  display:inline-block;
  margin-right:5px;
  width:6px;
  height:6px;
  border-radius:50%;
  content:'';

}
.table-calen tr td .data-detail .data-num .data-status.type-yellow {
  color:#ecbd16;
}
.table-calen tr td .data-detail .data-num .data-status.type-blue {
  color:#16a3e5;
}
.table-calen tr td .data-detail .data-num .data-status.type-red {
  color:red;
}
.table-calen tr td .data-detail .data-num .data-status.type-yellow:before {
  background-color:#ecbd16;

}
.table-calen tr td .data-detail .data-num .data-status.type-blue:before {
  background-color:#16a3e5

}
.table-calen tr td .data-detail .data-num .data-status.type-red:before {
  background-color:red;
}
.table-calen-check tr th {
  position: relative;
  padding: 10px 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
  border-bottom: 1px solid #CECECE;
}

.table-calen-check tr th:first-of-type .component-checkbox .data-day {
  color: #FD4F4F;
}

.table-calen-check tr th:last-of-type .component-checkbox .data-day {
  color: #0062FF;
}

.table-calen-check tr th .component-checkbox {
  display: flex;
}

.table-calen-check tr th .component-checkbox i {
  position: absolute;
  top: 50%;
  left: 12px;
  margin-top: -10px;
}

.table-calen-check tr th .component-checkbox .data-day {
  display: block;
  width: 100%;
}

.table-calen-check tr td {
  position: relative;
  height: 152px;
  border: 1px solid #F0F0F0;
}

.table-calen-check tr td.is-prev {
  background-color: #FAFAFA;
}

.table-calen-check tr td.is-prev .txt-day .data-today {
  margin-right: 12px;
  text-decoration: none;
}

.table-calen-check tr td.is-prev .txt-day .data-num {
  text-decoration: line-through;
}

.table-calen-check tr td .component-checkbox {
  position: absolute;
  top: 12px;
  left: 12px;
}

.table-calen-check tr td .txt-day {
  position: absolute;
  top: 9px;
  right: 12px;
  font-size: 12px;
  font-weight: 500;
  line-height: 160%;
}

.table-calen-check tr td .data-price {
  text-align: center;
  font-weight: 500;
  line-height: 150%;
  font-size: 16px;
}

/***************************************************************************************
   LAYOUT
***************************************************************************************/
/***************************************************************************************
   LAYOUT
***************************************************************************************/
html, body {
  background-color: #fafafa;
  min-width: 1440px;
}

html.layout-modal {
  min-width: 1300px;
}

html.layout-modal body {
  min-width: 1300px;
}
.syncBox + .syncBox{
  margin-top: 30px;
}
.wrap_calendar.wrap_calendar-header {
  position: sticky;
  top: 0;
  background: white; /* 헤더를 가독성 높게 설정 */
  z-index: 10;
  border-bottom: 1px solid #999;
}
.wrap_calendar.wrap_calendar-header > div {
  border-bottom: 0 !important;
  border-right: 0;
  border-left: 1px solid #999;
}
.wrap_calendar.wrap_calendar-header > div:first-child {
  border-left: 0 !important;
}
.wrap_calendar.wrap_calendar-header > div.wrap_room {
  border-left: 1px solid #999;
}
.wrap_calendar.wrap_calendar-header > div.wrap_room > div {
  border-left: 0;
}
.wrap_calendar.wrap_calendar-header > div.wrap_room > div.wrap_booNo {
  border-left: 0;
}
.wrap_calendar.wrap_calendar-header > div.wrap_room > div.res_class{
  border-right: 1px solid #999;

}
.wrap_calendar.wrap_calendar-header .room_name{
  border-bottom: 1px solid #999;
}
.wrap_calendar.wrap_calendar-header .boo_name {
  /*border-left: 1px solid #999;*/
  border-right: 1px solid #999;
}
.wrap_calendar.wrap_calendar-header .wrap_booNo{
  border-bottom: 0;
}
.wrap_calendar.wrap_calendar-header > div.wrap_room > div.plat_list,
.wrap_calendar.wrap_calendar-header > div.wrap_room > div.hand_select{
  border-left: 1px solid #999;
}
.wrap_room > .wrap_box{
  border-left: 1px solid #ddd;
}
.wrap_box > .wrap_p_box,
.wrap_box > .wrap_s_box{
  border-bottom: 1px solid #ddd;
}
.tableContent > .wrap_calendar:not(.wrap_calendar-header){
  border-bottom: 1px solid #999;
}

.wrap-page {
  display: flex;
  min-height: 100vh;
  width: 100%;
}

.layout-lnb {
  display:flex;
  flex:none;
  flex-direction: column;
  position:relative;
  width: 180px;
  flex: none;
  border-right: 1px solid #E4E4E4;
  background-color: #fff;
}
.layout-lnb .lnb-banner {
  margin-top:auto;
  padding:10px 10px 30px 10px;

}
.layout-lnb .lnb-banner img {
  width:100%;
}
.layout-lnb.type-close {
  display:none;
}

.layout-lnb .lnb-top {
  padding:12px 24px;
  font-size:15px;
  color:#000;
  font-weight:500;
  margin-bottom:-40px;
}
.layout-lnb .link-logo {
  display: inline-block;
  width: 100%;
  height: 62px;
  margin-bottom:34px;
  background: url("../images/svg/img-logo.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a {
  font-weight: 700;
  color: #FF6A29;
}

.layout-lnb .list-lnb li.is-selected a .icon-calen {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-calen-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-sale {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-sale-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-exposure {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-exposure-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-calculate {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-calculate-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-room {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-room-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-option {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-option-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-member {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-member-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-review {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-review-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-event {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-event-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-call {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-call-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-chart {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-chart-select.svg") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}

.layout-lnb .list-lnb li.is-selected a .icon-message {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-message-select.svg") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}

.layout-lnb .list-lnb li a {
  display: flex;
  align-items: center;
  line-height: 24px;
  font-size: 16px;
  font-weight: 500;
  color: #696969;
  padding: 12px 18px;
}
.layout-lnb .list-lnb li ul li a{
  display:block;
  padding:5px 40px;
  font-size:14px;
}

.layout-lnb .list-lnb li a:hover {
  background-color: #FFF3EB;
  font-weight: 700;
  color: #FF6A29;
}

.layout-lnb .list-lnb li a:hover .icon-calen {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-calen-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-sale {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-sale-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-exposure {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-exposure-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-calculate {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-calculate-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-room {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-room-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-option {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-option-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-member {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-member-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-review {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-review-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-event {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-event-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-call {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-call-select.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a:hover .icon-chart {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-chart-select.svg") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}

.layout-lnb .list-lnb li a:hover .icon-message {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-message-select.svg") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}

.layout-lnb .list-lnb li a [class^="icon"] {
  margin-right: 16px;
}

.layout-lnb .list-lnb li a .icon-calen {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-calen.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-sale {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-sale.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li.is-selected a .icon-realtime,
.layout-lnb .list-lnb li a:hover .icon-realtime {

  background: url("../images/icon-realtime-selected.png") no-repeat 0 0;
  background-size:100% 100%;
}
.layout-lnb .list-lnb li.is-selected a .icon-calendarview,
.layout-lnb .list-lnb li a:hover .icon-calendarview {
  background: url("../images/icon-calendarview-selected.png") no-repeat 0 0;
  background-size:100% 100%;
}



.layout-lnb .list-lnb li a .icon-realtime {
  display: inline-block;
  width: 23px;
  height: 23px;
  background: url("../images/icon-realtime.png") no-repeat 0 0;
  background-size:100% 100%;
  vertical-align: top;
}
.layout-lnb .list-lnb li a .icon-calendarview {
  display: inline-block;
  width: 23px;
  height: 23px;
  background: url("../images/icon-calendarview.png") no-repeat 0 0;
  background-size:100% 100%;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-exposure {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-exposure.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-calculate {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-calculate.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-room {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-room.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-option {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-option.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-member {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-member.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-review {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-review.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-event {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-event.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-call {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-call.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-lnb .list-lnb li a .icon-chart {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-chart.svg") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}

.layout-lnb .list-lnb li a .icon-message {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-message.svg") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li.is-selected a .icon-lnb-dashboard,
.layout-lnb .list-lnb li a:hover .icon-lnb-dashboard {

  background: url("../images/icon-lnb-dashboard-selected.png") no-repeat 0 0;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li a .icon-lnb-dashboard {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/icon-lnb-dashboard.png") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li.is-selected a .icon-lnb-price,
.layout-lnb .list-lnb li a:hover .icon-lnb-price {

  background: url("../images/icon-lnb-price-selected.png") no-repeat 0 0;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li a .icon-lnb-price {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/icon-lnb-price.png") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li.is-selected a .icon-lnb-work,
.layout-lnb .list-lnb li a:hover .icon-lnb-work {

  background: url("../images/icon-lnb-work-selected.png") no-repeat 0 0;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li a .icon-lnb-work {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/icon-lnb-work.png") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li.is-selected a .icon-lnb-option,
.layout-lnb .list-lnb li a:hover .icon-lnb-option {

  background: url("../images/icon-lnb-option-selected.png") no-repeat 0 0;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li a .icon-lnb-option {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/icon-lnb-option.png") no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}

.layout-lnb .member-alram {padding: 34px 10px 0 10px;}
.layout-lnb .member-alram li {
  border: 1px solid #ddd;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  font-size: 12px;
  color: #555;
  padding: 8px;
  margin-bottom: 14px;
  line-height: 18px;
}
.layout-lnb .list-lnb li .icon-auto{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/icon-lnb-auto.svg") no-repeat 0 0;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li a:hover .icon-auto{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/icon-lnb-auto-selected.svg") no-repeat 0 0;
  background-size: 100% 100%;
}

.layout-lnb .list-lnb li .icon-select{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/icon-lnb-select.svg") no-repeat 0 0;
  background-size: 100% 100%;
}
.layout-lnb .list-lnb li a:hover .icon-select{
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/icon-lnb-select-selected.svg") no-repeat 0 0;
  background-size: 100% 100%;
}

.layout-gnb {
  position:relative;
  display:flex;
  background-color: #fff;
  width: 100%;
  border-bottom: 1px solid #E4E4E4;
}
.layout-gnb .wrap-gnb-menu {
  display:flex;
  flex:auto;
  align-items: center;
  justify-content: center;
  margin-bottom:0;
}
.layout-gnb .list-gnb-menu {
  display:flex;
}
.layout-gnb .list-gnb-menu li {
  display:block;
  padding:0 10px;
  line-height:62px;

  min-width:120px;
}
.layout-gnb .list-gnb-menu li a {
  display:block;
  font-size:16px;

  line-height:62px;
  color:#888888;
  font-weight:bold;
  text-align:center;
  position:relative;

}
.layout-gnb .list-gnb-menu li.is-selected a {color:#FF6A29;}

.layout-gnb .ui-gnb {
  display: flex;
  padding-right: 48px;
  height: 62px;
  margin-left: auto;
  align-items: center;
  justify-content: end;
}
.layout-gnb .ui-gnb .txt-manager {
  font-size:14px;
  margin-right:40px;
}
.popup-alarm {
  border-radius:10px;
  background-color:#fff;
  position:absolute;
  top:100%;
  left:50%;
  margin:12px 0 0 -150px;
  white-space:nowrap;
  background-color:#fff;
  padding:20px 15px;
  border:1px solid #F0F0F0;
  width:300px;
}
.popup-alarm .icon-alarm {
  display:inline-block;
  width:10px;
  height:10px;
  position:absolute;
  bottom:100%;
  margin-bottom:-2px;
  left:50%;
  margin-left:-5px;
  background: url("../images/svg/icon-triangle.svg") no-repeat 0 0;
  background-size:100% 100%;
  content:'';
  background-color:#fff;
}
.popup-alarm .icon-alarm:after {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  border:1px solid #fff;
  content:'';
}
.popup-alarm .list-alarm li {
  align-items: center;;
  color:#000;
  font-size:14px;
  display:flex;
}
.popup-alarm .list-alarm li:before {display:inline-block; width:3px; height:3px; margin-right:5px;background-color:#000; border-radius:50%;content:''; flex:none;}
.popup-alarm .list-alarm li .txt-message {white-space:nowrap; text-overflow:ellipsis; overflow:hidden; flex:auto;}
.popup-alarm .list-alarm li .data-day {
  margin-left:auto;
  font-size:12px;
  padding-left:10px;
}
.popup-alarm .list-alarm li + li {
  padding-top:10px;
}
.layout-gnb .wrap-alarm {position:relative;
  margin-right: 24px;}
.layout-gnb .link-alarm {
  position: relative;
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-alarm.svg") no-repeat 0 0;
  vertical-align: top;
}

.layout-gnb .link-alarm .icon-new {
  position: absolute;
  display: inline-block;
  width: 12px;
  height: 12px;
  top: 0;
  right: 0;
  background-color: #FD6A6A;
  border: 2px solid #fff;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
}

.layout-gnb .data-member {
  position: relative;
  padding-left: 24px;
  font-weight: 700;
  color: #1B1A1A;
}

.layout-gnb .data-member:before {
  display: inline-block;
  height: 14px;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -7px;
  content: '';
  border-left: 1px solid #CECECE;
}

.layout-gnb .link-logout {
  margin-left: 12px;
  display: inline-block;
  font-size: 12px;
  color: #696969;
}

.layout-container {
  display: flex;
  width: 100%;
  height:100vh;
  flex-direction: column;
  position:relative;
  overflow:auto;
}

.layout-container .btn-close {
  display:inline-block;
  width:30px;
  height:30px;
  border:1px solid #E4E4E4;
  position:absolute;
  top:16px;;
  left:0;
  background-color:#fff;
  border-left:none;
  z-index:10;
}
.layout-container .btn-close:before {
  display:inline-block;
  position:absolute;
  top:50%;
  left:50%;
  margin:-12px 0 0 -12px;
  width:25px;
  height:25px;
  background:url("../images/svg/arrow-close.svg") no-repeat 0 0;
  background-size:100% 100%;
  content:'';
}

.layout-container .btn-close.type-open:before {
  transform:rotate(180deg);
}
.section-tabs {
  flex: none;
  background-color: #fff;
  height: 62px;
  border-bottom: 1px solid #E4E4E4;
}
.section-tabs .ui-back {
  height:100%;
  display:flex;
  align-items: center;
  color:#1B1A1A;
  font-weight:700;
  font-size:24px;

}
.section-tabs .ui-back .btn-back {
  margin:0 16px 0 40px;
  display:inline-block;
  width:34px;
  height:34px;
  background:url(../images/btn-back-page.svg) no-repeat;
  background-size:100% 100%;
}

.section-tabs .list-tabs {
  display: flex;
  padding: 0 40px;
}

.section-tabs .list-tabs li + li {
  margin-left: 16px;
}

.section-tabs .list-tabs li.is-selected a {
  color: #FF6A29;
  font-weight: 700;
}

.section-tabs .list-tabs li.is-selected a:before {
  position: absolute;
  bottom: 1px;
  left: 0;
  right: 0;
  content: '';
  border-bottom: 2px solid #FF6A29;
}

.section-tabs .list-tabs li a {
  display: block;
  position: relative;
  padding: 0 8px;
  font-size: 16px;
  font-weight: 500;
  color: #888888;
  line-height: 62px;
}
.section-tabs .list-tabs li a .badge-new {
  display:inline-block;
  position:absolute;
  top:10px;
  right:-3px;
  width:16px;
  height:16px;
  border-radius:50%;
  background-color:#FD6A6A;
  color:#fff;
  font-weight:bold;
  padding:0 5px;
  font-size:10px;
  line-height:16px;
}
.section-tabs .list-tabs li a:hover {
  color: #FF6A29;
  font-weight: 700;
  text-decoration: none;
}

.section-tabs .list-tabs li a:hover:hover:before {
  position: absolute;
  bottom: 1px;
  left: 0;
  right: 0;
  content: '';
  border-bottom: 2px solid #FF6A29;
}

.section-contents {
  position:relative;
  padding: 40px;
}
.section-contents.type-fix {
  display:flex;
  flex-direction: column;
  flex:auto;
  height:100%;
  overflow:auto;

}
.section-contents.type-fix .ui-view {
  flex:auto;
  height:100%;
  margin:-40px;
  overflow:auto;
  padding:40px;
}


.section-contents .label-title {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  min-width: 800px;
  margin-bottom: 10px;
  padding: 8px 20px;
  font-weight: 700;
  font-size: 24px;
  color: #000;
  border: 1px solid #ccc;
  border-radius: 8px;
  /*border-bottom: 1px solid #ccc;*/
}
.section-contents .label-title > span {
  flex: 1;
  max-width: 650px;
}
.section-contents .label-title > div:hover {
  color: #6449fc;
  cursor: pointer;
}
.section-contents .label-title .title-right {
  margin-left:auto;
}
.section-contents .link-detail {
  position:absolute;
  font-weight:600;
  top:40px;
  right:40px;
  color:#FF6A29;
}

/***************************************************************************************
   LAYOUT Popup
***************************************************************************************/
.layout-popup {
  display: flex;
  flex-wrap: wrap;
  position: fixed;
  align-items: start;
  justify-content: center;
  padding:30px 0 0 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(27, 26, 26, 0.5);
  overflow: auto;
  z-index: 100;
}

.layout-popup .box-popup {
  position:relative;
  padding: 24px 32px 0 32px;
  width: 830px;
  background-color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}

.section-contents .label-title .title-back,
.layout-popup .box-popup .popup-back {
  margin-right:5px;
  display:inline-block;
  width:25px;
  height:25px;
  background:url(../images/svg/arrow-close.png) no-repeat;
  background-size:100% 100%;
  transform:rotate(90deg);
}
.layout-popup .box-popup .popup-close-default,
.layout-popup .box-popup .popup-close {
  position:absolute;
  top:10px;
  right:20px;
  display:inline-block;
  width:30px;
  height:30px;
  background:url(../images/svg/alarm-close.svg) no-repeat;
  background-size:100% 100%;

}

.layout-popup .box-popup.type-l-size {
  width: 1200px;
}
.layout-popup .box-popup.type-s-size {
  width:400px;
}

.layout-popup .box-popup .label-popup {
  display:flex;
  align-items: center;;
  padding-bottom: 12px;
  color: #1B1A1A;
  font-size: 16px;
  font-weight: 600;
  border-bottom: 1px solid #E4E4E4;
}

.layout-popup .box-popup .popup-contents {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 20px 0 8px 0;
  min-height: 172px;
}
.layout-popup .box-popup .popup-contents .room-day {
  font-size:13px;
  padding-bottom:10px;
  font-weight:600;
  text-align:center;
}
.layout-popup .box-popup .popup-contents .btn-center {text-align:center; padding:10px 0 30px 0;}

.layout-popup .box-popup .popup-contents .room-info {
  font-size:13px;
  padding-bottom:10px;
  font-weight:600;
  text-align:center;
}

.layout-popup .box-popup .popup-footer {
  padding: 32px 0;
  display: flex;
  justify-content: center;
  margin: 0 -8px;
}
.layout-popup .box-popup .popup-footer.type-line {
  border-top:1px solid #E4E4E4;
  margin-top:16px;
  padding:24px 0;
}

.layout-popup .box-popup .popup-footer button {
  margin: 0 8px;
}

.layout-popup .box-popup .wrap-table + .wrap-table {
  margin-top: 24px;
}
.layout-popup .box-popup .wrap-table .data-day {font-size:18px;font-weight:500; padding-bottom:10px;}
.layout-popup .box-popup .table-line {
  border:none;
  border-top:1px solid #F0F0F0;
  margin-top:20px;
  padding:20px 0 0 0;
}
.layout-popup .box-popup .wrap-table .view-status {display:flex; align-items: center; padding-bottom:10px;}
.layout-popup .box-popup .wrap-table .view-status .area-status {display:flex;}
.layout-popup .box-popup .wrap-table .view-status .area-status .tag-status {display:inline-block; border-radius:3px; padding:2px 5px; font-size:13px;  font-weight:500;}
.layout-popup .box-popup .wrap-table .view-status .area-status .tag-status.type-wait {background-color:#fdf3d0;}
.layout-popup .box-popup .wrap-table .view-status .area-status .tag-status.type-confirm {background-color:#b8c6e4;}
.layout-popup .box-popup .wrap-table .view-status .area-status .tag-status.type-cancel {background-color:#808080; color:#fff;}
.layout-popup .box-popup .wrap-table .view-status .area-status .tag-status + .tag-status {margin-left:3px;}
.layout-popup .box-popup .wrap-table .view-status .area-right {margin-left:auto; font-size:13px;}
.layout-popup .box-popup .wrap-table .table-option {display:flex; align-items:center; padding-bottom:10px;}
.layout-popup .box-popup .wrap-table .table-option .img-logo {margin-left:10px; margin-right:5px;}
.layout-popup .box-popup .wrap-table .table-option .data-name {font-size:14px; margin-left:5px;}
.layout-popup .box-popup .wrap-table .table-option .data-tag {display:inline-block; border-radius:3px; width:70px; text-align:center;background-color:#ccc; padding:2px 3px; font-size:14px; }
.layout-popup .box-popup .wrap-table .table-option .btn-solid {margin-left:auto;}
.layout-popup .box-popup .wrap-table .label-table {
  margin-bottom: 6px;
  font-weight: 500;
  line-height: 160%;
  font-size: 14px;
  color: #303030;
  display:flex;
  align-items: center;
}
.layout-popup .box-popup .wrap-table .label-table .label-buttons {display:flex; margin-left:15px;}
.layout-popup .box-popup .wrap-table .label-table .label-buttons a {margin-left:10px;}
.layout-popup .box-popup .wrap-table .label-table.type-strong {
  color:#FF6A29;
}

.top-summary {
  background-color:#fbe0d4;
  height:40px;
  padding-left:200px;
  display:flex;
  align-items: center;
}
.top-summary .btn-reload {
  display:inline-block;
  width:20px;
  height:20px;
  margin-right:10px;
  background:url(../images/icon-reload.png) no-repeat;
  background-size:100% 100%;
}
.top-summary .data-per {
  font-size:16px;
  color:#d80808;
}
.top-summary .data-summary {
  font-size:14px;
  color:#000;
  margin-left:10px;
  margin-right:10px;
}
.top-summary .txt-info {
  color:#000;
  font-size:13px;
}
/***************************************************************************************
   로그인
***************************************************************************************/
.page-login {
  height: 100%;
  width: 100%;
  display: flex;
  position: relative;
}

.page-login .img-logo {
  position: absolute;
  top: 32px;
  left: 100px;
  display: inline-block;
  width: 107px;
  height: 32px;
  background: url("../images/svg/img-login-logo.svg") no-repeat 0 0;
  vertical-align: top;
}

.page-login .bg-login {
  flex: auto;
  height: 100%;
}

.page-login .form-login {
  margin: 0 0 0 83px;
  width: 449px;
}

.page-login .ui-login {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  flex: auto;
  background-color: #fff;
}

.page-login .ui-login .label-login {
  margin-bottom: 48px;
  color: #1B1A1A;
  font-size: 40px;
  font-weight: 700;
}

.page-login .ui-login .form-login .ui-input {
  position: relative;
  width: 449px;
  border: none;
}

.page-login .ui-login .form-login .ui-input input {
  display: block;
  width: 100%;
  font-size: 16px;
  background-color: #FAFAFA;
  border: 1px solid #FAFAFA;
  padding: 16px;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}

.page-login .ui-login .form-login .ui-input input:focus {
  border: 1px solid #FF6A29;
}

.page-login .ui-login .form-login .ui-input + .ui-input {
  margin: 24px 0 0 0;
}

.page-login .ui-login .form-login .type-password input {
  padding-right: 52px;
}

.page-login .ui-login .form-login .ui-eye {
  position: absolute;
  top: 50%;
  right: 16px;
  margin-top: -12px;
}

.page-login .ui-login .form-login .ui-eye input {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
}

.page-login .ui-login .form-login .ui-eye input:checked + i {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-eye-off.svg") no-repeat 0 0;
  vertical-align: top;
}

.page-login .ui-login .form-login .ui-eye i {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-eye.svg") no-repeat 0 0;
  vertical-align: top;
}

.page-login .ui-login .component-radio {
  margin: 24px 0 32px 0;
}

.page-login .ui-login .component-radio .txt-radio {
  font-size: 16px;
  color: #696969;
}

.page-login .ui-login .btn-login {
  width: 100%;
  display: block;
  background: #FF6A29;
  color: #fff;
  line-height: 56px;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}

.page-login .ui-login .btn-login:disabled {
  background-color: #FEBF8F;
}

.page-login .ui-login .txt-info {
  display: block;
  margin-top: 32px;
  color: #ABABAB;
  font-size: 16px;
}

.reservation-home {
  display: flex;
  margin: 0 -8px;
  padding: 12px 0 0 0;
}

.reservation-home .view-home {
  flex: auto;
  padding: 0 8px;
}

.reservation-home .view-home .box-home {
  display: block;
  padding: 24px;
  width: 100%;
  height: 136px;
  border: 1px solid #F0F0F0;
  background-color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
}

.reservation-home .view-home .box-home:hover {
  border: 1px solid #FF6A29;
}

.reservation-home .view-home .box-home .label-box {
  display: flex;
  align-items: center;
  padding-bottom: 24px;
  color: #303030;
  font-weight: 600;
  line-height: 150%;
  font-size: 16px;
}

.reservation-home .view-home .box-home .label-box [class^="icon-"] {
  margin-right: 8px;
}

.reservation-home .view-home .box-home .label-box .icon-card {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-card.svg") no-repeat 0 0;
  vertical-align: top;
}

.reservation-home .view-home .box-home .label-box .icon-reservation {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-reservation.svg") no-repeat 0 0;
  vertical-align: top;
}

.reservation-home .view-home .box-home .label-box .icon-cacel {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-cancel.svg") no-repeat 0 0;
  vertical-align: top;
}

.reservation-home .view-home .box-home .label-box .icon-close {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-close.svg") no-repeat 0 0;
  vertical-align: top;
}

.reservation-home .view-home .box-home .label-box .icon-calendar {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/svg/icon-calendar.svg") no-repeat 0 0;
  vertical-align: top;
}

.reservation-home .view-home .box-home .data-calen {
  font-size: 18px;
  font-weight: 500;
  line-height: 150%;
  color: #303030;
}

.reservation-home .view-home .box-home .data-num {
  font-size: 32px;
  color: #1B1A1A;
  font-weight: 700;
  line-height: 125%;
}
.ui-view .top-option + .top-option {
  padding-top:0;
}
.ui-view {
  margin-top: 48px;
}

.ui-view:first-of-type {
  margin-top: 0;
}

.ui-view + .view-flex {
  margin-top: 48px;
}

.ui-view + .view-flex .ui-view {
  margin-top: 0;
}

.ui-view .box-table {
  border: 1px solid #E4E4E4;
  background-color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
  overflow: auto;
}

.view-flex {
  display: flex;
  margin: 0 -9px;
}

.view-flex .ui-view {
  padding: 0 9px;
  width: 50%;
  flex: none;
}

.view-box {
  display:flex;
  flex-wrap:wrap;
  margin:-8px;

}
.view-box .box-in {
  padding: 24px;
  border-radius: 12px;
  border: 1px solid #E4E4E4;
  background: #FFF;
  height:218px;
  position:relative;
}
.view-box .box-in.type-flex {
  display:flex;
  flex-direction: column;
  height:auto;
  min-height:218px;
}
.view-box .box-in.type-flex .list-reservation {
  flex:auto;
  height:100%;
}
.view-box.type-calen .box-form {width:20%;}
.view-box .box-form {width:25%; padding:8px; }
.view-box .box-in .label-name {
  position:relative;
  padding-bottom:16px;
  font-size:16px;
  color:#1B1A1A;
  font-weight:500;
  line-height:24px;
}
.view-box .box-in .label-name .data-week {
  font-size:14px;
}
.view-box .box-in .label-name.type-line {
  border-bottom:1px solid #E4E4E4;
  margin:-14px -24px 10px -24px;
  padding:0 24px 10px 24px;
}
.view-box .box-in .label-name .tag-today {position:absolute; top:50%; right:24px; margin-top:-14px; font-weight:600; background-color:#fff129; display:inline-block; font-size:13px; padding:2px 5px; line-height:1.3em;}
.view-box .box-in table {
  margin:-4px 0;
  width:100%;
}
.view-box .box-in table tr th {
  color: #696969;
  font-size:14px;
  line-height:22px;
  font-weight:500;
  padding:4px 0 ;
  text-align:left;
}
.view-box .box-in table tr th.txt-strong {
  color: #FF6A29;
}
.view-box .box-in table tr td {
  padding:4px 0 ;
  color: #696969;
  font-size:14px;
  line-height:22px;
  font-weight:500;

}
.view-box .box-in table tr td strong {
  color:#1B1A1A;
}


.view-box .box-in .btn-info {
  position:absolute;
  padding:8px 16px;
  display:flex;
  align-items: center;
  justify-content: center;
  bottom:24px;
  left:24px;
  right:24px;
  border-radius: 12px;
  border: 1px solid #E4E4E4;

  background: #FFF;
  text-align:center;
  font-size:14px;
  color:#1B1A1A;
  font-weight:500;

}
.view-box .box-in .btn-info:before {
  display:inline-block;
  width:24px;
  height:24px;
  margin-right:8px;
  background:url(../images/icon-clock.svg) no-repeat; background-size:100% 100%;
  content:'';
}
.view-box .box-in .wrap-round {
  position:absolute; top:24px; right:24px;

}
.view-box .box-in i.icon-round {
  display:inline-block;
  width:12px;
  height:12px;
  border-radius:50%;
  background-color:#FF6A29;

}
.view-box .box-in i.icon-round.type-line {
  background:none;
  border:1px solid #CCC;
}
.view-box .box-in i.icon-round.type-gray {
  background-color:#696969;
}
.view-box .box-in i.icon-round + .icon-round {
  margin-left:8px;
}
.table-line-form tr td {
  padding:8px 12px;
  font-size:14px;
  color:#1B1A1A;
  border-bottom:1px solid #E4E4E4;
}
.table-line-form tr td.txt-center {
  text-align:center;
}
.table-line-form tr td.ui-left {
  overflow:hidden;
}
.table-line-form tr td.ui-left .btn-line {
  float:left;
}
.table-line-form tr td .txt-gray {
  color:#696969;
}
.table-line-form tr td .btn-line + .btn-line{
  margin-left:8px;

}
.table-line-form tr td.txt-gray {
  color:#696969;
}
.table-line-form tr td .box-strong {
  padding:9px 12px;
  border-radius: 8px;
  background: #FFE9DF;
  font-size: 12px;
  color: #FF6A29;
  line-height:20px;
}
.table-line-form tr td .box-strong.type-gray {
  color:#696969;
  background-color:#F4F4F4;
}
.box-time-info {
  position:relative;
  margin:8px 0 0 0;
  line-height: 20px;
  padding:4px 8px;
  background-color:#F4F4F4;
  font-size:12px;
  color:#696969;
}
.box-time-info .btn-refresh {
  display:inline-block;
  width:24px;
  height:24px;
  background:url(../images/icon-time-refresh.svg) no-repeat;
  background-size:100% 100%;
  position:absolute;
  top:50%;
  right:8px;
  margin-top:-12px;
}
.ui-change .change-label {
  color:#303030;
  font-size:14px;
  font-weight:500;
  line-height:22px;
  padding:8px 0;
  margin-bottom:8px;
  border-bottom:1px solid #E4E4E4;
}
.form-change {
  display:flex;
  align-items: center;
  justify-content: flex-end;
  color:#696969;
  font-size:14px;
}
.form-change .component-selectbox {
  margin:0 12px;
  width:93px;
}

.table-line-calen tr th {
  position:relative;
  border:1px solid #DDD;
  background-color:#FAFAFA;
  text-align:center;
  font-size:16px;
  color:#303030;
  line-height:24px;
  padding:8px;
  font-weight:500;
}
.table-line-calen tr td .component-checkbox,
.table-line-calen tr th .component-checkbox {
  position:absolute;
  top:10px;
  left:14px;
  z-index:4;
}
.table-line-calen tr td .component-checkbox {
  top:5px;
}
.table-line-calen tr th:first-of-type {
  color:#FD4F4F;
}
.table-line-calen tr th:last-of-type {
  color:#0062FF;
}
.table-line-calen tr td {
  position:relative;
  border:1px solid #DDD;
  vertical-align: top;

}
.table-line-calen tr td .txt-day  {
  color:#303030;
  font-size:14px;
  font-weight:500;
  border-bottom:1px solid #DDD;
  text-align:center;
  line-height:22px;
  padding:5px 0;
  position:relative;

}
.table-line-calen tr td .txt-day .btn-more {
  display:inline-block;
  position:absolute;
  top:50%;
  right:10px;
  margin-top:-10px;
  width:20px;
  height:20px;
  background:url(../images/btn-more.png) no-repeat;
  background-size:100% 100%;

}
.table-line-calen tr td:first-of-type .txt-day {
  color:#FD4F4F;
}
.table-line-calen tr td:last-of-type .txt-day {
  color:#0062FF;
}
.table-line-calen tr td .txt-day .tag-new {
  border-radius:2px;
  background-color:#FF6A29;
  line-height:16px;
  width:14px;
  display:inline-block;
  text-align:center;
  position:absolute;
  top:7px;
  left:45px;
  color:#fff;
  font-size:10px;
}
.table-line-calen tr td .txt-day.type-disabled {
  color:#CCC;

}
.table-line-calen tr td .wrap-num {
  padding:8px;
}
.table-line-calen tr td .wrap-num .wrap-status {
  display:flex; flex-wrap:wrap;
}
.table-line-calen tr td .wrap-num .wrap-status + .wrap-status {margin-top:4px;}
.table-line-calen tr td .wrap-num .wrap-status .ui-tag {overflow:hidden; display:flex;}
.table-line-calen tr td .wrap-num .wrap-status .ui-tag span.data-tag {display:inline-block; border-radius:2px; background-color:#ccc; padding:2px 5px; margin-right:2px; height:20px; font-size:11px;}
.table-line-calen tr td .wrap-num .wrap-status .ui-tag span.data-tag.type-dark {
  background-color:#000;
  color:#fff;
}
.table-line-calen tr td .wrap-num .wrap-status .ui-tag span.data-tag.type-error {
  background-color:red;
  color:#fff;
}
.table-line-calen tr td .wrap-num .wrap-status .ui-right {margin-left:auto; font-size:11px; line-height:20px;}
.table-line-calen tr td .wrap-num .data-num {
  display:flex;

}
.table-line-calen tr td .wrap-num .data-num .txt-label {
  line-height:20px;
  color:#696969;
  font-size:12px;
}
.table-line-calen tr td .wrap-num .data-num .txt-num {
  margin-left:auto;
  color:#1B1A1A;
  font-size:12px;
}
.table-line-calen tr td .box-status {
  background-color:#fafafa;
  border-bottom:1px solid #E4E4E4;
  padding:8px;
}
.table-line-calen tr td .box-status .data-room {
  color:#FF6A29;
  font-size:12px;
  font-weight:500;
  line-height: 20px;
  margin-bottom:8px;
}
.table-line-calen tr td .box-status .ui-status {
  display:flex;
  align-items: center; flex-wrap:wrap;
}
.table-line-calen tr td .box-status .ui-status .txt-reservation {font-size:13px; margin-left:auto;}
.table-line-calen tr td .box-status .ui-status .txt-reservation.type-impossible {color:red;}
.table-line-calen tr td .box-status .ui-status .status-price {
  color: #696969;
  font-size:12px;
  font-weight:500;
}
.table-line-calen tr td .box-status .ui-status .data-name {display:inline-block; border-radius:2px; padding:2px 3px; font-size:11px; border:1px solid #ccc; background-color:#fff;}
.table-line-calen tr td .box-status .ui-status .data-name + .data-name {margin-left:2px;}

.table-line-calen tr td .box-status .ui-status .data-name.type-0 {background-color:#f5c342; border:1px solid #f5c342; }
.table-line-calen tr td .box-status .ui-status .data-name.type-1 {background-color:#cadfb8; border-color:#cadfb8;}


.table-line-calen tr td .box-status .ui-status .data-name.type-a {background-color:#f5c342; border:1px solid #f5c342; }
.table-line-calen tr td .box-status .ui-status .data-name.type-b {background-color:#cadfb8; border-color:#cadfb8;}
.table-line-calen tr td .box-status .ui-status .txt-tag {
  flex:none;
  margin-right:5px;
  display:inline-block;
  width:15px;
  height:15px;
  border-radius:50%;
  background-color:#888;
  font-size:10px;
  color:#fff;
  font-weight:bold;
  display:flex;
  align-items: center;
  justify-content: center;
}
.table-line-calen tr td .box-status .ui-status + .ui-status {
  margin-top:8px;
}
.table-line-calen tr td .box-status .ui-status .status-num {
  display:flex;
  flex-direction: column;
  line-height: 20px;
}
.table-line-calen tr td .box-status .ui-status .status-num .data-num {
  color:#696969;
  font-size:12px;
  font-weight:500;

}
.table-line-calen tr td .box-status .ui-status .status-num .data-num.type-strong {
  display:block;
  color:#FF6A29;
}

.table-line-calen tr td .box-status .ui-status .status-num .data-num.type-cancel {
  color:#000;
  font-weight:500;
}
.table-line-calen tr td .box-status .ui-status .form-btn {
  margin-left:auto;
  display:inline-block;
  padding:0 4px;
  font-weight:500;
  color:#888;
  font-size:10px;
  background-color:#fff;
  border:1px solid #ddd;
  border-radius:4px;
  line-height:18px;
}
.table-line-calen tr td .box-status .ui-status .form-btn.type-dark {
  background-color:#454647;
  color:#fff;
  border:1px solid #454647;

}

.table-line-calen tr td .calen-buttons {
  padding:12px;
}
.table-line-calen tr td .calen-buttons .btn-view {
  display:flex;
  align-items: center;
  justify-content: center;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid #DDD;
  text-align:center;
  background: #FFF;
  text-align:cetner;
  color:#1B1A1A;
  font-size:12px;line-height: 20px;

}
.table-line-calen tr td .calen-buttons .btn-view .icon-ai {display:inline-block; background:url(../images/icon-ai.png) no-repeat; width:15px;height:15px; background-size:100% 100%; margin-right:5px;}

.popup-contents .box-price {
  border-radius: 8px;
  border: 1px solid #E4E4E4;
  background: #FAFAFA;
  padding:16px;
}
.popup-contents .box-price .view-price {
  display:flex;
  align-items: center;
}
.popup-contents .box-price .view-price .component-radio {
  margin-right:8px;
}
.popup-contents .box-price .view-price .txt-tag {
  flex:none;
  margin-right:8px;
  display:inline-block;
  width:15px;
  height:15px;
  border-radius:50%;
  background-color:#888;
  font-size:10px;
  color:#fff;
  font-weight:bold;
  display:flex;
  align-items: center;
  justify-content: center;
}
.popup-contents .box-price .view-price + .view-price {
  margin-top:16px;
}
.popup-contents .box-price .view-price .data-price {
  color: #696969;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  width:104px;
  display:inline-block;
}
.popup-contents .box-price .view-price .input-multi {
  display:flex;
  align-items: center;
  margin-left:auto;
  border-radius: 4px;
  border: 1px solid #DDD;
  width:180px;

  background: #FFF;
  overflow:hidden;
  position:relative;

}
.popup-contents .box-price .view-price .input-multi.is-disabled:after {
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background: #EEE;
  content:'';

}
.popup-contents .box-price .view-price .input-multi input {
  display:block;
  width:100%;
  text-align:right;
  line-height:30px;
  border:none;
  background:transparent;

}
.popup-contents .box-price .view-price .input-multi .txt-unit {
  position:relative;
  z-index:1;

  font-size: 12px;
  color:#888;
  line-height: 20px;
  display:inline-block;
  margin:0 8px 0 10px;
}


.round-table {border-radius:8px; border:1px solid #ddd; overflow:hidden; position:relative;}
.round-table.type-flex {Display:flex; align-items: center;}
.round-table .btn-change {flex:none; margin:0 3px; border-radius:5px; border:1px solid #ddd; padding:3px 10px; background-color:#fff; color:#000; font-size:12px; margin:25px 0 0 0;}
.round-table.type-flex {display:flex;}
.round-table .component-table2 {border:none;}
.round-table .component-table2 tr th,
.round-table .component-table2 tr td {border-bottom:none;}
.component-table2 tr td .img-logo {width:100%; max-width:70px;}
.component-table2 tr td .data-room {color:#000;}
.component-table2 tr td .data-room.type-error {color:red;}

.round-table .component-table2 tr th.th-line {border-left:1px solid #ddd;}
.round-table .component-table2 tr td.td-line {
  border-left:1px solid #ddd;
}
.modal-change{position:fixed; top:0; left:0; right:0;  bottom:0; z-index:10000; display:none;}

.modal-change .modal-dialog {width:300px; height:100%;}
.modal-change .modal-body {padding-top: 50px;}
.modal-change .form-flex {display:flex; align-items: center; margin:6px 0 0 0;}
.modal-change .form-flex .label-form {width:25%; flex:none;}
.modal-change .form-flex .component-selectbox {width:100%;}
.modal-change .txt-message {padding:10px 0; text-align:center; font-weight:500;}
.pop-error {position:fixed;  border:1px solid #ccc; border-radius:10px; text-align:left; padding:10px 10px 10px; background-color:#fff; display:none;}
.pop-error .txt-error {display:inline-block; background-color:red; color:#fff; padding:0 3px; border-radius:3px; font-size:10px;}

.pop-error .box-contents {padding:10px 0 0 0; font-size:12px; text-align:left;}
.pop-error .btn-close-pop {
  opacity:1;
  font-size:0;
  margin-top:0;

  position:absolute;
  top:10px;
  right:20px;
  display:inline-block;
  width:20px;
  height:20px;
  background:url(../images/svg/alarm-close.svg) no-repeat;
  background-size:100% 100%;
  z-index:10;
}


.round-table .component-table2 tr td .icon-mecro {display:inline-block; position:relative; top:2px;  width:12px; height:12px; background:url(../images/icon-mecro.png) no-repeat; background-size:100% 100%; margin-right:5px;}
.round-table .component-table2 tr th .btn-ing {border-radius:5px; border:1px solid #ddd; padding:3px 10px; background-color:#fff; color:#000; margin-left:auto;}
.round-table .component-table2 tr th.txt-left {text-align:left;}
.round-table .component-table2 tr td .ui-error {position:relative; display:inline-block;}

.round-table .component-table2 tr td .ui-error .txt-error {display:inline-block; background-color:red; color:#fff; padding:0 3px; border-radius:3px; font-size:10px;}
.round-table .component-table2 tr td .ui-error .txt-error.type-cursor {cursor:pointer;}
.collecting-ing {border-radius:5px; border:1px solid #ddd; color:red; text-align:center; padding:10px 0; margin:10px 0;}
.component-table2.type-center tr td {text-align:center;}
.component-table2.type-center.type-flex tr td {padding:6px 5px;}
.component-status {color:#222; font-size:500; font-size:14px; line-height:22px; display:flex; align-items: center; }
.component-status:before {display:inline-block; width:16px; height:16px; border-radius:4px; content:''; margin-right:4px; border:1px solid rgba(255,255,255,0.4);}
.component-status.status-wait:before {background-color:#CCCCCC;}
.component-status.status-normal:before {background-color:#467AFF;}
.component-status.status-check:before {background-color:#F84F44;}

.box-management {border-radius:12px; border:1px solid #ddd; margin-top:16px; display:flex; align-items: center; background-color:#fff;}
.box-management .area-list {flex:auto;}
.box-management .list-management {display:flex; align-items: center; height:54px; padding:0 16px; position:relative;}
.box-management .list-small {display:flex;}
.box-management .list-management .btn-line {position:absolute; top:50%; right:0; margin-top:-22px;}
.component-category {display:inline-block; border:1px solid #DDD; border-radius:4px; width:48px; text-align:center; color:#222; font-weight:500; font-size:12px; line-height:20px;}


.box-management .list-management+.list-management {border-top:1px dashed #DDD;}

.component-category.is-disabled {background-color:#EEEEEE; color:#ccc;}
.box-management .list-management .component-status {margin-left:16px;}

.box-management .list-management .txt-data {margin-left:16px; color:#222; font-size:14px; font-weight:500; min-width:100px; display:flex; align-items: center;}
.box-management .list-management .txt-data.type-collecting {color:#F84F44;}
.box-management .list-management .txt-data.is-disabled {color:#ccc;}
.box-management .list-management .txt-data.type-error {color:#F84F44;}
.box-management .list-management .txt-data .img-logo {margin-right:8px; width:70px;}
.box-management .list-management .txt-data .data-day {min-width:200px;}
.box-management .list-management .txt-data.box-data {border:1px solid #ddd; border-radius:8px; padding:0 12px; height:38px;display:flex; align-items: center; justify-content: center;}
.box-management .list-management .txt-data .txt-disabled {color:#ABABAB; margin-left:3px;}
.box-management .list-management .tag-check2,
.box-management .list-management .tag-check {border-radius:2px; background-color:#222; padding:2px 4px; display:inline-block; color:#fff; font-size:10px; line-height:12px; margin-right:4px; border-radius:4px;}
.box-management .list-management .tag-check2 {background-color:#FF6A29;}
.box-management .area-buttons {padding:0 24px;}
.box-management .area-buttons .btn-line {padding:14px 12px;}


.form-day {display:flex;}
.form-day .data-day {font-size:16px; font-weight:500; color:#222;}
.form-day .data-day .tag-day {padding:3px 10px; background-color:#000; color:#fff; margin-right:3px;}
.form-day .txt-right {margin-left:auto; font-size:14px; color:#222; display:flex;}
.form-day .txt-right .txt-label {font-size:14px; color:#696969; margin-right:5px;}
.component-tag {display:inline-block; border-radius:4px; width:48px; text-align:center; font-size:12px; font-weight:500; line-height:20px;}
.component-tag.type-normal { background-color:#EBFFF0; color:#00BD35;}
.component-tag.type-days {color:#888; background-color:#EEE;}
.component-tag.type-error {
  background-color:red; color:#fff; font-weight:600;
}
.data-total {
  display:flex; margin-bottom:16px;
}
.data-total .txt-total + .txt-total {margin-left:16px;}
.data-total .txt-total {font-size:14px; color:#696969;}
.data-total .data-num {font-size:14px; color:#222; margin-left:5px; font-weight:500;}
.section-contents h3.list-inline {display:flex; align-items: center;}
.section-contents h3 .ui-status {display:flex; margin-left:40px; align-items: center;}
.section-contents h3 .ui-status .component-status {margin-right:16px;}

.popup-footer2 .btn-solid {margin:0 3px;}
.popup-footer2 {
  display: flex;
  justify-content: center;
  padding:24px 0;
}
.btn-solid.type-m-size2,
.btn-line.type-m-size2 {
  padding: 11px 23px;
  font-weight: 500;

}

.modal-body .title {
  padding:0;
  margin-bottom: 6px;
  font-weight: 500;
  line-height: 160%;
  font-size: 14px;
  color: #303030;
  display:flex;
  align-items: center;
}
.modal-body .title .component-status {margin-left:auto;}
.modal-body .title .component-status.type-left {margin-left:20px;}
.modal-content .close {
  opacity:1;
  font-size:0;
  margin-top:0;

  position:absolute;
  top:10px;
  right:20px;
  display:inline-block;
  width:30px;
  height:30px;
  background:url(../images/svg/alarm-close.svg) no-repeat;
  background-size:100% 100%;
  z-index:10;
}

.txt-error  {
  background-color: #ffc3c3;
}
.txt-success {
  background-color: #afeaff;
}
.btn-refresh {
  display:inline-block;
  width:24px;
  height:24px;
  background:url(../images/icon-time-refresh.svg) no-repeat;
  background-size:100% 100%;
  position:relative;
  top:50%;
  left:8px;
  margin-top:-12px;
}
.popup-status .ui-status {padding-bottom:10px;}
.popup-status .ui-status span.data-tag {display:inline-block; border-radius:2px; background-color:#ccc; padding:2px 5px; margin-right:10px; height:20px; font-size:11px;}

.popup-status .ui-status span.data-tag.type-error {
  background-color:red; color:#fff; font-weight:600;
}


.form-tops {position:relative; display:flex; align-items:center; margin-bottom:20px;}
.form-tops .component-day {
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  padding-bottom:0;

}
.component-day {
  padding-bottom: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.component-day .arrow-next,
.component-day .arrow-prev {
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url("../images/svg/arrow-calen-prev.svg") no-repeat 0 0;
  vertical-align: top;
}

.component-day .arrow-next {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.component-day .txt-day {
  position:relative;
  display: inline-block;
  margin: 0 40px;
  color: #2D2D2D;
  font-weight: 700;
  font-size: 24px;
}
.list-reservation li {
  white-space: nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
}
.list-reservation li a {
  font-size:14px;
  text-decoration: underline;
  font-weight:700;
  color:#000;
}
.list-reservation li a .tag-round {
  display:inline-block;
  width:18px;
  height:18px;
  border-radius:50%;
  background-color:#888;
  color:#fff;
  text-align:center;
  font-size:13px;
  line-height:18px;
  margin-right:5px;
}
.list-reservation li a span {
  font-weight:normal;
}
.list-reservation li + li {
  margin-top:10px;
}
.reservation-num {text-align:center; margin-bottom:-14px;}
.reservation-num span {
  width:50px;
  text-align:center;
  display:inline-block;
  border-radius:4px;
  font-size:14px;
  background-color:#888;
  color:#fff;
  padding:3px 5px;

}
.ui-view .view-days {
  display:flex;
  margin:0 -8px;
}
.ui-view .view-days .box-days {
  padding:0 8px;width:20%;
}
.ui-view .view-days .area-days .tag-today {position:absolute; top:0; right:20px;margin-top:-11px; font-weight:600; background-color:#fff129; line-height: 1.3em; display:inline-block; font-size:13px; padding:2px 5px; color:#000;}
.ui-view .view-days .area-days {
  padding:15px 24px;
  position:relative;
  border:1px solid #E4E4E4;
  display:flex;
  flex-wrap:wrap;
  border-radius:12px; margin:0 0 10px 0;}
.ui-view .view-days .area-days.is-selected:before {position:absolute; top:-1px; right:-1px; bottom:-1px; left:-1px; border:2px solid #FF6A29;  border-radius:12px; content:'';}
.ui-view .view-days .area-days .data-days {font-size:16px; color:#000;}
.ui-view .view-days .area-days .data-days + .data-days {margin-left:10px;}
.ui-view .view-days .area-days .reservation-num {margin-left:auto;}



/***************************************************************************************
   Popup : Login
***************************************************************************************/


.page-login .login-info {
  padding: 56px 24px 37px 24px;
  color: #1b1b1b;
  font-size: 14px;
  line-height: 24px;
  text-align: center;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  -webkit-align-items: center;
  justify-content: center;
  -webkit-justify-content: center;
}

.page-login .login-info:before {
  margin-bottom: 20px;
  content: '';
  display: inline-block;
  vertical-align: top;
}

.page-login .login-info .type-sign {
  padding: 4px 0 48px 0;
  text-align: center;
  font-size: 32px;
  color: #1b1b1b;
  line-height: 42px;
  font-weight: bold;
}

.page-login .form-login {
  padding: 0 24px;
}

.page-login .form-login .component-input + .component-input {
  margin-top: 10px;
}

.page-login .form-login .component-btn-solid {
  margin-top: 48px;
}

.page-login .ui-link {
  padding: 20px 24px 0 24px;
}

.page-login .ui-link:after {
  display: block;
  clear: both;
  content: '';
}

.page-login .ui-link .link-txt {
  float: Left;
  font-size: 12px;
  color: #6f6f6f;
  text-decoration: underline;
}

.page-login .ui-link .link-txt + .link-txt {
  float: right;
}

.page-login .ui-link2 {
  text-align: right;
  padding: 6px 24px 0 24px;
}

.page-login .ui-link2 .link-txt {
  font-size: 12px;
  color: #6f6f6f;
  text-decoration: underline;
}
.status-cancel { background:#ffc1c1 }
.status-memo { background:#b5ffdb }

.calendar-cancel {
  text-decoration : line-through;
}
.monitoring-section{
  overflow-x: auto;
}
.view-monitor + .view-monitor {margin-top:20px; padding-top:20px; border-top:3px solid #ddd;}
.view-monitor .data-calen {}
.view-monitor .data-calen .data-year{font-size:15px;}
.view-monitor .data-calen .data-day {margin-bottom: 5px;font-size:20px; font-weight:bold;}
.view-monitor .data-calen .data-day span {display:inline-block; margin-right:10px;}
.view-monitor-table{
  overflow: hidden;
  max-width: 1800px;
  min-width: 1800px;
  border: 1px solid #999;
  border-radius: 6px;
}
.view-monitor-table.vertical{
  max-width: 600px;
  min-width: 600px;
}
.view-monitor-table_box {
  table-layout: fixed;
  border-spacing: 0; /* 셀 간격 없애기 */
  border-radius: 6px; /* 내부 둥근 테두리 */
}
.view-monitor-table_box th,
.view-monitor-table_box td {
  padding: 12px;
  text-align: left;
}
.view-monitor-table_box thead{
  border-bottom: 1px solid #ccc;
}
.view-monitor-table_box th{
  border-right: 1px solid #ccc;
}
.view-monitor-table_box th:last-child{
  border-right: none;
}
.view-monitor-table_box tbody tr {
  border-bottom: 1px solid #ddd;
}
.view-monitor-table_box tbody:last-child tr:last-child {
  border-bottom: 0;
}
.view-monitor-table_box tbody tr td,
.view-monitor-table_box tbody tr td:last-child[colspan='11']{
  border-right: 1px solid #ccc;
}
.view-monitor-table_box tbody tr td.platform-wrap {
  padding: 0;
}
.view-monitor-table_box tbody tr td:last-child {
  border-right: 0;
}
.view-monitor-table_box thead tr:first-child th:first-child {
  border-top-left-radius: 6px;
}

.view-monitor-table_box thead tr:first-child th:last-child {
  border-top-right-radius: 6px;
}
.view-monitor-table_box tbody tr:last-child td:first-child {
  border-bottom-left-radius: 6px;
}
.view-monitor-table_box tbody tr:last-child td:last-child {
  border-bottom-right-radius: 6px;
}
.view-monitor-table_box th,
.view-monitor-table_box td {
  padding: 8px;
  text-align: left;
}
.view-monitor-table_box th {
  text-align: center;
  font-weight: 400;
  background: #f4f4f4;
}
.view-monitor-table_box tbody td span{
  display: block;
}
.view-monitor-table_box tbody td.error{
  background-color: greenyellow;
}
.view-monitor-table_box tbody td.cell-blue {
  background-color: skyblue;
}
.view-monitor-table_box tbody td.cell-cancel{
  background-color: #FF9999;
}
.view-monitor-table_box tbody td select{
  display: block;
  width: 100%;
}
.view-monitor-table_box .hostel-name {
  font-weight: bold;
}
.view-monitor-table_box .btn_change {
  display: block;
  margin: 0 auto;
}
.view-monitor-table_box .btn-line{
  margin-bottom: 4px;
  padding: 4px 16px;
}
.view-monitor-table_box .btn-link{
  display: block;
  text-decoration: underline;
}
.view-monitor-table_box .txt-center{
  text-align: center;
}

.platform-wrap{
  position: relative;
}
.platform-wrap table{
  position: relative;
  left: 0;
  top: 0;
  min-height: 75px;
}
.platform-wrap table td {
  border-radius: 0 !important;
}

.box-monitor {display:flex; border:1px solid #ddd; border-radius:10px; padding:20px; background-color:#fff; margin-top:10px;}
.box-monitor .area-room {display:flex; width:25%;}
.box-monitor .area-room .tag-round {
  display:inline-block;
  width:18px;
  height:18px;
  border-radius:50%;
  background-color:#888;
  color:#fff;
  text-align:center;
  font-size:13px;
  line-height:18px;
  margin-right:5px;
  position:relative;
  top:2px;
}
/* .box-monitor .area-room .data-name {
  font-size:15px; font-weight:bold;
} */
.box-monitor .area-room .data-user {
  font-size:14px;
  padding:5px 0;
}
.box-monitor .area-room .txt-message + .txt-message {margin-top:5px;}
.box-monitor .area-room .txt-message  {display:flex;}
.box-monitor .area-room .txt-message .component-category {width:25px; margin-right:5px;}
.box-monitor .area-room .data-txt {font-size:14px;}
.box-monitor .area-room .data-txt.txt-red {color:red;}
.box-monitor .area-room .data-num {margin-top:10px;}

.box-monitor .area-room>div {display: flex; width: 500px; align-items: flex-end}
.box-monitor .area-room .room-left {width: 240px; }
.box-monitor .area-room .room-left .data-user {font-size: 16px; font-weight: bold; line-height: 28px;}


/* -------------------------------- 빨간 줄 처리 -----------------------------------
.box-monitor .area-room .room-left .data-user {
  text-decoration: line-through;
  text-decoration-color: #f00;
  text-decoration-thickness: 2px;
}
*/

.box-monitor .area-room .room-right {width: 240px;}
.box-monitor .area-room .room-left span {display: block;}
.box-monitor .area-room .room-left span img {width: auto; height: 30px;  margin-bottom: 7px;
}
.box-monitor .area-room .room-left .data-name {font-size: 16px; font-weight: bold;}
.box-monitor .area-room .room-left .data-name span.mailState {
  display: inline-block;
  width: 45px;
  margin-bottom: 7px;
  text-align: center;
  font-size: 13px;
  padding: 3px 0;
  background-color: #555;
  color: #fff;
  font-weight: bold;
}


.box-monitor .area-day {flex:auto; margin-left: 170px;}
.box-monitor .area-day .days {font-size:16px; margin-bottom:10px;text-decoration: underline;}
.box-monitor .area-day .area-box{display:flex; gap: 15px;}
.box-monitor .area-day .area-box .box-in {width:150px;}
.box-monitor .area-day .area-box .box-in +.box-in {margin-left:10px;}
.box-monitor .area-day .area-box .box-in .data-day {text-align:center; font-size:12px; text-align:center;}
.box-monitor .area-day .area-box .box-status {background-color:#fafafa; border:1px solid #e4e4e4; padding:8px;}
.box-monitor .area-day .area-box .box-status .ui-status {display:flex; align-items: center;}
.box-monitor .area-day .area-box .box-status .ui-status .txt-tag {

  flex:none;
  margin-right:5px;
  display:inline-block;
  width:15px;
  height:15px;
  border-radius:50%;
  background-color:#888;
  font-size:10px;
  color:#fff;
  font-weight:bold;
  display:flex;
  align-items: center;
  justify-content: center;
}
.box-monitor .area-day .area-box .box-status .ui-status .data-name {display:inline-block; margin-right:5px;border-radius:2px; padding:2px 3px; font-size:11px; border:1px solid #ccc; background-color:#fff;}


.box-monitor .area-day .area-box .box-status .ui-status .txt-reservation {font-size:13px; margin-left:auto;}
.box-monitor .area-day .area-box .box-status .ui-status .txt-reservation.type-impossible {color:red;}

.box-monitor .area-buttons {display:flex; flex-direction: column;}
.box-monitor .area-buttons a {text-align:center;justify-content:center;}
.box-monitor .area-buttons a + a{margin-top:5px; }
.box-monitor .area-buttons a.type-error {background-color:red; color:#fff;}
.popup-monitor .table-option {display:flex; gap:4px;}
.popup-monitor .table-option .data-tag {background-color:#FF6A29; color:#fff; display:inline-block; padding:5px; border-radius:3px; font-weight:600;}
.popup-monitor .table-option .data-tag.type-cancel {background-color:gray; }
.popup-monitor .data-room {color:#FF6A29; font-size:24px; font-weight:bold; padding:10px 0;}
.popup-monitor .wrap-table+.wrap-table {margin-top:10px io !important;}
.popup-monitor .ui-memo {padding:10px 0; display:flex; align-items: center;}
.popup-monitor .ui-memo .component-search {margin-left:10px; flex:auto; width:100%;}
.popup-monitor .ui-memo .form-search {width:100%;}
.popup-monitor .ui-memo .memo-label {font-weight:600; flex:none;}




.popup-monitor .area-day {flex:auto; display:flex; width:100%;}
.popup-monitor .area-day .days {font-size:16px; margin-bottom:10px;text-decoration: underline;}
.popup-monitor .area-day .area-box{display:flex; flex-wrap:wrap;}
.popup-monitor .area-day .area-box .box-in { width:30%; margin:5px 10px;}

.popup-monitor .area-day .area-box .box-in .data-day {text-align:center; font-size:12px; text-align:center;}
.popup-monitor .area-day .area-box .box-status {background-color:#fafafa; border:1px solid #e4e4e4; padding:8px;}
.popup-monitor .area-day .area-box .box-status .ui-status {display:flex; align-items: center;}
.popup-monitor .area-day .area-box .box-status .ui-status .txt-tag {

  flex:none;
  margin-right:5px;
  display:inline-block;
  width:15px;
  height:15px;
  border-radius:50%;
  background-color:#888;
  font-size:10px;
  color:#fff;
  font-weight:bold;
  display:flex;
  align-items: center;
  justify-content: center;
}
.popup-monitor .area-day .area-box .box-status .ui-status .data-name {display:inline-block; margin-right:5px;border-radius:2px; padding:2px 3px; font-size:11px; border:1px solid #ccc; background-color:#fff;}
.popup-monitor .area-day .area-box .box-status .ui-status .txt-reservation.type-impossible {color:red;}
.txt-red {
  color: red;
}

.bookSDate { font-size: 11px; }
.back-waring { background: #ff8181; }
.back-cancel{ background: #ffe1e1; }
.back-gray{ background: #d3d3d3; }
.btn-reload { width: 72px;
  height: 34px;
  position: relative;
  left: 20px;
  top: 7px;
  border: 2px #9a9a9a solid;
}


/***************************************************************************************
   Sync
***************************************************************************************/
.sync_table {
  border: 1px solid #ddd
}

/***************************************************************************************
   Alarm System
***************************************************************************************/
.alarm-system {}
.alarm-system .sub-title {
  margin: 35px 0 0;
  padding-bottom: 16px;
  font-size: 20px;
  font-weight: 500;
}
.alarm-system .view-monitor-table {
  max-width: 100%;
  min-width: 100%;
}

.alarm-system .view-monitor-table.vertical {
  max-width: 600px;
  min-width: 600px;
}

.alarm-system .view-monitor-table th {
  text-align: center;
}

.alarm-system .view-monitor-table label {
  font-weight: normal;
}

.alarm-system .view-monitor-table input[type=text],
.alarm-system .view-monitor-table textarea{
  width: 100%;
  padding: 5px 5px;
}

.alarm-system .view-monitor-table .sub-options {
  margin-left: 20px;
}
.alarm-system .view-monitor-table label{
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}
.alarm-system .view-monitor-table input[type="radio"]{
  margin: 0;
}
.alarm-system .view-monitor-table .sub-options label:has(input[disabled]) {
  color: #aaa;
}
.alarm-system .view-monitor-table .sub-options input[type="radio"] {
  pointer-events: none;
}
.alarm-system .view-monitor-table .member-block {
  margin-top: 10px;
}
.member-select-container + .member-select-container {
  margin-top: 20px;
}

.alarm-system .view-monitor-table .file-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
}
.alarm-system .view-monitor-table .file-wrapper input[type="file"] {
  display: none;
}
.alarm-system .view-monitor-table .file-wrapper label {
  padding: 4px 8px;
  border: 1px solid #aaa;
  border-radius: 4px;
  background-color: #f9f9f9;
  cursor: pointer;
}
.alarm-system .view-monitor-table .file-name {
  color: #555;
  font-size: 0.9em;
}
.alarm-system .view-monitor-table .file-clear-btn {
  background: none;
  border: none;
  color: #007bff;
  cursor: pointer;
}
.alarm-system .view-monitor-table .txt-caution{
  color: #777;
}

/***************************************************************************************
   Image Slide Popup (slick slider)
***************************************************************************************/
.photo-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .7);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.photo-overlay.is-open {
  display: flex;
}

.photo-overlay .slick-dots {
  display: none !important;
}

.photo-overlay .slick-disabled {
  opacity: 0.3;
  cursor: default;
}

.photo-overlay .overlay-inner {
  position: relative;
  width: min(1100px, 92vw);
}

.photo-overlay .overlay-track .overlay-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.photo-overlay .overlay-track .overlay-slide img {
  width: 100%;
  max-width: 90%;
  max-height: 86vh;
  object-fit: contain;
}

.photo-overlay .overlay-close {
  z-index: 1;
  position: absolute;
  top: -80px;
  right: 0;
  font-size: 60px;
  color: #fff;
  padding: 8px 12px;
  border-radius: 8px;
  border: 0;
  cursor: pointer;
}

.no-scroll {
  overflow: hidden;
}

/* slick 기본 화살표 위치 조정 */
.photo-overlay .slick-prev,
.photo-overlay .slick-next {
  z-index: 1;
  width: 40px;
  height: 40px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

.photo-overlay .slick-prev {
  left: 14px;
}

.photo-overlay .slick-next {
  right: -26px;
}


/* arms */
.arms {}
.arms .hotel-list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.arms .hotel-list__item {
  position: relative;
  max-width: 250px;
  min-width: 250px;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid #E4E4E4;
  background: #FFF;
}
.arms .hotel-list__item .tit {
  position: relative;
  display: block;
  text-align: center;
  margin-bottom: 14px;
}
.arms .hotel-list__item .tit span {
  display: inline-block;
  max-width: calc(100% - 50px);
  font-size: 16px;
  font-weight: bold;
}
.arms .hotel-list__item .tit button {
  position: absolute;
  right: 0;
}
.arms .hotel-list__item .tit button .icon-lnb-option{
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url(../images/icon-lnb-option.png) no-repeat 0 0;
  vertical-align: top;
  background-size: 100% 100%;
}
.arms .hotel-list__item .btn-wrap {
  display: flex;
  gap: 10px;
}
.arms .hotel-list__item .btn-wrap a {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  margin-left: 0 !important;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  color: #333;
}
.arms .hotel-list__item .btn-wrap a:hover {
  background-color: #696969;
  border: 1px solid #696969;
  color: #fff;
  text-decoration: none;
}
.arms .managing-pop {
  z-index: 1;
  position: absolute;
  display: flex;
  flex-direction: column;
  gap: 4px;
  top: -40px;
  right: -60px;
  padding: 6px;
  border-radius: 6px;
  border: 1px solid #E4E4E4;
  background: #FFF;
}
.arms .managing-pop a {
  display: block;
  font-size: 12px;
}

.arms-calendar .section-tabs {
  display: flex;
  justify-content: center;
  align-items: center;
}

.arms-calendar .section-tabs em {
  font-size: 24px;
  font-weight: bold;
}

.arms-calendar .btn-page-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url(../images/svg/alarm-close.svg) no-repeat;
  background-size: 100% 100%;
}

.arms-calendar-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.arms-calendar-wrap .tit-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
}
.arms-calendar-wrap .tit-wrap .tit {
  width: calc((100% - 60px) / 7);
  display: block;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: #ddd;
  border-radius: 10px;
  padding: 4px 0;
}

.arms-calendar-wrap__item {
  width: calc((100% - 60px) / 7); /* gap 10px * (7-1) = 60px */
  border: 1px solid #333;
  text-align: center;
  padding: 8px;
  border-radius: 6px;
}

.arms-calendar-wrap__info {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.arms-calendar-wrap__info li {
  display: flex;
  align-items: center;
  padding: 6px 0;
  border-top: 1px solid #aaa;
}
.arms-calendar-wrap__info .top-wrap {
  justify-content: space-between;
  border-top: 0;

}
.arms-calendar-wrap__info .top-wrap label {
  margin-top: initial;
}

.arms-calendar-wrap__info .reserve-wrap {
  position: relative;
  justify-content: space-between;
}
.arms-calendar-wrap__info .reserve-wrap .btn-more {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../images/btn-more.png) no-repeat;
  background-size: 100% 100%;
}
.arms-calendar-wrap__info .reserve-wrap [class^="reserve"] {

}
.arms-calendar-wrap__info .reserve-wrap .reserve-available {
  color: #FF6A29;
}
.arms-calendar-wrap__info .reserve-wrap .reserve-closed {
  color: #2b542c;
}

.arms-calendar-wrap__info li.inventory-wrap {

}

.arms-calendar-wrap__info li.inventory-wrap .inventory {
  flex: 1;
  text-align: left;
}
.arms-calendar-wrap__info li.inventory-wrap .inventory em {

}
.arms-calendar-wrap__info li.inventory-wrap .inventory span {
  margin-left: 6px;
}
.arms-calendar-wrap__info li.inventory-wrap .add {
  position: relative;
  flex: 1;
  text-align: left;
}
.arms-calendar-wrap__info li.inventory-wrap .add em {
  color: #FF6A29;
}
.arms-calendar-wrap__info li.inventory-wrap .add span {
  margin-left: 6px;
  color: #FF6A29;
}

.arms-calendar-wrap__info li:nth-child(4) .reserve {
  text-align: left;
}
.arms-calendar-wrap__info li:nth-child(4) .reserve span {
  margin-left: 6px;
}

.arms-calendar-wrap__info .guest-wrap {
  flex-direction: column;
  padding: 0;
}
.arms-calendar-wrap__info .guest-wrap__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 0;
  width: 100%;
  border-bottom: 1px solid #ddd;
  cursor: pointer;
}
.arms-calendar-wrap__info .guest-wrap__item:last-child {
  border-bottom: 1px solid #aaa;
}
.arms-calendar-wrap__info .guest-wrap__item:hover {
  background-color: #eeecf9;
}
.arms-calendar-wrap__info .guest-wrap__item p {
  margin: 0;
  flex: 1;
  text-align: left;
  font-size: 12px;
}
.arms-calendar-wrap__info .guest-wrap__item p em {
}
.arms-calendar-wrap__info .guest-wrap__item p span {

}
.arms-calendar-wrap__info .memo-view-btn {
  font-size: 10px;
  color: #aaa;
  text-decoration: underline;
}
.arms-calendar-wrap__info .deadline-wrap {
  margin-top: auto;
  justify-content: center;
}
.arms-calendar-wrap__info .guest-wrap + .deadline-wrap {
  border-top: 0;
}
.arms-calendar-wrap__info .deadline-wrap button {
  font-size: 12px;
  font-weight: bold;
  text-decoration: underline;
}
.arms-calendar-wrap__info .more-wrap {
  position: relative;
  margin-top: auto;
  justify-content: space-between;
}
.arms-calendar-wrap__info .more-wrap button {
  font-size: 12px;
  font-weight: bold;
  text-decoration: underline;
}
.arms-calendar-wrap__info .deadline-wrap + .more-wrap {
  margin-top: initial;
}

/* arms 미니팝업 관련 */
.arms-calendar-wrap .mini-pop {
  z-index: 1;
  position: absolute;
  display: none;
  width: 250px;
  padding: 10px;
  border-radius: 6px;
  border: 1px solid #E4E4E4;
  background: #FFF;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.6);
}
.arms-calendar-wrap .mini-pop.is-open {
  display: block;
}
.arms-calendar-wrap .mini-pop__top {
  position: relative;
  display: flex;
  justify-content: space-between;
  font-weight: bold;
  margin-bottom: 10px;
}
.arms-calendar-wrap .mini-pop__top span {
  margin-left: 0 !important;
  color: #333 !important;
}
.arms-calendar-wrap .mini-pop__close {
  top: 10px;
  right: 10px;
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../images/svg/alarm-close.svg) no-repeat;
  background-size: 100% 100%;
}
.arms-calendar-wrap .mini-pop .info {
  font-size: 12px;
}

.arms-calendar-wrap__info li.inventory-wrap .add-pop {
  position: absolute;
  left: -110px;
}
.arms-calendar-wrap__info li.inventory-wrap .add-pop .select-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.arms-calendar-wrap__info li.inventory-wrap .add-pop .select-wrap .select-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 24px;
  padding: 0 10px;
  margin-left: 0 !important;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  color: #333;
}
.arms-calendar-wrap .reserve-more-pop {
  top: 30px;
}
.arms-calendar-wrap .reserve-more-pop .reserve-more-btn-wrap {
  display: flex;
  gap: 10px;
}
.arms-calendar-wrap .reserve-more-pop .reserve-more-btn-wrap button {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  margin-left: 0 !important;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  color: #333;
}
.arms-calendar-wrap .reserve-more-pop .reserve-more-btn-wrap button:hover {
  background-color: #696969;
  border: 1px solid #696969;
  color: #fff;
  text-decoration: none;
}
.arms-calendar-wrap .memo-pop.mini-pop {
  width: 180px;
  top: 0;
}
.arms-calendar-wrap .memo-pop.mini-pop .mini-pop__close{
  margin-left: auto;
  display: block;
}
.arms-calendar-wrap .setting-pop {
  top: 24px;
}
.arms-calendar-wrap .setting-pop .direct-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  margin-left: 0 !important;
  border: 1px solid #E4E4E4;
  background-color: #fff;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  color: #333;
  text-decoration: none;
  padding: 0 10px;
}
.arms-calendar-wrap .setting-pop .direct-btn:hover {
  background-color: #696969;
  border: 1px solid #696969;
  color: #fff;
  text-decoration: none;
}
.arms-calendar-wrap .setting-pop .memo-wrap {
  text-align: left;
  margin-top: 10px;
}
.arms-calendar-wrap .setting-pop .memo-wrap b {
  font-size: 12px;
  font-weight: 500;
  display: block;
  margin-bottom: 6px;
}
.arms-calendar-wrap .setting-pop .memo-wrap textarea {
  width: 100%;
}

.arms-calendar-wrap .cancel-pop {
  width: 200px;
  font-size: 12px;
}
.arms-calendar-wrap .cancel-pop .mini-pop__main li:last-child {
  border-bottom: 1px solid #aaa;
}

.popup-reserve-info .box-popup {
  width: 680px;
  top: 50%;
  left: 50%;
  padding: 24px 32px;
  transform: translate(-50%, -50%);
}
.popup-reserve-info dt {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: bold;
}
.popup-reserve-info ul li {}
.popup-reserve-info ul li em {}
.popup-reserve-info .textarea-wrap {
  display: flex;
  gap: 10px;
}
.popup-reserve-info textarea {
  flex: 1;
  margin-bottom: 0;
}
.popup-reserve-info textarea + button {
  padding: 20px;
  background-color: #ddd;
  border-radius: 6px;
}
.popup-reserve-info__footer {}
.popup-reserve-info__footer button {
  padding: 4px 20px;
  border-radius: 6px;
}
.popup-reserve-info__footer p {
  margin: 10px 0 0;
}
.monitoring .section-tabs,
.sync .section-tabs{
  display: flex;
  justify-content: center;
  align-items: center;
}
.monitoring .section-tabs em,
.sync .section-tabs em{
  font-size: 24px;
  font-weight: bold;
}
.monitoring .btn-page-close,
.sync .btn-page-close{
  position: absolute;
  top: 10px;
  right: 10px;
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url(../images/svg/alarm-close.svg) no-repeat;
  background-size: 100% 100%;
}



.market-table {
  overflow-x: auto;
}

.market-table table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
  color: #333;
}

.market-table th,
.market-table td {
  border: 1px solid #d9d9d9;
  padding: 0;
  vertical-align: middle;
}

.market-table thead th {
  background: #f3f3f3;
  font-weight: 600;
  text-align: center;
  height: 30px;
}

.market-table td {
  height: 44px;
  background: #fff;
}

.market-table .cell {
  height: 44px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
}

.market-table .grade {
  font-weight: 700;
  letter-spacing: 0.5px;
}

.market-table .meta {
  font-size: 11px;
  color: #666;
  line-height: 1;
}

.market-table .meta-danger {
  color: #d60000;
  font-weight: 700;
}

.market-table .is-selected {
  background: #d9ebff;
}

.market-table thead .is-selected {
  background: #d9ebff;
}

.market-table .col-action {
  width: 170px;
}

.market-table .action {
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 10px;
}

.market-table .action__select {
  width: 88px;
  height: 26px;
  border: 1px solid #bfbfbf;
  border-radius: 2px;
  background: #fff;
  font-size: 12px;
}

.market-table .action__btn {
  height: 26px;
  padding: 0 10px;
  border-radius: 2px;
  background: #555;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

.market-table .action__btn:active {
  transform: translateY(1px);
}