{"id":1448,"date":"2026-07-13T10:30:09","date_gmt":"2026-07-13T02:30:09","guid":{"rendered":"https:\/\/damkarmatan.kukarkab.go.id\/?page_id=1448"},"modified":"2026-09-23T16:28:29","modified_gmt":"2026-09-23T08:28:29","slug":"skm","status":"publish","type":"page","link":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/skm\/","title":{"rendered":"SKM"},"content":{"rendered":"\n<style data-wp-block-html=\"css\">\n.ikm-shell,\n.ikm-shell * {\n  box-sizing: border-box;\n}\n\n:root {\n  --navy: #092449;\n  --blue: #1769aa;\n  --red: #d7252b;\n  --red-dark: #ae171c;\n  --ink: #142238;\n  --muted: #66758a;\n  --line: #dbe4ec;\n  --soft: #f4f7fa;\n  --white: #ffffff;\n  --green: #19a875;\n}\n\nbody {\n  margin: 0;\n  color: var(--ink);\n  font-family: \"Poppins\", \"Segoe UI\", Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n}\n\n.ikm-shell button,\n.ikm-shell select {\n  font: inherit;\n}\n\n.ikm-shell {\n  position: relative;\n  display: grid;\n  place-items: center;\n  padding: clamp(40px, 6vw, 76px) 20px;\n  overflow: hidden;\n  background:\n    linear-gradient(\n      135deg,\n      #e8eff5 0%,\n      #f8fafc 48%,\n      #e9f0f5 100%\n    );\n  font-family: \"Poppins\", \"Segoe UI\", Arial, sans-serif;\n}\n\n.ikm-shell::before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 8px;\n  background:\n    linear-gradient(\n      90deg,\n      var(--navy) 0 68%,\n      var(--red) 68% 88%,\n      #f5b72e 88%\n    );\n}\n\n.ikm-shell::after {\n  content: \"\";\n  position: absolute;\n  top: -180px;\n  right: -140px;\n  width: 460px;\n  height: 460px;\n  border: 70px solid rgba(23, 105, 170, 0.03);\n  border-radius: 50%;\n  pointer-events: none;\n}\n\n.ikm-card {\n  position: relative;\n  width: min(720px, 100%);\n  padding: clamp(32px, 6vw, 58px);\n  overflow: hidden;\n  border: 1px solid #d5dfe8;\n  border-radius: 24px;\n  background: #ffffff;\n  box-shadow:\n    0 30px 80px rgba(9, 36, 73, 0.09),\n    0 3px 10px rgba(9, 36, 73, 0.04);\n}\n\n.ikm-accent {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 5px;\n  background:\n    linear-gradient(\n      90deg,\n      var(--red) 0 32%,\n      var(--navy) 32%\n    );\n}\n\n.ikm-heading {\n  display: grid;\n  grid-template-columns: auto 1fr auto;\n  align-items: start;\n  gap: 16px;\n  padding-bottom: 25px;\n  border-bottom: 1px solid var(--line);\n}\n\n.ikm-heading__icon {\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  gap: 3px;\n  width: 46px;\n  height: 46px;\n  padding: 11px;\n  border-radius: 12px;\n  color: #ffffff;\n  background: var(--navy);\n  box-shadow: 0 9px 20px rgba(9, 36, 73, 0.12);\n}\n\n.ikm-heading__icon span {\n  display: block;\n  width: 5px;\n  border-radius: 4px 4px 1px 1px;\n  background: #ffffff;\n}\n\n.ikm-heading__icon span:nth-child(1) {\n  height: 10px;\n  opacity: 0.65;\n}\n\n.ikm-heading__icon span:nth-child(2) {\n  height: 17px;\n  opacity: 0.82;\n}\n\n.ikm-heading__icon span:nth-child(3) {\n  height: 24px;\n}\n\n.ikm-heading p {\n  margin: 2px 0 7px;\n  color: var(--red);\n  font-size: 0.75rem;\n  font-weight: 700;\n  letter-spacing: 0.13em;\n  text-transform: uppercase;\n}\n\n.ikm-heading h1 {\n  max-width: 500px;\n  margin: 0;\n  color: var(--navy);\n  font-size: clamp(1.55rem, 4vw, 2.15rem);\n  font-weight: 700;\n  line-height: 1.12;\n  letter-spacing: -0.04em;\n}\n\n.ikm-badge {\n  display: grid;\n  place-items: center;\n  width: 47px;\n  height: 47px;\n  border: 1px solid #f0c8ca;\n  border-radius: 12px;\n  color: var(--red);\n  background: #fff5f5;\n  font-size: 0.72rem;\n  font-weight: 700;\n  letter-spacing: 0.08em;\n}\n\n.ikm-intro {\n  max-width: 560px;\n  margin: 24px 0 28px;\n  color: var(--muted);\n  font-size: 1rem;\n  line-height: 1.65;\n}\n\n.ikm-form {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px 15px;\n}\n\n.ikm-field {\n  display: grid;\n  gap: 9px;\n}\n\n.ikm-field--full,\n.ikm-availability,\n.ikm-submit {\n  grid-column: 1 \/ -1;\n}\n\n.ikm-field > span {\n  color: #35465c;\n  font-size: 0.875rem;\n  font-weight: 600;\n}\n\n.ikm-field select {\n  width: 100%;\n  min-height: 54px;\n  padding: 0 44px 0 15px;\n  border: 1px solid #cbd7e2;\n  border-radius: 10px;\n  color: var(--ink);\n  background: var(--soft);\n  font-size: 0.9rem;\n  outline: none;\n  transition:\n    border-color 0.18s,\n    box-shadow 0.18s,\n    background 0.18s;\n}\n\n.ikm-field select:hover {\n  border-color: #aebdcc;\n  background: #ffffff;\n}\n\n.ikm-field select:focus {\n  border-color: var(--blue);\n  background: #ffffff;\n  box-shadow: 0 0 0 4px rgba(23, 105, 170, 0.07);\n}\n\n.ikm-availability {\n  display: flex;\n  align-items: center;\n  gap: 11px;\n  margin-top: 1px;\n  padding: 12px 14px;\n  border: 1px solid #d9e8e2;\n  border-radius: 10px;\n  color: #496458;\n  background: #f3faf7;\n}\n\n.ikm-availability > span {\n  flex: 0 0 auto;\n  width: 9px;\n  height: 9px;\n  border-radius: 50%;\n  background: var(--green);\n  box-shadow: 0 0 0 5px rgba(25, 168, 117, 0.09);\n}\n\n.ikm-availability p {\n  margin: 0;\n  font-size: 0.8rem;\n  line-height: 1.45;\n}\n\n.ikm-availability b {\n  color: #1f6d53;\n}\n\n.ikm-submit {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  min-height: 56px;\n  padding: 0 9px 0 21px;\n  border: 0;\n  border-radius: 10px;\n  color: #ffffff;\n  background:\n    linear-gradient(\n      135deg,\n      var(--red),\n      var(--red-dark)\n    );\n  box-shadow: 0 13px 25px rgba(215, 37, 43, 0.15);\n  font-size: 0.78rem;\n  font-weight: 700;\n  letter-spacing: 0.065em;\n  text-transform: uppercase;\n  cursor: pointer;\n  transition:\n    transform 0.18s,\n    box-shadow 0.18s;\n}\n\n.ikm-submit b {\n  display: grid;\n  place-items: center;\n  width: 39px;\n  height: 39px;\n  border: 1px solid rgba(255, 255, 255, 0.16);\n  border-radius: 8px;\n  background: rgba(255, 255, 255, 0.07);\n  font-size: 1.2rem;\n}\n\n.ikm-submit:hover {\n  transform: translateY(-1px);\n  box-shadow: 0 16px 30px rgba(215, 37, 43, 0.21);\n}\n\n.ikm-submit:focus-visible {\n  outline: 3px solid #75aadb;\n  outline-offset: 3px;\n}\n\n.ikm-footnote {\n  margin: 18px 0 0;\n  color: #7a889a;\n  font-size: 0.75rem;\n  text-align: center;\n}\n\n.ikm-footnote span {\n  color: var(--green);\n  font-weight: 700;\n}\n\n@media (max-width: 600px) {\n  .ikm-shell {\n    place-items: start center;\n    padding: 24px 12px;\n  }\n\n  .ikm-card {\n    padding: 29px 20px;\n    border-radius: 17px;\n  }\n\n  .ikm-heading {\n    grid-template-columns: auto 1fr;\n  }\n\n  .ikm-badge {\n    display: none;\n  }\n\n  .ikm-heading__icon {\n    width: 42px;\n    height: 42px;\n  }\n\n  .ikm-form {\n    grid-template-columns: 1fr;\n  }\n\n  .ikm-field--full,\n  .ikm-availability,\n  .ikm-submit {\n    grid-column: auto;\n  }\n\n  .ikm-intro {\n    font-size: 0.95rem;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .ikm-submit {\n    transition: none;\n  }\n}\n<\/style>\n\n<meta charset=\"utf-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n\n  <title>Hasil Indeks Kepuasan Masyarakat<\/title>\n\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin=\"\">\n\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700&amp;display=swap\" rel=\"stylesheet\">\n\n  <link rel=\"stylesheet\" href=\"style.css\">\n\n\n\n\n  <main class=\"ikm-shell\" id=\"hasil-ikm\">\n\n    <section class=\"ikm-card\" aria-labelledby=\"ikm-title\">\n\n      <div class=\"ikm-accent\" aria-hidden=\"true\"><\/div>\n\n      <div class=\"ikm-heading\"><\/div>\n\n        <div class=\"ikm-heading__icon\" aria-hidden=\"true\">\n          <span><\/span>\n          <span><\/span>\n          <span><\/span>\n        <\/div>\n\n        <div>\n          <p>Data pelayanan publik<\/p>\n\n          <h1 id=\"ikm-title\">\n            Hasil Indeks Kepuasan Masyarakat\n          <\/h1>\n        <\/div>\n\n        <span class=\"ikm-badge\">IKM<\/span>\n\n      \n\n      <p class=\"ikm-intro\">\n        Pilih layanan dan periode untuk menampilkan hasil penilaian\n        kepuasan masyarakat.\n      <\/p>\n\n      <form class=\"ikm-form\" onsubmit=\"lihatHasil(); return false;\">\n\n        <label class=\"ikm-field ikm-field--full\">\n\n          <span>Layanan<\/span>\n\n          <select id=\"layanan\" name=\"layanan\" required=\"\">\n\n            <option value=\"\" selected=\"\" disabled=\"\">\n              Pilih layanan\n            <\/option>\n\n            <option>\n              Layanan Pelaksanaan Pemadam dan Pengendalian Kebakaran\n            <\/option>\n\n            <option>\n              Layanan Pelaksanaan Penyelamatan dan Evakuasi\n            <\/option>\n\n            <option>\n              Himbauan Pencegah Kebakaran\n            <\/option>\n\n            <option>\n              Sosialisasi Pencegahan Kebakaran\n            <\/option>\n\n            <option>\n              Layanan Pemberdayaan Masyarakat\/Relawan Kebakaran\n            <\/option>\n\n            <option>\n              Layanan Pendataan, Inspeksi Dan Investigasi Pasca Kebakaran\n            <\/option>\n\n          <\/select>\n\n        <\/label>\n\n        <label class=\"ikm-field\">\n\n          <span>Bulan<\/span>\n\n          <select id=\"bulan\" name=\"bulan\" required=\"\">\n            <option value=\"Januari\">Januari<\/option>\n            <option value=\"Februari\">Februari<\/option>\n            <option value=\"Maret\">Maret<\/option>\n            <option value=\"April\">April<\/option>\n            <option value=\"Mei\">Mei<\/option>\n            <option value=\"Juni\">Juni<\/option>\n            <option value=\"Juli\">Juli<\/option>\n            <option value=\"Agustus\">Agustus<\/option>\n            <option value=\"September\">September<\/option>\n            <option value=\"Oktober\">Oktober<\/option>\n            <option value=\"November\">November<\/option>\n            <option value=\"Desember\">Desember<\/option>\n          <\/select>\n\n        <\/label>\n\n        <label class=\"ikm-field\">\n\n          <span>Tahun<\/span>\n\n          <select id=\"tahun\" name=\"tahun\" required=\"\">\n            <option value=\"2025\" selected=\"\">2025<\/option>\n            <option value=\"2026\">2026<\/option>\n            <option value=\"2024\">2024<\/option>\n          <\/select>\n\n        <\/label>\n\n        <div class=\"ikm-availability\">\n\n          <span aria-hidden=\"true\"><\/span>\n\n          <p>\n            <b>Data tersedia<\/b>\n            untuk periode Juni\u2013November 2025\n          <\/p>\n\n        <\/div>\n\n        <button class=\"ikm-submit\" type=\"submit\">\n\n          <span>Tampilkan hasil<\/span>\n\n          <b aria-hidden=\"true\">\u2192<\/b>\n\n        <\/button>\n\n      <\/form>\n\n      <p class=\"ikm-footnote\">\n        <span aria-hidden=\"true\">\u2713<\/span>\n        Pilihan hanya digunakan untuk memfilter data indeks.\n      <\/p>\n\n    <\/div><\/section>\n\n  <\/main>\n\n  <script>\n    function lihatHasil() {\n      const layanan = document.getElementById(\"layanan\");\n      const bulan = document.getElementById(\"bulan\").value;\n      const tahun = document.getElementById(\"tahun\").value;\n\n      const data = {\n        \"2025\": {\n          \"Juni\":\n            \"https:\/\/damkarmatan.kukarkab.go.id\/wp-content\/uploads\/2026\/07\/SKM-_-JUNI.pdf\",\n\n          \"Juli\":\n            \"https:\/\/damkarmatan.kukarkab.go.id\/wp-content\/uploads\/2026\/07\/SKM-JULI-DAMKAR.pdf\",\n\n          \"Agustus\":\n            \"https:\/\/damkarmatan.kukarkab.go.id\/wp-content\/uploads\/2026\/07\/SKM-_-AGUSTUS.pdf\",\n\n          \"September\":\n            \"https:\/\/damkarmatan.kukarkab.go.id\/wp-content\/uploads\/2026\/07\/SKM-_-SEPTEM.pdf\",\n\n          \"Oktober\":\n            \"https:\/\/damkarmatan.kukarkab.go.id\/wp-content\/uploads\/2026\/07\/SKM-_-OKT.pdf\",\n\n          \"November\":\n            \"https:\/\/damkarmatan.kukarkab.go.id\/wp-content\/uploads\/2026\/07\/SKM-_-NOP.pdf\"\n        }\n      };\n\n      if (!layanan.value) {\n        layanan.focus();\n        return;\n      }\n\n      if (data[tahun] && data[tahun][bulan]) {\n        window.open(\n          data[tahun][bulan],\n          \"_blank\",\n          \"noopener\"\n        );\n      } else {\n        alert(\n          \"Data untuk \" +\n          bulan +\n          \" \" +\n          tahun +\n          \" belum tersedia.\"\n        );\n      }\n    }\n  <\/script>\n","protected":false},"excerpt":{"rendered":"<p>Hasil Indeks Kepuasan Masyarakat Data pelayanan publik Hasil Indeks Kepuasan Masyarakat IKM Pilih layanan dan periode untuk menampilkan hasil penilaian kepuasan masyarakat. Layanan Pilih layanan Layanan Pelaksanaan Pemadam dan Pengendalian Kebakaran Layanan Pelaksanaan Penyelamatan dan Evakuasi Himbauan Pencegah Kebakaran Sosialisasi Pencegahan Kebakaran Layanan Pemberdayaan Masyarakat\/Relawan Kebakaran Layanan Pendataan, Inspeksi Dan Investigasi Pasca Kebakaran Bulan JanuariFebruariMaretAprilMeiJuniJuliAgustusSeptemberOktoberNovemberDesember [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"templates\/fullwidth.php","meta":{"footnotes":""},"class_list":["post-1448","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/wp-json\/wp\/v2\/pages\/1448","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/wp-json\/wp\/v2\/comments?post=1448"}],"version-history":[{"count":57,"href":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/wp-json\/wp\/v2\/pages\/1448\/revisions"}],"predecessor-version":[{"id":2138,"href":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/wp-json\/wp\/v2\/pages\/1448\/revisions\/2138"}],"wp:attachment":[{"href":"https:\/\/damkarmatan.kukarkab.go.id\/index.php\/wp-json\/wp\/v2\/media?parent=1448"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}