@charset "UTF-8";
.sec-lifespan {
  position: relative;
  background: #F8F8F8;
  font-feature-settings: normal;
}
.lifespan-body {
  padding: 116px 0 81px;
}
.lifespan-head {
  width: min(1080px, calc(100% - 48px));
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}
.lifespan-title {
  margin: -24.144px 0 -17.472px;
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: 48px;
  line-height: 1.6;
  color: var(--c-text);
  text-align: center;
}
.lifespan-title-l { font-size: 48px; }
.lifespan-title-s { font-size: 40px; }
.lifespan-divider {
  display: block;
  width: 80px;
  height: 1px;
  margin: -0.5px 0;
}
.lifespan-lead {
  width: min(1136px, calc(100% - 48px));
  margin: 40px auto 0;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 18px;
  line-height: 2;
  letter-spacing: 0.72px;
  color: var(--c-text);
  text-align: center;
}
.lifespan-cards {
  --lf-u: min(1px, calc((100vw - 80px) / 1426));
  width: calc(1426 * var(--lf-u));
  margin: 99.816px auto 0;
  display: flex;
  justify-content: space-between;
}
.lifespan-card {
  position: relative;
  height: calc(522 * var(--lf-u));
}
.lifespan-card--denture { width: calc(435 * var(--lf-u)); background: #fff; }
.lifespan-card--bridge  { width: calc(434 * var(--lf-u)); background: #fff; }
.lifespan-card--implant {
  width: calc(435 * var(--lf-u));
  background: #FEF8F1;
  border-radius: calc(16 * var(--lf-u));
  box-shadow: inset 0 0 0 calc(3 * var(--lf-u)) var(--c-primary);
}
.lifespan-card-title {
  position: absolute;
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: calc(32 * var(--lf-u));
  line-height: calc(20 * var(--lf-u));
  letter-spacing: calc(-0.1504 * var(--lf-u));
  color: var(--c-text);
  text-align: center;
}
.lifespan-card--denture .lifespan-card-title { left: calc(18 * var(--lf-u)); top: calc(52 * var(--lf-u));     width: calc(400 * var(--lf-u)); }
.lifespan-card--bridge  .lifespan-card-title { left: calc(35 * var(--lf-u)); top: calc(51.742 * var(--lf-u)); width: calc(365.352 * var(--lf-u)); }
.lifespan-card--implant .lifespan-card-title { left: calc(48 * var(--lf-u)); top: calc(51.695 * var(--lf-u)); width: calc(340 * var(--lf-u)); }
.lifespan-photo {
  position: absolute;
  overflow: hidden;
  width: calc(360.703 * var(--lf-u));
  height: calc(208 * var(--lf-u));
  left: calc(37 * var(--lf-u));
}
.lifespan-card--denture .lifespan-photo { top: calc(97.742 * var(--lf-u)); }
.lifespan-card--bridge  .lifespan-photo { top: calc(97.742 * var(--lf-u)); }
.lifespan-card--implant .lifespan-photo { top: calc(97.695 * var(--lf-u)); }
.lifespan-photo-img {
  position: absolute;
  display: block;
  max-width: none;
  object-fit: cover;
}
.lifespan-card--denture .lifespan-photo-img {
  left: calc(-53.504 * var(--lf-u)); top: calc(-23.563 * var(--lf-u));
  width: calc(420.856 * var(--lf-u)); height: calc(242.688 * var(--lf-u));
}
.lifespan-card--bridge .lifespan-photo-img {
  left: calc(-28 * var(--lf-u)); top: calc(-33.047 * var(--lf-u));
  width: calc(417.573 * var(--lf-u)); height: calc(281.313 * var(--lf-u));
}
.lifespan-card--implant .lifespan-photo-img {
  left: 0; top: calc(-50 * var(--lf-u));
  width: calc(394.593 * var(--lf-u)); height: calc(280.132 * var(--lf-u));
}
.lifespan-box {
  position: absolute;
  border-radius: calc(8 * var(--lf-u));
}
.lifespan-card--denture .lifespan-box,
.lifespan-card--bridge  .lifespan-box {
  top: calc(327.727 * var(--lf-u));
  width: calc(400 * var(--lf-u));
  height: calc(160.273 * var(--lf-u));
  background: #FDF8F2;
}
.lifespan-card--denture .lifespan-box { left: calc(18 * var(--lf-u)); }
.lifespan-card--bridge  .lifespan-box { left: calc(17 * var(--lf-u)); }
.lifespan-card--implant .lifespan-box {
  left: calc(18 * var(--lf-u));
  top: calc(327.695 * var(--lf-u));
  width: calc(400 * var(--lf-u));
  height: calc(155 * var(--lf-u));
  background: #FDF2E7;
}
.lifespan-sub {
  position: absolute;
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: calc(20 * var(--lf-u));
  line-height: calc(20 * var(--lf-u));
  letter-spacing: calc(-0.1504 * var(--lf-u));
  color: var(--c-text);
  text-align: center;
  white-space: nowrap;
}
.lifespan-card--denture .lifespan-sub { left: calc(19 * var(--lf-u)); top: calc(27.273 * var(--lf-u)); width: calc(340 * var(--lf-u)); }
.lifespan-card--bridge  .lifespan-sub { left: calc(18 * var(--lf-u)); top: calc(27.273 * var(--lf-u)); width: calc(365.352 * var(--lf-u)); }
.lifespan-sub--implant {
  left: calc(30 * var(--lf-u));
  top: calc(8 * var(--lf-u));
  width: calc(340 * var(--lf-u));
}
.lifespan-num {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: flex-start;
  white-space: nowrap;
  font-family: var(--font-body);
  line-height: 1;
  color: var(--c-primary);
}
.lifespan-num-fig   { font-weight: 700; font-size: calc(86 * var(--lf-u)); margin-top: calc(-17.458 * var(--lf-u)); }
.lifespan-num-tilde { font-weight: 900; font-size: calc(52 * var(--lf-u)); }
.lifespan-num-unit  { font-weight: 700; font-size: calc(48 * var(--lf-u)); }
.lifespan-card--denture .lifespan-num,
.lifespan-card--bridge  .lifespan-num { top: calc(73.226 * var(--lf-u)); }
.lifespan-card--denture .lifespan-num-tilde,
.lifespan-card--bridge  .lifespan-num-tilde { margin-top: calc(5.444 * var(--lf-u)); }
.lifespan-card--denture .lifespan-num-unit,
.lifespan-card--bridge  .lifespan-num-unit  { margin-top: calc(12.256 * var(--lf-u)); }
.lifespan-card--implant .lifespan-num            { top: calc(36 * var(--lf-u)); }
.lifespan-card--implant .lifespan-num-tilde      { margin-top: calc(3.444 * var(--lf-u)); }
.lifespan-card--implant .lifespan-num-unit       { margin-top: calc(15.256 * var(--lf-u)); }
.lifespan-rule {
  position: absolute;
  display: block;
  max-width: none;
  left: calc(25 * var(--lf-u));
  top: calc(105 * var(--lf-u));
  width: calc(355 * var(--lf-u));
  height: 1px;
}
.lifespan-rate {
  position: absolute;
  left: calc(94 * var(--lf-u));
  top: calc(111 * var(--lf-u));
  display: flex;
  align-items: flex-start;
  gap: calc(5 * var(--lf-u));
  white-space: nowrap;
  font-family: var(--font-body);
  line-height: 1;
}
.lifespan-rate-label {
  font-weight: 500;
  font-size: calc(20 * var(--lf-u));
  color: var(--c-text);
  margin-top: calc(9.94 * var(--lf-u));
}
.lifespan-rate-val {
  font-weight: 700;
  font-size: calc(54 * var(--lf-u));
  color: var(--c-primary);
  margin-top: calc(-10.962 * var(--lf-u));
}
.lifespan-rate-unit { font-size: calc(22 * var(--lf-u)); }
.lifespan-note {
  position: absolute;
  left: calc(174 * var(--lf-u));
  top: calc(482.695 * var(--lf-u));
  width: calc(89 * var(--lf-u));
  font-family: var(--font-body);
  font-weight: 300;
  font-size: calc(16 * var(--lf-u));
  line-height: 2;
  color: var(--c-text);
  text-align: center;
  white-space: nowrap;
}
.lifespan-only-sp { display: none; }
.lifespan-br--sp  { display: none; }
.lifespan-cta {
  --lf-c: min(1px, calc((100vw - 48px) / 1044));
  position: relative;
  background: #FAF8F6;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
  padding: calc(74 * var(--lf-c)) 0 calc(64 * var(--lf-c));
  -webkit-clip-path: inset(-8px 0 0 0);
          clip-path: inset(-8px 0 0 0);
}
.lifespan-cta-inner {
  width: calc(1044 * var(--lf-c));
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
.lifespan-btn {
  position: relative;
  display: block;
  width: calc(480 * var(--lf-c));
  height: calc(134 * var(--lf-c));
  transition: transform .2s ease, box-shadow .2s ease;
}
.lifespan-btn--tel {
  background: #F8F8F8;
  box-shadow:
    0 calc(4 * var(--lf-c)) calc(4 * var(--lf-c)) rgba(0, 0, 0, 0.25),
    inset 0 0 0 calc(2 * var(--lf-c)) var(--c-primary);
}
.lifespan-btn--free {
  background: #F0831E;
  box-shadow: 0 calc(4 * var(--lf-c)) calc(4 * var(--lf-c)) rgba(0, 0, 0, 0.25);
}
.lifespan-btn-deco {
  position: absolute;
  display: block;
  max-width: none;
  transform: rotate(180deg);
}
.lifespan-btn--tel .lifespan-btn-deco {
  left: 0.399375%;
  top: calc(2.75 * var(--lf-c));
  width: 99.4125%;
  height: calc(128.25 * var(--lf-c));
}
.lifespan-btn--free .lifespan-btn-deco {
  left: 0.565833%;
  top: calc(0.5 * var(--lf-c));
  width: 98.8713%;
  height: calc(133.5 * var(--lf-c));
}
.lifespan-btn-arrow {
  position: absolute;
  display: block;
  max-width: none;
  top: calc(57.25 * var(--lf-c));
  width: calc(48 * var(--lf-c));
  height: calc(14 * var(--lf-c));
}
.lifespan-btn--tel  .lifespan-btn-arrow { left: 85.5208%; }
.lifespan-btn--free .lifespan-btn-arrow { left: 86.3542%; }
.lifespan-btn-label {
  position: absolute;
  left: 50%;
  white-space: nowrap;
  font-family: var(--font-body);
}
.lifespan-btn--tel .lifespan-btn-label {
  top: calc(21 * var(--lf-c));
  transform: translateX(calc(-50% + 1 * var(--lf-c)));
  font-weight: 300;
  font-size: calc(20 * var(--lf-c));
  line-height: calc(24 * var(--lf-c));
  letter-spacing: calc(2 * var(--lf-c));
  color: var(--c-text);
}
.lifespan-btn--free .lifespan-btn-label {
  top: calc(58 * var(--lf-c));
  transform: translateX(calc(-50% + 0.845 * var(--lf-c)));
  font-weight: 500;
  font-size: calc(24 * var(--lf-c));
  line-height: calc(24 * var(--lf-c));
  letter-spacing: calc(1.69 * var(--lf-c));
  color: #fff;
  text-shadow: 0 calc(2 * var(--lf-c)) calc(4 * var(--lf-c)) rgba(0, 0, 0, 0.25);
}
.lifespan-tel-num {
  position: absolute;
  left: 25.2083%;
  top: calc(51 * var(--lf-c));
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: calc(39.488 * var(--lf-c));
  line-height: 1;
  color: var(--c-primary);
  white-space: nowrap;
}
.lifespan-tel-icon {
  position: absolute;
  display: block;
  max-width: none;
  left: 18.75%;
  top: calc(61.664 * var(--lf-c));
  width: calc(23.869 * var(--lf-c));
  height: calc(28.821 * var(--lf-c));
}
.lifespan-badge {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: calc(-17.25 * var(--lf-c));
  width: calc(311 * var(--lf-c));
  height: calc(44 * var(--lf-c));
  background: #fff;
  border: calc(1 * var(--lf-c)) solid #F0831E;
  border-radius: calc(26 * var(--lf-c));
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.lifespan-badge-text {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: calc(20 * var(--lf-c));
  line-height: calc(24 * var(--lf-c));
  letter-spacing: calc(1 * var(--lf-c));
  color: #F0831E;
  white-space: nowrap;
}
@media (hover: hover) {
  .lifespan-btn:hover {
    transform: translateY(calc(-2 * var(--lf-c)));
  }
  .lifespan-btn--tel:hover {
    box-shadow:
      0 calc(6 * var(--lf-c)) calc(6 * var(--lf-c)) rgba(0, 0, 0, 0.22),
      inset 0 0 0 calc(2 * var(--lf-c)) var(--c-primary);
  }
  .lifespan-btn--free:hover {
    box-shadow: 0 calc(6 * var(--lf-c)) calc(6 * var(--lf-c)) rgba(0, 0, 0, 0.22);
  }
}
.lifespan-btn:focus-visible {
  outline: 2px solid var(--c-primary);
  outline-offset: 3px;
}
@media (max-width: 767px) {
  .lifespan-body {
    padding: 86px 0 46px;
  }
  .lifespan-head {
    width: min(342px, calc(100% - 48px));
    gap: 48px;
  }
  .lifespan-title {
    margin: -14.084px 0 -10.192px;
    font-size: 28px;
  }
  .lifespan-title-l { font-size: 28px; }
  .lifespan-title-s { font-size: 24px; }
  .lifespan-divider { width: 64px; }
  .lifespan-lead {
    width: min(342px, calc(100% - 48px));
    font-size: 16px;
    letter-spacing: -0.16px;
    text-align: justify;
  }
  .lifespan-cards {
    --lf-u: min(1px, calc((100vw - 48px) / 342));
    width: calc(342 * var(--lf-u));
    margin-top: 34.676px;
    flex-direction: column;
    align-items: flex-start;
    gap: calc(40 * var(--lf-u));
  }
  .lifespan-card--denture {
    width: calc(341 * var(--lf-u));
    height: calc(384 * var(--lf-u));
    border-radius: calc(8 * var(--lf-u));
  }
  .lifespan-card--bridge {
    width: calc(340 * var(--lf-u));
    height: calc(409 * var(--lf-u));
    border-radius: calc(8 * var(--lf-u));
  }
  .lifespan-card--implant {
    width: calc(341 * var(--lf-u));
    height: calc(409 * var(--lf-u));
  }
  .lifespan-card-title { font-size: calc(24 * var(--lf-u)); }
  .lifespan-card--denture .lifespan-card-title { left: calc(14 * var(--lf-u)); top: calc(27 * var(--lf-u)); width: calc(314 * var(--lf-u)); }
  .lifespan-card--bridge  .lifespan-card-title { left: calc(28 * var(--lf-u)); top: calc(33 * var(--lf-u)); width: calc(285 * var(--lf-u)); }
  .lifespan-card--implant .lifespan-card-title { left: calc(38 * var(--lf-u)); top: calc(30 * var(--lf-u)); width: calc(266 * var(--lf-u)); }
  .lifespan-photo {
    width: calc(282.444 * var(--lf-u));
    height: calc(162.872 * var(--lf-u));
  }
  .lifespan-card--denture .lifespan-photo { left: calc(29 * var(--lf-u));     top: calc(76.539 * var(--lf-u)); }
  .lifespan-card--bridge  .lifespan-photo { left: calc(29.055 * var(--lf-u)); top: calc(69.512 * var(--lf-u)); }
  .lifespan-card--implant .lifespan-photo { left: calc(29.055 * var(--lf-u)); top: calc(60.002 * var(--lf-u)); }
  .lifespan-card--denture .lifespan-photo-img {
    left: calc(-23 * var(--lf-u)); top: calc(-18.453 * var(--lf-u));
    width: calc(329.546 * var(--lf-u)); height: calc(190.033 * var(--lf-u));
  }
  .lifespan-card--bridge .lifespan-photo-img {
    left: calc(-21.927 * var(--lf-u)); top: calc(-25.877 * var(--lf-u));
    width: calc(326.975 * var(--lf-u)); height: calc(220.278 * var(--lf-u));
  }
  .lifespan-card--implant .lifespan-photo-img {
    left: calc(-6.055 * var(--lf-u)); top: calc(-38.705 * var(--lf-u));
    width: calc(295 * var(--lf-u)); height: calc(209 * var(--lf-u));
  }
  .lifespan-card--denture .lifespan-box,
  .lifespan-card--bridge  .lifespan-box {
    width: calc(313.215 * var(--lf-u));
    height: calc(120 * var(--lf-u));
  }
  .lifespan-card--denture .lifespan-box { left: calc(14 * var(--lf-u));     top: calc(248 * var(--lf-u)); }
  .lifespan-card--bridge  .lifespan-box { left: calc(13.391 * var(--lf-u)); top: calc(247.969 * var(--lf-u)); }
  .lifespan-card--implant .lifespan-box {
    left: calc(14.176 * var(--lf-u));
    top: calc(223 * var(--lf-u));
    width: calc(313.215 * var(--lf-u));
    height: calc(141 * var(--lf-u));
  }
  .lifespan-sub {
    font-size: calc(18 * var(--lf-u));
    letter-spacing: normal;
  }
  .lifespan-card--denture .lifespan-sub { left: calc(24 * var(--lf-u));     top: calc(15 * var(--lf-u));     width: calc(266 * var(--lf-u)); }
  .lifespan-card--bridge  .lifespan-sub { left: calc(14.609 * var(--lf-u)); top: calc(14.031 * var(--lf-u)); width: calc(285 * var(--lf-u)); }
  .lifespan-sub--implant                { left: calc(16.824 * var(--lf-u)); top: calc(14 * var(--lf-u));     width: calc(279 * var(--lf-u)); }
  .lifespan-num-fig   { font-size: calc(64 * var(--lf-u)); margin-top: calc(-12.992 * var(--lf-u)); }
  .lifespan-num-tilde { font-size: calc(36 * var(--lf-u)); }
  .lifespan-num-unit  { font-size: calc(32 * var(--lf-u)); }
  .lifespan-card--denture .lifespan-num       { top: calc(50.889 * var(--lf-u)); }
  .lifespan-card--denture .lifespan-num-tilde { margin-top: calc(5.217 * var(--lf-u)); }
  .lifespan-card--denture .lifespan-num-unit  { margin-top: calc(14.618 * var(--lf-u)); }
  .lifespan-card--bridge .lifespan-num        { top: calc(51.031 * var(--lf-u)); }
  .lifespan-card--bridge .lifespan-num-tilde  { margin-top: calc(5.223 * var(--lf-u)); }
  .lifespan-card--bridge .lifespan-num-unit   { margin-top: calc(12.504 * var(--lf-u)); }
  .lifespan-card--implant .lifespan-num       { top: calc(38 * var(--lf-u)); }
  .lifespan-card--implant .lifespan-num-tilde { margin-top: calc(3.648 * var(--lf-u)); }
  .lifespan-card--implant .lifespan-num-unit  { margin-top: calc(14.974 * var(--lf-u)); }
  .lifespan-rule {
    left: calc(16.824 * var(--lf-u));
    top: calc(94.877 * var(--lf-u));
    width: calc(279 * var(--lf-u));
  }
  .lifespan-rate {
    left: calc(74.213 * var(--lf-u));
    top: calc(102.877 * var(--lf-u));
    gap: calc(5.222 * var(--lf-u));
  }
  .lifespan-rate-label { font-size: calc(16 * var(--lf-u)); margin-top: calc(7.708 * var(--lf-u)); }
  .lifespan-rate-val   { font-size: calc(40 * var(--lf-u)); margin-top: calc(-8.12 * var(--lf-u)); }
  .lifespan-rate-unit  { font-size: calc(16 * var(--lf-u)); }
  .lifespan-note {
    left: calc(129 * var(--lf-u));
    top: calc(365 * var(--lf-u));
    width: calc(89 * var(--lf-u));
    font-size: calc(16 * var(--lf-u));
  }
  .lifespan-only-pc { display: none; }
  .lifespan-only-sp { display: inline; }
  .lifespan-br--sp  { display: inline; }
  .lifespan-cta {
    --lf-c: min(0.644118px, calc((100vw - 48px) / 480));
    padding: calc(112.306 * var(--lf-c)) 0 calc(86.810 * var(--lf-c));
  }
  .lifespan-cta-inner {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: calc(76.261 * var(--lf-c));
  }
  .lifespan-btn--free { order: -1; }
}