:root {
  --smcf-color-web-bg:      #ee6323;
  --smcf-color-tel-bg:      #ee6323;
  --smcf-color-btn-label:   #ffffff;
  --smcf-color-catch-text:  #000000;
  --smcf-color-catch-edge:  #ffffff;
  --smcf-color-shadow:      rgba(0, 0, 0, 0.2);
  --smcf-color-focus:       #0017c1;
  --smcf-space-1:           2px;
  --smcf-space-3:           6px;
  --smcf-inset-bottom:      3px;
  --smcf-col-inset-left:    1.2821cqw;
  --smcf-col-inset-right:   2.3077cqw;
  --smcf-col-gutter:        1.0256cqw;
  --smcf-col-web:           33.5897cqw;
  --smcf-col-tel:           61.7949cqw;
  --smcf-bar-max:           390px;
  --smcf-btn-height:        52px;
  --smcf-btn-radius:        8px;
  --smcf-font-family:       "Noto Sans JP", Meiryo, "BIZ UDPGothic", "Yu Gothic", sans-serif;
  --smcf-font-number:       "Oswald", "Noto Sans JP", sans-serif;
  --smcf-font-catch:        clamp(12px, 3.5897cqw, 14px);
  --smcf-font-web-sub:      clamp(13.63px, 4.0092cqw, 15.636px);
  --smcf-font-web-main:     clamp(16.25px, 4.7795cqw, 18.64px);
  --smcf-font-tel-sub:      clamp(11.33px, 3.3333cqw, 13px);
  --smcf-font-tel-num:      clamp(25.88px, 7.6103cqw, 29.68px);
  --smcf-icon-web:          clamp(22.20px, 6.5293cqw, 25.4643px);
  --smcf-icon-tel:          clamp(27.90px, 8.2051cqw, 32px);
  --smcf-gap-web:           clamp(6.34px,  1.8641cqw, 7.27px);
  --smcf-gap-tel:           clamp(4.36px,  1.2821cqw, 5px);
  --smcf-pad-tel:           clamp(7.85px,  2.3077cqw, 9px);
}

.smc-float {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 900;
  background: transparent;
  padding: 0 0 calc(var(--smcf-inset-bottom) + env(safe-area-inset-bottom, 0px));
  font-family: var(--smcf-font-family);
  pointer-events: none;
}

.smc-float *, .smc-float *::before, .smc-float *::after { box-sizing: border-box; }

.smc-float__inner {
  max-width: var(--smcf-bar-max);
  margin-inline: auto;
  container-type: inline-size;
  text-align: center;
}

.smc-float__catch {
  margin: 0 0 var(--smcf-space-3);
  font-size: var(--smcf-font-catch);
  font-weight: 700;
  line-height: 1.095;
  text-align: center;
  color: var(--smcf-color-catch-text);
  -webkit-text-stroke: 4px var(--smcf-color-catch-edge);
  paint-order: stroke fill;
  pointer-events: none;
  background: #fff;
  display: inline-block;
  border-radius: 2em;
  border: 2px solid var(--smcf-color-web-bg);
  padding: 0.1em 0.3em;
  white-space: nowrap;
}

.smc-float__actions {
  display: flex;
  align-items: flex-end;
  gap: var(--smcf-col-gutter);
  padding-inline: var(--smcf-col-inset-left) var(--smcf-col-inset-right);
}

.smc-float__btn {
  display: flex;
  align-items: center;
  min-width: 0;
  height: var(--smcf-btn-height);
  border: 0;
  border-radius: var(--smcf-btn-radius);
  text-decoration: none;
  color: var(--smcf-color-btn-label) !important;
  filter: drop-shadow(1.04px 1.04px 1px var(--smcf-color-shadow));
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
}
.smc-float__btn--web {
  flex: 0 0 var(--smcf-col-web);
  background: var(--smcf-color-web-bg);
  padding-left: var(--smcf-gap-web);
}
.smc-float__btn--tel {
  flex: 0 0 var(--smcf-col-tel);
  background: var(--smcf-color-tel-bg);
  padding-left: var(--smcf-pad-tel);
}

.smc-float__btn:focus-visible {
  outline: 3px solid var(--smcf-color-focus);
  outline-offset: 1px;
  box-shadow: 0 0 0 1px var(--smcf-color-btn-label);
}

.smc-float__icon {
  display: block;
  flex: 0 0 auto;
  color: var(--smcf-color-btn-label) !important;
}
.smc-float__icon svg { display: block; width: 100%; height: 100%; }
.smc-float__icon--web { width: var(--smcf-icon-web); height: var(--smcf-icon-web); margin-right: var(--smcf-gap-web); }
.smc-float__icon--tel { width: var(--smcf-icon-tel); height: var(--smcf-icon-tel); margin-right: var(--smcf-gap-tel); margin-top: var(--smcf-space-1); }

.smc-float__btn-text { display: block; min-width: 0; }
.smc-float__btn-sub,
.smc-float__btn-main,
.smc-float__btn-num { display: block; white-space: nowrap; }

.smc-float__btn-sub  { font-size: var(--smcf-font-web-sub);  font-weight: 700; line-height: 1.247; }
.smc-float__btn-main { font-size: var(--smcf-font-web-main); font-weight: 900; line-height: 1.046; }

.smc-float__btn-sub--tel {
  font-size: var(--smcf-font-tel-sub);
  font-weight: 700;
  line-height: 1.192;
  letter-spacing: 0.07em;
}
.smc-float__btn-num {
  font-family: var(--smcf-font-number);
  font-size: var(--smcf-font-tel-num);
  font-weight: 600;
  line-height: 0.893;
  letter-spacing: 0.04em;
}

.smc-float--tel-hidden .smc-float__btn--tel {
  display: none;
}
.smc-float--tel-hidden .smc-float__btn--web {
  flex: 1;
  justify-content: center;
  padding-left: 0;
}

@media (max-width: 767px) {
  body.smc-float-active .pagetop {
    bottom: 120px;
  }
}

@media (min-width: 768px) {
  .smc-float {
    --smcf-bar-max:        585px;
    --smcf-btn-height:     100px;
    --smcf-font-catch:     3.5897cqw;
    --smcf-font-web-sub:   4.0092cqw;
    --smcf-font-web-main:  4.7795cqw;
    --smcf-font-tel-sub:   3.3333cqw;
    --smcf-font-tel-num:   7.6103cqw;
    --smcf-icon-web:       6.5293cqw;
    --smcf-icon-tel:       8.2051cqw;
    --smcf-gap-web:        1.8641cqw;
    --smcf-gap-tel:        1.2821cqw;
    --smcf-pad-tel:        2.3077cqw;
  }
}

@media (forced-colors: active) {
  .smc-float__btn { border: 1px solid ButtonBorder; }
  .smc-float__catch { -webkit-text-stroke: 0; color: CanvasText; }
}