.clining-szc {
  background: #fbfaf9;
  border-radius: 16px;
  box-sizing: border-box;
  color: #010000;
  font-family: Inter, "Segoe UI", sans-serif;
  max-width: 565px;
  min-height: 510px;
  padding: 11px 18px 23px 19px;
  width: 100%;
}

.clining-szc__inner {
  box-sizing: border-box;
  margin: 0 auto;
  max-width: 528px;
  width: 100%;
}

.clining-szc__label {
  box-sizing: border-box;
  color: #000000;
  display: block;
  font-size: 12px;
  font-weight: 500;
  line-height: 40px;
  margin: 0 0 -4px;
  min-height: 40px;
  padding-left: 14px;
}

.clining-szc__row {
  align-items: stretch;
  display: flex;
  gap: 10px;
  width: 100%;
}

.clining-szc__input-area {
  position: relative;
}

.clining-szc__input {
  appearance: none;
  background: #fffeff;
  border: 1px solid #e6e6ea;
  border-radius: 8px;
  box-sizing: border-box;
  color: #010000;
  flex: 0 1 391px;
  font-size: 14px;
  font-weight: 500;
  height: 43px;
  line-height: 16.94px;
  max-width: 391px;
  min-width: 0;
  outline: none;
  padding: 0 14px;
  width: 100%;
}

.clining-szc__input::placeholder {
  color: #9da2ae;
}

.clining-szc__input:focus {
  border-color: #cfd4dc;
  box-shadow: 0 0 0 2px rgba(11, 111, 211, 0.08);
}

.clining-szc__check-btn {
  align-items: center;
  background: #0b6fd3 !important;
  background-image: none;
  border: 1px solid #0b6fd3 !important;
  border-radius: 8px;
  box-sizing: border-box;
  color: #eaf4ff !important;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 127px;
  font-size: 14px !important;
  font-weight: 500 !important;
  height: 43px !important;
  justify-content: center;
  line-height: 16.94px !important;
  min-width: 127px;
  padding: 0 12px;
  text-decoration: none;
  text-shadow: none;
  transition: opacity 0.2s ease;
  white-space: nowrap;
}

@media (min-width: 1025px) {
  .clining-szc__label {
    line-height: 1.25;
    margin: 0 0 10px;
    min-height: 0;
  }

  .clining-szc__row {
    align-items: center;
  }

  .clining-szc__input {
    height: 43px !important;
    line-height: 16.94px !important;
    max-height: 43px !important;
    min-height: 43px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .clining-szc__check-btn {
    height: 43px !important;
    line-height: 16.94px !important;
    min-height: 43px !important;
  }
}

.clining-szc__check-btn:hover,
.clining-szc__check-btn:focus {
  opacity: 0.94;
}

.clining-szc__check-btn:disabled {
  cursor: not-allowed;
  opacity: 0.7;
}

.clining-szc__suggestions {
  background: #ffffff;
  border: 1px solid #e6e6ea;
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(1, 0, 0, 0.08);
  display: flex;
  flex-direction: column;
  left: 0;
  margin-top: 0;
  max-height: 210px;
  overflow: auto;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 30;
}

.clining-szc__suggestions[hidden],
.clining-szc__result[hidden] {
  display: none !important;
}

.clining-szc__suggestion {
  background: transparent;
  border: 0;
  border-bottom: 1px solid #eef0f3;
  color: #1f2329;
  cursor: pointer;
  font-size: 12px;
  line-height: 1.35;
  padding: 10px 12px;
  text-align: left;
  width: 100%;
}

.clining-szc__suggestion:last-child {
  border-bottom: 0;
}

.clining-szc__suggestion:hover,
.clining-szc__suggestion:focus {
  background: #f6f8fc;
  outline: none;
}

.clining-szc__divider {
  background: #dfe3ea;
  height: 1px;
  margin-top: 10px;
  width: 100%;
}

.clining-szc__result,
.clining-szc__zone-box {
  background: #fbfaf9;
  border: 1px solid #eaeaea;
  border-radius: 8px;
  box-sizing: border-box;
  width: 100%;
}

.clining-szc__result {
  align-items: center;
  display: flex;
  gap: 14px;
  height: 68px;
  margin-top: 10px;
  min-height: 68px;
  padding: 15px 18px 16px 10px;
}

.clining-szc__result-icon {
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: inline-flex;
  flex: 0 0 18px !important;
  height: 18px !important;
  justify-content: center;
  line-height: 1;
  overflow: visible;
  width: 18px !important;
}

.clining-szc__result-icon [hidden] {
  display: none !important;
}

.clining-szc__result-icon-success {
  background: transparent !important;
  display: block;
  filter: none !important;
  height: 18px;
  width: 18px;
}

.clining-szc__result-icon-success svg {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: block !important;
  filter: none !important;
  height: 18px !important;
  overflow: visible;
  width: 18px !important;
}

.clining-szc__result-icon-success path {
  fill: #46b978 !important;
}

.clining-szc__result-icon-error {
  align-items: center;
  background: #b94646 !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  color: #ffffff !important;
  display: inline-flex;
  flex: 0 0 18px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  height: 18px !important;
  justify-content: center;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 18px !important;
}

.clining-szc__result-content {
  display: block;
}

.clining-szc__result-title {
  color: #000000;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 16.94px !important;
  margin-bottom: 5px;
}

.clining-szc__result-text {
  color: #000000;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 14.52px !important;
}

.clining-szc__zone-box {
  height: auto !important;
  margin-top: 28px;
  min-height: 0 !important;
  overflow: hidden;
  padding: 22px 22px 14px;
}

.clining-szc__zone-title {
  align-items: center;
  color: #000000;
  display: flex;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: 14px !important;
  font-weight: 500 !important;
  gap: 6px;
  line-height: 16.94px !important;
  margin: 0 0 13px;
}

.clining-szc__zone-heading-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='13' viewBox='0 0 10 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 13C5 13 10 8.38013 10 4.875C10 3.58207 9.47322 2.34209 8.53553 1.42785C7.59785 0.513615 6.32608 0 5 0C3.67392 0 2.40215 0.513615 1.46447 1.42785C0.526784 2.34209 0 3.58207 0 4.875C0 8.38013 5 13 5 13ZM5 7.3125C4.33696 7.3125 3.70107 7.05569 3.23223 6.59857C2.76339 6.14145 2.5 5.52147 2.5 4.875C2.5 4.22853 2.76339 3.60855 3.23223 3.15143C3.70107 2.69431 4.33696 2.4375 5 2.4375C5.66304 2.4375 6.29893 2.69431 6.76777 3.15143C7.23661 3.60855 7.5 4.22853 7.5 4.875C7.5 5.52147 7.23661 6.14145 6.76777 6.59857C6.29893 7.05569 5.66304 7.3125 5 7.3125Z' fill='%23010000'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 10px 13px;
  display: inline-flex;
  flex: 0 0 10px;
  height: 13px;
  margin-top: 1px;
  width: 10px;
}

.clining-szc__zone-list {
  list-style: none;
  margin: 0 !important;
  max-height: none;
  overflow: visible;
  padding: 0 !important;
  padding-right: 0;
}

.clining-szc__zone-list li {
  color: #000000;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: 12px;
  font-weight: 500 !important;
  line-height: 14.52px;
  margin: 0 0 10px !important;
  padding-left: 17px;
  position: relative;
}

.clining-szc__zone-list li:last-child {
  margin-bottom: 0 !important;
}

.clining-szc__zone-list li.is-check::before,
.clining-szc__zone-list li.is-clock::before {
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-flex;
  left: 0;
  position: absolute;
}

.clining-szc__zone-list li.is-check::before {
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='7' viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.41997 5.47216L8.90063 0.187083C9.02997 0.0623609 9.18086 0 9.35331 0C9.52576 0 9.67666 0.0623609 9.80599 0.187083C9.93533 0.311804 10 0.460015 10 0.631715C10 0.803415 9.93533 0.951418 9.80599 1.07572L3.87265 6.81292C3.74332 6.93764 3.59242 7 3.41997 7C3.24752 7 3.09663 6.93764 2.96729 6.81292L0.186544 4.1314C0.0572069 4.00668 -0.00487502 3.85868 0.00029847 3.68739C0.00547196 3.51611 0.0729427 3.3679 0.202711 3.24276C0.332479 3.11762 0.486175 3.05526 0.663798 3.05568C0.841421 3.05609 0.994901 3.11846 1.12424 3.24276L3.41997 5.47216Z' fill='%23010000'/%3E%3C/svg%3E");
  height: 7px;
  top: 4px;
  transform: none;
  width: 10px;
}

.clining-szc__zone-list li.is-clock::before {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 0C9.3138 0 12 2.6862 12 6C12 9.3138 9.3138 12 6 12C2.6862 12 0 9.3138 0 6C0 2.6862 2.6862 0 6 0ZM6 2.4C5.84087 2.4 5.68826 2.46321 5.57574 2.57574C5.46321 2.68826 5.4 2.84087 5.4 3V6C5.40003 6.15912 5.46327 6.3117 5.5758 6.4242L7.3758 8.2242C7.48896 8.3335 7.64052 8.39397 7.79784 8.3926C7.95516 8.39124 8.10565 8.32814 8.21689 8.21689C8.32814 8.10565 8.39124 7.95516 8.3926 7.79784C8.39397 7.64052 8.3335 7.48896 8.2242 7.3758L6.6 5.7516V3C6.6 2.84087 6.53679 2.68826 6.42426 2.57574C6.31174 2.46321 6.15913 2.4 6 2.4Z' fill='%23A3A2A3'/%3E%3C/svg%3E");
  height: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
}

.clining-szc__outside-box {
  background: #f5f4f5;
  border-radius: 8px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 18px;
  height: auto;
  margin-top: 15px;
  min-height: 125px;
  padding: 17px 14px 16px;
  width: 100%;
}

.clining-szc__outside-note {
  align-items: flex-start;
  color: #010000;
  display: flex;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: 12px !important;
  font-weight: 500 !important;
  gap: 10px;
  justify-content: center;
  line-height: 14.52px !important;
  margin: 0 auto;
  max-width: 477px;
  text-align: center;
}

.clining-szc__outside-note-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.4 9H6.6V5.4H5.4V9ZM6.4278 4.0278C6.5426 3.9126 6.6 3.77 6.6 3.6C6.6 3.43 6.5424 3.2876 6.4272 3.1728C6.312 3.058 6.1696 3.0004 6 3C5.8304 2.9996 5.688 3.0572 5.5728 3.1728C5.4576 3.2884 5.4 3.4308 5.4 3.6C5.4 3.7692 5.4576 3.9118 5.5728 4.0278C5.688 4.1438 5.8304 4.2012 6 4.2C6.1696 4.1988 6.3122 4.1412 6.4278 4.0272M6 12C5.17 12 4.39 11.8424 3.66 11.5272C2.93 11.212 2.295 10.7846 1.755 10.245C1.215 9.7054 0.7876 9.0704 0.472801 8.34C0.158001 7.6096 0.000400759 6.8296 7.59493e-07 6C-0.00039924 5.1704 0.157201 4.3904 0.472801 3.66C0.7884 2.9296 1.2158 2.2946 1.755 1.755C2.2942 1.2154 2.9292 0.788 3.66 0.4728C4.3908 0.1576 5.1708 0 6 0C6.8292 0 7.6092 0.1576 8.33999 0.4728C9.07079 0.788 9.7058 1.2154 10.245 1.755C10.7842 2.2946 11.2118 2.9296 11.5278 3.66C11.8438 4.3904 12.0012 5.1704 12 6C11.9988 6.8296 11.8412 7.6096 11.5272 8.34C11.2132 9.0704 10.7858 9.7054 10.245 10.245C9.7042 10.7846 9.06919 11.2122 8.33999 11.5278C7.6108 11.8434 6.8308 12.0008 6 12Z' fill='%23A3A2A3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 12px 12px;
  display: inline-flex;
  flex: 0 0 12px;
  height: 12px;
  margin-top: 1px;
  width: 12px;
}

.clining-szc__outside-note-text {
  max-width: 455px;
}

.clining-szc__outside-btn {
  align-items: center;
  background: #eaf4ff !important;
  border: 1px solid #0b6fd3 !important;
  border-radius: 8px;
  box-sizing: border-box;
  color: #0b6fd3 !important;
  cursor: pointer;
  display: inline-flex;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: 14px !important;
  font-weight: 500 !important;
  height: 44px !important;
  justify-content: center;
  line-height: 16.94px !important;
  margin: 0 auto;
  text-decoration: none;
  text-shadow: none;
  transition: opacity 0.2s ease;
  width: 100%;
  max-width: 499px;
}

.clining-szc__outside-btn:hover,
.clining-szc__outside-btn:focus {
  opacity: 0.92;
  text-decoration: none;
}

.clining-szc__outside-btn.is-disabled {
  cursor: default;
  opacity: 1;
}

@media (max-width: 767px) {
  .clining-szc {
    min-height: 0;
    padding: 14px;
  }

  .clining-szc__inner {
    max-width: 100%;
  }

  .clining-szc__label {
    line-height: 1.2;
    margin: 0 0 8px;
    min-height: 0;
  }

  .clining-szc__row {
    flex-direction: column;
    gap: 8px;
  }

  .clining-szc__input {
    flex: 0 0 auto !important;
    font-size: 16px !important;
    height: 43px !important;
    line-height: 16.94px !important;
    max-height: 43px !important;
    max-width: 100% !important;
    min-height: 43px !important;
    width: 100% !important;
  }

  .clining-szc__check-btn {
    flex: 0 0 43px;
    min-width: 0;
    width: 100%;
  }

  .clining-szc__divider {
    margin-top: 8px;
  }

  .clining-szc__result,
  .clining-szc__zone-box,
  .clining-szc__outside-box {
    height: auto;
    margin-top: 10px;
    min-height: 0;
    padding: 14px;
  }

  .clining-szc__outside-note {
    max-width: 100%;
  }

  .clining-szc__outside-btn {
    width: 100%;
  }

  .clining-szc__zone-list li.is-clock::before {
    top: 2px;
    transform: none;
  }
}