::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #bbb;
  opacity: 1; /* Firefox */
}
:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #bbb;
}
::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #bbb;
}
#compass {
  bottom: 0px !important;
}
body {
  overflow: hidden;
}
body {
  font-family: 'Noto Sans KR', sans-serif !important;
  line-height: 1.3 !important;
}
[role='button'] {
  cursor: pointer;
}
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
input[type='number'] {
  -moz-appearance: textfield;
}
.MuiTooltip-tooltipPlacementTop {
  transform: translateY(7px) !important;
}
.MuiTooltip-tooltipPlacementTop,
.MuiTooltip-tooltipPlacementBottom,
.MuiTooltip-tooltipPlacementLeft,
.MuiTooltip-tooltipPlacementRight {
  transition: none !important;
}

.MuiOutlinedInput-input {
  padding: 0px 14px !important;
}
.MuiSelect-outlined.MuiSelect-outlined {
  padding-right: 32px !important;
}

.toastError {
  border-left: 5px solid rgb(255, 94, 94) !important;
}
.toastSuccess {
  border-left: 5px solid rgb(125, 204, 125) !important;
}
/* 지도위에 로드뷰의 위치와 각도를 표시하기 위한 map walker 아이콘의 스타일 */
.MapWalker {
  position: absolute;
  margin: -26px 0 0 -51px;
}
.MapWalker .figure {
  position: absolute;
  top: -2px;
  left: 38px;
  width: 25px;
  height: 39px;
  background: url(http://i1.daumcdn.net/localimg/localimages/07/2012/roadview/roadview_minimap_wk.png) -298px -114px
    no-repeat;
}
.MapWalker .angleBack {
  width: 102px;
  height: 52px;
  background: url(http://i1.daumcdn.net/localimg/localimages/07/2012/roadview/roadview_minimap_wk.png) -834px -2px
    no-repeat;
}
.MapWalker.m0 .figure {
  background-position: -298px -114px;
}
.MapWalker.m1 .figure {
  background-position: -335px -114px;
}
.MapWalker.m2 .figure {
  background-position: -372px -114px;
}
.MapWalker.m3 .figure {
  background-position: -409px -114px;
}
.MapWalker.m4 .figure {
  background-position: -446px -114px;
}
.MapWalker.m5 .figure {
  background-position: -483px -114px;
}
.MapWalker.m6 .figure {
  background-position: -520px -114px;
}
.MapWalker.m7 .figure {
  background-position: -557px -114px;
}
.MapWalker.m8 .figure {
  background-position: -2px -114px;
}
.MapWalker.m9 .figure {
  background-position: -39px -114px;
}
.MapWalker.m10 .figure {
  background-position: -76px -114px;
}
.MapWalker.m11 .figure {
  background-position: -113px -114px;
}
.MapWalker.m12 .figure {
  background-position: -150px -114px;
}
.MapWalker.m13 .figure {
  background-position: -187px -114px;
}
.MapWalker.m14 .figure {
  background-position: -224px -114px;
}
.MapWalker.m15 .figure {
  background-position: -261px -114px;
}
.MapWalker.m0 .angleBack {
  background-position: -834px -2px;
}
.MapWalker.m1 .angleBack {
  background-position: -938px -2px;
}
.MapWalker.m2 .angleBack {
  background-position: -1042px -2px;
}
.MapWalker.m3 .angleBack {
  background-position: -1146px -2px;
}
.MapWalker.m4 .angleBack {
  background-position: -1250px -2px;
}
.MapWalker.m5 .angleBack {
  background-position: -1354px -2px;
}
.MapWalker.m6 .angleBack {
  background-position: -1458px -2px;
}
.MapWalker.m7 .angleBack {
  background-position: -1562px -2px;
}
.MapWalker.m8 .angleBack {
  background-position: -2px -2px;
}
.MapWalker.m9 .angleBack {
  background-position: -106px -2px;
}
.MapWalker.m10 .angleBack {
  background-position: -210px -2px;
}
.MapWalker.m11 .angleBack {
  background-position: -314px -2px;
}
.MapWalker.m12 .angleBack {
  background-position: -418px -2px;
}
.MapWalker.m13 .angleBack {
  background-position: -522px -2px;
}
.MapWalker.m14 .angleBack {
  background-position: -626px -2px;
}
.MapWalker.m15 .angleBack {
  background-position: -730px -2px;
}
[data-tooltip] {
  position: relative;
  font-family: 'Noto Sans KR';
  &:hover::before {
    position: absolute;
    top: calc(50% - 0px);
    right: -4px;
    z-index: 1;
    width: 0;
    height: 0;
    border-color: transparent #222 transparent transparent;
    border-style: solid;
    border-width: 7px 9px 7px 0px;
    transform: translate(100%, -50%);
    /* &::before { */
    content: '';
  }

  &:hover::after {
    position: absolute;
    top: 50%;
    right: -11px;
    z-index: 1;
    width: max-content;
    padding: 10px;
    color: #fff;
    font-weight: 400;
    font-size: 14px;
    /* &::after { */
    font-family: 'Noto Sans KR';
    font-style: normal;
    line-height: 20px; /* 142.857% */
    white-space: pre;
    background-color: #222;
    border-radius: 4px;
    transform: translate(100%, -50%);
    content: attr(data-tooltip);
  }
}

.toast-body {
  padding: 0 4px;
  font-size: 14px;
  line-height: 15px;
  white-space: nowrap;
}

.MuiButtonBase-root.MuiAccordionSummary-root.Mui-expanded {
  min-height: 48px;
}

.MuiPaper-root .MuiAccordionSummary-content {
  margin: 0;
}
.MuiPaper-root .MuiAccordionSummary-content.Mui-expanded {
  margin: 0;
}
.MuiPaper-root.MuiPaper-elevation1 {
  box-shadow: none;
}

.MuiPaper-root.MuiPopover-paper {
  margin-top: 4px;
}

.MuiMenuItem-root.MuiListItem-root {
  min-height: 32px;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
}
.MuiMenuItem-root.MuiListItem-root:hover {
  background-color: #f9f9f9;
}

.MuiMenuItem-root.MuiListItem-root.Mui-selected {
  color: #ffffff;
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  background-color: #2b5184;
}
.MuiMenuItem-root.MuiListItem-root.Mui-selected:hover {
  color: #ffffff;
  background-color: #2b5184;
}

.rc-slider-mark-text {
  word-break: keep-all;
}