@charset "UTF-8";
.papics_intro_intro {
  background: #fdfdfc 0% 0% no-repeat padding-box;
  display: flex;
  padding: 32px 0px 32px 0px;
  justify-content: center;
}

.papics_intro_intro .papics_intro_intro-content {
  width: 100%;
  max-width: 1080px;
  display: flex;
  flex-wrap: wrap-reverse;
  justify-content: space-between;
}

.papics_intro_intro .papics_intro_intro-content .content-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-right: 93px;
  flex: 1;
  width: 400px;
}

.papics_intro_intro .papics_intro_intro-content .content-left h2 {
  font: normal normal bold 24px/34px Noto Sans JP;
  letter-spacing: 0px;
  color: #333333;
  margin: 0px;
}

.papics_intro_intro .papics_intro_intro-content .content-left p {
  font: normal normal normal 16px/28px Noto Sans JP;
  color: #333333;
  letter-spacing: 0px;
  margin-top: 16px;
  margin-bottom: 0;
  text-align: left;
}

.papics_intro_intro .papics_intro_intro-content .content-left .pre-title {
  margin: 0px;
  font: normal normal 500 16px/28px Noto Sans JP;
}
.papics_intro_intro .papics_intro_intro-content .content-left .pre-title > br {
  display: none;
}
.papics_intro_intro .papics_intro_intro-content .content-left .title {
  margin: 4px 0px 32px;
  font: normal normal bold 24px/34px Noto Sans JP;
}
.papics_intro_intro .papics_intro_intro-content .content-left .desc {
  margin: 0px 0px 8px;
  font: normal normal normal 16px/28px Noto Sans JP;
}
.papics_intro_intro .papics_intro_intro-content .content-left .sub-desc {
  margin: 0px;
  font: normal normal normal 13px/20px Noto Sans JP;
  color: #808080;
}

.papics_intro_intro .papics_intro_intro-content .content-left .btn {
  margin-top: 48px;
}

.papics_intro_intro .papics_intro_intro-content .content-right {
  width: 494px;
  height: 365px;
}

.papics_intro_intro .papics_intro_intro-content .content-right .empty {
  width: 100%;
  height: 100%;
}
.papics_intro_intro .papics_intro_intro-content .content-right .empty > img {
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 1020px) {
  .papics_intro_intro .papics_intro_intro-content .content-left {
    padding: 0px 16px;
    align-items: center;
    text-align: center;
    margin-right: unset;
  }

  .papics_intro_intro .papics_intro_intro-content .content-left h2 {
    font: normal normal bold 21px/32px Noto Sans JP;
  }

  .papics_intro_intro .papics_intro_intro-content .content-left p {
    font: normal normal normal 15px/26px Noto Sans JP;
  }
}

@media only screen and (max-width: 576px) {
  .papics_intro_intro {
    padding: 56px 0 56px;
  }
  .papics_intro_intro .papics_intro_intro-content .content-left .pre-title {
    text-align: center;
    font: normal normal 500 15px/22px Noto Sans JP;
  }
  .papics_intro_intro
    .papics_intro_intro-content
    .content-left
    .pre-title
    > br {
    display: block;
  }
  .papics_intro_intro .papics_intro_intro-content .content-left .title {
    font: normal normal bold 22px/32px Noto Sans JP;
    text-align: center;
    margin: 8px 0px 16px;
  }
  .papics_intro_intro .papics_intro_intro-content .content-left .desc {
    font: normal normal bold 15px/21px Noto Sans JP;
  }
  .papics_intro_intro .papics_intro_intro-content .content-left .sub-desc {
    font: normal normal normal 13px/19px Noto Sans JP;
  }
  .papics_intro_intro .papics_intro_intro-content .content-left .btn {
    margin-top: 32px;
  }
  .papics_intro_intro .papics_intro_intro-content .content-right {
    width: 100%;
    height: fit-content;
    padding: 0px 16px;
    margin-bottom: 35px;
    text-align: center;
  }
  .papics_intro_intro .papics_intro_intro-content .content-right .empty > img {
    width: 69.68%;
  }
  .papics_intro_intro .papics_intro_intro-content .content-left h2 {
    font: normal normal bold 22px/32px Noto Sans JP;
  }
}

.papics_contact-us {
  background: #2faecb 0% 0% no-repeat padding-box;
  display: flex;
  padding: 48px 0px 100px;
  justify-content: center;
}

.papics_contact-us .papics_contact-us-content {
  width: 100%;
  max-width: 1080px;
  display: flex;
  flex-direction: column;
}

.papics_contact-us .papics_contact-us-content p {
  margin: 0px;
}

.papics_contact-us .papics_contact-us-content .top-title {
  text-align: center;
  font: normal normal bold 32px/48px Noto Sans JP;
  letter-spacing: 0px;
  color: #ffffff;
}

.papics_contact-us .papics_contact-us-content .desc {
  text-align: center;
  font: normal normal normal 16px/28px Noto Sans JP;
  letter-spacing: 0px;
  color: #ffffff;
  margin: 24px 0px 40px;
}

.papics_contact-us .papics_contact-us-content .btn {
  align-self: center;
}

.papics_contact-us .row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 45px;
  margin-top: 41px;
}

.papics_contact-us .row .card {
  background: #ffffff 0% 0% no-repeat padding-box;
  border-radius: 16px;
  width: 330px;
  min-height: 336px;
  padding: 24px 29px 30px 24px;
}

.papics_contact-us .row .card.card--left {
  margin-left: auto;
}

.papics_contact-us .row .card.card--left .card__img {
  max-width: 178px;
  margin: auto;
}

.papics_contact-us .row .card.card--left .card__img img {
  max-width: 100%;
}

.papics_contact-us .row .card .card__title {
  font: normal normal bold 18px/30px Noto Sans JP;
  letter-spacing: 0px;
  color: #414141;
  text-align: center;
  margin-top: 13px;
  margin-bottom: 0px;
}
.papics_contact-us .row .card .card__title--alt {
  font: normal normal bold 22px/30px Noto Sans JP;
  letter-spacing: 0px;
  color: #414141;
  text-align: center;
  margin-top: 0px;
  margin-bottom: 24px;
}

.papics_contact-us .row .card.card--right .card__img {
  max-width: 80px;
  max-height: 80px;
  margin: auto;
}

.papics_contact-us .row .card.card--right .card__img img {
  max-width: 100%;
  object-fit: cover;
}

.papics_contact-us .row .card.card--right .card__title {
  margin: 16px 0 8px;
  font: normal normal bold 22px/32px Noto Sans JP;
}

.papics_contact-us .row .card .card__desc {
  font: normal normal normal 16px/28px Noto Sans JP;
  letter-spacing: 0px;
  color: #333333;
  margin-bottom: 34px;
}

.papics_contact-us .row .card .card__btn {
  display: flex;
  justify-content: center;
}

@media only screen and (max-width: 768px) {
  .papics_contact-us .row {
    grid-template-columns: repeat(1, 1fr);
  }

  .papics_contact-us .row .card.card--left {
    margin: auto;
  }

  .papics_contact-us .row .card.card--right {
    margin: auto;
    margin-top: 29px;
  }
}

@media only screen and (max-width: 576px) {
  .papics_contact-us {
    padding: 40px 32px 64px;
  }

  .papics_contact-us .papics_contact-us-content .top-title {
    font: normal normal bold 28px/38px Noto Sans JP;
  }

  .papics_contact-us .papics_contact-us-content .desc {
    font: normal normal normal 15px/26px Noto Sans JP;
    margin: 24px 0;
    text-align: left;
  }

  .papics_contact-us .papics_contact-us-content .btn {
    font: normal normal bold 15px/30px Noto Sans JP;
    min-width: unset;
    min-height: unset;
    padding: 0 34px 0 26px;
    line-height: 21px;
    width: 184px;
  }

  .papics_contact-us .row {
    margin-top: 24px;
    display: block;
  }

  .papics_contact-us .row .card {
    width: 311px;
    padding: 24px 21px 32px 22px;
  }

  .papics_contact-us .row .card.card--left .card__img {
    max-width: 184px;
  }

  .papics_contact-us .row .card.card--left .card__img img {
    min-width: 184px;
  }

  .papics_contact-us .row .card .card__desc {
    font: normal normal normal 15px/26px Noto Sans JP;
    margin-bottom: 24px;
  }

  .papics_contact-us .row .card .card__desc span {
    display: inline;
  }

  .papics_contact-us .row .card.card--left {
    padding-top: 30px;
  }
}

.wcs_what-is {
  background: #f6f3ee 0% 0% no-repeat padding-box;
  display: flex;
  padding: 81px 0px 80px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}

.wcs_what-is .wcs_what-is__content {
  width: 100%;
  max-width: 1080px;
  text-align: center;
}

.wcs_what-is .wcs_what-is__content .content-with-img {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  column-gap: 48px;
}
.wcs_what-is .wcs_what-is__content .common-problems {
  width: 100%;
  display: flex;
  margin-top: 45px;
  flex-direction: column;
  align-items: center;
}
.wcs_what-is .wcs_what-is__content .common-problems h1 {
  font: normal normal bold 32px/78px Noto Sans JP;
  color: #393939;
  width: 100%;
  text-align: center;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-bottom: 9px;
}
.wcs_what-is .wcs_what-is__content .common-problems h1 img {
  width: 71px;
  height: 120px;
}
.wcs_what-is .wcs_what-is__content .common-problems h1 br {
  display: none;
}
.wcs_what-is .wcs_what-is__content .common-problems .boxes {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 30px;
  row-gap: 30px;
}
.wcs_what-is .wcs_what-is__content .common-problems .boxes .box {
  padding: 32px 34px;
  min-width: 340px;
  max-width: 340px;
  background: #ffffff 0% 0% no-repeat padding-box;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  position: relative;
}
.wcs_what-is .wcs_what-is__content .common-problems .boxes .box .text {
  text-align: center;
  font: normal normal bold 16px/24px Noto Sans JP;
  letter-spacing: 0px;
  color: #414141;
}
.wcs_what-is .wcs_what-is__content .common-problems .boxes .box .text > br {
  display: none;
}
.wcs_what-is .wcs_what-is__content .content-with-img .empty-img {
  margin-left: 30px;
  background: #cecece 0% 0% no-repeat padding-box;
  border-radius: 16px;
  min-width: 480px;
  max-width: 480px;
  min-height: 297px;
  max-height: 297px;
}
.wcs_what-is .wcs_what-is__content .content-with-img .empty-img > img {
  width: 100%;
  height: 100%;
  max-width: 480px;
  max-height: 297px;
}

.wcs_what-is h1.top-title {
  margin: 0px;
  font: normal normal bold 32px/42px Noto Sans JP;
  letter-spacing: 0px;
  color: #333333;
}
.wcs_what-is h1.top-title.sp {
  display: none;
}

.wcs_what-is h1.top-title::after {
  border-bottom: 7px solid #f0b342;
}
.wcs_what-is .wcs_what-is__content .sub-title {
  font: normal normal bold 24px Noto Sans JP;
  letter-spacing: 0px;
  color: #333333;
  margin: 24px 0px 40px;
  line-height: 35px;
  text-align: center;
}
.wcs_what-is .wcs_what-is__content .sub-title.sp {
  display: none;
}
.wcs_what-is .wcs_what-is__content p {
  text-align: left;
  margin: 0px;
  font: normal normal normal 16px/28px Noto Sans JP;
  color: #333333;
}
.wcs_what-is .wcs_what-is__content .content-with-img .content-text .desc {
  width: 454px;
  margin-bottom: 16px;
}
.wcs_what-is .wcs_what-is__content .content-with-img .content-text .desc.sp {
  display: none;
}
.wcs_what-is .wcs_what-is__content .content-with-img .content-text .sub-desc {
  width: 454px;
  font: normal normal normal 13px/20px Noto Sans JP;
  letter-spacing: 0px;
  color: #808080;
  height: 39px;
}

.wcs_what-is .wcs_what-is__content .between {
  display: flex;
  justify-content: space-between;
  margin: 40px 0 16px;
}

.wcs_what-is .wcs_what-is__content .card {
  min-width: 510px;
  background: #ffffff 0% 0% no-repeat padding-box;
  border-radius: 16px;
  padding: 32px;
  min-height: 224px;
}

.wcs_what-is .wcs_what-is__content .card .card__title {
  font: normal normal bold 22px/30px Noto Sans JP;
}

.wcs_what-is .wcs_what-is__content .card .card__desc {
  text-align: left;
  font: normal normal normal 16px/28px Noto Sans JP;
  margin-top: 12px;
}

.wcs_what-is .wcs_what-is__content.--sm .small {
  display: flex;
  margin-top: 16px;
}

.wcs_what-is .wcs_what-is__content.--sm .small p {
  font: normal normal normal 13px/20px Noto Sans JP;
  color: #808080;
}
.wcs_what-is
  .wcs_what-is__content
  .content-with-img
  .content-text
  .desc
  span.sign {
  font-size: 11px;
  position: absolute;
  margin-left: 0px;
}
.wcs_what-is .wcs_what-is__content .content-with-img .content-text .desc span {
  margin-left: 11px;
}

@media only screen and (max-width: 576px) {
  .wcs_what-is {
    padding: 48px 0px 64px;
  }
  .wcs_what-is h1.top-title {
    display: none;
  }
  .wcs_what-is h1.top-title.sp {
    display: block;
    text-align: center;
    font: normal normal bold 32px/42px Noto Sans JP;
    margin: 0px;
    padding-bottom: 16px;
  }
  .wcs_what-is .wcs_what-is__content .sub-title {
    display: none;
  }
  .wcs_what-is .wcs_what-is__content .sub-title.sp {
    display: block;
    margin: 32px 0px 24px;
    text-align: center;
    font: normal normal bold 20px/30px Noto Sans JP;
  }
  .wcs_what-is .wcs_what-is__content .content-with-img .empty-img {
    width: 100%;
    margin: 0px;
    min-width: unset;
    max-width: unset;
    min-height: 212px;
    max-height: 212px;
  }
  .wcs_what-is .wcs_what-is__content .content-with-img .empty-img > img {
    height: 212px;
  }
  .wcs_what-is .wcs_what-is__content .content-with-img .content-text {
    margin-top: 16px;
    width: 100%;
  }
  .wcs_what-is .wcs_what-is__content .content-with-img .content-text .desc {
    display: none;
  }
  .wcs_what-is .wcs_what-is__content .content-with-img .content-text .desc.sp {
    display: block;
    font: normal normal normal 15px/26px Noto Sans JP;
    width: 100%;
    margin-bottom: 8px;
    height: 255px;
  }
  .wcs_what-is .wcs_what-is__content .content-with-img .content-text .sub-desc {
    width: 100%;
  }
  .wcs_what-is .wcs_what-is__content .common-problems {
    margin-top: 31px;
  }
  .wcs_what-is .wcs_what-is__content .common-problems h1 img {
    max-width: 52px;
    height: unset;
    margin-right: 2px;
  }
  .wcs_what-is .wcs_what-is__content .common-problems h1 {
    font: normal normal bold 22px/32px Noto Sans JP;
    text-align: center;
  }
  .wcs_what-is .wcs_what-is__content .common-problems h1 br {
    display: inline-block;
  }
  .wcs_what-is .wcs_what-is__content .common-problems .boxes {
    column-gap: 9px;
    row-gap: 16px;
    margin-top: 0px;
  }
  .wcs_what-is .wcs_what-is__content .common-problems .boxes .box {
    padding: 0px 21px 0px 22px;
    min-width: 167px;
    max-width: 167px;
    min-height: 56px;
    justify-content: center;
  }
  .wcs_what-is .wcs_what-is__content .common-problems .boxes .box p.text {
    font: normal normal bold 13px/18px Noto Sans JP;
    color: #414141;
  }
  .wcs_what-is .wcs_what-is__content .common-problems .boxes .box p.text > br {
    display: block;
  }
  .wcs_what-is .wcs_what-is__content {
    padding: 0 16px;
  }
}

.wcs_to-do {
  background: #fdfdfc 0% 0% no-repeat padding-box;
  display: flex;
  padding: 80px 0px 80px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.wcs_to-do .wcs_to-do__content {
  width: 100%;
  max-width: 1080px;
  text-align: center;
}
.wcs_to-do .wcs_to-do__content p {
  letter-spacing: 0px;
  color: #333333;
  margin: 0px;
}
.wcs_to-do h1.top-title.survey > br {
  display: none;
}
.wcs_to-do .wcs_to-do__content .arrow-img {
  width: 46px;
  height: 40px;
}
.wcs_to-do .wcs_to-do__content .two-boxes {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  column-gap: 30px;
  row-gap: 24px;
  margin: 40px 0px 21px;
}
.wcs_to-do .wcs_to-do__content .two-boxes .box {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px 44px 48px;
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 1px solid #e8e8e8;
  border-radius: 16px;
  min-width: 495px;
  max-width: 495px;
}
.wcs_to-do .wcs_to-do__content .two-boxes .box .title {
  text-align: center;
  font: normal normal bold 22px/30px Noto Sans JP;
  line-height: 31px;
  margin-bottom: 16px;
}
.wcs_to-do .wcs_to-do__content .two-boxes .box .text {
  text-align: left;
  font: normal normal normal 16px/28px Noto Sans JP;
  height: 52px;
  margin-bottom: 32px;
}
.wcs_to-do .wcs_to-do__content .two-boxes .box .empty-img {
  border-radius: 16px;
  width: 310px;
  height: fit-content;
}
.wcs_to-do .wcs_to-do__content .two-boxes .box .empty-img > img {
  width: 310px;
  height: 161px;
}
.wcs_to-do .wcs_to-do__content .note-box {
  margin: 16px 0px 120px;
  background: #fbddd0 0% 0% no-repeat padding-box;
  border: 1px solid #e8e8e8;
  border-radius: 16px;
  padding: 40px 24px 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.wcs_to-do .wcs_to-do__content .note-box .title {
  text-align: center;
  font: normal normal bold 26px Noto Sans JP;
  line-height: 37px;
  margin-bottom: 11px;
}
.wcs_to-do .wcs_to-do__content .note-box .text {
  font: normal normal normal 16px Noto Sans JP;
  max-width: 720px;
  width: 100%;
  text-align: left;
  line-height: 24px;
}
.wcs_to-do .wcs_to-do__content .three-col {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 45px;
  row-gap: 40px;
}
.wcs_to-do .wcs_to-do__content .three-col .col {
  min-width: 310px;
  max-width: 310px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.wcs_to-do .wcs_to-do__content .three-col .col .empty-box {
  background: #cecece 0% 0% no-repeat padding-box;
  border-radius: 16px;
  width: 100%;
  min-height: 200px;
  max-height: 200px;
  position: relative;
}
.wcs_to-do .wcs_to-do__content .three-col .col .empty-box > img {
  width: 100%;
  height: 100%;
  max-width: 310px;
  max-height: 200px;
}
.wcs_to-do .wcs_to-do__content .three-col .col .box-label {
  display: flex;
  flex-direction: column;
  background: #2faecb 0% 0% no-repeat padding-box;
  border-radius: 50%;
  width: 64px;
  height: 64px;
  position: absolute;
  left: 12px;
  top: 12px;
  align-items: center;
  justify-content: center;
}
.wcs_to-do .wcs_to-do__content .three-col .col .box-label span {
  font: normal normal bold 11px urw-din;
  line-height: 11px;
  letter-spacing: 0px;
  color: #ffffff;
  text-transform: uppercase;
}
.wcs_to-do .wcs_to-do__content .three-col .col .box-label span.number {
  font: normal normal bold 34px/48px urw-din;
  line-height: 34px;
}
.wcs_to-do .wcs_to-do__content .three-col .col .title {
  font: normal normal bold 22px Noto Sans JP;
  line-height: 32px;
  margin: 16px 0px 12px;
}
.wcs_to-do .wcs_to-do__content .three-col .col .text {
  font: normal normal normal 16px/28px Noto Sans JP;
  height: 80px;
  text-align: left;
}

.wcs_to-do h1.top-title {
  margin: 0px;
  font: normal normal bold 32px/42px Noto Sans JP;
  letter-spacing: 0px;
  color: #333333;
}
.wcs_to-do h1.top-title.sp {
  display: none;
}

.wcs_to-do h1.top-title::after {
  border-bottom: 7px solid #f0b342;
}

@media only screen and (max-width: 576px) {
  .wcs_to-do {
    padding: 56px 0px 56px;
  }
  .wcs_to-do h1.top-title {
    display: none;
  }
  .wcs_to-do h1.top-title.survey {
    display: block;
  }
  .wcs_to-do h1.top-title.survey > br {
    display: block;
  }
  .wcs_to-do h1.top-title.sp {
    display: block;
    text-align: center;
    font: normal normal bold 32px/42px Noto Sans JP;
    margin: 0px;
    padding-bottom: 16px;
  }
  .wcs_to-do .wcs_to-do__content {
    padding: 0 16px;
  }
  .wcs_to-do .wcs_to-do__content .arrow-img {
    width: 36px;
    height: 32px;
  }
  .wcs_to-do .wcs_to-do__content .two-boxes {
    row-gap: 24px;
    column-gap: unset;
    flex-wrap: unset;
    flex-direction: column;
    margin-top: 76px;
    margin-bottom: 16px;
  }
  .wcs_to-do .wcs_to-do__content .two-boxes .box {
    max-width: unset;
    min-width: unset;
    max-height: 418px;
    padding: 40px 22px 32px 24px;
  }
  .wcs_to-do .wcs_to-do__content .two-boxes .box .title {
    font: normal normal bold 20px/30px Noto Sans JP;
    letter-spacing: -0.3px;
    margin-bottom: 8px;
  }
  .wcs_to-do .wcs_to-do__content .two-boxes .box .text {
    font: normal normal normal 15px/26px Noto Sans JP;
    margin-bottom: 48px;
    height: unset;
  }
  .wcs_to-do .wcs_to-do__content .two-boxes .box .empty-img {
    width: 100%;
    margin-bottom: 64px;
  }
  .wcs_to-do .wcs_to-do__content .two-boxes .box .empty-img > img {
    width: 243px;
    height: unset;
  }
  .wcs_to-do .wcs_to-do__content .note-box {
    padding: 32px 24px 40px 24px;
    margin-bottom: 56px;
  }
  .wcs_to-do .wcs_to-do__content .note-box .title {
    font: normal normal bold 20px/30px Noto Sans JP;
    letter-spacing: -0.3px;
    line-height: 29px;
  }
  .wcs_to-do .wcs_to-do__content .note-box .text {
    font: normal normal normal 15px/26px Noto Sans JP;
  }
  .wcs_to-do .wcs_to-do__content .three-col {
    margin-top: 32px;
  }
  .wcs_to-do .wcs_to-do__content .three-col .col {
    min-width: unset;
    max-width: unset;
    width: 100%;
  }
  .wcs_to-do .wcs_to-do__content .three-col .col .empty-box {
    min-height: 212px;
    max-height: 212px;
    min-width: 343px;
    width: 100%;
  }
  .wcs_to-do .wcs_to-do__content .three-col .col .empty-box > img {
    width: 100%;
    height: 100%;
    max-height: 212px;
    max-width: unset;
  }
  .wcs_to-do .wcs_to-do__content .three-col .col .title {
    font: normal normal bold 20px/29px Noto Sans JP;
    margin: 16px 0px 8px;
  }
  .wcs_to-do .wcs_to-do__content .three-col .col .text {
    font: normal normal normal 15px/25px Noto Sans JP;
    height: fit-content;
  }
}

.wcs_usage {
  background: #fdfdfc 0% 0% no-repeat padding-box;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  padding: 64px 0px 80px;
  background: #f6f3ee 0% 0% no-repeat padding-box;
}
.wcs_usage .wcs_usage__content {
  width: 100%;
  max-width: 1080px;
  text-align: center;
}
.wcs_usage .wcs_usage__content p {
  letter-spacing: 0px;
  color: #333333;
  margin: 0px;
}
.wcs_usage .wcs_usage__content .sub-title {
  margin: 32px auto 32px auto;
  font: normal normal normal 16px/30px Noto Sans JP;
  line-height: 24px;
}
.wcs_usage .wcs_usage__content .box-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 30px;
  row-gap: 30px;
}
.wcs_usage .wcs_usage__content .box-container .box {
  min-width: 340px;
  max-width: 340px;
  min-height: 240px;
  max-height: 240px;
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 1px solid #e8e8e8;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 32px;
  padding-top: 20px;
}
.wcs_usage .wcs_usage__content .box-container .box > img {
  margin: auto;
}
.wcs_usage .wcs_usage__content .box-container .box .title {
  font: normal normal bold 18px/26px Noto Sans JP;
  line-height: 26px;
  margin-top: auto;
  margin-bottom: 8px;
}
.wcs_usage .wcs_usage__content .box-container .box .title.sp {
  display: none;
}
.wcs_usage .wcs_usage__content .box-container .box .text {
  font: normal normal normal 14px/24px Noto Sans JP;
  line-height: 20px;
}

.wcs_usage h1.top-title {
  margin: 0px;
  font: normal normal bold 32px/42px Noto Sans JP;
  letter-spacing: 0px;
  color: #333333;
  padding-bottom: 23px;
}
.wcs_usage h1.top-title > br {
  display: none;
}

.wcs_usage h1.top-title::after {
  border-bottom: 7px solid #f0b342;
}

@media only screen and (max-width: 576px) {
  .wcs_usage {
    padding: 56px 0px 64px;
  }
  .wcs_usage h1.top-title {
    display: block;
    text-align: center;
    font: normal normal bold 32px/42px Noto Sans JP;
    margin: 0px;
    padding-bottom: 23px;
  }
  .wcs_usage h1.top-title > br {
    display: block;
  }
  .wcs_usage .wcs_usage__content .sub-title {
    display: none;
  }
  .wcs_usage .wcs_usage__content .box-container {
    margin-top: 37px;
    column-gap: 9px;
    row-gap: 9px;
    display: grid;
    grid-template-columns: 50% 50%;
  }
  .wcs_usage .wcs_usage__content .box-container .box {
    max-width: 167px;
    min-width: 167px;
    max-height: fit-content;
    min-height: 284px;
    max-height: 284px;
    padding: 0px 16px;
  }
  .wcs_usage .wcs_usage__content .box-container .box .title {
    display: none;
  }
  .wcs_usage .wcs_usage__content .box-container .box .title.sp {
    margin-top: auto;
    display: block;
    font: normal normal bold 18px/24px Noto Sans JP;
  }
  .wcs_usage .wcs_usage__content .box-container .box .text {
    font: normal normal normal 15pxs/23px Noto Sans JP;
    margin-bottom: auto;
    text-align: left;
  }
  .wcs_usage .wcs_usage__content {
    padding: 0 16px;
  }
  .wcs_usage .wcs_usage__content .box-container .box > img {
    margin: unset;
    margin-top: auto;
    transform: scale(0.6);
  }
}

.wcs_flow {
  background: #fdfdfc 0% 0% no-repeat padding-box;
  display: flex;
  padding: 64px 0px 80px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.wcs_flow .wcs_flow__content {
  width: 100%;
  max-width: 1080px;
  text-align: center;
}

.wcs_flow .wcs_flow__content .sub-title {
  font: normal normal normal 16px/30px Noto Sans JP;
  letter-spacing: 0px;
  color: #333333;
  margin: 32px 0px 48px;
  line-height: 27px;
  text-align: center;
}

.wcs_flow .wcs_flow__content p {
  letter-spacing: 0px;
  color: #333333;
  margin: 0px;
}

.wcs_flow .wcs_flow__content .flow-items {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 8px;
  align-items: center;
  position: relative;
  z-index: 1;
}
.wcs_flow .wcs_flow__content .flow-items .box {
  min-width: 248px;
  max-width: 248px;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 1px solid #e8e8e8;
  border-radius: 16px;
  padding-bottom: 24px;
}
.wcs_flow .wcs_flow__content .flow-items .arrow {
  width: 16px;
  height: 18px;
  margin: auto 6px;
}
.wcs_flow .wcs_flow__content .flow-items .arrow.sub {
  display: none;
}
.wcs_flow .wcs_flow__content .flow-items .box .empty-box {
  width: 100%;
  position: relative;
  padding: 64px 0px 15px;
  height: 143px;
}
.wcs_flow .wcs_flow__content .flow-items .box .empty-box img {
  max-width: 82px;
  height: 64px;
}
.wcs_flow .wcs_flow__content .flow-items .box .box-label {
  display: flex;
  flex-direction: column;
  background: #0b4f8d 0% 0% no-repeat padding-box;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  position: absolute;
  left: 16px;
  top: -16px;
  align-items: center;
  justify-content: center;
}
.wcs_flow .wcs_flow__content .flow-items .box .box-label span {
  font: normal normal bold 26px/26px urw-din;
  letter-spacing: 0px;
  color: #ffffff;
  text-transform: uppercase;
  line-height: 36px;
}
.wcs_flow .wcs_flow__content .flow-items .box .title {
  font: normal normal bold 16px/24px Noto Sans JP;
  line-height: 24px;
  margin: 0px 20px 8px;
}
.wcs_flow .wcs_flow__content .flow-items .box .text {
  font: normal normal normal 14px/22px Noto Sans JP;
  padding: 0px 26px;
  text-align: left;
}
.wcs_flow .wcs_flow__content .flow-items .content.sub {
  display: none;
  align-items: center;
}
.wcs_flow .wcs_flow__content .flow-items .content .title {
  text-align: center;
  font: normal normal bold 16px/24px Noto Sans JP;
  line-height: 24px;
  margin-left: 8px;
}
.wcs_flow .wcs_flow__content .flow-items .box-label {
  display: flex;
  flex-direction: column;
  background: #0b4f8d 0% 0% no-repeat padding-box;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
}
.wcs_flow .wcs_flow__content .flow-items .box-label span {
  font: normal normal bold 36px/50px urw-din;
  letter-spacing: 0px;
  color: #ffffff;
  text-transform: uppercase;
  line-height: 36px;
}
.wcs_flow .wcs_flow__content .flow-item-sub {
  margin-top: -16px;
  margin-left: calc(50% - 140px);
  width: 560px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  z-index: 0;
}
.wcs_flow .wcs_flow__content .flow-item-sub .arrow.up {
  width: 16px;
  height: 18px;
  margin-top: 24px;
  transform: rotate(-90deg);
}
.wcs_flow .wcs_flow__content .flow-item-sub .arrow-back {
  border: 4px solid #0b4f8d;
  width: 100%;
  height: 60px;
  margin-bottom: 13px;
  border-top: none;
}
.wcs_flow .wcs_flow__content .flow-item-sub .arrow-back .arrow-container {
  height: 32px;
  position: absolute;
  top: 0px;
  left: -6px;
  z-index: 2;
  background-color: #ffffff;
}
.wcs_flow .wcs_flow__content .flow-item-sub .content {
  display: flex;
  align-items: center;
}
.wcs_flow .wcs_flow__content .flow-item-sub .box-label {
  display: flex;
  flex-direction: column;
  background: #0b4f8d 0% 0% no-repeat padding-box;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
}
.wcs_flow .wcs_flow__content .flow-item-sub .box-label span {
  font: normal normal bold 26px/26px urw-din;
  letter-spacing: 0px;
  color: #ffffff;
  text-transform: uppercase;
  line-height: 36px;
}
.wcs_flow .wcs_flow__content .flow-item-sub .title {
  font: normal normal bold 16px/24px Noto Sans JP;
  line-height: 24px;
  margin-left: 18px;
}
.wcs_flow h1.top-title {
  margin: 0px;
  font: normal normal bold 32px/42px Noto Sans JP;
  letter-spacing: 0px;
  color: #333333;
}

.wcs_flow h1.top-title::after {
  border-bottom: 7px solid #f0b342;
}

@media only screen and (max-width: 1079px) {
  .wcs_flow .wcs_flow__content .flow-item-sub {
    display: none;
  }
  .wcs_flow .wcs_flow__content .flow-items .arrow.sub {
    display: block;
  }
  .wcs_flow .wcs_flow__content .flow-items .content.sub {
    display: flex;
  }
}
@media only screen and (max-width: 576px) {
  .wcs_flow {
    padding: 56px 0px 80px;
  }
  .wcs_flow h1.top-title {
    display: block;
    text-align: center;
    font: normal normal bold 32px/42px Noto Sans JP;
    margin: 0px;
    padding-bottom: 23px;
  }
  .wcs_flow .wcs_flow__content {
    padding: 0 16px;
  }
  .wcs_flow .wcs_flow__content .sub-title {
    font: normal normal normal 15px/26px Noto Sans JP;
    text-align: left;
  }
  .wcs_flow .wcs_flow__content .flow-items {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    margin: 48px 16px 0px;
  }
  .wcs_flow .wcs_flow__content .flow-items .box {
    width: 100%;
    max-width: unset;
    padding-bottom: 32px;
  }
  .wcs_flow .wcs_flow__content .flow-items .box .title {
    text-align: center;
    font: normal normal bold 20px/30px Noto Sans JP;
    letter-spacing: -0.3px;
    line-height: 29px;
    margin: 0 28px 8px;
  }
  .wcs_flow .wcs_flow__content .flow-items .box .text {
    padding: 0px;
    font: normal normal normal 15px/26px Noto Sans JP;
    letter-spacing: 0px;
    line-height: 24px;
    margin: 0 28px;
  }
  .wcs_flow .wcs_flow__content .flow-items .box .empty-box {
    padding: 80px 0px 32px;
    min-height: unset;
    max-height: unset;
    height: 176px;
  }
  .wcs_flow .wcs_flow__content .flow-items .arrow {
    width: 28px;
    height: 25px;
    transform: rotate(90deg);
    margin: auto 8px;
  }
  .wcs_flow .wcs_flow__content .flow-items .box .box-label {
    width: 60px;
    height: 60px;
  }
  .wcs_flow .wcs_flow__content .flow-items .box-label {
    width: 60px;
    height: 60px;
  }
  .wcs_flow .wcs_flow__content .flow-items .box .box-label span {
    font: normal normal bold 36px/36px urw-din;
  }
  .wcs_flow .wcs_flow__content .flow-items .content.sub {
    margin-top: 4px;
  }
  .wcs_flow .wcs_flow__content .flow-items .content.sub .box-label {
    width: 48px;
    height: 48px;
  }
  .wcs_flow .wcs_flow__content .flow-items .content.sub .box-label span {
    font: normal normal bold 26px/36px urw-din;
  }
  .wcs_flow .wcs_flow__content .flow-items .content.sub .title {
    font: normal normal bold 16px/24px Noto Sans JP;
  }
  .wcs_flow .wcs_flow__content .flow-item-sub .box-label {
    width: 60px;
    height: 60px;
  }
  .wcs_flow .wcs_flow__content .flow-item-sub .title {
    text-align: center;
    font: normal normal bold 20px/30px Noto Sans JP;
    letter-spacing: -0.3px;
    line-height: 29px;
    margin: 0 28px 8px;
  }
}

.wcs_improve {
  background: #ffffff 0% 0% no-repeat padding-box;
  display: flex;
  padding: 48px 0px 80px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.wcs_improve p {
  letter-spacing: 0px;
  color: #333333;
  text-align: left;
  margin: 0px;
}
.wcs_improve h1 {
  margin: 0px;
}
.wcs_improve .top-title {
  font: normal normal bold 24px Noto Sans JP;
  line-height: 35px;
}
.wcs_improve .top-title.sp {
  display: none;
}
.wcs_improve .wcs_improve__content {
  width: 100%;
  max-width: 1080px;
  text-align: center;
  padding: 0px 30px;
}
.wcs_improve .wcs_improve__content .content-with-img {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap-reverse;
  column-gap: 48px;
  margin: 40px 0px;
}
.wcs_improve .wcs_improve__content .content-with-img .content-img img {
  width: 440px;
  height: 257px;
}
.wcs_improve .wcs_improve__content .content-with-img .content-text {
  max-width: 532px;
  display: flex;
  flex-direction: column;
}
.wcs_improve .wcs_improve__content .content-with-img .content-text img {
  height: 48px;
  width: 353px;
  margin-bottom: 24px;
}
.wcs_improve .wcs_improve__content .content-with-img .content-text .title.sp {
  display: none;
}
.wcs_improve .wcs_improve__content .content-with-img .content-text .desc {
  width: 100%;
  font: normal normal normal 16px/28px Noto Sans JP;
  line-height: 27.4px;
}
.wcs_improve .wcs_improve__content .content-with-img .content-text .desc.sp {
  display: none;
}

.wcs_improve .wcs_improve__content .common-problems .boxes .box p.text.sp {
  display: none;
}

@media only screen and (max-width: 576px) {
  .wcs_improve {
    padding: 56px 0px 64px;
  }
  .wcs_improve .top-title {
    display: none;
  }
  .wcs_improve .top-title.sp {
    display: block;
    text-align: center;
    font: normal normal bold 22px/32px Noto Sans JP;
    margin: 16px auto;
  }
  .wcs_improve .wcs_improve__content .content-with-img {
    margin: 0px;
  }
  .wcs_improve .wcs_improve__content .content-with-img .content-img {
    width: 100%;
  }
  .wcs_improve .wcs_improve__content .content-with-img .content-img img {
    width: 87.46%;
    height: unset;
  }
  .wcs_improve .wcs_improve__content .content-with-img .content-text {
    width: 100%;
    align-items: center;
    margin-top: 18px;
  }
  .wcs_improve .wcs_improve__content .content-with-img .content-text img {
    margin-bottom: 0px;
    width: 94.17%;
    height: 44px;
  }
  .wcs_improve .wcs_improve__content .content-with-img .content-text .desc {
    font: normal normal normal 15px/26px Noto Sans JP;
    width: 100%;
    line-height: 25px;
  }
  .wcs_improve .wcs_improve__content .common-problems .title img {
    width: 52px;
    height: 88px;
    margin: 0px 2px 9px -50px;
  }
  .wcs_improve .wcs_improve__content .common-problems .title p.text {
    font: normal normal bold 22px/32px Noto Sans JP;
    width: 200px;
    text-align: center;
  }
  .wcs_improve .wcs_improve__content .common-problems .boxes {
    column-gap: 9px;
    row-gap: 16px;
    margin-top: 0px;
  }
  .wcs_improve .wcs_improve__content .common-problems .boxes .box {
    padding: 17px 21px 20px 22px;
    min-width: 167px;
    max-width: 167px;
  }
  .wcs_improve .wcs_improve__content .common-problems .boxes .box p.text {
    display: none;
  }
  .wcs_improve .wcs_improve__content .common-problems .boxes .box p.text.sp {
    font: normal normal bold 13px/18px Noto Sans JP;
    color: #414141;
    line-height: 19px;
    display: block;
  }
  .wcs_improve .wcs_improve__content .common-problems .boxes .box::after {
    width: 20px;
    height: 21px;
    top: -8px;
    right: -6px;
  }
  .wcs_improve .wcs_improve__content {
    padding: 0 16px;
  }
  .wcs_improve .btn.btn-primary {
    margin-top: 24px;
  }
}