.hs-clap {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem;
  margin: var(--hs-clap-margin, 1rem 0);
  --hs-clap-panel-bg: #fff;
  --hs-clap-panel-color: #2c3338;
  --hs-clap-panel-border: #dcdcde;
  --hs-clap-field-bg: #fff;
  --hs-clap-accent: var(--hs-clap-color, #8a1538);
  --hs-clap-hover-bg: color-mix(in srgb, var(--hs-clap-color, #8a1538) 10%, var(--hs-clap-bg, #fff));
  --hs-clap-hover-color: var(--hs-clap-color, #8a1538);
  --hs-clap-inline-max-width: 36rem;
  --hs-clap-thanks-max-width: 32rem;
  --hs-clap-form-max-width: 36rem;
  --hs-clap-margin: 1rem 0;
  --hs-clap-button-gap: .45rem;
  --hs-clap-button-padding: .55rem 1rem;
  --hs-clap-custom-button-padding: 0;
  --hs-clap-custom-button-min-height: 0;
  --hs-clap-custom-button-radius: 0;
  --hs-clap-button-font-size: inherit;
  --hs-clap-count-border: 1px solid currentColor;
  --hs-clap-count-padding-left: .45rem;
  --hs-clap-custom-count-border: 0;
  --hs-clap-custom-count-padding-left: 0;
  --hs-clap-icon-size: 1.25em;
  --hs-clap-thanks-image-margin: .75rem auto;
  --hs-clap-thanks-text-margin: .75rem 0;
  --hs-clap-submit-bg: var(--hs-clap-accent);
  --hs-clap-submit-color: #fff;
  --hs-clap-submit-border: var(--hs-clap-accent);
  --hs-clap-submit-radius: .4rem;
}
.hs-clap-layer { position:static; width:0; height:0; margin:0; }
.hs-clap__action { position:relative; display:flex; flex:1 1 100%; flex-wrap:wrap; align-items:center; gap:.65rem; min-width:0; }

.hs-clap button:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}
.hs-clap button:focus-visible {
  outline: 2px solid currentColor !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

.hs-clap__button {
  display: inline-flex;
  align-items: center;
  gap: var(--hs-clap-button-gap);
  min-height: 2.75rem;
  padding: var(--hs-clap-button-padding);
  border: 1px solid var(--hs-clap-border, #d63669);
  border-radius: 999px;
  background: var(--hs-clap-bg, #fff);
  color: var(--hs-clap-color, #8a1538);
  font: inherit;
  font-size: var(--hs-clap-button-font-size);
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background-color .15s ease, transform .15s ease;
}

.hs-clap__button:hover,
.hs-clap__button:focus-visible {
  background: var(--hs-clap-hover-bg);
  color: var(--hs-clap-hover-color);
}

.hs-clap__button:active {
  transform: scale(.96);
}

.hs-clap__button:disabled {
  cursor: wait;
  opacity: .65;
}

.hs-clap-align--center { justify-content:center; text-align:center; }
.hs-clap-align--right { justify-content:flex-end; text-align:right; }
.hs-clap-align--center .hs-clap__action { justify-content:center; }
.hs-clap-align--right .hs-clap__action { justify-content:flex-end; }

.hs-clap-button--simple .hs-clap__button {
  min-height: 0;
  padding: .35rem .2rem;
  border-color: transparent;
  border-radius: .25rem;
  background: transparent;
}
.hs-clap-button--simple .hs-clap__button:hover,
.hs-clap-button--simple .hs-clap__button:focus-visible { background:var(--hs-clap-hover-bg); }
.hs-clap-button--compact .hs-clap__button {
  flex: 0 0 auto;
  width: fit-content !important;
  inline-size: fit-content !important;
  min-height: 2rem;
  gap: .3rem;
  padding: .3rem .65rem;
  font-size: .875em;
}
.hs-clap-button--compact .hs-clap__count { padding-left:.3rem; }
.hs-clap-button--custom :where(.hs-clap__button) {
  all: unset;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: var(--hs-clap-button-gap);
  padding: var(--hs-clap-custom-button-padding);
  min-height: var(--hs-clap-custom-button-min-height);
  border-radius: var(--hs-clap-custom-button-radius);
  font-size: var(--hs-clap-button-font-size);
  cursor: pointer;
}
.hs-clap-button--custom.hs-clap-colors--custom :where(.hs-clap__button) {
  border: 1px solid var(--hs-clap-border);
  background: var(--hs-clap-bg);
  color: var(--hs-clap-color);
}
.hs-clap-button--custom :where(.hs-clap__button):hover,
.hs-clap-button--custom :where(.hs-clap__button):focus-visible { background:transparent; }
.hs-clap-button--custom.hs-clap-colors--custom :where(.hs-clap__button):hover,
.hs-clap-button--custom.hs-clap-colors--custom :where(.hs-clap__button):focus-visible { background:var(--hs-clap-hover-bg); color:var(--hs-clap-hover-color); }
.hs-clap-button--custom :where(.hs-clap__button):focus-visible { outline:2px solid currentColor; outline-offset:2px; }
.hs-clap-button--custom :where(.hs-clap__button):disabled { cursor:wait; opacity:.65; }
.hs-clap-button--custom :where(.hs-clap__count) { min-width:0; padding-left:var(--hs-clap-custom-count-padding-left); border-left:var(--hs-clap-custom-count-border); }
.hs-clap-button--image .hs-clap__button {
  all: unset;
  box-sizing: border-box;
  display: inline-flex;
  max-width: 100%;
  cursor: pointer;
  line-height: 0;
}
.hs-clap-button--image .hs-clap__button:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.hs-clap-button--image .hs-clap__button:disabled { cursor:wait; opacity:.65; }
.hs-clap__button-image { display:block; max-width:100%; object-fit:contain; }

.hs-clap__icon {
  font-size: var(--hs-clap-icon-size);
}
.hs-clap__icon--image { display:inline-flex; align-items:center; line-height:0; }
.hs-clap__icon-image { display:block; max-width:100%; object-fit:contain; }
.hs-clap__icon-svg-mask {
  display: block;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask: var(--hs-clap-svg-icon) center / contain no-repeat;
  mask: var(--hs-clap-svg-icon) center / contain no-repeat;
}

.hs-clap__count {
  min-width: 1.25em;
  padding-left: var(--hs-clap-count-padding-left);
  border-left: var(--hs-clap-count-border);
  text-align: center;
}

.hs-clap__feedback {
  position: relative;
  flex-basis: 100%;
  box-sizing: border-box;
  color: var(--hs-clap-panel-color);
  font-size: .95rem;
  line-height: 1.65;
}
.hs-clap--inline .hs-clap__feedback {
  flex: none;
  width: 100%;
  max-width: var(--hs-clap-inline-max-width);
  padding: 1rem 2.75rem 1rem 1rem;
  border: 1px solid var(--hs-clap-panel-border);
  border-radius: .75rem;
  background: var(--hs-clap-panel-bg);
}
.hs-clap__feedback[hidden],
.hs-clap__backdrop[hidden] { display:none !important; }

.hs-clap__thanks,
.hs-clap__message-form {
  margin: 0;
}
.hs-clap__message-form--always {
  flex:none;
  width:100%;
  max-width:var(--hs-clap-form-max-width);
  box-sizing:border-box;
  padding:1rem;
  border:1px solid var(--hs-clap-panel-border);
  border-radius:.75rem;
  background:var(--hs-clap-panel-bg);
  color:var(--hs-clap-panel-color);
  text-align:left;
  margin-top: 10px;
  margin-bottom: 18px;
}
.hs-clap__message-form--always { order:2; }
.hs-clap.is-form-before .hs-clap__message-form--always { order:-1; }
.hs-clap--inline { flex-direction:column; align-items:flex-start; }
.hs-clap--inline.hs-clap-align--center { align-items:center; }
.hs-clap--inline.hs-clap-align--right { align-items:flex-end; }
.hs-clap--inline .hs-clap__action { display:contents; }
.hs-clap--inline .hs-clap__button { order:0; }
.hs-clap--inline .hs-clap__feedback { order:1; }
.hs-clap--inline.is-inline-thanks-before .hs-clap__feedback { order:-2; }

.hs-clap.has-error .hs-clap__feedback {
  color: #b32d2e;
  border-color:#f0b7b8;
  background:#fcf0f1;
}
.hs-clap.has-limit .hs-clap__feedback { color:#8a4b08; border-color:#e8cf9d; background:#fff8e5; }
.hs-clap.has-error .hs-clap__thanks::before,
.hs-clap.has-limit .hs-clap__thanks::before { content:"⚠ "; }

.hs-clap__feedback-close {
  position: absolute;
  top: .45rem;
  right: .45rem;
  z-index: 2;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #646970;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}
.hs-clap__feedback-close:hover,
.hs-clap__feedback-close:focus-visible { background:#f0f0f1; color:#1d2327; }

/* ポップアップ／モーダルの位置計算が終わるまで中間位置を描画しない。 */
.hs-clap__feedback.is-positioning {
  visibility:hidden !important;
  transition:none !important;
}

.hs-clap--popup .hs-clap__feedback {
  position: absolute;
  top: calc(100% + .5rem);
  z-index: 1000;
  width: min(28rem, calc(100vw - 2rem));
  padding: 1.25rem 3rem 1.25rem 1.25rem;
  border: 1px solid var(--hs-clap-panel-border);
  border-radius: .75rem;
  background: var(--hs-clap-panel-bg);
  box-shadow: 0 .75rem 2rem rgba(0,0,0,.16);
  text-align:left;
  --hs-clap-popup-shift-x: 0px;
}
.hs-clap--popup.hs-clap-align--left .hs-clap__feedback { left:0; right:auto; transform:translateX(var(--hs-clap-popup-shift-x)); }
.hs-clap--popup.hs-clap-align--center .hs-clap__feedback { left:50%; right:auto; transform:translateX(calc(-50% + var(--hs-clap-popup-shift-x))); }
.hs-clap--popup.hs-clap-align--right .hs-clap__feedback { right:0; left:auto; transform:translateX(var(--hs-clap-popup-shift-x)); }
.hs-clap--popup.is-popup-before .hs-clap__feedback { top:auto; bottom:calc(100% + .5rem); }
.hs-clap--popup.hs-clap-align--custom .hs-clap__feedback {
  position:fixed;
  top:50%;
  right:auto;
  bottom:auto;
  left:50%;
  z-index:99999;
  width:min(28rem, calc(100vw - 2rem));
  max-height:calc(100vh - 2rem);
  max-height:calc(100dvh - 2rem);
  overflow:auto;
  transform:translate(-50%, -50%);
}
.hs-clap-layer.hs-clap--popup .hs-clap__feedback {
  position:fixed;
  right:auto;
  bottom:auto;
  z-index:99999;
  overflow:auto;
  overscroll-behavior:contain;
  transform:none;
}

.hs-clap__backdrop { display:none; }
.hs-clap--modal .hs-clap__backdrop {
  position: fixed;
  inset: 0;
  z-index: 99998;
  display: block;
  background: rgba(0,0,0,.5);
}
.hs-clap--modal .hs-clap__feedback {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 99999;
  width: min(38rem, calc(100vw - 2rem));
  max-height: calc(100vh - 2rem);
  padding: 1.5rem 3.25rem 1.5rem 1.5rem;
  overflow: auto;
  border:1px solid rgba(255,255,255,.35);
  border-radius: .85rem;
  background: var(--hs-clap-panel-bg);
  color:var(--hs-clap-panel-color);
  box-shadow: 0 1rem 3rem rgba(0,0,0,.3);
  transform: translate(-50%, -50%);
}
.hs-clap--modal .hs-clap__feedback { text-align:left; }
.hs-clap--modal .hs-clap__message-input { margin-right:0; margin-left:0; }
.hs-clap--modal .hs-clap__thanks-image { margin-right:auto; margin-left:auto; }
body.hs-clap-modal-open { overflow:hidden; }

.hs-clap.has-fade .hs-clap__feedback,
.hs-clap.has-fade .hs-clap__backdrop { opacity:0; transition:opacity .18s ease; }
.hs-clap.has-fade .hs-clap__thanks { opacity:1; transition:opacity .18s ease; }
.hs-clap.has-fade.is-thanks-closing .hs-clap__thanks { opacity:0; }
.hs-clap.has-fade.hs-clap--popup .hs-clap__feedback { transform:translate(var(--hs-clap-popup-shift-x), -.35rem); transition:opacity .18s ease, transform .18s ease; }
.hs-clap.has-fade.hs-clap--popup.hs-clap-align--center .hs-clap__feedback { transform:translate(calc(-50% + var(--hs-clap-popup-shift-x)), -.35rem); }
.hs-clap.has-fade.is-feedback-open .hs-clap__feedback,
.hs-clap.has-fade.is-feedback-open .hs-clap__backdrop { opacity:1; }
.hs-clap.has-fade.is-feedback-open.hs-clap--popup .hs-clap__feedback { transform:translate(var(--hs-clap-popup-shift-x), 0); }
.hs-clap.has-fade.is-feedback-open.hs-clap--popup.hs-clap-align--center .hs-clap__feedback { transform:translate(calc(-50% + var(--hs-clap-popup-shift-x)), 0); }
.hs-clap.has-fade.hs-clap--popup.hs-clap-align--custom .hs-clap__feedback { transform:translate(-50%, calc(-50% - .35rem)); }
.hs-clap.has-fade.is-feedback-open.hs-clap--popup.hs-clap-align--custom .hs-clap__feedback { transform:translate(-50%, -50%); }
.hs-clap-layer.has-fade.hs-clap--popup .hs-clap__feedback { transform:translateY(-.35rem); }
.hs-clap-layer.has-fade.is-feedback-open.hs-clap--popup .hs-clap__feedback { transform:none; }

.hs-clap__thanks {
  box-sizing:border-box;
  width:100%;
  max-width:var(--hs-clap-thanks-max-width);
  min-width:0;
  margin-right:auto;
  margin-left:auto;
  text-align:left;
}
.hs-clap__thanks-image { display:block; max-width:100%; object-fit:contain; margin:var(--hs-clap-thanks-image-margin); border-radius:.5rem; }
.hs-clap--modal .hs-clap__thanks-image { max-height:min(50vh,32rem); }
.hs-clap__thanks-text { margin:var(--hs-clap-thanks-text-margin); overflow-wrap:anywhere; }
.hs-clap-text--left,
.hs-clap-text--center,
.hs-clap-text--right { display:block; }
.hs-clap-text--left { text-align:left; }
.hs-clap-text--center { text-align:center; }
.hs-clap-text--right { text-align:right; }
.hs-clap__message-form { box-sizing:border-box; width:100%; max-width:var(--hs-clap-form-max-width); font:inherit; text-align:left; }
.hs-clap__message-form label { display:block; color:var(--hs-clap-panel-color); font-size:.9rem; font-weight:600; line-height:1.5; }
.hs-clap__sender-name {
  display:block;
  box-sizing:border-box;
  width:min(100%, 24rem);
  min-height:2.65rem;
  margin:.5rem 0 .75rem;
  padding:.55rem .7rem;
  border:1px solid #8c8f94;
  border-radius:.4rem;
  background:var(--hs-clap-field-bg);
  color:#2c3338;
  font:inherit;
  line-height:1.4;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.04);
}
.hs-clap__message-input {
  display:block;
  box-sizing:border-box;
  width:min(100%, 36rem);
  min-height:6.5rem;
  margin:.5rem 0 .75rem;
  padding:.7rem .8rem;
  border:1px solid #8c8f94;
  border-radius:.4rem;
  background:var(--hs-clap-field-bg);
  color:#2c3338;
  font:inherit;
  line-height:1.55;
  resize:vertical;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.04);
}
.hs-clap__sender-name:focus,
.hs-clap__message-input:focus { border-color:var(--hs-clap-accent); outline:2px solid color-mix(in srgb, var(--hs-clap-accent) 22%, transparent); outline-offset:0; }
.hs-clap form.hs-clap__message-form > button.hs-clap__message-submit {
  all:unset;
  appearance:none;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:2.5rem;
  width:fit-content;
  min-width:0;
  max-width:100%;
  margin-top:0;
  margin-bottom:0;
  margin-right:0;
  margin-left:auto;
  padding:.5rem .9rem;
  border:1px solid var(--hs-clap-submit-border);
  border-radius:var(--hs-clap-submit-radius);
  background:var(--hs-clap-submit-bg);
  color:var(--hs-clap-submit-color);
  font:inherit;
  font-size:inherit;
  font-weight:600;
  line-height:1.2;
  letter-spacing:normal;
  text-align:center;
  text-decoration:none;
  text-indent:0;
  text-transform:none;
  white-space:normal;
  box-shadow:none;
  cursor:pointer;
  transition:filter .15s ease,transform .15s ease;
}
.hs-clap form.hs-clap__message-form > button.hs-clap__message-submit:hover,
.hs-clap form.hs-clap__message-form > button.hs-clap__message-submit:focus-visible { filter:brightness(.9); outline:2px solid color-mix(in srgb, var(--hs-clap-accent) 25%, transparent); outline-offset:2px; }
.hs-clap form.hs-clap__message-form > button.hs-clap__message-submit:active { transform:translateY(1px); }
.hs-clap form.hs-clap__message-form > button.hs-clap__message-submit:disabled { cursor:wait; opacity:.65; }
.hs-clap__message-status { display:inline-block; margin-top:.5rem; font-size:.9rem; line-height:1.5; }
.hs-clap__website { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }

@media (max-width: 600px) {
  .hs-clap { align-items:stretch; }
  .hs-clap__button { max-width:100%; justify-content:center; }
  .hs-clap-button--compact .hs-clap__button { align-self:flex-start; max-width:100%; }
  .hs-clap--popup .hs-clap__feedback { width:min(28rem, calc(100vw - 1.5rem)); max-height:calc(100vh - 1.5rem); max-height:calc(100dvh - 1.5rem); overflow:auto; }
  .hs-clap--modal .hs-clap__feedback {
    top:max(.75rem, env(safe-area-inset-top));
    right:max(.75rem, env(safe-area-inset-right));
    bottom:max(.75rem, env(safe-area-inset-bottom));
    left:max(.75rem, env(safe-area-inset-left));
    width:auto;
    height:max-content;
    max-height:calc(100dvh - 1.5rem - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    margin:auto;
    padding:1rem 2.5rem 1rem 1rem;
    transform:none;
    overscroll-behavior:contain;
  }
  .hs-clap__message-input { width:100%; min-height:6rem; font-size:16px; }
  .hs-clap__sender-name { width:100%; font-size:16px; }
  .hs-clap form.hs-clap__message-form > button.hs-clap__message-submit { min-height:2.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .hs-clap.has-fade .hs-clap__feedback,
  .hs-clap.has-fade .hs-clap__backdrop,
  .hs-clap.has-fade .hs-clap__thanks { transition:none; }
}
.hs-clap--toggle.is-on .hs-clap__button {
  background: var(--hs-clap-hover-bg, #f8e7ed);
  color: var(--hs-clap-hover-color, #8a1538);
  border-color: var(--hs-clap-accent, #8a1538);
}

.hs-clap-count {
  display: inline-flex;
  align-items: center;
  gap: .3em;
  line-height: 1;
}

.hs-clap-count .hs-clap__icon,
.hs-clap-count .hs-clap__icon-image {
  width: 1em;
  height: 1em;
  object-fit: contain;
}