.ssm-map-d {
  display: flex;
  flex-direction: column;
  background-color: #fff;

  --fil-sel: brightness(0) saturate(100%) invert(8%) sepia(95%) saturate(7454%)
    hue-rotate(11deg) brightness(97%) contrast(114%);

  ::-webkit-input-placeholder {
    font-size: 12px;
    color: #aaa;
  }

  &.dt {
    // position: fixed;
    width: 100%;
    height: 100%;
    // top: 0;
    // bottom: 0;
    // z-index: 999;

    & > .m-bd {
      flex: 1;
      // height: calc( 100% - 30vh - 48px );
    }
  }

  .m-hd {
    display: flex;
    height: 48px;

    & > .m-wrap {
      flex: 1 1;
      display: flex;
      align-items: center;
      background: #faf7fa;
      border-radius: 18px;
      padding: 5px 10px;
      box-sizing: border-box;
      margin: 8px 10px;

      & > img {
        width: 16px;
        height: 16px;
        filter: var(--fil-main);
      }

      input {
        margin: 0 10px;
      }
    }
  }

  .m-bd {
    display: flex;
    flex-direction: column;
    height: 188px;
    overflow: hidden;

    .amap-marker.sel img {
      filter: var(--fil-sel);
    }

    & > .m-img {
      width: 100%;
      height: calc(100vw / 2.23) !important;
      border-radius: 4px;
      overflow: hidden;

      &.np {
        margin: 0 calc(10px - 26px);
        width: calc(100% + (26px - 10px) * 2) !important;
        border-radius: 0 !important;
      }

      &.no-margin {
        margin-bottom: calc(-26px - 10px);
      }
    }

    & > p {
      display: -webkit-box;
      /* ! autoprefixer: off */
      -webkit-box-orient: vertical;
      /* autoprefixer: on */
      -webkit-line-clamp: 2;
      overflow: hidden;
      margin: 12px 0 0 0;
      font-weight: var(--font-weight, initial);
      font-size: var(--content-default-size, 15px);
      color: #000000;
    }
  }

  .m-ft {
    display: flex;
    flex-direction: column;
    height: 272px;
    overflow-y: scroll;
    margin: 5px 0;
    padding: 16px;

    & > .m-none {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;

      & > img {
        width: 128px;
        height: 128px;
      }
      & > span {
        font-size: 12px;
        color: #999;
        margin-top: 4px;
      }
    }
  }

  .m-ret {
    margin: 0 10px;
  }
}

.sp-margin {
  padding: 0;

  .g-wb_tl {
    padding: calc(26px - 10px) calc(26px - 10px) 0 calc(26px - 10px);
  }

  .m-bd {
    & > p {
      padding: 0 calc(26px - 10px);
      margin-bottom: calc(26px - 10px);
    }
  }
}