@charset "UTF-8";
.sec-pcfloat {
  --pcfloat-u: min(1px, 0.05208333vw);
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  height: calc(192 * var(--pcfloat-u));
  background: #E3E3E3;
  font-family: var(--font-body);
  font-feature-settings: normal;
  transition: transform .4s ease, opacity .4s ease;
}
.sec-pcfloat.is-hidden {
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: transform .4s ease, opacity .4s ease, visibility 0s linear .4s;
}
.pcfloat-btn {
  position: absolute;
  top: calc(47.55 * var(--pcfloat-u));
  display: block;
  width: calc(452.174 * var(--pcfloat-u));
  height: calc(93.449 * var(--pcfloat-u));
  border: calc(2 * var(--pcfloat-u)) solid #FFFFFF;
  border-radius: calc(8 * var(--pcfloat-u));
  background: linear-gradient(-31.139470390922deg, #F7F7F7 17.858%, #FFFFFF 30.592%, #EFEFEF 39.776%);
  box-shadow: 0 calc(1 * var(--pcfloat-u)) calc(7 * var(--pcfloat-u)) 0 rgba(0, 0, 0, .25);
  transition: opacity .2s;
}
.pcfloat-btn:hover { opacity: .88; }
.pcfloat-btn--sim { left: calc(472.572 * var(--pcfloat-u)); }
.pcfloat-btn--ai  { left: calc(992.254 * var(--pcfloat-u)); }
.pcfloat-badge {
  position: absolute;
  top: calc(-12.55 * var(--pcfloat-u));
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: calc(32 * var(--pcfloat-u));
  border-radius: calc(27 * var(--pcfloat-u));
  font-size: calc(15 * var(--pcfloat-u));
  font-weight: 500;
  line-height: calc(18 * var(--pcfloat-u));
  color: #FFFFFF;
  white-space: nowrap;
  text-align: center;
  text-shadow: 0 calc(1 * var(--pcfloat-u)) calc(6 * var(--pcfloat-u)) rgba(0, 0, 0, .25);
}
.pcfloat-badge--sim {
  background: #244496;
  padding: 0 calc(16 * var(--pcfloat-u));
}
.pcfloat-badge--ai {
  background: #F0831E;
  border: calc(2 * var(--pcfloat-u)) solid #F0831E;
  padding: 0 calc(22 * var(--pcfloat-u));
}
.pcfloat-label {
  position: absolute;
  top: calc(49.6 * var(--pcfloat-u));
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: calc(20 * var(--pcfloat-u));
  font-weight: 500;
  line-height: calc(24 * var(--pcfloat-u));
  color: #444444;
  white-space: nowrap;
  text-align: center;
  text-shadow: 0 calc(1 * var(--pcfloat-u)) calc(6 * var(--pcfloat-u)) rgba(0, 0, 0, .25);
}
.pcfloat-label-strong { color: #244496; }
.pcfloat-label-ai {
  font-size: calc(28 * var(--pcfloat-u));
  line-height: calc(34 * var(--pcfloat-u));
  color: #F0831E;
}
@media (max-width: 767px) {
  .sec-pcfloat { display: none; }
}
.sec-pcfloat { background: rgba(227, 227, 227, .8); }
@media (min-width: 768px) and (max-width: 1360px) {
  .sec-pcfloat {
    --pcfloat-u: max(0.6px, 0.05208333vw);
    height: calc(160 * var(--pcfloat-u));
  }
  .pcfloat-btn--sim { left: auto; right: calc(50% + 33.75 * var(--pcfloat-u)); }
  .pcfloat-btn--ai  { left: calc(50% + 33.75 * var(--pcfloat-u)); }
}

/* ----------------------------------------------------------
   閉じるボタン（2026-10-08 追加 / Figma 3462:4848 Ellipse 428）
   - 1920 幅で バー右端から 60.75、上端から -18.26（バー上端をまたぐ）
   - 円（影つき）は assets/img/pcfloat/close-circle.svg、× は #333 の線 2 本
   - 押すと .is-closed を付けて非表示（同じタブの間は閉じたまま／pcfloat.js）
   ---------------------------------------------------------- */
.sec-pcfloat.is-closed { display: none; }
.pcfloat-close {
  position: absolute;
  top: calc(-18.26 * var(--pcfloat-u));
  right: calc(60.75 * var(--pcfloat-u));
  width: calc(33.752 * var(--pcfloat-u));
  height: calc(33.752 * var(--pcfloat-u));
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  transition: opacity .2s;
}
.pcfloat-close:hover { opacity: .8; }
.pcfloat-close-circle {
  position: absolute;
  top: calc(-4 * var(--pcfloat-u));
  left: calc(-4 * var(--pcfloat-u));
  width: calc(41.752 * var(--pcfloat-u));
  height: calc(41.752 * var(--pcfloat-u));
  max-width: none;
  pointer-events: none;
}
.pcfloat-close::before,
.pcfloat-close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(2.081 * var(--pcfloat-u));
  height: calc(16.156 * var(--pcfloat-u));
  background: #333333;
  z-index: 1;
}
.pcfloat-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.pcfloat-close::after  { transform: translate(-50%, -50%) rotate(-45deg); }
