html {
    height: -webkit-fill-available !important;
}

body {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100vh; /* Use vh as a fallback for browsers that do not support Custom Properties */
    height: calc(var(--vh, 1vh) * 100) !important;
    font-family: 'Lato', 'Noto Sans KR', sans-serif;
    font-size: 14px;
    color: #111111;
    background: #fff;
    min-height: -webkit-fill-available !important;
  }
  
  body::after {
      position: absolute;
      width: 0;
      height: 0;
      overflow: hidden;
      z-index: -1;
      content:
          url(/images/logo.png) url(/images/icon_x.svg) url(/images/icon_x_blue.svg) url(/images/icon_pin_blue.svg) url(/images/icon_pin_red.svg) url(/images/icon_back.svg) url(/images/icon_back_on.svg) url(/images/icon_pin_black_outline.svg) url(/images/icon_coupon.svg) url(/images/icon_coupon_on.svg) url(/images/icon_crosshairs_on.svg);
  }
  
  ul, h1, h2, h3, h4, h5, h6 {
      margin: 0;
      padding: 0
  }
  html {
      /* 62.5% of 16px browser font size is 10px */
      font-size: 62.5%;
  }
  
  .d-flex {
      display: flex;
  }
  
  .align-item-center {
      align-items: center;
  }
  
  .justify-content-end {
      justify-content: flex-end;
  }
  
  .text-bold {
      font-weight: 600;
  }
  
  .input_hidden {
      display: none;
  }
  div,
  button,
  input,
  textarea {
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-size: 14px;
      outline: none;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      -webkit-overflow-scrolling: touch;
  }
  input,
  textarea,
  button,
  select,
  a {
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  
  /* Base for label styling */
  [type="checkbox"]:not(:checked),
  [type="checkbox"]:checked {
      position: absolute;
      left: -9999px;
  }
  
  [type="checkbox"]:not(:checked)+label,
  [type="checkbox"]:checked+label {
      position: relative;
      padding-left: 28px;
      cursor: pointer;
      overflow: hidden;
      text-overflow: ellipsis;
      margin-bottom: 0 !important;
  }
  
  /* checkbox aspect */
  [type="checkbox"]:not(:checked)+label:before,
  [type="checkbox"]:checked+label:before {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      width: 18px;
      height: 18px;
      border: 1px solid #41464b;
      background: #1b242c;
      box-shadow: none;
  }
  
  [type="checkbox"]:checked+label:before {
      border-color: #fff;
  }
  
  [type="checkbox"]:not(:checked):hover+label:before,
  [type="checkbox"]:checked:hover+label:before {
      border-color: #fff;
  }
  
  /* checked mark aspect */
  [type="checkbox"]:not(:checked)+label:after,
  [type="checkbox"]:checked+label:after {
      content: '✓';
      position: absolute;
      top: 2px;
      left: 1px;
      font-size: 14px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      width: 16px;
      height: 16px;
      line-height: 16px;
      text-align: center;
      color: #fff;
      background: transparent;
      transition: all .1s;
  }
  
  /* checked mark aspect changes */
  [type="checkbox"]:not(:checked)+label:after {
      opacity: 0;
      transform: scale(0);
  }
  
  [type="checkbox"]:checked+label:after {
      opacity: 1;
      transform: scale(1);
  }
  
  /* disabled checkbox */
  [type="checkbox"]:disabled:not(:checked)+label:before,
  [type="checkbox"]:disabled:checked+label:before {
      box-shadow: none;
      border-color: #41464b;
      background-color: #252b2f;
  }
  
  [type="checkbox"]:disabled:checked+label:after {
      color: #41464b;
  }
  
  [type="checkbox"]:disabled+label {
      color: #41464b;
  }
  
  
  [type="radio"]:not(:checked),
  [type="radio"]:checked {
      position: absolute;
      left: -9999px;
  }
  
  [type="radio"]:not(:checked)+label,
  [type="radio"]:checked+label {
      position: relative;
      padding-left: 28px;
      cursor: pointer;
      margin-bottom: 0 !important;
  }
  
  /* radio aspect */
  [type="radio"]:not(:checked)+label:before,
  [type="radio"]:checked+label:before {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      width: 18px;
      height: 18px;
      border: 1px solid #666666;
      background: #666666;
      border-radius: 12px;
      -moz-border-radius: 12px;
      -webkit-border-radius: 12px;
      box-shadow: none;
  }
  
  [type="radio"]:checked+label:before {
      border-color: #fff;
  }
  
  [type="radio"]:not(:checked):hover+label:before,
  [type="radio"]:checked:hover+label:before {
      border-color: #fff;
  }
  
  /* checked mark aspect */
  [type="radio"]:not(:checked)+label:after,
  [type="radio"]:checked+label:after {
      content: '';
      position: absolute;
      top: 5px;
      left: 5px;
      border: 4px solid #fff;
      border-radius: 50%;
      -moz-border-radius: 50%;
      -webkit-border-radius: 50%;
      background: transparent;
      transition: all .1s;
  }
  
  /* checked mark aspect changes */
  [type="radio"]:not(:checked)+label:after {
      opacity: 0;
      transform: scale(0);
  }
  
  [type="radio"]:checked+label:after {
      opacity: 1;
      transform: scale(1);
  }
  
  /* disabled radio */
  [type="radio"]:disabled:not(:checked)+label:before,
  [type="radio"]:disabled:checked+label:before {
      box-shadow: none;
      border-color: #41464b;
      background-color: #252b2f;
  }
  
  [type="radio"]:disabled:checked+label:after {
      color: #41464b;
  }
  
  [type="radio"]:disabled+label {
      color: #41464b;
  }
  
  .c-scrollbar::-webkit-scrollbar {
      width: 10px;
      background-color: transparent;
  }
  
  .c-scrollbar::-webkit-scrollbar-track {
      background-color: transparent;
  }
  
  .c-scrollbar::-webkit-scrollbar-thumb {
      border: 3px solid transparent;
      background-color:rgb(176 244 255 / 90%);
      background-clip: padding-box;
      border-radius: 10px;
  }
  
  .fit_input_normal {
      width: 100%;
      height: 35px;
      line-height: 35px;
      padding: 0 15px;
      background: #fbfbfb;
      border: 1px solid #999;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-size: 14px !important;
      color: #000000;
      vertical-align: middle;
      box-shadow: inset 1px 2px 4px rgba(0, 0, 0, 0.25);
  }
  
  .fit_input_normal:hover{
      border: 1px solid #FBEEF0;
  }
  
  .fit_input_normal::placeholder {
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      color: #a6a6a6;
  }
  
  .fit_input_normal:focus {
      border: 1px solid #FBEEF0;
  }
  
  .fit_input_normal:disabled {
      color: #6c6c6c;
      background: #cacaca;
      border: 1px solid #4f5457;
  }
  
  .fit_input_round {
      width: 100%;
      height: 46px;
      display: flex;
      align-items: center;
      padding: 0px 24px 0 42px;
      background: #fff;
      border: 1px solid #f4f4f4;
      border-radius: 23px;
      -moz-border-radius: 23px;
      -webkit-border-radius: 23px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-size: 14px !important;
      color: #111;
      box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15);
      text-overflow: ellipsis;
  }
  .search_box_ft {
      position: absolute;
      top: -60px;
      width: 86%;
      background: #fff;
      right: 0;
      transition: opacity 0.5s linear, transform 0.5s linear;
      opacity: 1;
  }
  .search_box_sc{
      position: absolute;
      top: 0px;
      left: 0;
  }
  
  .fit_input_round:hover {
      border: 1px solid #f4f4f4;
  }
  
  .fit_input_round::placeholder {
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      color: #ccc;
  }
  
  .fit_input_round:focus {
      border: 1px solid #eee;
  }
  
  .fit_input_round:disabled {
      color: #6c6c6c;
      background: #cacaca;
      border: 1px solid #4f5457;
  }
  
  .font-roboto {
      font-family: 'Roboto';
  }
  
  .pagination,
  .pagination li {
      list-style: none;
      margin: 0;
      padding: 0;
  }
  
  .pagination .page-item {
      display: inline-block;
      padding: 0 10px;
      min-width: 10px;
      height: 30px;
      line-height: 30px;
      text-align: center;
      font-size: 14px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      color: #000000;
      cursor: pointer;
  }
  
  .pagination .page-item:hover {
      color: #002756;
  }
  
  .pagination .page-item.on {
      color: #002756;
      cursor: default;
  }
  
  .btn_transparent {
      margin: 0;
      padding: 5px 10px 4px 10px;
      border: 0;
      background: transparent;
      font-weight: bold;
      color: #000000;
      cursor: pointer;
  }
  
  .btn_transparent:hover,
  .btn_transparent.on {
      color:  #002756;
  }
  
  .btn_cancel {
      width: 22px;
      height: 22px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: normal;
      color: #1111;
      background: transparent url(/images/icon_search_cancel.svg) center no-repeat;
      outline: none;
      cursor: pointer;
  }
  
  .btn_coupon {
      width: 30px;
      height: 30px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: normal;
      color: #1111;
      background: transparent url(/images/icon_coupon.svg) center no-repeat;
      outline: none;
      cursor: pointer;
      position: absolute;
      /* top: -54px; */
  }
  
  .btn_coupon:hover,
  .btn_coupon.on {
      background: transparent url(/images/icon_coupon_on.svg) center no-repeat;
  }
  
  .btn_back {
      width: 32px;
      height: 32px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: normal;
      background: transparent url(/images/icon_back_default.png) center no-repeat;    
      background-size: 32px 32px;
      position: absolute;
      left: 9px;
      cursor: pointer;
  }
  
  .btn_back.on,
  .btn_back.active {
      background: transparent url(/images/icon_back.svg) center no-repeat;
  }
  .btn_circleclose {
      width: 36px;
      height: 36px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: normal;
      color: #1111;
      background: #fff url(/images/icon_x.svg) center no-repeat;
      border-radius: 18px;
      -moz-border-radius: 18px;
      -webkit-border-radius: 18px;
      cursor: pointer;
  }
  
  .btn_circleclose.closeRoutePathButton {
      color: #fff;
      background:  #002756 url(/images/icon_x_red.svg) center no-repeat;
  }
  
  .btn_circleclose:hover,
  .btn_circleclose.on {
      background: #fff url(/images/icon_x_blue.svg) center no-repeat;
  }
  
  .btn_circleblue {
      z-index: 1;
      width: 46px;
      height: 46px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: bold;
      color: #676767;
      background: #fff;
      border-radius: 23px;
      -moz-border-radius: 23px;
      -webkit-border-radius: 23px;
      cursor: pointer;
  }
  
  .btn_circlewhite {
      width: 46px;
      height: 46px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: bold;
      color: #B7B7B7;
      background: #fff;
      border-radius: 23px;
      -moz-border-radius: 23px;
      -webkit-border-radius: 23px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
      cursor: pointer;
  }
  
  .btn_circlewhite.on {
      color:  #002756;
      background: #ffffff;
  }
  
  .btn_location {
      width: 46px;
      height: 46px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: bold;
      color: #b7b7b7;
      background: #fff url(/images/icon_crosshairs.svg) center no-repeat;
      border-radius: 23px;
      -moz-border-radius: 23px;
      -webkit-border-radius: 23px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
      cursor: pointer;
  }
  
  .btn_location.on {
      background:#fff url(/images/icon_crosshairs_on.svg) center no-repeat;
  }
  .btn_location.on_ct {
      background:#fff url(/images/icon_crosshairs_on_ct.svg) center no-repeat;
  }
  
  .btn_location.off,
  .btn_circlewhite.off {
      cursor: default;
      pointer-events: none;
      opacity: 0.5;
  }
  
  .btn_building {
      width: 46px;
      height: 46px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      color: #b7b7b7;    
      background: #fff url(/images/bx_building.svg) center no-repeat;
      border-radius: 23px;
      -moz-border-radius: 23px;
      -webkit-border-radius: 23px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
      cursor: pointer;
      position: relative;
      flex-shrink: 0;
  }
  .btn_white {
      width: 100%;
      height: 35px;
      margin: 0;
      padding: 0 20px;
      border: none;
      font-size: 14px !important;
      font-weight: bold;
      color: #000000;
      background: #fff;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      cursor: pointer;
  }
  
  .btn_white:hover,
  .btn_white.on {
      color: #fff;
      background:  #BDBDBD;
  }
  
  .btn_white:disabled,
  .btn_white.off {
      color: #979c9e;
      background: #6c7276;
      cursor: default;
  }
  
  .btn_keywordtip {
      float: left;
      height: 46px;
      display: flex;
      align-items: center;
      margin: 8px 10px 8px 0;
      padding: 0 20px;
      border: 1px solid #484848;
      font-size: 16px !important;
      font-weight: normal;
      color: #484848;
      background: #fff;
      border-radius: 23px;
      -moz-border-radius: 23px;
      -webkit-border-radius: 23px;
      outline: none;
      cursor: pointer;
  }
  
  .btn_keywordtip:hover,
  .btn_keywordtip.on {
      color:  #002756;
      border: 1px solid  #002756;
  }
  
  .btn_keywordtip:disabled,
  .btn_keywordtip.off {
      color: #979c9e;
      background: #6c7276;
      cursor: default;
  }
  
  .btn_whiteround {
      height: 41px;
      display: flex;
      align-items: center;
      margin: 0;
      padding: 0 20px;
      border: 1px solid #f4f4f4;
      font-size: 14px !important;
      font-weight: bold;
      color: #222;
      background: #fff;
      border-radius: 22px;
      -moz-border-radius: 22px;
      -webkit-border-radius: 22px;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
      outline: none;
      cursor: pointer;
  }
  
  .btn_whiteround.on {
      color: #fff;
  }
  
  .btn_whiteround:disabled,
  .btn_whiteround.off {
      color: #979c9e;
      background: #6c7276;
      cursor: default;
  }
  
  .btn_wround_blackline {
      width: 100%;
      height: 40px;
      margin: 0;
      padding: 0 20px;
      border: 1px solid #111;
      font-size: 14px !important;
      font-weight: normal;
      color: #111;
      background: #fff;
      border-radius: 20px;
      -moz-border-radius: 20px;
      -webkit-border-radius: 20px;
      cursor: pointer;
  }
  
  .btn_wround_blackline:hover,
  .btn_wround_blackline.on {
      color: #002756;
      border: 1px solid #002756;
  }
  
  .btn_wround_blackline:disabled,
  .btn_wround_blackline.off {
      color: #979c9e;
      background: #6c7276;
      cursor: default;
  }
  .btn_start, .btn_end {
      width: 100%;
      height: 40px;
      margin: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: normal;
      border-radius: 20px;
      -moz-border-radius: 20px;
      -webkit-border-radius: 20px;
      cursor: pointer;
  }
  .btn_blueround {
      width: 100%;
      height: 40px;
      margin: 0;
      padding: 0 20px;
      border: 0;
      font-size: 14px !important;
      font-weight: normal;
      border-radius: 20px;
      -moz-border-radius: 20px;
      -webkit-border-radius: 20px;
      cursor: pointer;
  }
  
  .btn_blueround.on {
      background: #02adfb;
  }
  
  .btn_blueround:disabled,
  .btn_blueround.off,
  .btn_search_route.off
   {
      color: #979c9e;
      background: #6c7276;
      cursor: default;
      pointer-events: none;
  }
  .btn_blueround.hiden {
      display: none;
  }
  
  .btn_dkblue_line {
      width: 100%;
      height: 35px;
      margin: 0;
      padding: 0 20px;
      border: 1px solid #fff;
      font-size: 14px !important;
      font-weight: bold;
      color: #fff;
      background: #444444;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      cursor: pointer;
  }
  
  .btn_dkblue_line:hover,
  .btn_dkblue_line.on {
      color: #000000;
      background: #fff;
  }
  
  .btn_dkblue_line:disabled,
  .btn_dkblue_line.off {
      color: #979c9e;
      background: #6c7276;
      cursor: default;
  }
  
  .btn_dkblue {
      width: 100%;
      height: 35px;
      margin: 0;
      padding: 0 20px;
      border: 1px solid  #002756 ;
      font-size: 14px !important;
      font-weight: bold;
      color: #fff;
      background:  #002756 ;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      cursor: pointer;
      isolation: isolate;
  }
  
  .btn_dkblue:hover,
  .btn_dkblue.on {
      color: #000000;
      background: #fff;
      transition: 0.4s;
  }
  
  .btn_dkblue:disabled,
  .btn_dkblue.off {
      color: #979c9e;
      background: #E6E6E6;
      cursor: default;
      border:none
  }
  
  .btn_search {
      width: 35px;
      height: 35px;
      margin: 0;
      padding: 0;
      border: 0;
      background: transparent;
      font-size: 16px;
      color: #333;
      cursor: pointer;
  }
  
  .btn_search:hover,
  .btn_search.on {
      color: #dc0707;
  }
  
  .btn_search:disabled,
  btn_search.off {
      color: #979c9e;
      cursor: default;
  }
  
  .btn_search_close {
      display: none;
      width: 28px;
      height: 28px;
      margin: 0;
      padding: 0;
      border: 0;
      background: transparent;
      font-size: 16px;
      color: #959595;
      cursor: pointer;
  }
  
  .btn_search_close:hover,
  .btn_search_close.on {
      color: #000000;
  }
  
  .btn_search_close:disabled,
  .btn_search_close.off {
      color: #000000;
      cursor: default;
  }
  
  .poi_infobox {
      position: relative;
      width: 100%;
      height: 100%;
      padding: 3px;
      margin-bottom: 15px;
      background: #000;
      border: 1px solid #fff;
      border-radius: 4px;
      margin-left: -50%;
      margin-top: -100%;
      text-align: initial;
  }
  
  .poi_infobox .btm_triangle {
      border-top: 10px solid #fff;
      border-left: 8px solid transparent;
      border-right: 8px solid transparent;
      border-bottom: 0px solid transparent;
      content: "";
      position: absolute;
      bottom: -10px;
      left: calc(50% - 5px);
  }
  
  .poi_infobox .btm_triangle .bt_inside {
      border-top: 9px solid #000;
      border-left: 7px solid transparent;
      border-right: 7px solid transparent;
      border-bottom: 0px solid transparent;
      content: "";
      position: absolute;
      margin: -11px 0 0 -7px;
  }
  
  .poi_infobox .pi_content {
      position: relative;
  }
  
  
  .white_link {
      font-size: 14px;
      font-weight: bold;
      text-decoration: none;
      color: #fff;
      outline: none;
      background: transparent;
      padding: 2px;
  }
  
  .white_link:link,
  .white_link:visited {
      color: #fff;
  }
  
  .white_link:hover,
  .white_link:active {
      color:  #002756;
  }
  
  
  #signin-frame {
      position: absolute;
      display: flex;
      justify-content: center;
      align-items: center;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
  }
  
  #signin-box {
      width: 500px;
      padding: 60px 100px 30px 100px;
      border: 1px solid #444444;
      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
  }
  
  #logo-white {
      margin: 0 auto;
      height: 130px;
      background: url(/images/logo_d.png) no-repeat center;
      background-size: contain;
  }
  
  #copy-text {
      width: 100%;
      padding: 15px 0 40px 0;
      font-size: 18px;
      color: #000;
      text-align: center;
      line-height: 28px;
  }
  
  #signin-box .form {
      width: 100%;
      padding-bottom: 10px;
  }
  
  #signin-box .btn {
      width: 100%;
      padding: 10px 0 30px 0;
  }
  
  #admin_gnb {
      position: fixed;
      display: flex;
      align-items: center;
      height: 60px;
      background: #fff;
      box-shadow: 0px 2px 4px rgb(0 0 0 / 20%);
      z-index: 99;
      width: 100%;
  }
  
  .gnb_logo {
      display: flex;
      padding: 0 20px;
  }
  
  .gnb_rightside {
      position: absolute;
      display: flex;
      align-items: center;
      top: 0;
      right: 20px;
      bottom: 0;
  }
  
  .gnb_menu {
      display: flex;
  }
  
  .gnb_menu .gm_item {
      padding: 8px 10px;
      margin: 0 5px;
      font-size: 14px;
      font-weight: 600;
      color: #111111;
      cursor: pointer;
  }
  
  .gnb_menu .gm_item:hover,
  .gnb_menu .gm_item.on {
      color:  #002756 ;
  }
  
  .gnb_my {
      display: flex;
      margin-left: 20px;
  }
  
  .gnb_my .gm_info {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 38px;
      height: 38px;
      background:  #002756 ;
      font-size: 18px;
      font-weight: bold;
      color: #fff;
      border-radius: 19px;
      -moz-border-radius: 19px;
      -webkit-border-radius: 19px;
      cursor: pointer;
  }
  
  .gnb_my .gm_info:hover {
      background:  #002756;
  }
  
  .left_side {
      position: relative;
      display: flex;
  }
  
  .right_side {
      position: absolute;
      right: 0;
  }
  
  .form_wrap {
      position: relative;
      display: inline-flex;
      width: 250px;
  }
  
  .form_wrap.w150 {
      width: 150px;
  }
  .form_wrap.w300 {
      width: 300px;
  }
  .form_wrap.search {
      width: 300px;
  }
  
  .form_wrap.search input {
      padding-right: 35px;
  }
  
  .form_wrap.search .btn_search {
      position: absolute;
      right: 0;
  }
  
  .form_wrap.search .btn_search_close {
      position: absolute;
      right: 35px;
      height: 100%;
  }
  
  .inside_text {
      display: inline-flex;
      align-items: center;
      padding: 0 5px;
  }
  
  .form_row {
      position: relative;
      display: flex;
      align-items: center;
      height: 45px;
      margin: 0 !important;
      padding: 0 10px !important;
      text-align: initial;
  }
  
  .form_row.textform {
      height: initial;
      padding: 5px 10px !important;
  }
  
  .form_row.textform textarea {
      line-height: 26px;
  }
  
  .form_row .form_text {
      display: inline-flex;
      align-items: center;
      width: 150px;
      color: #fff;
      cursor: default;
  }
  
  .form_row .form_elm {
      display: inline-flex;
      align-items: center;
      width: calc(100% - 150px);
      color: #fff;
  }
  
  .form_row .form_msg {
      padding: 0 10px;
      color: #999;
      font-size: 13px;
      cursor: default;
  }
  
  .form_row .form_msg.on {
      color: #FBEEF0;
  }
  
  .preview_form {
      position: absolute;
      top: 0;
      right: -310px;
      width: 300px !important;
      height: 600px;
      margin: 0 !important;
      background: transparent url(/images/frame_phone.svg) top left no-repeat;
      background-size: contain;
  }
  
  .preview_form .pf_background {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1;
  }
  
  .preview_form .pf_landing {
      position: absolute;
      top: 18px;
      left: 20px;
      right: 20px;
      bottom: 15px;
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      border-radius: 15px;
      -moz-border-radius: 15px;
      -webkit-border-radius: 15px;
      z-index: 2;
  }
  
  .preview_form .pf_coupon_back {
      position: absolute;
      top: 40px;
      left: 20px;
      right: 20px;
      bottom: 18px;
      background: transparent url(/images/frame_coupon_back.png) center no-repeat;
      background-size: cover;
      border-radius: 20px;
      -moz-border-radius: 20px;
      -webkit-border-radius: 20px;
      z-index: 1;
  }
  
  .preview_form .pf_content {
      position: absolute;
      left: 30px;
      right: 30px;
      bottom: 28px;
      z-index: 2;
  }
  
  .preview_form .pf_content .pc_link {
      position: relative;
      display: flex;
      justify-content: right;
      padding-bottom: 7px;
  }
  
  .preview_form .pf_content .pc_link a {
      font-size: 12px !important;
  }
  .preview_form .pf_content .pc_link a:hover {
      color:  #002756;
  }
  
  .preview_form .pf_content .pc_box {
      position: relative;
      padding: 15px;
      background: #fff;
      border-radius: 16px;
      -moz-border-radius: 16px;
      -webkit-border-radius: 16px;
  }
  
  .preview_form .pf_content .pc_img {
      position: relative;
      width: 100%;
      height: 110px;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      border-radius: 6px;
      -moz-border-radius: 6px;
      -webkit-border-radius: 6px;
      margin-bottom: 12px;
  }
  
  .preview_form .pf_content .pc_title {
      font-size: 13px;
      font-weight: bold;
      color: #111;
      line-height: 20px;
      word-break: break-all;
      text-align: center;
      margin-bottom: 5px;
  }
  
  .preview_form .pf_content .pc_desc {
      font-size: 11px;
      font-weight: normal;
      color: #111;
      line-height: 14px;
      text-align: left;
      word-break: break-all;
      margin-bottom: 5px;
      max-height: 120px;
      overflow: auto;
  }
  
  .preview_form .pf_content .pc_period {
      font-size: 10px;
      font-weight: normal;
      color:  #002756;
      line-height: 14px;
      text-align: center;
  }
  
  .preview_form .pf_content .pc_period .text {
      font-size: 10px;
      margin-bottom: 4px;
  }
  
  .preview_form .pf_content .pc_period .date {
      font-size: 10px;
      font-weight: bold;
  }
  
  .preview_form .pf_content .pc_code {
      min-height: 40px;
      margin-top: 10px;
      word-break: break-all;
      max-height: 100px;
      overflow: auto;
  }
  
  .preview_form .pf_content .pc_btn {
      padding-top: 14px;
  }
  
  .preview_form .pf_content .pc_btn button {
      height: 36px;
      font-size: 13px !important;
  }
  
  .hide {
      display: none;
  }
  
  .show {
      display: initial;
  }
  
  #mapping_frame, #poi_frame {
      position: absolute;
      top: 60px;
      left: 0;
      right: 0;
      bottom: 0;
      background: #fff;
      z-index: 5;
      overflow: hidden;
  }
  
  #mapping_frame .mf_infobar, #poi_frame .pf_infobar {
      position: relative;
      display: flex;
      align-items: center;
      height: 50px;
      background: #f4f4f4;
      box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2);
      z-index: 3;
  }
  
  
  #mapping_frame .mf_infobar .mi_title {
      padding-left: 20px;
      font-size: 16px;
      color: #000000;
  }
  
  #mapping_frame .mf_infobar .mi_title strong {
      color: #000;
  }
  
  #mapping_frame .mf_infobar .mi_building{
      position: absolute;
      display: flex;
      align-items: center;
      top: 0;
      right: 200px;
      bottom: 0;
      width: 170px;
  }
  
  #mapping_frame .mf_infobar .mi_floor {
      position: absolute;
      display: flex;
      align-items: center;
      top: 0;
      right: 70px;
      bottom: 0;
      max-width: 120px;
  }
  
  #poi_frame .pf_infobar .pi_floor {
      position: absolute;
      display: flex;
      align-items: center;
      top: 0;
      right: 80px;
      bottom: 0;
      width: 120px;
  }
  #mapping_frame .mf_infobar .mi_floor .form_wrap .choices .choices__inner,
  #poi_frame .pf_infobar .pi_floor .form_wrap .choices .choices__inner{
      max-width: 125px;
  }
  #poi_frame .pf_infobar .pi_title {
      margin-left: 20px;
  }
  #poi_frame .pf_infobar .pi_language {
      position: absolute;
      display: flex;
      align-items: center;
      top: 0;
      right: 31.5rem;
      bottom: 0;
      width: 16rem;
  }
  
  #poi_frame .pf_infobar .mi_building {
      position: absolute;
      display: flex;
      align-items: center;
      top: 0;
      right: 15.6rem;
      bottom: 0;
      width: 16rem;
  }
  
  #mapping_frame .mf_infobar .mi_btn,
  #poi_frame .pf_infobar .pi_btn {
      position: absolute;
      display: flex;
      align-items: center;
      top: 0;
      right: 20px;
      bottom: 0
  }
  
  #mapping_frame .mf_infobar .mi_btn button,
  #poi_frame .pf_infobar .pi_btn button {
      font-size: 22px;
  }
  
  #mapping_frame .mf_maparea,
  #poi_frame .pf_maparea {
      position: absolute;
      top: 50px;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1;
  }
  
  #mapping_coord_frame, #poi_coord_frame {
      position: absolute;
      top: 50px;
      right: 0;
      bottom: 0;
      background: #444444;
      width: 350px;
      z-index: 2;
      overflow: hidden;
  }
  
  #mapping_coord_frame .mc_title {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 60px;
      font-size: 15px;
      font-weight: bold;
      color: #fff;
  }
  
  #mapping_coord_frame .mc_contents, #poi_coord_frame .poi_contents {
      position: absolute;
      top: 60px;
      left: 10px;
      right: 0;
      bottom: 120px;
      overflow-y: scroll;
  }
  
  #mapping_coord_frame .mc_contents.modify {
      bottom: 180px;
  }
  
  #mapping_coord_frame .mc_buttons, #poi_coord_frame .pc_buttons {
      position: absolute;
      left: 10px;
      right: 10px;
      bottom: 10px;
  }
  
  #mapping_coord_frame .mc_buttons div {
      position: relative;
      display: flex;
      align-items: center;
      height: 50px;
      padding: 0 10px;
  }
  
  #mapping_coord_frame .mc_buttons button {
      width: 100%;
      height: 40px;
      border-radius: 5px;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
  }
  
  #mapping_coord_frame .mc_buttons .mappingDeleteButton {
      color: #EB7373;
  }
  
  .angle-message.d-none {
      display: none;
  }
  
  .angle-message {
      font-size: 11px;
      padding: 0 10px;
      color: #F5EC0A;
  }
  
  .angle-message p {
      margin-bottom: 0;
  }
  
  .mc_form {
      position: relative;
      margin: 0;
      padding: 5px 10px 10px 10px;
  }
  
  .mc_form .mf_titlebar,.pc_form .pf_titlebar {
      position: relative;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding-right: 10px;
      height: 35px;
      font-size: 14px;
      font-weight: normal;
      color: #fff;
  }
  
  .mc_form .mf_row {
      position: relative;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 10px;
      height: 45px;
  }
  
  .mc_form .mf_row .mr_left {
      display: inline-flex;
      font-size: 13px;
      color: #ccc;
  }
  
  .mc_form .mf_row .mr_right {
      display: inline-flex;
      width: 200px;
  }
  
  .mc_form .mf_titlebar .mr_left {
      display: inline-flex;
  }
  
  .mc_form .mf_titlebar .mr_right {
      display: inline-flex;
      justify-content: right;
  }
  
  .mc_form .mf_padrow {
      position: relative;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 10px 10px 10px;
  }
  .pc_form .pf_padrow{
      position: relative;
      justify-content: space-between;
      align-items: center;
      overflow: hidden;
  }
  #couponlist_frame {
      position: absolute;
      top: 60px;
      left: 0;
      right: 0;
      bottom: 0;
      background: #fff;
      z-index: 5;
      overflow: hidden;
  }
  
  #contents_frame {
      position: absolute;
      min-width: 100%;
      top: 60px;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1;
      overflow: hidden;
      scroll-y: auto;
  }
  
  .top_area {
      position: relative;
      padding: 30px 30px 20px 30px;
  }
  
  .list_area {
      position: relative;
      padding: 0 30px 40px 30px;
  }
  
  .top_area .location {
      display: flex;
      align-items: center;
      padding-bottom: 10px;
      font-size: 16px;
      color: #000000;
  }
  
  .top_area .location .current {
      font-weight: bold;
      line-height: 25px;
      color:  #002756;
  }
  
  .top_area .location button {
      padding: 0;
      font-size: 16px;
      line-height: 25px;
  }
  
  .top_area .right_side {
      top: 45px;
      right: 30px;
  }
  
  .list_area .la_info {
      position: relative;
      padding-bottom: 15px;
      font-size: 13px;
      color: #666666;
  }
  
  .list_area .la_header {
      position: relative;
      display: flex;
      border-top: 1px solid #444444;
      border-bottom: 1px solid #444444;
      padding-right: 5px;
  }
  
  .list_area .la_body .lb_item {
      position: relative;
      display: flex;
      border-bottom: 1px solid #999999;
  }
  
  .list_area .la_body .lb_item.off {
      background: #f4f4f4;
  }
  
  .list_area .la_header>div,
  .list_area .la_body .lb_item>div {
      position: relative;
      display: inline-flex;
      justify-content: center;
      align-items: center;
      padding: 0 5px;
      min-height: 48px;
      overflow: hidden;
      font-size: 14px;
      color: #000000;
      text-align: center;
  }
  
  list_area .la_body .lb_item>div {
      height: 58px;
  }
  
  .list_area .la_header .lh_number,
  .list_area .la_body .lb_item .li_number {
      width: 100px;
  }
  .list_area .la_header .lh_rgpoi,
  .list_area .la_body .lb_item .li_rgpoi,
  .list_area .la_body .lb_item .li_cvpoi,
  .list_area .la_header .lh_floor,
  .list_area .la_body .lb_item .li_floor {
      width: 170px;
  }
  .list_area .la_header .lh_cvpoi {
      width: 170px;
  }
  .list_area .la_header .lh_cbpoi,
  .list_area .la_body .lb_item .li_cbpoi {
      width: 200px;
  }
  .list_area .la_header .lh_lspoi, 
  .list_area .la_body .lb_item .li_lspoi {
      width: 122px;
  }
  .list_area .la_header .lh_ptitle,
  .list_area .la_body .lb_item .li_ptitle {
      width: calc(100% - 800px);
  }
  .list_area .la_header .lh_catepoi,
  .list_area .la_header .lh_cbpoi2,
  .list_area .la_header .lh_cvpoi2,
  .list_area .la_body .lb_item .li_cbpoi2,
  .list_area .la_body .lb_item .li_cvpoi2,
  .list_area .la_body .lb_item .li_pcate
  {
      width: 200px;
  }
  
  .list_area .la_header .lh_s_status,
  .list_area .la_body .lb_item .li_s_status,
  .list_area .la_body .lb_item .li_mapping {
      width: 100px;
      text-align: center;
  }
  .list_area .la_header .lh_mapping {
      width: 103px;
      text-align: center;
  }
  
  .list_area .la_body .lb_item .li_mapping {
      justify-content: center;
  }
  
  .list_area .la_header .lh_grade,
  .list_area .la_body .lb_item .li_grade {
      width: 180px;
  }
  
  .list_area .la_header .lh_stype,
  .list_area .la_body .lb_item .li_stype{
      width: 111px;
      text-align: center;
  }
  
  .list_area .la_header .lh_ttype,
  .list_area .la_body .lb_item .li_ttype {
      width: 170px;
  }
  
  .list_area .la_header .lh_email,
  .list_area .la_body .lb_item .li_email {
      width: calc(100% - 850px);
  }
  
  .lh_suisetting {
      width: 145px
  }
  .list_area .la_body .lb_item .li_sname,
  .list_area .la_header .lh_sname {
      width: calc(100% - 1060px);
  }
  .list_area .la_header .li_sname_mp,
  .list_area .la_body .lb_item .li_sname_mp {
      width: calc(100% - 840px);
  }
  
  .list_area .la_header .lh_sname2,
  .list_area .la_body .lb_item .li_sname2 {
      width: calc(100% - 1080px);
  }
  
  .list_area .la_header .lh_mapname,
  .list_area .la_body .lb_item .li_mapname {
      width: 300px;
  }
  
  .list_area .la_header .lh_mapname2,
  .list_area .la_body .lb_item .li_mapname2 {
      width: 290px;
  }
  
  .list_area .la_header .lh_status,
  .list_area .la_body .lb_item .li_status {
      width: 180px;
  }
  .list_area .la_header .lh_slogo,
  .list_area .la_header .lh_mapqr,
  .list_area .la_body .lb_item .li_slogo,
  .list_area .la_body .lb_item .li_mapqr {
      width: 120px;
  }
  
  .list_area .la_header .lh_regdate,
  .list_area .la_header .lh_logindate,
  .list_area .la_body .lb_item .li_regdate,
  .list_area .la_body .lb_item .li_logindate {
      width: 200px;
  }
  
  .list_area .la_header .lh_tcoupon,
  .list_area .la_header .lh_pucoupon,
  .list_area .la_header .lh_pscoupon,
  .list_area .la_header .lh_tevent,
  .list_area .la_header .lh_puevent,
  .list_area .la_header .lh_psevent,
  .list_area .la_body .lb_item .li_tcoupon,
  .list_area .la_body .lb_item .li_pucoupon,
  .list_area .la_body .lb_item .li_pscoupon,
  .list_area .la_body .lb_item .li_tevent,
  .list_area .la_body .lb_item .li_puevent,
  .list_area .la_body .lb_item .li_psevent {
      width: 130px;
  }
  
  .list_area .la_body .lb_item .li_tcoupon,
  .list_area .la_body .lb_item .li_pucoupon,
  .list_area .la_body .lb_item .li_pscoupon,
  .list_area .la_body .lb_item .li_tevent,
  .list_area .la_body .lb_item .li_puevent,
  .list_area .la_body .lb_item .li_psevent {
      justify-content: center;
  }
  
  .list_area .la_header .lh_title,
  .list_area .la_body .lb_item .li_title {
      width: 320px;
  }
  
  .list_area .la_header .lh_linkurl,
  .list_area .la_body .lb_item .li_linkurl {
      width: calc(100% - 1150px);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      justify-content: left;
  }
  
  .list_area .la_header .lh_ctype,
  .list_area .la_header .lh_ptype,
  .list_area .la_body .lb_item .li_ctype,
  .list_area .la_body .lb_item .li_ptype {
      width: 120px;
  }
  
  .list_area .la_header .lh_isdate,
  .list_area .la_body .lb_item .li_isdate {
      width: 130px;
  }
  
  .list_area .la_header .lh_period,
  .list_area .la_body .lb_item .li_period {
      width: 260px;
  }
  
  .list_area .la_header .lh_btn,
  .list_area .la_body .lb_item .li_btn {
      width: 100px
  }
  
  .list_area .la_body .lb_item .li_btn button {
      width: 90%;
      height: 30px;
      font-size: 12px !important;
      font-weight: normal;
  }
  
  .list_area .la_body .lb_item .li_slogo .logo_wrapper {
      width: 100px;
      height: 54px;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      color: #999;
      font-size: 12px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif ;
  }
  
  .list_area .la_body .lb_nolist {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 500px;
      background: #f4f4f4;
      font-size: 14px;
      color: #999;
      border-bottom: 1px solid #a2bdc9;
  }
  
  #service_frame {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1;
      overflow: hidden;
  height: 100vh; /* Use vh as a fallback for browsers that do not support Custom Properties */
    height: calc(var(--vh, 1vh) * 100);
  }
  
  #service_frame .landing_contents {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      animation: fade-in 0.5s;
      -moz-animation: fade-in 0.5s;
      -webkit-animation: fade-in 0.5s;
      z-index: 2;
  }
  
  #service_frame .landing_contents.out {
      animation: fade-out 1s;
      -moz-animation: fade-out 1s;
      -webkit-animation: fade-out 1s;
      opacity: 0;
  }
  
  #service_frame .landing_contents .lc_loading_wrapper {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 50%;
  }
  
  #service_frame .main_contents,
  #service_frame .main_contents .mapview_area {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1;
      overflow: hidden;
  }
  
  #service_frame .main_contents .mapview_area {
      z-index: 1;
  }
  
  #service_frame .main_contents .ui_top_area {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      opacity: 1;
      z-index: 5;
      transition: all .2s ease-out;
      -moz-transition: all .2s ease-out;
      -webkit-transition: all .2s ease-out;
      touch-action: none;
  }
  
  #service_frame .main_contents .ui_top_area.on {
      bottom: 0;
  }
  
  #service_frame .main_contents .ui_top_area.up {
      top: -150px;
      opacity: 0;
  }
  
  #service_frame .main_contents .ui_top_area .mf_searchbar {
      position: absolute;
      top: 20px;
      left: 20px;
      right: 20px;
      z-index: 4;
  }
  #service_frame .main_contents .ui_top_area .mf_result_router {
      display: none;
      top: 238px;
      position: absolute;
      left: 0;
      right: 0;
      background: #FAFBFF;
      overflow: hidden;
      overflow-y: auto;
      z-index: 3;
  }
  #service_frame .main_contents .ui_top_area .mf_result_router.on {
      display: block;
      height: 100vh;
  }
  #service_frame .main_contents .ui_top_area .mf_result_back {
      position: absolute;
      top: 10px;
      left: 0;
      right: 0;
      background: #fff;
      overflow: hidden;
      overflow-y: auto;
      margin-top: 64px;
      padding-right: 10px;
      z-index: 3;
  }
  
  #service_frame .main_contents .ui_top_area .mf_result_back.on {
      bottom: 0;
  }
  
  #service_frame .main_contents .ui_top_area .mf_result_back .s_item, #service_frame .main_contents .ui_top_area .mf_result_router .s_item {
      position: relative;
      width: 100%;
      height: 60px;
      display: flex;
      align-items: center;
  }
  
  #service_frame .main_contents .ui_top_area .mf_result_back .s_item .icon, #service_frame .main_contents .ui_top_area .mf_result_router .s_item .icon {
      width: 48px;
      height: 100%;
      display: inline-flex;
      background: transparent url(/images/icon_pin_black_outline.svg) center no-repeat;
      background-size: 50%;
  }
  
  #service_frame .main_contents .ui_top_area .mf_result_back .s_item .text, #service_frame .main_contents .ui_top_area .mf_result_router .s_item .text {
      width: calc(100% - 110px);
      width: -moz-calc(100% - 110px);
      width: -webkit-calc(100% - 110px);
      outline: none;
      cursor: pointer;
      max-width: -webkit-calc(100% - 190px);
  }
  
  #service_frame .main_contents .ui_top_area .mf_result_back .s_item .text .title, #service_frame .main_contents .ui_top_area .mf_result_router .s_item .text .title {
      height: 20px;
      margin-bottom: 3px;
      font-size: 14px;
      color: #111;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
  }
  
  #service_frame .main_contents .ui_top_area .mf_result_back .s_item .text .cate, #service_frame .main_contents .ui_top_area .mf_result_router .s_item .text .cate {
      height: 16px;
      font-size: 12px;
      color: #959595;
  }
  
  #service_frame .main_contents .ui_top_area .mf_result_back .s_item .coupon{
      width: 62px;
      height: 100%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
  }
  #service_frame .main_contents .ui_top_area .mf_result_back .s_item .btn_end, #service_frame .main_contents .ui_top_area .mf_result_router .s_item .btn_end{
      /* background:  #002756; */
      border-radius: 20px;
      width: 75px;
      height: 30px;
      justify-content: center;
      align-items: center;
      display: flex;
      margin-left: 5px;
      color: #fff;
      font-size: 14px;
      line-height: 19.7px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-weight: 400;
  }
  
  #service_frame .main_contents .ui_top_area .mf_result_back .s_item .btn_start, #service_frame .main_contents .ui_top_area .mf_result_router .s_item .btn_start{
      /* border: 1px  #002756 solid; */
      border-radius: 20px;
      width: 75px;
      height: 30px;
      justify-content: center;
      align-items: center;
      display: flex;
      /* color:  #002756; */
      font-size: 14px;
      line-height: 19.7px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-weight: 400;
  }
  
  #service_frame .main_contents .ui_top_area .mf_search_back, #service_frame .main_contents .ui_top_area .mf_router_back {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: #fff;
      overflow: hidden;
      z-index: 2;
  }
  
  #service_frame .main_contents .ui_top_area .mf_search_back .sb_tipbar {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 80px 20px 20px 20px;
      padding: 8px 20px;
      background: #002756;
      color: #fff;
      font-size: 12px;
      font-weight: normal;
      line-height: 16px;
      word-break: break-all;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
  }
  
  #service_frame .main_contents .ui_top_area .mf_search_back .sb_tipbar.empty {
      background: transparent;
  }
  
  #service_frame .main_contents .ui_top_area .mf_search_back .sb_tipbar span {
      color: #ffdb00;
  }
  
  #service_frame .main_contents .ui_top_area .mf_search_back .sb_recent_title {
      height: 26px;
      padding: 0 20px;
      font-size: 16px;
      font-weight: bold;
      color: #111;
  }
  
  #service_frame .main_contents .ui_top_area .mf_search_back .sb_recent_list {
      padding: 0 20px;
  }
  
  #service_frame .main_contents .ui_top_area .mf_catebar {
      position: absolute;
      top: 68px;
      left: 0;
      right: 0;
      z-index: 1;
  }
  
  #service_frame .main_contents .ui_top_area .mf_searchbar .mf_search_wrapper {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: space-between;
  }
  
  /* #service_frame .main_contents .ui_top_area .mf_searchbar .mf_search_wrapper .btn_back {
      background: transparent url(/images/poi_icon_df.png) center no-repeat;
      position: absolute;
      left: 20px;
  } */
  
  #service_frame .main_contents .ui_top_area .mf_searchbar .mf_search_wrapper .btn_back.active {
      display: block;
      margin-right: 10px;
      /* position: absolute;
      top: -53px; */
  }
  
  #service_frame .main_contents .ui_top_area .mf_searchbar .mf_search_wrapper .btn_cancel {
      position: absolute;
      display: none;
      right: 15px;
      /* top: -47px; */
      z-index: 2;
  }
  
  #service_frame .main_contents .ui_top_area .mf_searchbar .mf_search_wrapper .btn_cancel.on,
  #service_frame .main_contents .ui_top_area .mf_routerbar .mf_router_wrapper .btn_cancel.on {
      display: block;
  }
  
  #service_frame .main_contents .ui_top_area .mf_catebar .swiper {
      padding: 0 20px;
  }
  
  #service_frame .main_contents .ui_top_area .mf_catebar .swiper-slide {
      display: flex;
      align-items: center;
      width: initial;
      height: 50px;
  }
  
  #service_frame .main_contents .ui_top_area.poi .mf_catebar {
      display: none;
  }
  
  #service_frame .main_contents .ui_bottom_area {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 160px;
      z-index: 3;
      transition: all .2s ease-out;
      -moz-transition: all .2s ease-out;
      -webkit-transition: all .2s ease-out;
  }
  #service_frame .main_contents .ui_bottom_area.off, .btn_back.off {
      display: none;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_poibar {
      position: relative;
      display: flex;
      align-items: center;
      height: 140px;
      padding: 0 20px 0 20px;
      transform: translateY(134px);
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_routebar {
      position: relative;
      display: flex;
      align-items: center;
      height: 140px;
      padding: 0 20px 0 20px;
      transform: translateY(140px);
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_couponbar {
      position: relative;
      display: flex;
      align-items: center;
      height: 140px;
      padding: 0 20px 0 20px;      
      margin-bottom: -140px;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_couponbar.off {
      display: none;
  }
  
  #service_frame .main_contents .ui_bottom_area .swiper-slide {
      width: calc(100% - 20px);
      width: -moz-calc(100% - 20px);
      width: -webkit-calc(100% - 20px);
      height: 140px;
      border-radius: 16px;
      padding: 20px;
      background: #fff;
      box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
  }
  #service_frame .main_contents .ui_bottom_area .coupon_cardview{
      background-color: #fff;
      color: #000;
  }#service_frame .main_contents .ui_bottom_area .event_cardview{
      background-color: #fff;
      color: #000;
  }#service_frame .main_contents .ui_bottom_area .poi_cardview{
      background-color: #fff;
      color: #000;
  }
  #service_frame .main_contents .ui_bottom_area .swiper-slide.route {
      width: 100%;
      height: 90px;
      margin-bottom: 50px;
      transition: all .2s ease-out;
      -moz-transition: all .2s ease-out;
      -webkit-transition: all .2s ease-out;
  }
  
  #service_frame .main_contents .ui_bottom_area .swiper-slide.poi {
      width: 100%;
      transition: all .2s ease-out;
      -moz-transition: all .2s ease-out;
      -webkit-transition: all .2s ease-out;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_couponbar .cp_icon {
      position: absolute;
      top: 20px;
      left: 20px;
      width: 15%;
  }
  #service_frame .main_contents .ui_bottom_area .mf_couponbar .cp_icon img,
  #service_frame .main_contents .ui_bottom_area .poi_icon img {
      max-width: 44px;
      max-height: 44px;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_couponbar .cp_title {
      position: relative;
      padding: 0 0 0 55px;
      max-width: 85%;
      min-height: 46px;
      max-height: 46px;
      font-size: 16px;
      font-weight: bold;
      white-space: pre-wrap;
      word-break: keep-all;
      overflow: hidden;
      text-overflow: ellipsis;
      margin-bottom: 15px;
      align-items: center;
      display: -webkit-box;
      -webkit-line-clamp: 2; /* number of lines to show */
              line-clamp: 2; 
      -webkit-box-orient: vertical;
  }
  #service_frame .main_contents .ui_bottom_area .mf_couponbar .cp_title_short {
      position: relative;
      padding: 0 0 0 55px;
      max-width: 85%;
      min-height: 46px;
      max-height: 46px;
      font-size: 16px;
      font-weight: bold;
      white-space: pre-wrap;
      word-break: keep-all;
      overflow: hidden;
      text-overflow: ellipsis;
      margin-bottom: 15px;
      align-items: center;
      display: flex;
  }
  #service_frame .main_contents .ui_bottom_area .mf_couponbar .cp_title .has-icon {
      padding-left: 45px;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_couponbar .cp_desc {
      font-size: 12px;
      font-weight: normal;
      line-height: 20px;
      max-height: 40px;
      overflow: hidden;
      /* word-break: break-all; */
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
  }
  
  #service_frame .main_contents .ui_bottom_area .poi_icon {
      position: absolute;
      width: 44px;
      height: 44px;
  }
  
  #service_frame .main_contents .ui_bottom_area .poi_icon.red {
      background: transparent url(/images/icon_pin_red.svg) center no-repeat;
  }
  
  #service_frame .main_contents .ui_bottom_area .poi_title {
      position: relative;
      padding: 0 0 0 50px;
      width: 90%;
      height: 28px;
      font-size: 16px;
      font-weight: bold;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      top: -3px;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_floorbar .swiper-wrapper {
      display: initial;
  }
  
  #service_frame .main_contents .ui_bottom_area .poi_subinfo {
      position: relative;
      padding: 0 0 0 50px;
      height: 32px;
      font-size: 12px;
      font-weight: normal;
      top: -9px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
  }
  
  #service_frame .main_contents .ui_bottom_area .poi_btns {
      display: flex;
      justify-content: space-between;
  }
  
  #service_frame .main_contents .ui_bottom_area .poi_btns .btn_wround_blackline {
      margin-right: 8px;
  }
  
  #service_frame .main_contents .ui_bottom_area .poi_btns button:nth-child(2) {
      margin-left: 8px;
      margin-right: 8px;
  }
  
  #service_frame .main_contents .ui_bottom_area.route {
      bottom: 110px !important;
      transition: all .2s ease-out;
      -moz-transition: all .2s ease-out;
      -webkit-transition: all .2s ease-out;
  }
  
  #service_frame .main_contents .ui_bottom_area .route .poi_btns {
      position: absolute;
      top: -60px;
      left: 80px;
      right: 80px;
      transition: all .2s ease-out;
      -moz-transition: all .2s ease-out;
      -webkit-transition: all .2s ease-out;
  }
  #service_frame .main_contents .ui_bottom_area .mf_floorbar {
      position: absolute;
      left: 20px;
      bottom: 20px;
      width: 46px;
      overflow: hidden;
      background: #fff;
      -webkit-border-radius: 23px;
      -moz-border-radius: 23px;
      border-radius: 23px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
      z-index: 9;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_floorbar.over {
      max-height: 260px;
      padding: 25px 0;
      overflow: clip;
      z-index: 88;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_floorbar .swiper-wrappe,
  .map_chart_container .mf_floorbar .swiper-wrappe {
      display: initial;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_floorbar.over .swiper-wrapper,
  .map_chart_container .mf_floorbar.over .swiper-wrapper {
      display: flex;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_floorbar .swiper-slide {
      width: 46px;
      height: 46px;
      padding: 0;
      background: initial;
      box-shadow: initial;
      border-radius: initial;
      -moz-border-radius: initial;
      -webkit-border-radius: initial;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_floorbar .floor-button-prev {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 1;
      display: flex;
      justify-content: center;
      align-items: end;
      font-size: 10px;
      height: 20px;
      background: #fff;
      -webkit-border-top-left-radius: 25px;
      -webkit-border-top-right-radius: 25px;
      -moz-border-radius-topleft: 25px;
      -moz-border-radius-topright: 25px;
      border-top-left-radius: 25px;
      border-top-right-radius: 25px;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_floorbar .floor-button-next {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      z-index: 1;
      display: flex;
      justify-content: center;
      align-items: baseline;
      font-size: 10px;
      height: 20px;
      background: #fff;
      -webkit-border-bottom-right-radius: 25px;
      -webkit-border-bottom-left-radius: 25px;
      -moz-border-radius-bottomright: 25px;
      -moz-border-radius-bottomleft: 25px;
      border-bottom-right-radius: 25px;
      border-bottom-left-radius: 25px;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_floorbar .swiper-button-disabled {
      color: rgba(103, 103, 103, 0.4);
  }
  #service_frame .main_contents .ui_bottom_area .mf_buttonbar {
      position: absolute;
      right: 20px;
      bottom: 20px;
      width: 46px;
  }
  
  #service_frame .main_contents .ui_bottom_area .mf_buttonbar button {
      margin-top: 15px;
  }
  #service_frame .main_contents .ui_coupon_detail, #service_frame .main_contents .ui_route_mode, 
  #service_frame .main_contents .ui_building_mode, #service_frame .ui_set_height {
      position: absolute;
      display: none;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgb(0 0 0 / 65%);
      z-index: 10;
  }
  #service_frame .main_contents .ui_info_legal{
      position: absolute;
      display: none;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0, 0, 0, 0.7);
      z-index: 10;
  }
  #service_frame .main_contents .ui_info_legal .ms_contents {
      width: 100vw;
      height: 100vh;
      background: #fff;
      position: relative;
  }
  
  #service_frame .main_contents .ui_info_legal .ms_contents .ms_box {
      width: 98%;
      position: absolute;
      top: 28%;
      left: 50%;
      transform: translate(-50%, -50%);
      color: #000;
  }
  #service_frame .main_contents .ui_info_legal .ms_contents .ms_box p {
      font-size: 18px;
  }
  #service_frame .main_contents .ui_info_legal.active  {
      display: block;
      animation: fade-in 0.3s;
  }
  #service_frame .main_contents .ui_coupon_detail.active, #service_frame .main_contents .ui_route_mode.active, 
  #service_frame .main_contents .ui_building_mode.active, #service_frame .ui_set_height.active  {
      display: block;
      animation: fade-in 0.3s;
  }
  
  #service_frame .main_contents .ui_coupon_detail .btn_circleclose, #service_frame .main_contents .ui_info_legal .btn_circleclose {
      position: absolute;
      top: 25px;
      right: 25px;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents {
      position: absolute;
      left: 30px;
      right: 30px;
      bottom: 30px;
      max-height: 85%;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_link {
      position: relative;
      display: flex;
      justify-content: right;
      padding-bottom: 15px;
  }
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box, #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box,
  #service_frame .main_contents .ui_building_mode .rtm_contents .rtm_box {
      position: relative;
      padding: 20px;
      background: #fff;
      border-radius: 16px;
      -moz-border-radius: 16px;
      -webkit-border-radius: 16px;
      max-height: 62vh;
      overflow: auto;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_img {
      position: relative;
      width: 100%;
      height: 130px;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      margin-bottom: 17px;
      background:#4f48482e url(/images/icon_loading.gif);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_title {
      font-size: 16px;
      font-weight: bold;
      color: #111;
      line-height: 22px;
      word-break: break-all;
      text-align: center;
      margin-bottom: 6px;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_desc {
      font-size: 12px;
      font-weight: normal;
      color: #111;
      line-height: 16px;
      text-align: left;
      word-break: break-all;
      max-height: 110px;
      overflow-x: scroll;
      margin-bottom: 10px;
      padding-right: 15px;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_period {
      font-size: 10px;
      font-weight: normal;
      color: #002756;
      line-height: 14px;
      text-align: center;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_period .text {
      margin-bottom: 4px;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_period .date {
      font-weight: bold;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_code {
      min-height: 40px;
      margin-top: 10px;
      word-break: break-all;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_code canvas {
      width: 100%;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_box .cb_rate {
      padding-top: 5px;
      text-align: center;
  }
  
  #service_frame .main_contents .ui_coupon_detail .cd_bottom_contents .cd_btn {
      padding-top: 20px;
  }
  
  .fadein {
      animation: fade-in 0.3s;
  }
  
  .fadeout {
      animation: fade-out 0.3s;
  }
  
  
  @keyframes fade-in {
      from {
          opacity: 0;
      }
  
      to {
          opacity: 1;
      }
  }
  
  @-moz-keyframes fade-in {
      from {
          opacity: 0;
      }
  
      to {
          opacity: 1;
      }
  }
  
  @-webkit-keyframes fade-in {
      from {
          opacity: 0;
      }
  
      to {
          opacity: 1;
      }
  }
  
  @keyframes fade-out {
      from {
          opacity: 1;
      }
  
      to {
          opacity: 0;
      }
  }
  
  @-moz-keyframes fade-out {
      from {
          opacity: 1;
      }
  
      to {
          opacity: 0;
      }
  }
  
  @-webkit-keyframes fade-out {
      from {
          opacity: 1;
      }
  
      to {
          opacity: 0;
      }
  }
  
  
  /* for custom choices library */
  .choices {
      width: 100%;
  }
  
  .choices__item {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
  }
  
  .choices__inner {
      display: inline-flex;
      align-items: center;
      padding: 0 10px !important;
      background: #fbfbfb;
      color: #000000;
      border: 1px solid #444444;
      box-shadow: inset 1px 2px 4px rgba(0, 0, 0, 0.25);
      border-radius: 8px !important;
      -moz-border-radius: 8px !important;
      ;
      -webkit-border-radius: 8px !important;
      ;
  }
  
  .is-focused .choices__inner,
  .is-open .choices__inner {
      /* border-color:  #002756; */
  }
  
  .choices__list--dropdown,
  .choices__list[aria-expanded] {
      border-radius: 8px;
      z-index: 100;
  }
  
  .choices__list {
      color: #666;
  }
  
  .choices[data-type="select-multiple"] .choices__list--dropdown .choices__item--choice {
      padding-left: 4rem;
  }
  
  .choices[data-type="select-multiple"] .choices__list--dropdown .choices__item--choice::before{
      content: '';
      width: 2rem;
      height: 2rem;
      border: 1px solid #c1c1c1;
      position: absolute;
      left: 1rem;
      top: 50%;
      transform: translateY(-50%);
  }
  
  .choices[data-type="select-multiple"] .choices__list--dropdown .is-selected::after {
      content: '\f00c';
      font: normal 900 1em/1 "Font Awesome 6 Free";
      position: absolute;
      left: 1.4rem;
      top: 50%;
      transform: translateY(-50%);
      opacity: 1;
  }
  
  .choices__list--multiple {
      display: inline-flex;
      vertical-align: middle;
  }
  
  /* .choices__list--multiple .choices__item {
      padding: 0;
      margin-right: 0.5rem; 
      margin-bottom: 0;
      background-color: #fff;
      color: #000;
      border: 0px solid #00a5bb;
  }
  
  .choices__list--multiple .choices__item::after {
      content: ','
  } */
  .choices__input {
      height: 3rem!important;
      margin-bottom: 0;
  }
  .choices__list--multiple .choices__item{
      margin-bottom: 0;
  }
  @media (min-width: 640px) {
  
      .choices__list--dropdown .choices__item--selectable,
      .choices__list[aria-expanded] .choices__item--selectable {
          padding-right: initial;
      }
  }
  
  .form_wrap .choices {
      width: calc(100% - 10px);
      height: 35px;
  }
  
  .form_wrap .choices__inner {
      vertical-align: initial;
      min-height: initial;
      height: 100%;
  }
  
  .form_wrap .choices__placeholder {
      opacity: initial;
  }
  
  /* custom datepciker library */
  .datepicker-header .datepicker-controls .button {
      font-size: 1.2rem;
  }
  
  /* Grid */
  .row {
      --bs-gutter-x: 10px;
      --bs-gutter-y: 0;
      display: flex;
      flex-wrap: wrap;
      margin-top: calc(var(--bs-gutter-y) * -1);
      margin-right: calc(var(--bs-gutter-x) * -.5);
      margin-left: calc(var(--bs-gutter-x) * -.5);
  }
  
  .row>* {
      flex-shrink: 0;
      width: 100%;
      max-width: 100%;
      padding-right: calc(var(--bs-gutter-x) * .5);
      padding-left: calc(var(--bs-gutter-x) * .5);
      margin-top: var(--bs-gutter-y);
  }
  
  .col {
      flex: 1 0 0%;
  }
  
  .col-4 {
      width: 33.33%;
  }
  
  .form_box {
      border: 1px solid #F9F9F9;
      padding: 10px;
      border-radius: 5px;
      display: flex;
      flex-wrap: wrap;
      width: 100%;
      color: #FBFBFB;
  }
  
  .form_box .form_wrap {
      width: 100%;
      align-items: center;
      margin: 3px 0;
  }
  .form_box .form_wrap >*:not(span){
      width: 145px !important;
  }
  .form_box .form_wrap>span {
      line-height: 1.2;
      width: calc(100% - 135px);
      margin-left: auto;
      overflow: hidden;
      text-overflow: ellipsis;
  }
  
  .form_box+.form_box {
      margin-left: 10px;
  }
  
  /* end */
  
  
  /* for custom notiflix library */
  [id^=NotiflixNotifyWrap] {
      inset: auto 0 40% !important;
  }
  
  .notiflix-report-content {
      border-radius: 8px !important;
  }
  
  .notiflix-confirm-content {
      overflow: initial !important;
  }
  
  .notiflix-confirm-buttons {
      display: flex;
      justify-content: center;
      padding: 30px 0;
  }
  
  .notiflix-confirm-head h5 {
      border: 0 !important;
      padding-top: 20px !important;
      font-weight: bold !important;
      font-size: 16px !important;
  }
  
  .notiflix-confirm-buttons .nx-confirm-button-ok,
  .notiflix-confirm-buttons .nx-confirm-button-cancel {
      width: 180px !important;
      font-weight: bold !important;
  }
  
  .notiflix-notify-info {
      justify-content: center;
  }
  
  .notiflix-report-icon {
      display: none !important;
  }
  
  .notiflix-report-title {
      font-weight: bold !important;
  }
  
  .notiflix-report-message {
      text-align: center;
      float: initial !important;
  }
  
  .notiflix-report-message .floor {
      font-size: 18px;
      font-weight: bold;
      display: flex;
      align-items: center;
      justify-content: center;
  }
  
  .notiflix-report-button {
      border-radius: 20px !important;
      -moz-border-radius: 20px !important;
      -webkit-border-radius: 20px !important;
  }
  
  /* end */
  
  
  /* for custom dropzone library */
  .dropzone {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: initial !important;
      height: 35px;
      min-width: 140px;
      padding: 0 15px !important;
      background: #666666;
      border: 1px solid #fff !important;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-size: 14px !important;
      color: #fff;
  }
  
  .dropzone.mkimage {
      width: 100%;
      height: 240px;
      background: #fff url(/images/icon_image.png) center no-repeat;
      background-size: 120px 120px !important;
      border: 0 !important;
      box-shadow: inset 1px 2px 4px rgba(0, 0, 0, 0.25);
  }
  
  .dropzone input[type=file] {
      display: none;
  }
  
  .dropzone .dz-message {
      margin: initial !important;
  }
  
  .dropzone.dz-started .dz-message {
      display: inline !important;
  }
  
  .dropzone.mkimage .dz-message {
      padding-top: 150px;
      font-size: 12px;
      color: #000000;
      text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px #fff;
  }
  
  /* end */
  
  .qr_preview, .qr_preview_ex {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 240px;
      min-width: 140px;
      padding: 0 5px;
      background: #fff url(/images/icon_qrcode.png) center no-repeat;
      background-size: 100px;
      border: 0;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-size: 14px;
      color: #fff;
      width: 100%;
      box-shadow: inset 1px 2px 4px rgba(0, 0, 0, 0.25);
  }
  
  .qr_preview img, .qr_preview_ex img {
      width: 100px;
  }
  
  .qr_preview .qp_message, .qr_preview_ex .qp_message {
      padding-top: 150px;
      font-size: 12px;
      color: #000000;
      text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px #fff;
  }
  
  .qr_preview .downloadQRButton, .qr_preview_ex .downloadQRExButton {
      display: none;
      position: absolute;
      right: 20px;
      bottom: 20px;
      width: auto;
      font-size: 12px !important;
  }
  
  
  /* for custom coloris library */
  .clr-picker {
      z-index: 4100 !important;
  }
  
  .clr-field button {
      width: 26px !important;
      height: 26px !important;
      right: 5px !important;
      border-radius: 5px;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
  }
  
  .clr-field button:after {
      border-radius: 4px !important;
      -moz-border-radius: 4px !important;
      -webkit-border-radius: 4px !important;
  }
  
  /* end */
  
  
  /* for custom tippy library */
  .tippy-box[data-theme~='qrhere'] {
      background-color: #000;
      font-size: 13px;
      font-weight: bold;
      color: #b9e3ff;
  }
  
  .tippy-box[data-theme~='qrhere'][data-placement^='left']>.tippy-arrow::before {
      border-left-color: #000;
  }
  
  /* end */
  
  
  /* for custom autoComplete library */
  .autoComplete_wrapper {
      width: 100%;
  }
  
  .autoComplete_wrapper>input {
      height: 35px;
      width: 100%;
      padding: 0 15px;
      text-overflow: ellipsis;
      color: #000000;
      outline: 0;
      background: #fff;
      border-radius: 8px;
      border: 1px solid #444444;
      transition: initial;
      -webkit-transition: initial;
  }
  
  .autoComplete_wrapper>input::placeholder {
      color: #a6a6a6;
      transition: initial;
      -webkit-transition: initial;
  }
  
  .autoComplete_wrapper>input:hover::placeholder {
      color: #a6a6a6;
      transition: initial;
      -webkit-transition: initial;
  }
  
  .autoComplete_wrapper>input:focus::placeholder {
      padding: 0;
      font-size: 14px;
      color: #a6a6a6;
  }
  
  .autoComplete_wrapper>input:focus::selection {
      background-color: initial;
  }
  
  .autoComplete_wrapper>input::selection {
      background-color: initial;
  }
  
  .autoComplete_wrapper>input:hover {
      color: #000000;
      transition: initial;
      -webkit-transition: initial;
  }
  
  .autoComplete_wrapper>input:focus {
      color: #000000;
      border: 1px solid #444444;
  }
  
  .autoComplete_wrapper>ul>li {
      margin: 0.3rem;
      padding: 0.3rem 0.5rem;
      text-align: left;
      font-size: 1rem;
      color: #212121;
      border-radius: 0.35rem;
      background-color: rgba(255, 255, 255, 1);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      transition: initial;
  }
  
  .autoComplete_wrapper>ul>li mark {
      background-color: transparent;
      color: #02adfb;
      font-weight: bold;
  }
  
  .autoComplete_wrapper>ul>li:hover {
      cursor: pointer;
      background-color: rgba(100, 100, 100, 0.3);
  }
  
  .autoComplete_wrapper>ul>li[aria-selected="true"] {
      background-color: rgba(100, 100, 100, 0.3);
  }
  
  .autoComplete_wrapper .no_result {
      color: #ccc;
      padding: 10px 15px;
  }
  
  /* end */
  
  
  .datepicker {
      color: initial;
  }
  
  
  /*UI Route mode*/
  
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box, #service_frame .ui_set_height .rtm_contents .rtm_box {
      position: relative;
      padding: 30px 5px;
      background: #fff;
      border-radius: 16px;
      -moz-border-radius: 16px;
      -webkit-border-radius: 16px;
  }
  
  #service_frame .ui_set_height .rtm_contents .rtm_box .rtm_title {
      font-style: normal;
      font-weight: 400;
      font-size: 18px;
      line-height: 24.5px;
      margin-bottom: 20px;
      padding: 0 52px;
      color: #111111;
      text-align: center;
      word-break: keep-all;
      white-space: pre-wrap;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_title {
      font-style: normal;
      font-weight: 700;
      font-size: 18px;
      line-height: 25px;
      color: #111111;
      text-transform: uppercase;
      padding-left: 10px;
  }
  #service_frame .ui_set_height .rtm_contents {
      position: absolute;
      left: 35px;
      right: 35px;
      top: 35%;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents {
      position: absolute;
      left: 35px;
      right: 35px;
      top: 25%;
      bottom: 50%;
  }
  
  #service_frame .main_contents .ui_route_mode .rtm_contents .btn_circleclose{
      position: absolute;
      z-index: 12;
      right: 25px;
      top: 25px;
  
  }
  #service_frame .main_contents .ui_building_mode .rtm_contents .btn_circleclose{
      position: absolute;
      z-index: 12;
      right: 20px;
      top: 13px;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt,
  #service_frame .main_contents .ui_building_mode .rtm_contents .rtm_box .building_group_bt{
      margin-top: 30px;
      text-align: center;
  }
  #service_frame .main_contents .ui_building_mode .rtm_contents .rtm_box .building_group_bt .building_bt_item {
      padding: 15px 25px 15px;
      background: #fff;
      border: 1px #D3D6DA solid;
      border-radius: 26px;
      cursor: pointer;
      margin-bottom: 10px;
      width: 100%;
      text-align: left;
      font-size: 14px;
      font-weight: bold;
      color: #111;
  }
  #service_frame .main_contents .ui_building_mode .rtm_contents .rtm_box .building_group_bt .building_bt_item.on {
      background: #002756;
      color: #fff;
  }
  #service_frame .main_contents .ui_building_mode .rtm_contents .rtm_box .rtm_title {
      font-style: normal;
      font-weight: 700;
      font-size: 18px;
      line-height: 25px;
      color: #111111;
      text-transform: uppercase;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents,
  #service_frame .main_contents .ui_building_mode .rtm_contents {
      position: absolute;
      left: 35px;
      right: 35px;
      top: 25%;
      bottom: 50%;
  }
  .mf_floorbar_container {
      position: absolute;
      left: 20px;
      bottom: 20px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      z-index: 9;
  }
  #service_frame .main_contents .ui_bottom_area .mf_floorbar_container .mf_floorbar {
      position: relative;
      left: auto;
      bottom: auto;
      width: 46px;
      overflow: hidden;
      background: #fff;
      -webkit-border-radius: 23px;
      -moz-border-radius: 23px;
      border-radius: 23px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
      z-index: 9;
  }
  #service_frame .ui_set_height .rtm_contents .rtm_box .rtm_group_bt .input_height_indoor {
      width: 100%;
      height: 39px;
      margin-top: 14px;
      border: 1px #1C3997 solid;
      border-radius: 5px;
      text-align: right;
      padding-right: 35px;
  }
  
  #service_frame .ui_set_height .rtm_contents .rtm_box .rtm_group_bt .bt_set_height {
      width: 95%;
      height: 39px;
      margin-top: 14px;
      background: #1C3997;
      color: #fff;
      border: none;
      border-radius: 5px;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt  .rtm_bt{
      width: 47%;
      margin: 0;
      padding: 53px 0 22px;
      border: 0;
      font-size: 12px !important;
      text-transform: uppercase;
      font-weight: 400;
      color: #666666;
      border-radius: 18px;
      -moz-border-radius: 18px;
      -webkit-border-radius: 18px;
      cursor: pointer;
      margin-bottom: 10px;
  }
  
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt  .rtm_bt_mode_recommendation
  {
      background: #E4F0F5 url(/images/way.svg) center 25% no-repeat;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt  .rtm_bt_mode_stairs
  {
      background: #E4F0F5 url(/images/way1.svg) center 25% no-repeat;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt  .rtm_bt_mode_escalator
  {
      background: #E4F0F5 url(/images/way2.svg) center 25% no-repeat;
  }
  
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt  .rtm_bt_mode_elevator
  {
      background: #E4F0F5 url(/images/way3.svg) center 25% no-repeat;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt .rtm_bt_mgr {
      margin-right: 10px;
  }
  
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt .rtm_bt_wf {
      width: 97%;
      margin-left: 4px;
  }
  #service_frame .main_contents .ui_route_mode .rtm_contents .rtm_box .rtm_group_bt .rtm_bt:last-child{
      margin-right: 0px!important;
  }
  
  /* Admin service UI setting */
  .ui-setting_popup [type="checkbox"]:not(:checked)+label,
  .ui-setting_popup [type="checkbox"]:checked+label {
      padding-right: 35px;
      padding-left: 0;
      height: 30px;
      display: flex;
      align-items: center;
      line-height: 1.2;
      padding-right: 55px;
  }
  
  .ui-setting_popup [type="checkbox"]:disabled:checked+label:after {
      color: #000000;
  }
  
  .ui-setting_popup [type="checkbox"]:disabled:not(:checked)+label:before,
  .ui-setting_popup [type="checkbox"]:disabled:checked+label:before {
      border-color: #aaa;
      background-color: #aaa;
  }
  
  .ui-setting_popup [type="checkbox"]:checked+label:after {
      color: #000000;
  }
  
  .ui-setting_popup [type="checkbox"]:checked+label:before {
      border-color: #fff;
      background-color: #fff;
  }
  
  .ui-setting_popup [type="checkbox"]:checked+label:before {
      border-color: #fff;
  }
  
  .ui-setting_popup [type="checkbox"]:not(:checked)+label:before,
  .ui-setting_popup [type="checkbox"]:checked+label:before {
      right: 0;
      left: auto;
      border: 1px solid #fff;
      background: #fff;
      box-shadow: inset 0px 4px 4px rgba(0, 0, 0, 0.25);
      border-radius: 5px;
      width: 30px;
      height: 30px;
  }
  
  .ui-setting_popup [type="checkbox"]:not(:checked)+label:after,
  .ui-setting_popup [type="checkbox"]:checked+label:after {
      top: 0;
      right: -1px;
      left: auto;
      font-size: 23px;
      width: 30px;
      height: 30px;
      line-height: 30px;
      font-weight: bold;
  }
  
  .ui-setting_popup [type="checkbox"]:disabled+label {
      color: #999;
      /* width: 144px; */
  }
  
  .ui-setting_popup .form_row .form_text {
      width: 145px;
      padding-right: 40px;
  }
  
  .ui-setting_popup .form_row .form_elm {
      width: calc(100% - 145px);
  }
  
  .ui-setting_popup .fit_input_normal {
      box-shadow: inset 0px 4px 4px rgb(0 0 0 / 25%);
      border-radius: 5px;
  }
  
  .ui-setting_popup-content {
      overflow: visible !important;
      padding: 0 !important;
      top: -25px !important;
      
  }
  
  .ui-setting_popup-buttons {
      display: flex;
      justify-content: center;
      padding: 10px 0;
  }
  
  .ui-setting_popup-buttons .nx-confirm-button-ok,
  .ui-setting_popup-buttons .nx-confirm-button-cancel {
      width: 180px !important;
      font-weight: bold !important;
      border-radius: 10px !important;
  }
  
  .ui-setting_popup .dropzone {
      /* min-width: 150px !important; */
      padding: 0 5px !important;
      min-width: 0;
      background: #FEFEFE;
      border-radius: 5px;
      color: #000000;
      box-shadow: inset 0px 4px 4px rgba(0, 0, 0, 0.25);
      position: relative;
  }
  
  .notiflix-confirm-head >div {
      max-height: calc(100vh - 215px);
      overflow-y: auto;
  }
  
  .ui-setting_popup-head >div {
      max-height: calc(100vh - 190px);
      overflow-y: auto;
      margin: 10px 0 !important;
  }
  
  .ui-setting_popup-content {
      left: -148px;
  }
  
  .form_msg.hidden {
      display: none;
  }
  .ui-setting_popup-head {
      padding-top: 15px;
  }
  
  .ui-setting_popup-content .choices__inner {
      height: 35px;
      min-height: 35px;
  }
  .btn-reset {
      float: right;
      cursor: pointer;
  }
  .p_relative {
      position: relative;
  }
  .search-result.on {
      position: absolute;
      display: block;
      top: 100%;
      left: 0;
      background: #fff;
      z-index: 999;
      width: 100%;
      color: #000;
      padding: 10px;
      border-radius: 8px;
  }
  
  .search-result {
      display: none;
  }
  
  .search-result .text {
      padding: 5px 0;
      cursor: pointer;
  }
  
  .search-result .text:hover {
      font-weight: bold;
  }
  
  /* Poi detail form UI */
  #poi_coord_frame .pc_title {
      font-size: 1.6rem;
      color: #fff;
      line-height: 1.9rem;
  }
  
  #poi_coord_frame .pc_title_wrapper {
      padding: 15px;
      display: flex;
      justify-content: space-between;
      position: relative;
      z-index: 9;
  }
  #poi_coord_frame .pc_contents {
      padding: 0px 0.8rem 0 1rem;
      position: absolute;
      top: 5rem;
      left: 0px;
      right: 0;
      bottom: 11.5rem;
      overflow-y: auto;
  }
  #poi_coord_frame .pc_contents .pc_form .pf_poi_title {
      font-weight: bold;
      font-size: 1.6rem;
      margin-bottom: 0.7rem;
  }
  
  #poi_coord_frame .pc_contents .pc_form .input_medium {
      border-radius: 0.5rem;
      background: #FFFAFA;
      color: #4B4B4B;
      font-size: 1.4rem;
      max-width: 321px;
      width: 100%;
      border: none;
      padding: 1rem 4rem 1rem 1rem;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
  }
  
  #poi_coord_frame .pc_contents .pc_form .input_large {
      height: 7rem;
      border-radius: 0.5rem;
      background: #FFFAFA;
      font-size: 1.4rem;
      color: #4B4B4B;
      width: 100%;
      outline: none;
      border: none;
      padding: 1rem;
  }
  
  #poi_coord_frame .pc_contents .pc_form .pf_detail_title {
      margin-bottom: 3px;
  }
  
  #poi_coord_frame .pc_contents .pc_form .pf_detail {
      margin-bottom: 4px;
      resize: none;
      position: relative;
      top: -33px;
      word-break: keep-all;
  }
  
  #poi_coord_frame .pc_contents .pc_form .dropzone.mkimage {
      height: 20.4rem;
      margin-bottom: 0.8rem;
  }
  
  #poi_coord_frame .pc_contents .pc_form .add_detail_field_btn {
      font-size: 1.4rem;
      font-weight: 700;
      color: #fff;
      background-color: transparent;
      border: none;
      text-align: center;
      display: inline-block;
      width: 100%;
      margin-bottom: 1rem;
      margin-top: 0.3rem;
  }
  
  #poi_coord_frame .pc_contents .pc_form .pf_page_url, #poi_coord_frame .pc_buttons .poiSaveButton {
      margin-bottom: 0.6rem;
  }
  
  #poi_coord_frame .pc_buttons {
      position: absolute;
      right: 15px;
      bottom: 10px;
  }
  
  #poi_coord_frame .pc_buttons div {
      margin-bottom: 0.4rem;
  }
  
  #poi_coord_frame .pc_buttons div button {
      border-radius: 0.3rem;
      height: 4.2rem;
  }
  
  .pc_language {
      width: 14rem;
      height: 2rem;
  }
  
  .pc_language .choices__inner {
      min-height: 2.2rem;
  }
  
  /* Preview form UI setting */
  .preview_form .bottom_content {
      display: flex;
      flex-wrap: wrap;
      position: absolute;
      z-index: 9;
      bottom: 30px;
      left: 30px;
      right: 30px;
      overflow: hidden;
  }
  
  .preview_form .bottom_content .swiper-slide {
      padding: 15px 15px 7px;
      height: 170px;
      background: #FFFFFF;
      box-shadow: 0px 2px 25px rgba(82, 112, 219, 0.3);
      border-radius: 16px;
      overflow: hidden;
  }
  
  .preview_form .bottom_content .title {
      display: flex;
      align-items: center;
      width: 100%;
      margin-bottom: 10px;
  }
  .preview_form .bottom_content .title .iconDetail{
      margin-top: -3px;
  }
  
  /* .preview_form .bottom_content .title::after {
      content: 'x';
      display: block;
      right: 15px;
      top: 10px;
      line-height: 1;
      color: inherit;
      cursor: pointer;
      font-size: 20px;
      position: absolute;
  } */
  
  .preview_form .bottom_content .title span {
      font-weight: 700;
      font-size: 16px;
      color: inherit;
      padding-left: 10px;
  }
  
  .preview_form.ui_setting .pf_landing {
      background: url(/images/mapTheHyundai.png) center;
      background-size: cover;
      background-repeat: no-repeat;
  }
  
  .preview_form.ui_setting .pf_background {
      top: -50px;
      left: -30px;
      right: -30px;
      bottom: -30px;
      z-index: -1;
  }
  
  .preview_form.ui_setting #mode_icon {
      position: absolute;
      z-index: 9;
      bottom: 190px;
      right: 20px;
      cursor: pointer;
  }
  .preview_form.ui_setting .logo_cpr {
      display: none;
  }
  .preview_form.ui_setting .logo_cpr_right_top {
      position: absolute;
      z-index: 3;
      top: 22px;
      right: 40px;
      cursor: pointer;
  }
  
  .preview_form.ui_setting .logo_cpr_right_top {
      position: absolute;
      z-index: 3;
      top: 22px;
      right: 40px;
      cursor: pointer;
  }
  .preview_form.ui_setting .logo_cpr_left_top {
      position: absolute;
      z-index: 3;
      top: 22px;
      left: 40px;  
      cursor: pointer;
  }
  .preview_form.ui_setting .logo_cpr_right_bottom {
      position: absolute;
      z-index: 3;
      bottom: 22px;
      right: 40px;
      cursor: pointer;
  }
  .preview_form.ui_setting .logo_cpr_left_bottom {
      position: absolute;
      z-index: 3;
      bottom: 22px;
      left: 40px;
      cursor: pointer; 
  }
  
  .preview_form #card_icon {
      background: transparent url(/images/event_icon_df.png);
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      width: 45px;
      height: 45px;
      display: block;
  }
  .preview_form .coupon_cardview #card_icon {
      background: transparent url(/images/coupon_icon_df.png);
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
  }
  .preview_form .card_cardview #card_icon {
      background: transparent url(/images/poi_icon_df.png);
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
  }
  
  .preview_form .preview_category {
      z-index: 9;
      top: 40px;
      margin: 0px 30px;
      overflow: hidden;
  }
  .preview_category .swiper-slide.active {
      background-color: #002756;
      color: #fff;
  }
  .preview_category .swiper-slide {
      font-size: 14px;
      font-weight: bold;
      color: #222;
      background: #fff;
      border-radius: 22px;
      -moz-border-radius: 22px;
      -webkit-border-radius: 22px;
      box-shadow: 0 1px 5px rgb(0 0 0 / 10%);
      outline: none;
      cursor: pointer;
      padding: 5px 15px;
      width: fit-content;
      display: flex;
      align-items: center;
      height: 40px;
  }
  .preview_search {
      z-index: 9;
      position: relative;
      top: 30px;
      margin: 0 35px;
  }
  .preview_search .fit_input_normal {
      padding: 0 24px;
      background: #fff;
      border: 1px solid #f4f4f4;
      border-radius: 23px;
      -moz-border-radius: 23px;
      -webkit-border-radius: 23px;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-size: 14px !important;
      color: #111;
      box-shadow: 0 1px 8px rgb(0 0 0 / 15%);
      height: 40px;
  }
  .ui-setting_popup input[type=number] {
      text-align: center;
  }
  
  .btn-reset-image {
      display: block;
      background: transparent;
      border: 0;
      margin-right: -6px;
      font-size: 20px;
      height: 35px;
      padding-bottom: 3px;
      cursor: pointer !important;
      position: absolute;
      right: 5px;
      background: url(/images/icon_x.svg) center no-repeat;
      color: transparent;
      background-size: 13px;
  }
  
  /**/
  .nowrap {
      white-space: nowrap;
  }
  .w200 {
      width: 181px !important;
  }
  .mb-10 {
      margin-bottom: 10px !important;
  }
  .mb-15 {
      margin-bottom: 15px !important;
  }
  .mb-20 {
      margin-bottom: 20px !important;
  }
  .dz-message {
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap;
  }
  .form_msg.hidden {
      line-height: 0;
      height: 0;
      opacity: 0;
      position: absolute;
  }
  .list_area {
      height: calc(100% - 50px);
  }
  .list_area.coupon {
      height: calc(100% - 155px);
  }
  .list_area .la_body {
      height: 100%;
      overflow: auto;
  }
  .pagination-area {
      display: flex;
      height: 60px;
      justify-content: center;
      align-items: center;
  }
  .choices__item,
  .choices__placeholder {
      white-space: nowrap;
  }
  .full-width {
      width: 100%;
  }
  .btn_blueround {
      background-color: #002756;
      color: #fff;
  }
  .max-600 {
      max-width: 669px;
  }
  /* Statistic page */
  
  .usage_service, .usage_directions_wrapper {
      padding: 20px 53px;
  }
  .page_wrapper {
      display: flex;
      align-items: stretch;
  }
  
  .statistic_page {
      display: none;
      height: 100%;
  }
  
  .page_wrapper .no_data {
      padding: 10rem 2rem 2rem 4rem;
      text-align: center;
      background: #eee;
      height: 100%;
  }
  .page_wrapper .sidebar {
      width: 20%;
      background-color: #eee;
      padding: 8rem 2rem 2rem 4rem;
      height: 100%;
      position: fixed;
      z-index: 1;
      top: 0;
      left: 0;
      overflow-x: hidden;
  }
  
  .page_wrapper .content {
      width: 80%;
      position: absolute;
      left: 20%;
      top: 70px;
  }
  
  .page_wrapper .sidebar .sidebar_menu, .page_wrapper .sidebar .sidebar_submenu {
      margin: 0;
      list-style: none;
  }
  
  .page_wrapper .sidebar .sidebar_submenu {
      margin-left: 2rem;
  }
  
  .page_wrapper .sidebar .sidebar_menu_item span, .page_wrapper .sidebar .sidebar_submenu_item span {
      display: inline-block;
      padding: 0.5rem 0;
      cursor: pointer;
  }
  
  .page_wrapper .sidebar .sidebar_menu_item {
      margin-top: 1rem;
  }
  
  .page_wrapper .sidebar .sidebar_menu_item:first-child {
      margin-top: 0;
  }
  
  .page_wrapper .sidebar .sidebar_menu_item span {
      font-weight: 600;
  }
  
  .page_wrapper .sidebar .sidebar_submenu_item span {
      font-weight: normal;
  }
  
  .page_wrapper .sidebar .sidebar_menu_item span.active {
      color: #002756;
  }
  
  .copyright a {
      font-size: 12px;
  }
  
  .page_wrapper .row {
      --bs-gutter-x: 3rem;
  }
  
  .stt_wrapper {
      margin: 0 auto;
      padding: 3rem 5.3rem;
  }
  .stt_wrapper:nth-child(even) {
      background: rgba(245, 245, 245, 0.7);
  }
  .stt_title {
      color: #111;
      font-weight: 600;
      margin-bottom: 2.4rem;
  }
  
  .stt_badge {
      display: flex;
      padding: 1.5rem 1.5rem 1.5rem 1.5rem;
      flex-direction: column;
      color: #fff;
      margin-left: 1.5rem;
      /* margin-right: 1.5rem; */
      margin-bottom: 3rem;
  }
  
  .stt_badge_flex {
      display: flex;
      align-items: center;
      height: 100%;
  }
  
  .stt_badge_large {
      /* width: 20rem; 
      min-height: 10rem;
       min-width: 22%; */
      flex: 1;
  }
  
  .stt_badge_large .stt_badge_title {
      font-size: 1.5rem;
      text-transform: capitalize;
      text-align: center;
      font-weight: 500;
  }
  
  .stt_badge_large .stt_badge_number {
      font-size: 2.5rem;
  }
  
  .stt_badge_number {
      font-size: 2.5rem;
      text-align: center;
      margin-top: 0.5rem;
      font-weight: 700;
  }
  
  .stt_badge_small {
      flex: 1;
      /* min-height: 10rem; */
  }
  
  .stt_badge_small .stt_badge_title {
      font-size: 1.5rem;
      text-transform: capitalize;    
      text-align: center;
      font-weight: 500;
  }
  
  .stt_badge_blue {
      background: #71D1DE;
  }
  
  .stt_badge_purpel {
      background: #486ED4;
      width: 70%;
      align-items: center;
  }
  
  .stt_badge_orange {
      background: linear-gradient(90deg, #e9c4ab 0%, #dda37c 100%);
  }
  
  #service_type_chart .col:first-child .stt_badge {
      background: #71D1DE;
  }
  
  .stt_badge_alice_blue {
      background: #71D1DE;
  }
  
  .stt_badge_dark_blue {
      background: linear-gradient(90deg, #b2c1dc 0%, #879fc9 100%);
  }
  
  .semi_donut_chart {
      position: relative;
      max-width: 340px;
      margin: auto;
  }
  
  .semi_donut_chart::after{
      content: '';
      background: #d9d9d9;
      width: 60.42%;
      height: 78%;
      position: absolute;
      left: 50%;
      top: 48%;
      transform: translate(-50%, -50%);
      border-radius: 50%;
      z-index: 0;
  }
  
  .semi_donut_chart .apexcharts-canvas {
      z-index: 2;
  }
  
  .apexcharts-tooltip {
      border-radius: 0!important;
  }
  
  .apexcharts-canvas .card .card-header {
      /* background: #ECEFF1; */
      /* border-bottom: 1px solid #ddd; */
      padding: 9px 14px;
      color: #444;
      font-size: 12px;
      font-weight: 600;
  }
  
  .apexcharts-canvas .card {
      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
      cursor: default;
      font-size: 14px;
      left: 62px;
      pointer-events: none;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      white-space: nowrap;
      z-index: 12;
      min-width: 16rem;
  }
  
  .apexcharts-canvas .card-body {
      padding: 0 14px;
      text-align: left;
      justify-content: left;
      align-items: center;
  }
  
  .apexcharts-canvas .card-body span{
      padding: 5px 0px;
      display: inline-block;
      position: relative;
  }
  
  .semi_donut_chart::before{
      content: '';
      background: #fff;
      width: 51.1%;
      height: 66%;
      position: absolute;
      left: 50%;
      top: 48%;
      transform: translate(-50%, -50%);
      border-radius: 50%;
      z-index: 1;
  }
  
  .see_more-btn {
      border: none;
      background: #ebebeb;
      color: #111111;
      display: inline-flex;
      align-items: center;
      cursor: pointer;
      height: 3.8rem;
      width: 11.1rem;
      justify-content: center;
      position: relative;
  }
  
  .see_more-btn span{
      display: block;
      left: -7px;
      position: inherit;
  }
  
  .see_more-btn svg {
     position: absolute;
     right: 1.3rem;
  }
  
  .donut_chart {
      max-width: 340px;
  }
  
  .chart__wrapper {
      margin-top: 2rem;
  }
  
  .stt_wrapper .form_wrap {
      width: 175px;
  }
  
  
  
  .stt_wrapper .form_wrap_medium, .filter_form_group .form_wrap_medium {
      width: 300px;
  }
  .filter_form_group {
      margin-bottom: 2rem;
  }
  
  .table__wrapper {
      margin-top: 3rem;
      position: relative;
  }
  
  .table__wrapper .table_title {
      font-weight: 600;
      margin-bottom: 10px;
  }
  
  .table__wrapper .table_title span{
      font-size: 80%;
  }
  
  .table-stt {
      width: 100%;
  }
  
  .table__wrapper .table-nodata {
      position: absolute;
      bottom: -60px;
      border: 1px solid #ebebeb;
      border-top: none;
      height: 60px;
      line-height: 60px;
      text-align: center;
      width: 100%;
  }
  
  .table-stt, .table-stt th, .table-stt td {
      border: 1px solid #E4E6EE;
      border-collapse: collapse; 
      text-align: center;
  }
  
  .table-stt th, .table-stt td {
      padding: 1rem;
      font-size: 15px;
      line-height: 24px;
  }
  
  .table-stt td {
      color: #444;
  }
  
  .table-stt th {
      background-color: #F5F6F9;
      color: #111;
      font-weight: 600;
  }
  
  .chart_name {
      font-weight: 600;
      color: #111;
      text-align: center;
      margin-bottom: 2rem;
  }
  .chart_name_donut {
      margin-bottom: 2rem;
  }
  
  .usage_directions_wrapper .see_more-btn--wrapper {
      display: flex;
      justify-content: flex-end;
      margin-bottom: 1rem;
      width: 100%;
  }
  
  .map_chart_wrapper {
      height: 60vh;
      position: relative;
      margin-top: 2rem;
      border: 1px solid #5e5c5e;
      background: rgba(217,214,215,255);
  }
  
  .map_chart_wrapper .overlay_image {
      width: 100%;
      height: 100%;
      background-image: url(/images/default_service.png);
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
  }
  
  .map_chart_wrapper .overlay_box {
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      position: absolute;
      background: #d9d6d7;
      opacity: 0.5;
  }
  
  .map_chart_wrapper .default_text {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50% , -50%);
      font-size: 1.8rem;
      z-index: 1;
      color: #000;
  }
  
  .form_wrap input {
      height: 3.5rem;
      width: 100%;
      border-radius: 0.8rem;
      padding: 0 1rem;
      outline: none;
      border-width: 1px;
  }
  
  .hyphen-text {
      margin: 0 0.5rem;
  }
  
  .statistic_page .service_name_filter, .statistic_page .select_large {
      width: 30%;
  }
  
  .statistic_page .action_btn_wrapper {
      margin-left: 1rem;
  }
  
  .statistic_page .action_btn_wrapper button {
      background-color: #ebebeb;
      border: 1px solid #ebebeb;
      height: 3.8rem;
      width: 11.1rem;
      cursor: pointer;
      color: #111;
  }
  
  .statistic_page .action_btn_wrapper button:hover {
      opacity: 0.7;
  }
  
  .tag-container {
      color: #1e74b6;
      font-weight: 600;
      margin-top: 0.3rem;
  }
  
  .statistic_page input.choices__input[name='search_terms']{
      display: none;
  }
  
  .choices-selected-text {
      font-weight: 500;
  }
  
  .statistic_page .choices__inner {
      border-radius: 0!important;
      border-color: #ccc;
      box-shadow: none;
  }
  
  .statistic_page .form_wrap {
      width: auto;
      margin-right: 1.5rem;
  }
  
  .statistic_page .form_wrap_small {
      margin-right: 0;
  }
  
  .statistic_page .form_wrap .choices {
      height: 3.8rem;
      width: 18rem;
  }
  
  .statistic_page .choices__list {
      color: #999;
  }
  
  .statistic_page .choices[data-type*=select-one]::after {
      content: '\f078';
      font: normal 900 1em/1 "Font Awesome 6 Free";
      border: none;
      color: #999;
      top: 50%;
      right: 1rem;
      transform: translateY(-50%);
      margin-top: 0;
      width: auto;
      height: auto;
      font-size: 1.2rem;
  }
  
  .statistic_page .choices[data-type*=select-one].is-open::after {
      content: '\f077';
  }
  
  .statistic_page .choices__list--dropdown, .choices__list[aria-expanded] {
      border-radius: 0;
      border-color: #ccc;
  }
  
  .statistic_page .form_wrap input {
      height: 3.8rem;
      width: 18rem;
      color: #999;
      border: 1px solid #cccccc;
      border-radius: 0;
  }
  
  .statistic_page #dateRangePicker .form_wrap {
      width: 14.8rem;
  }
  
  .statistic_page #dateRangePicker .form_wrap_small input{
      width: 14.8rem;
  }
  
  .statistic_page #dateRangePicker .form_wrap::after {
      content: '';
      background: url(../images/calendar.svg) no-repeat;
      position: absolute;
      top: 50%;
      right: 1rem;
      width: 18px;
      height: 18px;
      background-color: #fff;
      z-index: 98;
      transform: translateY(-50%);
  }
  
  .statistic_page .datepicker-dropdown, .statistic_page .datepicker-dropdown .datepicker-picker {
      width: 100%;
  }
  
  .statistic_page .datepicker-grid {
      width: 100%;
  }
  
  /* end statistic page */
  
  /* FE POI detail */
  #service_frame .main_contents .ui_poi_detail {
      position: absolute;
      display: none;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0, 0, 0, 0.7);
      z-index: 10;
      text-align: center;
  }
  #service_frame .main_contents .ui_poi_detail.active {
      display: block;
      animation: fade-in 0.3s;
  }
  #service_frame .main_contents .ui_poi_detail .btn_circleclose {
      position: absolute;
      top: 15px;
      left: auto;
      right: 20px;
      bottom: auto;
      z-index: 9;
  }
  .poi_detail_slide-swiper {
      height: 100%;
      background-color: #000;
  }
  .poi_detail_slide .swiper-slide {
      align-items: center;
      display: flex;
  }
  .poi_detail_slide .image-wrapper {
      width: 100%;
      max-height: 100%;
      overflow: hidden;
      display: flex;
      transition: all 300ms;
      align-items: center;
      justify-content: center;
  }
  .ui_poi_detail.zoom-mode .poi_detail_slide .image-wrapper img {
      max-width: 100%;
      height: auto;
      margin: 0 auto;   
  }
  .ui_poi_detail:not(.zoom-mode) .poi_detail_slide .image-wrapper img {
      margin: 0 auto;
      width: auto;
      height: auto;
      max-width: 100%;
      max-height: 100%;
  }
  .ui_poi_detail:not(.zoom-mode) .poi_detail_slide .image-wrapper {
      height: 100%;
  }
  body #loading-block.nx-block-temporary-position {
      position: fixed !important;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 9;
  }
  body #loading-block.nx-block-temporary-position .notiflix-block.nx-with-animation {
      background: rgba(0, 0, 0, 0.4) !important;
  }
  body #loading-block.nx-block-temporary-position .notiflix-block-message {
      color: #fefefe !important;
      font-size: 20px !important;
  }
  
  .poi_detail_slide .slide-count {
      position: absolute;
      top: auto;
      left: auto;
      right: 10px;
      bottom: 7px;
      z-index: 9;
      color: #fff;
      font-size: 10px;
      display: flex;
      align-items: center;
      background: rgba(0, 0, 0, 0.4);
      border-radius: 15px;
      padding: 3px 6px;
      letter-spacing: 1px;
  }
  .ui_poi_detail.active.content-up .poi_detail_slide {
      bottom: 0;
  }
  .ui_poi_detail.content-up .poi_detail_content {
      top: 0;
  }
  .ui_poi_detail.content-up .poi_detail_slide .image-wrapper {
      height: 0;
  }
  .poi_detail_slide {
      width: 100%;
      position: absolute;
      transition: all 0ms;
      top: 0;
      bottom: 60%;
  }
  .poi_detail_content {
      width: 100%;
      bottom: 0;
      top: 40%;
      background-color: #fff;
      text-align: left;
      position: absolute;
      padding: 31px 30px 30px;
      opacity: 1;
      visibility: visible;
      transition: all 0ms;
      overscroll-behavior: contain;
  }
  .poi_detail_content.height-100 {
      top: 100%;
  }
  .poi_detail_content-title {
      font-size: 12px;
      color: #8C8C8C;
      padding-bottom: 20px;
      margin-bottom: 8px;
      border-bottom: 1px solid #242424;
  }
  .poi_detail_content-title p {
      font-size: 12px;
      color: #8C8C8C;
      margin-bottom: 15px;
  }
  .poi_detail_content-title p span {
      color: #8C8C8C;
      padding: 0 6px;
  }
  .poi_detail_content-title h4 {
      font-weight: 700;
      font-size: 26px;
      line-height: 34px;
      color: #242424;
  }
  .poi_detail_content-items {
      height: calc(100% - 199px);
      overflow-y: auto;
      overflow-x: hidden;
      margin: 0 -30px;
      padding: 0 30px;
  }
  .poi_detail_content-item {
      border-bottom: 1px solid #EEEEEE;
      padding: 24px 0 17px;
  }
  .poi_detail_content-item h5 {
      font-weight: 700;
      font-size: 16px;
      color: #242424;
      margin-bottom: 14px;
      line-height: 21px;
  }
  .poi_detail_content-item p {
      font-size: 14px;
      color: #000000;
      line-height: 20px;
      word-break: keep-all;
      white-space: pre-wrap;
  }
  .poi_detail_content-actions {
      text-align: center;
      display: flex;
      background: #FFFFFF;
      box-shadow: 0px -2px 12px rgba(0, 0, 0, 0.2);
      position: absolute;
      bottom: 0;
      top: auto;
      left: 0;
      right: 0;
      z-index: 9;
      padding: 0 20px;
  }
  .poi_detail_content-actions >button {
      width: 100%;
      margin: 30px 5px;
      justify-content: center;
  }
  .poi_detail_content-actions >button.btn_whiteround {
      box-shadow: none;
      border: 1px solid #111111;
      font-weight: normal;
      color: #111111;
  }
  .ui_poi_detail.active.zoom-mode .btn_circleclose {
      display: none;
  }
  .ui_poi_detail .btn_circleclose_zoom {
      display: none;
      position: absolute;
      top: 15px;
      left: auto;
      right: 20px;
      bottom: auto;
      z-index: 9;
  }
  .ui_poi_detail.active.zoom-mode .btn_circleclose_zoom {
      display: block;
  }
  
  .ui_poi_detail.active.zoom-mode .poi_detail_content {
      opacity: 0;
      visibility: hidden;
  }
  .ui_poi_detail.active.zoom-mode .poi_detail_slide {
      height: 100%;
      display: flex;
      align-items: center;
  }
  .ui_poi_detail.active.zoom-mode .slide-count {
      transform: translateX(-50%);
      left: 50%;
      top: auto;
      bottom: 30px;
      right: auto;
  }
  .ui_poi_detail.zoom-mode .swiper-horizontal>.swiper-pagination-bullets, 
  .ui_poi_detail.zoom-mode.swiper-pagination-bullets.swiper-pagination-horizontal, 
  .ui_poi_detail.zoom-mode .swiper-pagination-custom, .swiper-pagination-fraction {
      bottom: 55px;
  }
  .btn_circleclose_zoom::after {
      /* content: ''; */
      display: block;
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 9;
  }
  .ui_poi_detail .btn_circleclose {
      color: #fff;
      background: rgba(0, 0, 0, 0.6) url(/images/icon_close.svg) center no-repeat;
  }
  .btn_circleclose_zoom {
      width: 36px;
      height: 36px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px;
      font-weight: normal;
      color: #1111;
      background: url(/images/icon_close.svg) center no-repeat;
      border-radius: 18px;
      -moz-border-radius: 18px;
      -webkit-border-radius: 18px;
      cursor: pointer;
  }
  .ui_poi_detail .btn_circleclose.on,
  .ui_poi_detail .btn_circleclose:hover,
  .btn_circleclose_zoom:hover,
  .btn_circleclose_zoom.on {
      background: #fff url(/images/icon_x_blue.svg) center no-repeat;
  }
  .btn-drag {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 15px;
      opacity: 0;
      cursor: pointer;
  }
  
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
      background: #fff;
      opacity: 1;
  }
  .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
      margin: 0 var(--swiper-pagination-bullet-horizontal-gap,3px);
  }
  .swiper-pagination-bullet {
      width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,6px));
      height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,6px));
      background: var(--swiper-pagination-bullet-inactive-color,#fff);
      opacity: var(--swiper-pagination-bullet-inactive-opacity, .5);
  }
  .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
      bottom: 6px;
  }
  .note {
      font-weight: bold;
      font-size: 16px;
  }
  .align-center{
      text-align: center;
  }
  .choices__item, .choices__placeholder,
  .choices__list--single .choices__item {
      text-overflow: ellipsis;
      overflow-x: hidden;
  }
  /* End FE POI detail */
  
  
  /* Start FE POI list */
  #poilist_frame {
      padding-top: 60px;
  }
  
  .poi_list .top_area .right_side {
      display: flex;
      align-items: center;
  }
  .poi_list .top_area .right_side .btn_white,
  .poi_list .top_area .right_side .btn_dkblue {
      width: 179px;
      margin-left: 12px;
      border: 1px solid #002756;
  }
  
  #input-file {
      position: absolute;
      opacity: 0;
      visibility: hidden;
  }
  .label-import {
      display: flex;
      align-items: center;
      justify-content: center;
  }
  
  
  .rm_title_poi {
      position: relative;
      top: -36px;
      left: 280px;
      opacity: 0.5;
  }
  
  .rm_des_poi {
      position: relative;
      top: -108px;
      left: 280px;
      opacity: 0.5;
  }
  
  .poi_detail_item {
      height: 115px;
  }
  .img_slide_poi {
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      margin-bottom: 10px;
      border: 5px #ffffff solid;
  }
  .rm_img_poi {
      position: relative;
      left: 275px;
      opacity: 0.8;
  }
  .rm_img_poi img {
      border-radius: 12px;
      -moz-border-radius: 12px;
      -webkit-border-radius: 12px;
      background: #ffffff;
  }
  .pf_padrow .swiper-pagination span {
      text-shadow: 1px 1px #ffffff;
  }
  .pf_padrow .upload_image_files  .slide-image-poi {
      width: 322px;
      height: 20.4rem;
  }
  /* End FE POI list */
  
  /* floor bar in admin statistics for main route direction*/
  .map_chart_container {
      position: relative;
  }
  .map_chart_container .mf_floorbar {
      position: absolute;
      left: 20px;
      bottom: 100px;
      width: 46px;
      overflow: hidden;
      background: #fff;
      -webkit-border-radius: 23px;
      -moz-border-radius: 23px;
      border-radius: 23px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
      z-index: 9;
  }
  
  .map_chart_container .mf_floorbar.over {
      max-height: 260px;
      padding: 25px 0;
      overflow: clip;
      z-index: 88;
  }
  
  .map_chart_container .mf_floorbar .swiper-wrapper {
      display: initial;
  }
  
  .map_chart_container .mf_floorbar.over .swiper-wrapper {
      display: flex;
  }
  
  .map_chart_container .mf_floorbar .swiper-slide {
      width: 46px;
      height: 46px;
      padding: 0;
      background: initial;
      box-shadow: initial;
      border-radius: initial;
      -moz-border-radius: initial;
      -webkit-border-radius: initial;
  }
  
  .map_chart_container .mf_floorbar .floor-button-prev {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 1;
      display: flex;
      justify-content: center;
      align-items: end;
      font-size: 10px;
      height: 20px;
      background: #fff;
      -webkit-border-top-left-radius: 25px;
      -webkit-border-top-right-radius: 25px;
      -moz-border-radius-topleft: 25px;
      -moz-border-radius-topright: 25px;
      border-top-left-radius: 25px;
      border-top-right-radius: 25px;
  }
  
  .map_chart_container .mf_floorbar .floor-button-next {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      z-index: 1;
      display: flex;
      justify-content: center;
      align-items: baseline;
      font-size: 10px;
      height: 20px;
      background: #fff;
      -webkit-border-bottom-right-radius: 25px;
      -webkit-border-bottom-left-radius: 25px;
      -moz-border-radius-bottomright: 25px;
      -moz-border-radius-bottomleft: 25px;
      border-bottom-right-radius: 25px;
      border-bottom-left-radius: 25px;
  }
  
  .map_chart_container .mf_floorbar .swiper-button-disabled {
      color: rgba(103, 103, 103, 0.4);
  }
  
  .map_chart_container .mf_floorbar .btn_floors_on {
      background-color: #002756;
      color: #fff;
  }
  .main_item_route {
      cursor: pointer;
  }
  .item_route_active {
      opacity: 0.5
  }
  .chart_circle_direction {
      display: flex;
      align-items: center;
      justify-content: center;
  }
  .chart_coupon_events {
      min-height: 293px;
  }
  .main_item_poi img {
      cursor: pointer;
  }
  .no-click {
      pointer-events: none;
      opacity: 0.6;
  }
  .apexcharts-canvas {
      margin: auto;
  }
  
  .apexcharts-legend-text {
      cursor: pointer;
  }
  .col-circle{
      height: 300px
  }
  .keyword_chart {
      height: 60vh
  }
  
  /*Style for pagination*/
  .pagination {
    display: flex;
    list-style: none;
  }
  .pagination li {
    flex: 1;
    margin: 0px 5px;
    background: #dde1e7;
    border-radius: 3px;
  }
  .pagination li a {
    font-size: 18px;
    text-decoration: none;
    color: #4d3252;
    height: 45px;
    width: 55px;
    display: block;
    line-height: 45px;
  }
  .pagination li:first-child a {
    width: 120px;
  }
  .pagination li:last-child a {
    width: 100px;
  }
  .pagination li.active {
    box-shadow: inset -3px -3px 7px #ffffff73,
      inset 3px 3px 5px rgba(94, 104, 121, 0.288);
  }
  .pagination li.active a {
    font-size: 17px;
    color: #6f6cde;
  }
  .pagination li:first-child {
    margin: 0 15px 0 0;
  }
  .pagination li:last-child {
    margin: 0 0 0 15px;
  }
  .backlinkbt {
      width: 45px;
      height: 45px;
      margin: 4px 0 0 0px;
      padding: 0;
      border: 0;
      background: transparent url(/images/icon_back.svg) center no-repeat;
      background-size: cover;
      outline: none;
      cursor: pointer;
      border-radius: 22px;
  }
  .backlinkbt_off {
      display: none;
  }
  .search_input_adv {
      position: absolute;
      width: 88%;
      left: 40px;
  }
  .back_btn_adv {
      z-index: 50;
      left: 50px;
  }
  .apexcharts-datalabel-label{
      font-weight: 600;
  }
  .apexcharts-datalabel,.apexcharts-datalabel-value,.apexcharts-datalabels,.apexcharts-pie-label {
      font-weight: 500;
  }
  .apexcharts-text tspan {
      font-size: 12px;
  }
  .blockEvent{
      margin: 14px 0 !important;
      border: 1px #ffffff75 solid;
      border-radius: 5px;
      padding: 13px 0 !important;
      border-left: none;
      border-right: none;
  }
  
  /* Simple scrollbar*/
  .scroll--simple::-webkit-scrollbar,.ui-setting_popup-head >div::-webkit-scrollbar, .la_body::-webkit-scrollbar, .notiflix-confirm-head >div::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
  .scroll--simple::-webkit-scrollbar-track {
    border-radius: 10px;
    background: rgba(209, 206, 210, 0.829);
  }
  .scroll--simple::-webkit-scrollbar-thumb{
    border-radius: 10px;
    background: rgba(42, 6, 83, 0.707);
  }
  .scroll--simple::-webkit-scrollbar-thumb:hover{
    background: rgba(0,0,0,0.4);
  }
  .scroll--simple::-webkit-scrollbar-thumb:active{
    background: rgba(0,0,0,.9);
  }
  /*-----*/
  .ui-setting_popup-head >div::-webkit-scrollbar-track {
      border-radius: 10px;
      background: rgba(241, 239, 242, 0.912);
  }
  .ui-setting_popup-head >div::-webkit-scrollbar-thumb{
      border-radius: 10px;
      background: rgba(41, 154, 137, 0.813);
  }
  .ui-setting_popup-head >div::-webkit-scrollbar-thumb:hover {
      background: rgba(0,0,0,0.4);
  }
  .ui-setting_popup-head >div::-webkit-scrollbar-thumb:active{
      background: rgba(12, 2, 75, 0.588);
  }
  /*****/
  .notiflix-confirm-head >div::-webkit-scrollbar-track {
      border-radius: 10px;
      background: rgba(241, 239, 242, 0.912);
  }
  .notiflix-confirm-head >div::-webkit-scrollbar-thumb{
      border-radius: 10px;
      background: rgba(41, 154, 137, 0.813);
  }
  .notiflix-confirm-head >div::-webkit-scrollbar-thumb:hover{
      background: rgba(0,0,0,0.4);
  }
  .notiflix-confirm-head >div::-webkit-scrollbar-thumb:active{
      background: rgba(12, 2, 75, 0.588);
  }
  /*------*/
    .la_body::-webkit-scrollbar-track {
      border-radius: 10px;
      background: rgba(209, 206, 210, 0.829);
    }
    .la_body::-webkit-scrollbar-thumb{
      border-radius: 10px;
      background: rgba(21, 3, 43, 0.707);
    }
    .la_body::-webkit-scrollbar-thumb:hover{
      background: rgba(0,0,0,0.4);
    }
    .la_body::-webkit-scrollbar-thumb:active{
      background: rgba(0,0,0,.9);
    }
  
  .iconDetail {
      width: 36px;
      height: 46px;
      background: transparent url(/images/icon_detail.svg) center no-repeat;
      position: absolute;
      right: 15px;
      top: 20px;
  }
  .iconPoiDetail {
      top: 15px !important;
      right: 15px !important;
  }
  .unit_group {
      display: flex;
      background: rgba(28, 57, 151, 0.1);
      align-items: center;
      justify-content: center;
      height: 121px;
      overflow: hidden;
  }
  .unit_group .choices{
      width: 60px;
      margin-left: 5px;
      margin-bottom: 0;
  }
  .unit_group .choices[data-type*=select-one]::after {
      display: none;
  }
  .unit_group .choices .choices__inner{
      border: 1px solid rgba(28, 57, 151, 1);
      box-shadow: none;
  }
  .unit_group .choices .choices__inner .choices__list--single {
      padding: 4px;
      text-align: center;
  }
  .unit_group .choices .choices__item{
      font-size: 20px;
  }
  .unit_group span.unit_one {
      display: block;
      padding: 5px;
  }
  .unit_group .choices .choices__inner .choices__list .choices__item, .unit_group span.unit_one{
      font-size: 32px;
      color:#000;
      font-weight: 400;
  }
  #service_frame .ui_set_height .rtm_contents .rtm_box .rtm_group_bt {
      text-align: center;
  }
  #service_frame .ui_set_height .rtm_contents .rtm_box .rtm_group_bt span.lable_unit{
      font-size: 20px;
      padding-top: 20px;
      display: block;
      margin-left: 5px;
  }
  .unit_group .choices .choices__inner .choices__list--dropdown, .choices__list[aria-expanded] {
      margin-top: 2px;
      margin-bottom: 2px !important;
      border-radius: 5px;
  }
  .unit_group .unit_group_top{
      display: flex;
      height: 20%;
      width: 100%;
      position: absolute;
      top: 68px;
      background-image: linear-gradient(rgb(232 235 244 / 83%) 30%, rgba(0, 0, 0, 0), rgb(232 235 244 / 83%) 30%, rgb(45 4 4 / 0%));
  }
  .unit_group .unit_group_bottom{
      display: flex;
      height: 20%;
      width: 100%;
      position: absolute;
      bottom: 82px;
      background-image: linear-gradient( rgb(232 235 244 / 0%) 30%, rgba(0, 0, 0, 0),rgb(232 235 244 / 0%) 30%, rgb(231 235 243));
  }
  
  .number-picker {
      display: flex;
      position: relative;
      z-index: 9999;
  }
  
  .keen-slider {
      height: 42px;
      width: 55px;
      border: 1px solid #1C3997;
      margin: 0 5px;
      border-radius: 5px;
  }
  
  .keen-slider__slide {
      height: 100% !important;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 24px;
      color: #ccc;
      opacity: 0.7;
  }
  
  .keen-slider__slide.active {
      height: 100% !important;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 32px;
      color: #000;
      opacity: 1;
  }
  .anychart-credits {
      display: none;
  }
  
  
  #service_frame .main_contents .ui_top_area .mf_routerbar{
      position: absolute;
      z-index: 4;
      width: 100%;
      background: #fff;
      display: none;
  }
  #service_frame .main_contents .ui_top_area .mf_routerbar.on{
      display: block;
  }
  
  .rt_header {
      display: flex;
      padding: 15px;
      justify-content: center;
      align-items: center;
  }
  .rt_content {
      transition: all 2s linear;
      padding-bottom: 10px;
      display: flex;
  }
  
  .rt_content .rt_content_col1, .rt_content .rt_content_col3{
      width: 15%;
      display: block;
      float: left;
  }
  .rt_content .rt_content_col3{
      width: 20%;
  }
  .rt_content .rt_content_col1 span{
      display: flex;
      height: 46px;
      align-items: center;
      font-size: 14px;
      font-weight: 400;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      justify-content: center;
  }
  .rt_content .rt_content_col1 div{
      display: flex;
      justify-content: center;
  }
  .rt_content .rt_content_col2{
      width: 68%;
      display: block;
      float: left;
  }
  .rt_content .rt_content_col2 .poi_end{
      margin-top: 15px;
  }
  .rt_header .btn_back {
      left: 30px;
  }
  #service_frame .main_contents .ui_top_area .mf_routerbar .mf_router_wrapper .btn_cancel {
      right: 21%;
      position: absolute;
      top: 65px;
      display: none;
  }
  #service_frame .main_contents .ui_top_area .mf_routerbar .mf_router_wrapper {
      touch-action: none;
  }
  #service_frame .main_contents .ui_top_area .mf_routerbar .mf_router_wrapper .item2 {
      right: 21%;
      position: absolute;
      top: 125px;
  }
  .rt_content.off, .mf_couponbar_container.off,.rt_footer.off,
  #service_frame .main_contents .ui_bottom_area .swiper-slide.off {
      display: none;
  }
  .rt_header .title_header {
      display: flex;
      font-family: 'Lato', 'Noto Sans KR', sans-serif;
      font-weight: 600;
      font-size: 16px;
      line-height: 21.79px;
  }
  .mf_router_info {
      display: none;
      position: absolute;
      top: 120%;
      background: #fff;
      height: 90vh;
      width: 100%;
      padding: 10px 15px 10px 15px;
      overflow: scroll;
      z-index: 99;
      overscroll-behavior: contain;
      overflow-x: hidden;
      transition: all .2s linear;
  }
  .mf_router_info.on {
      display: block;
      transition: all .2s linear;
  }
  .btn-router-item {
      display: flex;
      background: none;
      border: none;
      /* max-width: 270px; */
      color: #000;
      text-align: left;
  }
  .item-router-info {
      display: flex;
      align-items: center;
      padding-left: 4px;
      min-height: 40px;
  }
  .item-router-info.on {
      display: flex
  }
  .btn_demo_simulated {
      width: 46px;
      height: 46px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px !important;
      font-weight: bold;
      color: #b7b7b7;
      background: #002756 url(/images/demo_simulated_active.svg) center no-repeat;
      border-radius: 23px;
      -moz-border-radius: 23px;
      -webkit-border-radius: 23px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
      cursor: pointer;
      display: none;
  }
  .btn_demo_simulated.on {
      display: block;
  }
  .btn_demo_simulated.start {
      background: #fff url(/images/demo_simulated.svg) center no-repeat; 
  }
  .ui_bottom_area .mf_routebar .swiper-slide.two {
      /* height: 105px !important; */
      padding: 15px !important;
  }
  
  .ui_bottom_area .mf_routebar .swiper-slide.one .poi_title {
      top: 6px !important;
  }
  .ui_bottom_area .mf_routebar .swiper-slide.one .poi_subinfo {
      top: 0px !important;
  }
  .ui_bottom_area .mf_routebar .swiper-slide.route .poi_info {
      display: flex;
      align-items: center;
      height: 22px;
  }
  .ui_bottom_area .mf_routebar .swiper-slide.route .poi_info .pos_icon {
      width: auto !important;
      position: unset !important;
  }
  .ui_bottom_area .mf_routebar .swiper-slide.route .poi_info .pos_icon.move {
      left: 23.5px;
      position: absolute !important;
  }
  .ui_bottom_area .mf_routebar .swiper-slide.route .poi_info .pos_icon img{
      max-width: 25px !important;
      max-height: 25px !important;
  }
  .ui_bottom_area .mf_routebar .swiper-slide.route .poi_info .poi_title{
      position: unset !important;
      width: auto !important;
      align-items: center;
      padding: 1px 0 0 10px !important;
      max-width: 80%;
  }
  .ui_bottom_area .mf_routebar .swiper-slide.route .poi_info .poi_subinfo {
      align-items: center;
      padding: 7px 0 0 10px !important;
      position: unset !important;
  }
  .rt_footer {
      position: relative;
      width: 100%;
      height: 68px;
      display: flex;
      align-items: center;
      border-bottom: 1px #DADADA solid;
      background: #FAFBFF;
  }
  .rt_footer span{
      width: 50%;
      padding-left: 5px;
      display: flex;
  }
  
  .rt_footer span.btn_my_pos{
      border-right: 1px #e8e8e8 solid;
      height: 68px;
      align-items: center;
  }
  .rt_footer span.btn_my_pos.off{
      cursor: default;
      pointer-events: none;
  }
  .rt_footer span.btn_my_pos.off .txt_position{
      color:#d6d6d6;
  }
  .rt_footer span.btn_my_pos.off .icon_position{
      width: 46px;
      height: 26px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: transparent url(/images/my_location_button_off.svg) center no-repeat;
  }
  .rt_footer span .icon_position {
      width: 46px;
      height: 26px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: transparent url(/images/my_location_button.svg) center no-repeat;
  }
  .rt_footer span .icon_map {
      width: 46px;
      height: 26px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: transparent url(/images/location_button.svg) center no-repeat;
  }
  .rt_footer span img {
      height: 22px;
  }
  .rt_footer span span{
      padding-top: 3px;
      height: 22px;
      display: flex;
  }
  .rt_footer span span.txt_position {
      color: #002756;
  }
  
  .btn_search_route  {
      width: 52px;
      height: 102px;
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 14px;
      color: #fff;
      background: #002756;
      outline: none;
      cursor: pointer;
      border-radius: 30px;
      position: absolute;
      top: 53px;
      right: 8px;
      word-break: keep-all;
      white-space: pre-wrap;
  }
  
  .poi_pos {
      min-height: 45px;
      margin-top: 15px;
      background: #fff url(/images/bg_pos_off.svg) left no-repeat;
      background-position: 11px 20px;
      background-size: 1.5px 44px;
  }
  .poi_pos.off {
      background: #fff url(/images/bg_pos_off.svg) left no-repeat;
  }
  .poi_pos:last-child {
      padding-top: 25px;
      margin-top: 0px;
      background-position: 11px -6px;
  }
  .poi_pos .poi_subinfo {
      display: flex;
      left: 30px;
      color: #8C8C8C;
      padding: 0 !important;
  }
  .poi_pos .poi_info {
      display: flex;
      align-items: center;
      font-weight: 700;
  }
  .poi_pos .poi_info .poi_title{
      padding-left: 5px !important;
  }
  .poi_pos .poi_info img {
      height: 22px;
  }
  .item-router-info .icon_move {
      width: 16px;
      height: 38px;
      background: transparent url(/images/icon_move_off.svg);
      background-size: 16px 38px;
      /* background-position: 0px 0.5px; */
  }
  .item-router-info .icon_move.off {
      background: transparent url(/images/icon_move_off.svg) center no-repeat;
  }
  .item-router-info div img {
      height: 31px;
  }
  .mf_router_info .control_bar{
      height: 30px;
      margin-bottom: 25px;
      text-align: right;
      padding: 10px;
      margin-top:10px
  }
  .mf_router_info .control_bar .close-routeif{
      margin-right: 10px;
  }
  
  .poi_start {
      background: transparent url(/images/icon_pin_blue.svg) left center no-repeat;
      background-size: 26px;
      background-position: 10px;
  }
  .poi_end {
      background: transparent url(/images/icon_pin_red.svg) left center no-repeat;
      background-size: 26px;
      background-position: 10px;
      padding: 0px 45px 0 38px;
  }
  .poi_end.location, .poi_start.location {
      color:  #002756
  }
  .convert_bar {
      background: transparent url(/images/button_convert.svg) center no-repeat;
      width: 25px;
      height: 25px;
      position: absolute;
      right: 25px;
      top: 75px;
      z-index: 100;
      -moz-transition: all .2s linear;
      -webkit-transition: all .2s linear;
      transition: all .2s linear;
  }
  .mf_result_router .txt_history {
      padding: 20px 20px 10px;
      font-size: 14px;
      font-weight: 600;
      display: block;
  }
  
  .btn_convert {
      -moz-transition: all .2s linear;
      -webkit-transition: all .2s linear;
      transition: all .2s linear;
  }
  .btn_convert.down, .convert_bar.down {
      -moz-transform:rotate(180deg);
      -webkit-transform:rotate(180deg);
      transform:rotate(180deg);
  }
  .icon_draw_rt {
      width: 31px;
      height: 31px;
  }
  
  .icon_draw_rt.straight {
      background: transparent url(/images/go_straight_off.svg) center no-repeat;
  }
  .icon_draw_rt.turn {
      background: transparent url(/images/go_straight.svg) center no-repeat;
  }
  .icon_draw_rt.straight.on {
      background: transparent url(/images/go_straight_off.svg) center no-repeat;
  }
  .icon_draw_rt.right {
      background: transparent url(/images/turn_right_off.svg) center no-repeat;
  }
  .icon_draw_rt.right.on {
      background: transparent url(/images/turn_right_off.svg) center no-repeat;
  }
  .icon_draw_rt.left {
      background: transparent url(/images/turn_left_off.svg) center no-repeat;
  }
  .icon_draw_rt.left.on {
      background: transparent url(/images/turn_left_off.svg) center no-repeat;
  }
  .icon_draw_rt.elevator {
      background: transparent url(/images/elevator.svg) center no-repeat;
  }
  .icon_draw_rt.escalator-up {
      background: transparent url(/images/escalator.svg) center no-repeat;
      background-size: cover;
  }
  .icon_draw_rt.escalator-down {
      background: transparent url(/images/escalator.svg) center no-repeat;
      background-size: cover;
      transform: scaleX(-1);
  }
  .icon_draw_rt.stairs {
      background: transparent url(/images/stairs.svg) center no-repeat;
      background-size: cover;
  }
  .pass-symbols {
      width: 30px;
      height: 30px;
      background: transparent url(/images/visibility_off.svg) center no-repeat;
      display: flex;
      position: absolute;
      margin-top: -31px;
      margin-left: 265px;
      z-index: 999;
  }
  .pass-symbols.off {
      background: transparent url(/images/visibility.svg) center no-repeat;
  }
  .item_keep_login{
      display: inline-flex;
      align-items: center;
      margin-top: 10px;
  }
  .item_keep_login .tick_keep_login {
      width: 20px;
      height: 20px;
      display: block;
      position: static !important;
  }
  
  #signin-box [type="checkbox"]:checked+label:before {
      right: auto;
      left: 0;
      border: 1px solid #000;
      background: #fff;
      border-radius: 5px;
      width: 25px;
      height: 25px;
  }
  
  
  #signin-box [type="checkbox"]:not(:checked)+label,
  #signin-box [type="checkbox"]:checked+label {
      padding-right: 0;
      padding-left: 35px;
      height: 25px;
      display: flex;
      align-items: center;
      line-height: 1.2;
  }
  
  #signin-box [type="checkbox"]:disabled:checked+label:after {
      color: #666;
  }
  
  #signin-box [type="checkbox"]:disabled:not(:checked)+label:before,
  #signin-box [type="checkbox"]:disabled:checked+label:before {
      border-color: #000;
      background-color: #aaa;
  }
  
  #signin-box [type="checkbox"]:checked+label:after {
      color: #fff;
  }
  
  #signin-box [type="checkbox"]:checked+label:before {
      border-color: #000;
      background-color: #fff;
  }
  
  #signin-box [type="checkbox"]:checked+label:before {
      border-color: #000;
  }
  
  #signin-box [type="checkbox"]:not(:checked)+label:before,
  #signin-box [type="checkbox"]:checked+label:before {
      right: auto;
      left: 0;
      background: #fff;
      border: 1px rgba(0, 0, 0, 0.25) solid;
      border-radius: 5px;
      width: 20px;
      height: 20px;
  }
  #signin-box [type="checkbox"]:checked+label:before{
      background: #002756;
      border:none
  }
  
  #signin-box [type="checkbox"]:not(:checked)+label:after,
  #signin-box [type="checkbox"]:checked+label:after {
      top: -2px;
      right: auto;
      left: 0px;
      font-size: 18px;
      width: 20px;
      height: 20px;
      line-height: 25px;
      font-weight: bold;
  }
  
  /*********************language dropdow************/
  .nav-wrapper {
    text-align: center;
    height: 19px;
  }
    .sl-nav {
    display: inline;
  }
  .sl-nav ul {
    margin:0;
    padding:0;
    list-style: none;
    position: relative;
    display: inline-block;
  }
  .sl-nav li {
    cursor: pointer;
    padding-bottom:10px;
  }
  .sl-nav li ul {
    display: none;
  }
  .sl-nav li:hover ul {
    position: absolute;
    top:35px;
    right:-10px;
    display: block;
    background: #fff;
    /* width: 50px; */
    padding-top: 0px;
    z-index: 1;
    border-radius:5px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
  }
  .sl-nav li:hover .triangle {
    position: absolute;
    top: 25px;
    right: 3px;
    z-index:10;
    height: 14px;
    overflow:hidden;
    width: 30px;
    background: transparent;
    display: none;
  }
  .sl-nav li:hover .triangle:after {
    content: '';
    display: block;
    z-index: 20;
    width: 15px;
    transform: rotate(45deg) translateY(0px) translatex(10px);
    height: 15px;
    background: #fff;
    border-radius:2px 0px 0px 0px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
  }
  .sl-nav li ul li {
    position: relative;
    text-align: left;
    background: transparent;
    padding: 12px 8px;
    padding-bottom:0;
    z-index: 2;
    font-size: 14px;
    color: #3c3c3c;
  }
  .sl-nav li ul li:last-of-type {
    padding-bottom: 10px;
  }
  .sl-nav li ul li span {
    padding:5px 10px;
    border-radius: 5px;
    font-weight: 700;
  }
  .sl-nav li ul li span:hover {
    background-color: #888585 ;
    color: #fff;
  }
   .sl-nav li ul li span.active {
    color: #fff;
    background-color: #666 ;
  }
  .dropd_lang {
      height: 16px;
      margin: 6px 6px;
      color: #002756 ;
  }
  .pf_infobar .pi_title strong {
      color: #002756;
  }
  .field_rq {
      color: #FF2F01;
      font-size: 20px;
      padding: 0 5px;
      font-weight: 700;
  }
  .txt_recent{
      padding: 20px 0 20px 20px;
      font-size: 14px;
      font-weight: 700;
  }
  .txt_recent.off {
      display: none !important;
  }
  
  input::-ms-reveal,
  input::-ms-clear {
  display: none;
  }
  /*Assige multiple user*/
  
   .user_assige::-webkit-scrollbar{
      width: 4px;
      height: 4px;
    }
  .user_assige::-webkit-scrollbar-track {
      border-radius: 10px;
      background: rgba(209, 206, 210, 0.829);
      height: 80%;
    }
    .user_assige::-webkit-scrollbar-thumb{
      border-radius: 10px;
      background: rgba(12, 2, 75, 0.588);
    }
    .user_assige::-webkit-scrollbar-thumb:hover{
      background: rgba(0,0,0,0.4);
    }
    .user_assige::-webkit-scrollbar-thumb:active{
      background: rgba(12, 2, 75, 0.588);
    }
  /*-----*/
  
  .user_assige {
      display: flex;
      overflow-y: hidden;
      overflow-x: auto;
      height: 33px;
  }
  .suseremail {
      border: none;
      width: 500px;
      background: transparent;
  }
  .list_assige, .item_assige {
      display: flex;
      align-items: center;
  }
  .item_assige {
      background: #aaccdc;
      padding: 0px 8px;
      border-radius: 15px;
      margin-right: 10px;
      color: #571414;
      height: 22px;
  }
  .item_assige .email_assign {
      display: inline;
  }
  .item_assige .rm_btn {
      display: flex;
      opacity: 0.5;
      border: none;
      cursor: pointer;
      background: transparent url(/images/icon_delete_field.svg) center no-repeat;
      width: 15px;
      height: 13px;
      background-size: 12px;
      margin: 1px 0px 0 5px;
      border-left: 1px #fff solid;
      padding: 0px 20px 0 0px;
      align-items: center;
  }
  
  #exportData{
      right: 0;
      position: absolute;
      isolation: isolate;
      overflow: hidden;
      border: 1px #D0CDCD solid;
      padding: 10px 15px;
      top: -20px;
      border-radius: 5px;
      color: #000;
      cursor: pointer;
      align-items: center;
      font-weight: 400;
      display: none;
  }
  #exportData img {
      margin-right: 10px;
  }
  #exportData:hover {
      color: #fff;
      background-color: #002756;
      transition: 0.4s;
  }
  .cate_ct, #sl_adst_cate, #vsh_ad_stcate {
      display: none;
  }
  #vsh_ad_stcate span, #vsh_ad_stbuilding span{
      font-size: 12px;
      color: #10a9ff;
      cursor: pointer;
  }
  #vsh_ad_stbuilding {
      cursor: pointer;
  }
  .cate_ct.show, .building_ct.show {
      display: block !important;
      transition: all 2s linear;
  }
  
  .ui-setting_popup {
      background-color: #444444 !important;
      top: 60px !important;
      z-index: 20 !important;
  }
  .ui-setting_popup-overlay {
      background: none !important;
      height: calc(100% - 60px) !important;
      top:60px !important;
  }
  .preview_form.ui_setting {
      margin-top: 55px !important;
      position: absolute;
      top: 0;
      right: -310px;
      width: 270px !important;
      height: 490px;
      background: none;
  }
  .ui-setting_popup-head h5 {
      text-align: left !important;
      padding-left: 20px !important;
      /* border-bottom: 1px #e0dee1 solid !important; */
  }
  .ui-setting_popup-head {
      border-bottom: 1px solid rgba(0,0,0,.1) !important;
  }
  .title_preview_form {
      color: #fff;
      position: absolute;
      right: -263px;
      top: 33px;
      font-size: 18px;
  }
  .cate_box {
      display: flex;
      flex-wrap: wrap;
      width: 710px;
  }
  .cate_box [type="checkbox"]+label {
      padding-left: 27px !important;
      padding-right: unset;
      font-size: 12px;
  } 
  .cate_box [type="checkbox"]:checked+label:before,.cate_box [type="checkbox"]:not(:checked)+label:before {
      left: 0;
      right: auto;
      width: 20px;
      height: 20px;
      border-radius: 0;
      box-shadow: none;
      border: #ccc thin solid;
      top: auto;
  }
  .cate_box [type="checkbox"].un-check+label:after, .cate_box [type="checkbox"]:not(:checked)+label:after{
      content: '';
  }
  .cate_box [type="checkbox"]:checked+label:after {
      left: 3px;
      right: auto;
      width: 15px;
      height: 14px;
      border-radius: 0;
      font-size: 16px;
      box-shadow: none;
  }
  .item_list_cate {
      background: #fff;
      flex: 33.3%;
      max-width: 33.3%;
      padding: 2px;
  }
  .main_cate{
      border-bottom: 1px #C6DBE4 solid;
      padding: 5px;
      background:  #BDBDBD;
  }
  .main_cate .title_main_ct {
      color: #000;
  }
  .sub_cate {
      padding:0 5px 0 15px;
      background: #F7F5F5;
      border-top: 1px #fff solid;
  }
  .sub_cate [type="checkbox"]+label.disable {
      opacity: 0.5;
      pointer-events: none;
  }
  #cate_ct, #building_ct {
      width: 725px;
      background: #cacaca;
      min-height: 300px;
      max-height: 300px;
      overflow: auto;
      min-width: 710px;
      border-radius: 5px;
      padding: 5px;
  }
  #building_ct {
      margin-bottom: 10px;
      min-height: auto;
      display: block !important;
      width: 725px !important;
  }
  .form_wrap.building_ct {
      width: auto !important;
      display: block !important;
  }
  .cate_ct::-webkit-scrollbar, .building_ct::-webkit-scrollbar{
      width: 6px;
      height: 6px;
  }
  
  .cate_ct::-webkit-scrollbar-track, .building_ct::-webkit-scrollbar-track {
      border-radius: 10px;
      background: #fff;
      height: 80%;
  }
  .cate_ct::-webkit-scrollbar-thumb, .building_ct::-webkit-scrollbar-thumb{
      border-radius: 10px !important;
      background:  #737373 !important;
  }
  .cate_ct::-webkit-scrollbar-thumb:hover, .building_ct::-webkit-scrollbar-thumb:hover{
      background:  #999999;
  }
  .cate_ct::-webkit-scrollbar-thumb:active, .building_ct::-webkit-scrollbar-thumb:active{
      background:  #999999;
  }
  
  .row_item {
      border-top: 1px #ccc solid;
      display: block;
      width: 100%;
      float: left;
  }
  /*Tab style*/
  
  
  .tabs {
      display: flex;
      flex-wrap: wrap;
      background: #cacaca;;
  }
  .tabs .input {
      position: absolute;
      opacity: 0;
  }
  .tabs .label {
      padding: 10px 13px;
      background:  #666666;
      font-weight: bold;
      font-size: 12px;
      color: #fff;
      margin-right: 1px;
      -webkit-border-top-left-radius: 5px;
      -webkit-border-top-right-radius: 5px;
      -moz-border-radius-topleft: 5px;
      -moz-border-radius-topright: 5px;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
  }
  /* .tabs .label:hover {
      background: #fff;
      color:  #002756;
  } */
  .tabs .label:active {
      background:  #737373;
  }
  .tabs .input:focus + .label {
      z-index: 1; 
  }
  .tabs .input:checked + .label {
      background: #F7F5F5;
      color: #000;
      padding-left: 17px;
  }
  @media (min-width: 600px) {
      .tabs .label {
              width: auto;
      }
  }
  .tabs .panel {
      display: none;
      background: #F7F5F5;
  }
  
  @media (min-width: 600px) {
  .tabs .panel {
      order: 99;
  }
  }
  .tabs  .input:checked + .label + .panel {
  display: block;
  }
  .tabs [type="radio"]:not(:checked)+label:before,.tabs [type="radio"]:checked+label:before,
  .tabs [type="radio"]:not(:checked)+label:after,.tabs [type="radio"]:checked+label:after,
  .switch-toggle [type="radio"]:checked+label:before,.switch-toggle [type="radio"]:checked+label:after,
   .switch-toggle [type="radio"]:not(:checked)+label:before,.switch-toggle [type="radio"]:not(:checked)+label:after {
  display: none;
  }
  .tabs [type="radio"]:not(:checked)+label, [type="radio"]:checked+label {
  padding-left: 28px;
  }
  span.info_tab{
  font-size: 12px;
  color: #000;
  padding: 8px 10px;
  display: block;
  }
   .bt-showb, .bt-showbbd {
      width: 15px;
      height: 15px;
      background: transparent url(/images/show_box.svg) center no-repeat;
      float: right;
      margin-left: 5px;
      margin-top: 5px;
      -moz-transform: rotate(180deg);
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
      cursor: pointer;
   }
   .bt-showb.up, .bt-showbbd.up {
      margin-top: 4px;
      -moz-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
   }
  
   
  .bt_button_close_w {
      width: 30px;
      height: 30px;
      background: transparent url(/images/close_bt_white.svg) center no-repeat;
      position: absolute;
      top: 10px;
      right: -350px;
      z-index: 999;
      border: 1px #fff solid;
      cursor: pointer;
      border-radius: 5px;
  }
  
  a.logo_gnb {
      height: 57px;
      width: 124px;
      background: transparent url(/images/logo_d.png) center no-repeat;
      background-size: contain !important;
  }
  /*Sync button*/
  
  .poup_syncdata{
      width: 100%;
      height: 100%;
      display: flex;
      position: fixed;
      z-index: 999;
      top: 0;
      background: rgba(0, 0, 0, 0.4);
      animation-duration: 300ms;
  }
  .poup_syncdata_button {
      width: 40%;
  }
  .poup_syncdata_button:first-child {
      margin-right: 20px;
  }
  .poup_syncdata_ct{
      background: #fff;
      border: #002756 1px solid;
      border-radius: 8px;
      position: relative;
      margin: auto;
      padding: 30px 50px;
      color: #0D3A4F;
      min-width: 500px;
  }
  .poup_syncdata_ct_hd {
      width: 100%;
      display: flex;
      justify-content: center;
      margin-bottom: 20px;
      font-weight: 700;
      margin-top: -5px;
  }
  .poup_syncdata_ct_ft {
      display: flex;
      margin-top: 20px;
      align-items: center;
      justify-content: center;
  }
  .bt_button_close {
      width: 30px;
      height: 30px;
      background: transparent url(/images/close_popup.svg) center no-repeat;
      position: absolute;
      top: 4px;
      right: 20px;
      z-index: 999;
      border: none;
  }
  .call_action {
      width: 35px;
      height: 35px;
      background: transparent url(/images/call_icon.svg) center no-repeat;
  }
  .poi_detail_phone {
      display: flex;
      padding: 20px 0;
      border-bottom: 1px #eee solid;
      align-items: center;
  }
  .title_phone {
      display: block;
      width: 85%;
  }
  .title_phone span:first-child{
      display: flex;
      font-weight: 700;
      color: #242424;
      font-size: 16px;
      line-height: 21.79px;
      margin-bottom: 10px;
  }
  
  .voice{
      width: 30px;
      height: 30px;
      margin: 0;
      padding: 0;
      border: 0;
      color: #002756;
      background: none;
      font-size: 20px;
      font-weight: 400;
      outline: none;
      cursor: pointer;
      display: block;
      position: absolute;
      right: 19px;
  }
  .voice.off, .voice.one.off, .voice.two.off {
      display: none;
  }
  .voice_bt{
      width: 60px;
      height: 60px;
      margin: 0;
      padding: 0;
      border: 0;
      color: #1111;
      background: url(/images/voice_icon.png) center no-repeat;
      background-size: 40px;
      outline: none;
      cursor: pointer;
      display: block;
      position: absolute;
      z-index: 99;
  }
  
  .recording-load{
      width: 80px;
      height: 80px;
      margin: 0;
      padding: 0;
      border: 0;
      color: #1111;
      background: url(/images/eclipse.svg) center no-repeat;
      outline: none;
      cursor: pointer;
      display: block;
      position: absolute;
      z-index: 99;
  }
  .mic-btn {
      font-size: 24px;
      padding: 30px;
      border-radius: 50%;
      border: none;
      background-color: #002756;
      color: white;
      cursor: pointer;
      outline: none;
  }
  .recording-indicator {
      width: 80px;
      height: 80px;
      margin: 0;
      padding: 0;
      border-radius: 50%;
      background-color: rgb(0 39 86);
      right: 38px;
      /* transform: translate(-50%, -50%); */
      opacity: 0;
      pointer-events: none;
  }
  
  .recording-load.off, .recording-indicator.off {
      display: none;
  }
  .recording-indicator.pulsing {
      animation: pulse 1.5s infinite;
  }
  
  @keyframes pulse {
      0% {
          transform: translate(-0%, -0%) scale(1);
          opacity: 0.5;
      }
      50% {
          transform: translate(-0%, -0%) scale(1.5);
          opacity: 0.1;
      }
      100% {
          transform: translate(-0%, -0%) scale(1);
          opacity: 0.5;
      }
  }
  
  .ui_voice_search {
      background: #ffffff;
      width: 100%;
      height: 100%;
      display: none;
      z-index: 88;
      position: absolute;
  }
  .ui_voice_search.active {
      display: flex;    
      align-items: center;
      justify-content: center;
  }
  .tag_border_bt {
      display: block;
      width: 98%;
      margin: auto;
      opacity: 0.6;
  }
  .mbt-10 {
      height: auto;
      margin: 10px 0 !important;
  }
  .mt-15 {
      height: auto;
      margin-top: 15px !important;
  }
  .mt-10 {
      height: auto;
      margin-top: 10px !important;
  }
  .mbn-10 {
      height: auto;
      margin: 10px 0 15px 0 !important;
  }
  .mb-10 {
      margin-bottom: 10px !important;
  }
  
  .text_talk{
      display: block;
      position: absolute;
      top: 59%;
      font-size: 24px;
  }
  .btn_close_routerbar {
      width: 26px;
      height: 26px;
      background: #fff url(/images/icon_x.svg) center no-repeat;
      cursor: pointer;
      border: none;
      right: 20px;
      position: absolute;
      display: none;
  }
  .btn_close_routerbar.on {
      display: block;
  }
  .voice.one {
      right: 87px;
      top: 59px;
  }
  .voice.two {
      right: 87px;
      top: 120px;
  }
  
  .txt_noresult{
      display: block;
      left: 35px;
      position: absolute;
      top: 20px;
      font-size: 14px;
      color: #ababab;
  }
  
  .building_table tbody tr {
    background: #cacaca;
    color: #000;
  }
  .building_table tbody tr td input[type="checkbox"]:checked+label, .building_table tbody tr td input[type="checkbox"]:not(:checked)+label{
      width: 35px;
      padding-right: 0px;
  }
  .building_table tbody tr td [type="radio"]:not(:checked)+label:before{
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      width: 18px;
      height: 18px;
      border: 1px solid #41464b;
      background: #ffffff;
      border-radius: 12px;
      -moz-border-radius: 12px;
      -webkit-border-radius: 12px;
      box-shadow: none;
  }
  .building_table tbody tr td [type="radio"]:checked+label:before{
      background: #543182;
      border-width: 2px;
  }
  .building_table tbody tr td [type="radio"]:checked+label:after{
      top: 3px;
      left: 3px;
      border: 5px solid #543182;
  }
  .building_table [type="radio"]:checked+label:before {
      background: #543182;
      border-width: 2px;
  }
  .building_table tbody tr td [type="radio"]:not(:checked)+label:after {
      content: '';
      position: absolute;
      top: 3px;
      left: 3px;
      border: 6px solid #0072cf;
      border-radius: 50%;
      -moz-border-radius: 50%;
      -webkit-border-radius: 50%;
      background: #335bba;
      transition: all .1s;
      width: 0;
      height: 0;
  }
  
  @media (min-width: 768px) {
      #service_frame .main_contents .ui_bottom_area .mf_floorbar{
          left: auto;
          top: auto;
          bottom: auto;
          right: auto;
          position: relative;
      }
      #service_frame .main_contents .ui_bottom_area .mf_floorbar_container{
        left: 32px;
      }
      #service_frame .main_contents .ui_bottom_area .mf_floorbar_container .mf_floorbar {
          position: relative;
      }
      #service_frame .main_contents .ui_building_mode .rtm_contents {
          width: 350px;
          left: calc(50vw - 175px);
          right: auto;
      }
      #service_frame .main_contents .ui_building_mode .rtm_contents .rtm_box {
          padding: 20px;
      }
      #service_frame .main_contents .ui_building_mode .rtm_contents .btn_circleclose {
          right: 16px;
          top: 16px;
      }
  }

  .walking-preview {
    background-color: #fff;
  }