/**
 * フローティングCTA — PC右サイド追従 / SP下部固定バー
 */

/* === PC版: 右サイド縦書きバー === */
.ow-floating-cta-pc {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%) translateX(0);
  z-index: 999;
  transition: transform 0.3s ease;
  display: block;
}

.ow-floating-cta-pc a {
  display: flex;
  align-items: center;
  justify-content: center;
  writing-mode: vertical-rl;
  background-color: var(--ow-accent, #D4875C);
  color: #FFFFFF;
  text-decoration: none;
  padding: 24px 14px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 4px;
  border-radius: 8px 0 0 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ow-floating-cta-pc a:hover {
  transform: translateX(-6px);
  box-shadow: -4px 0 16px rgba(0, 0, 0, 0.15);
  color: #FFFFFF;
}

/* HERO表示中は非表示 */
.ow-floating-cta-pc.is-hidden {
  transform: translateY(-50%) translateX(calc(100% + 8px));
  opacity: 0;
  pointer-events: none;
}

/* === SP版: 下部固定バー === */
.ow-floating-cta-sp {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background-color: #FFFFFF;
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.1);
  padding: 8px 12px;
  display: none;
  transition: transform 0.3s ease;
}

.ow-floating-cta-sp.is-hidden {
  transform: translateY(100%);
  pointer-events: none;
}

.ow-floating-cta-sp__inner {
  display: flex;
  gap: 8px;
  max-width: 480px;
  margin: 0 auto;
}

.ow-floating-cta-sp a {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 8px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  text-align: center;
  line-height: 1.3;
  transition: opacity 0.3s ease;
}

.ow-floating-cta-sp a:hover {
  opacity: 0.85;
}

.ow-floating-cta-sp__download {
  background-color: var(--ow-bg, #F6F5F0);
  color: var(--ow-text, #2C2E2A);
  border: 1px solid var(--ow-light, #C5D4C0);
}

.ow-floating-cta-sp__contact {
  background-color: var(--ow-accent, #D4875C);
  color: #FFFFFF;
}

/* === レスポンシブ制御 === */
@media (max-width: 767px) {
  .ow-floating-cta-pc {
    display: none;
  }
  .ow-floating-cta-sp {
    display: block;
  }
  /* SP下部バーの高さ分、フッター下部に余白 */
  body {
    padding-bottom: 64px;
  }
}

@media (min-width: 768px) {
  .ow-floating-cta-sp {
    display: none !important;
  }
}