.dl__box {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px 10px 10px;
  background-color: #eaecef;
  border-radius: 8px
}

.dl__box-title {
  font-size: 19px;
  font-weight: 600;
  line-height: 25px;
  color: #606060;
  text-align: center
}

.dl__box-title-strong {
  font-size: 25px;
  color: red
}

.dl__box-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center
}

.dl__box-lead {
  display: flex;
  gap: 8px;
  align-items: center
}

.dl__box-catch {
  padding-inline: 4px;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  color: #fff;
  text-align: center;
  background: linear-gradient(180deg, #a91111 0%, #ff1010 100%);
  border-radius: 4px
}

.dl__box-text {
  font-size: 13px;
  font-weight: 600;
  color: #ff2800
}

.dl__box-text.black {
  color: #303030
}

.dl__button {
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding-block: 10px;
  cursor: pointer;
  background-color: #fff;
  border-radius: 100vmax;
  box-shadow: 0 1px 8px 0 rgba(0, 0, 0, .25)
}

.dl__button[data-type=pro] {
  background-color: #f60
}

.dl__button:has(.dl__button-title-strong) {
  padding-block: 12px
}

.dl__button-title {
  font-size: 17px;
  font-weight: 600;
  line-height: 17px;
  color: #f60;
  text-align: center;
  letter-spacing: -0.081px
}

.dl__button-title-strong {
  font-size: 25px
}

.dl__button-title:is([data-type=pro] *) {
  color: #fff
}

.dl__button-text {
  font-size: 13px;
  line-height: 13px;
  color: #f60;
  text-align: center
}

.dl__button-text:is([data-type=pro] *) {
  color: #fff
}

.dl__button-text-strong {
  font-weight: 600
}

.dl__pro {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center
}

.dl__pro-title {
  font-size: 13px;
  font-weight: 600;
  line-height: 13px;
  color: #303030;
  text-align: center
}

.dl__pro-lead {
  display: flex;
  gap: 5px;
  align-items: center
}

.dl__pro-catch {
  padding-inline: 4px;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  color: #fff;
  text-align: center;
  background: linear-gradient(180deg, #0b419a 0%, #4d9eff 100%);
  border-radius: 4px
}

.dl__pro-text {
  font-size: 13px;
  font-weight: 600;
  color: #1f59ba;
  text-decoration: underline
}

.dl__pro-note {
  font-size: 13px;
  line-height: 13px;
  color: #1f59ba;
  text-align: center
}

#main {
  padding: 10px;
  overflow: hidden
}

.block__lv2 p.bold {
  text-align: center
}

.serviceTable tr>* {
  font-size: 11px
}

.serviceTable tr>*:nth-child(1) {
  width: 32%
}

.serviceTable tr>*:nth-child(2) {
  width: 16%
}

.serviceTable tr>*:nth-child(3) {
  width: 26%;
  color: #303030;
  letter-spacing: -0.2px;
  background-color: rgba(12, 65, 154, .2)
}

.serviceTable tr>*:last-child {
  width: 26%;
  color: #fff;
  letter-spacing: -0.2px;
  background-color: #0c419a
}

.serviceTable tbody td {
  font-size: 13px;
  font-weight: 600;
  line-height: 15px
}

.serviceTable tbody td:last-child {
  white-space: nowrap
}

.about__article {
  display: flex;
  flex-direction: column;
  gap: 40px
}

.about__article.flex {
  flex-direction: row;
  gap: 60px
}

.about__article-pc {
  position: relative;
  flex: 1;
  width: 420px
}

.about__article-pc img {
  position: relative;
  z-index: 5;
  width: 100%
}

.about__article-pc::before,
.about__article-pc::after {
  position: absolute;
  top: 0;
  z-index: 10;
  width: 100vw;
  height: 330px;
  pointer-events: none;
  content: ""
}

.about__article-pc::before {
  right: calc(100% - 34px);
  background: linear-gradient(to left, transparent 0%, rgba(255, 255, 255, 0.8) 6%, rgb(255, 255, 255) 100%)
}

.about__article-pc::after {
  left: calc(100% - 33px);
  background: linear-gradient(to right, transparent 0%, rgba(255, 255, 255, 0.8) 6%, rgb(255, 255, 255) 100%)
}

.about__article-pc:is(.recommend *) {
  margin-inline: auto
}

.about__article-images {
  position: absolute;
  top: 5px;
  left: 53px;
  z-index: 2;
  display: flex;
  transition: -webkit-transform .3s ease-in-out;
  transition: transform .3s ease-in-out;
  transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out
}

.about__article-images[data-value="0"] {
  -webkit-transform: translateX(calc(-477px * 0));
  transform: translateX(calc(-477px * 0))
}

.about__article-images[data-value="1"] {
  -webkit-transform: translateX(calc(-477px * 1));
  transform: translateX(calc(-477px * 1))
}

.about__article-images[data-value="2"] {
  -webkit-transform: translateX(calc(-477px * 2));
  transform: translateX(calc(-477px * 2))
}

.about__article-images[data-value="3"] {
  -webkit-transform: translateX(calc(-477px * 3));
  transform: translateX(calc(-477px * 3))
}

.about__article-images[data-value="4"] {
  -webkit-transform: translateX(calc(-477px * 4));
  transform: translateX(calc(-477px * 4))
}

.about__article-images[data-value="5"] {
  -webkit-transform: translateX(calc(-477px * 5));
  transform: translateX(calc(-477px * 5))
}

.about__article-img {
  position: relative;
  width: 477px
}

.inner>*:not(:last-child) {
  margin-bottom: 30px
}

@media(max-width: 749px) {
  .about__article.flex {
    flex-direction: column;
    gap: 40px
  }

  .about__article-pc {
    width: 320px;
    margin-inline: auto
  }

  .about__article-pc::before,
  .about__article-pc::after {
    height: 180px
  }

  .about__article-pc::before {
    right: calc(100% - 5px)
  }

  .about__article-pc::after {
    left: calc(100% - 5px)
  }

  .about__article-images {
    top: 4px;
    left: 29px
  }

  .about__article-images[data-value="0"] {
    -webkit-transform: translateX(calc(-262px * 0));
    transform: translateX(calc(-262px * 0))
  }

  .about__article-images[data-value="1"] {
    -webkit-transform: translateX(calc(-262px * 1));
    transform: translateX(calc(-262px * 1))
  }

  .about__article-images[data-value="2"] {
    -webkit-transform: translateX(calc(-262px * 2));
    transform: translateX(calc(-262px * 2))
  }

  .about__article-images[data-value="3"] {
    -webkit-transform: translateX(calc(-262px * 3));
    transform: translateX(calc(-262px * 3))
  }

  .about__article-images[data-value="4"] {
    -webkit-transform: translateX(calc(-262px * 4));
    transform: translateX(calc(-262px * 4))
  }

  .about__article-images[data-value="5"] {
    -webkit-transform: translateX(calc(-262px * 5));
    transform: translateX(calc(-262px * 5))
  }

  .about__article-img {
    width: 262px
  }
}
