@charset "UTF-8";

:root {
  /* font-family */
  --font-noto: "Noto Sans JP", sans-serif;
  --font-lato: "Lato", sans-serif;
  --font-doppio: "Doppio One", sans-serif;
  --font-anton: "Anton SC", sans-serif;

  /*color*/
  --color-black: #333;
  --color-green: #00978c;
  --color-light: #f2fffe;
  --color-blue: #0066ba;

  /*gradation*/
  --grad-01: linear-gradient(100deg,rgba(195, 234, 247, 1) 16%, rgba(223, 247, 255, 1) 53%, rgba(224, 244, 251, 1) 98%);
}

/* 事業実績
**********************************************/
.page-id-14 #sec_01 {
  padding: 10rem 0;
}

.page-id-14 #sec_01 .pattern_hl_02_cover .text {
  padding-top: 3rem;
}

.page-id-14 #sec_02 {
  background: var(--grad-01);
}

.page-id-14 #sec_02 .wrapper_cover {
  padding: 9rem 0 17rem;
}

.page-id-14 #sec_02 .pattern_hl_03 {
  margin-bottom: 8rem;
}

.page-id-14 #sec_02 .work_archive {
  background-color: #fff;
  border-radius: 10px;
  padding: 7.6rem 0 10rem;
}

.page-id-14 #sec_02 .work_archive+.work_archive {
  margin-top: 5rem;
}

.page-id-14 #sec_02 .pattern_hl_02 {
  padding-left: 16.4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 13rem;
  position: relative;
  margin-bottom: 6rem;
}

.page-id-14 #sec_02 .pattern_hl_02:before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  margin: auto 0;
  width: 13rem;
  height: 13rem;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  border-radius: 1000px;
  background-color: #fff;
  border: 1px solid var(--color-blue);
}

.page-id-14 #sec_02 #kitting .pattern_hl_02:before {
  background-image: url(../img/work/work_kitting.png);
}

.page-id-14 #sec_02 #setup .pattern_hl_02:before {
  background-image: url(../img/work/work_setup.png);
}

.page-id-14 #sec_02 .year {
  font-size: 2.4rem;
  font-weight: 600;
  color: var(--color-blue);
  display: flex;
  align-items: center;
  margin-bottom: 4rem;
}

.page-id-14 #sec_02 .year:after {
  content: "";
  background-color: var(--color-blue);
  height: 1px;
  flex-grow: 1;
  margin-left: 2.4rem;
}

.page-id-14 #sec_02 .year:first-of-type .total {
  display: none;
}

.page-id-14 #sec_02 .year:not(:first-of-type) {
  margin-top: 5.5rem;
}

.page-id-14 #sec_02 .col {
  display: flex;
  column-gap: 2rem;
  row-gap: 2.5rem;
  flex-wrap: wrap;
}

.page-id-14 #sec_02 .month_box {
  width: calc(50% - 1rem);
  height: 9rem;
  display: flex;
  align-items: center;
  column-gap: 4rem;
  row-gap: 1rem;
  padding: 1rem 5rem 1rem 4.5rem;
  background-color: #fff;
  border: 1px solid #c2c2c2;
  border-radius: 10px;
  font-size: 2rem;
  font-weight: 600;
  background-image: url(../img/common/arrow_blue_2.svg);
  background-repeat: no-repeat;
  background-size: 2.7rem auto;
  background-position: right 3.8rem center;
  transition: .2s;
}

.page-id-14 #sec_02 .month_box .month {
  color: #919191;
}

.page-id-14 #sec_02 .month_box .count {
  color: var(--color-black);
}

.page-id-14 #sec_02 .month_box:hover {
  background-color: #dff6fe;
}

@media (max-width: 767px) {
  .page-id-14 #sec_01 {
    padding: 6rem 0;
  }

  .page-id-14 #sec_02 .wrapper_cover {
    padding: 5rem 0 6rem;
  }

  .page-id-14 #sec_02 .pattern_hl_03 {
    margin-bottom: 4rem;
  }

  .page-id-14 #sec_02 .pattern_hl_02 {
    min-height: 6rem;
    padding: 10rem 0 0;
    margin-bottom: 4rem;
  }

  .page-id-14 #sec_02 .pattern_hl_02:before {
    width: 8rem;
    height: 8rem;
    margin: 0 auto;
    inset: 0 0 auto;
  }

  .page-id-14 #sec_02 .work_archive {
    padding: 4rem 0;
  }

  .page-id-14 #sec_02 .year {
    font-size: 1.8rem;
    margin-bottom: 2rem;
  }

  .page-id-14 #sec_02 .month_box {
    width: 100%;
    font-size: 1.6rem;
    padding: 1rem 6rem 1rem 2rem;
    column-gap: 3rem;
    background-position: right 2rem center;
    background-size: 2.4rem auto;
    height: 7rem;
  }
}

/* 会社案内
**********************************************/
.page-id-61 #sec_circle {
  margin: 0 auto 0;
  width: 64rem;
  max-width: 40vw;
  aspect-ratio: 1 / 1;
  line-height: 1.8;
  text-align: center;
}

.page-id-61 #sec_circle .inner {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  border: 2rem solid var(--color-light);
  box-shadow: 0 0 27px -1px rgba(0, 0, 0, .25);
  margin-top: -50%;
}

.page-id-61 #sec_circle .logo {
  width: 34rem;
  margin-bottom: 7.7rem;
}

.page-id-61 #sec_circle .lead {
  font-size: 2rem;
  font-weight: 700;
  color: var(--color-green);
  margin-bottom: 5px;
}

.page-id-61 #sec_circle .text {
  font-size: 1.5rem;
  font-weight: 500;
}

.page-id-61 #sec_01 .wrapper {
  padding: 15rem 0 14rem;
}

.page-id-61 #sec_01 .pattern_hl_02 {
  width: 38%
}

.page-id-61 #sec_01 .pattern_hl_02_cover .text {
  width: calc(62% - 5rem);
  font-size: 1.8rem;
  line-height: 2;
}

.page-id-61 #sec_01 .pattern_hl_02_cover .text .copy {
  font-size: 2.4rem;
  font-weight: 800;
  margin: 5.4rem 0 1rem;
}

.page-id-61 #sec_02 {
  background-color: var(--color-light);
}

.page-id-61 #sec_02 .wrapper {
  padding: 9rem 0 12rem;
}

.page-id-61 #sec_02 .pattern_hl_02 {
  margin-bottom: 8rem;
}

.page-id-61 #sec_02 .inner {
  padding: 6.5rem 2rem 8rem;
  background-color: #fff;
}

.page-id-61 #sec_02 .inner+.inner {
  margin-top: 3.6rem;
}

.page-id-61 #sec_02 h3 {
  font-size: 3.2rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.6;
}

.page-id-61 #sec_02 .company_table {
  margin-top: 3.5rem;
}

.page-id-61 #sec_02 .col {
  display: flex;
  flex-wrap: wrap;
  column-gap: 3.5rem;
  row-gap: 2rem;
  margin-top: 7rem;
}

.page-id-61 #sec_02 .col .item {
  width: calc(50% - 1.75rem);
  padding: 4.5rem 4rem 5rem;
  border-radius: 10px;
  background-color: #eee;
}

.page-id-61 #sec_02 .col h4 {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--color-blue);
  margin-bottom: .5rem;
  line-height: 1.8;
}

.page-id-61 #sec_02 .col p {
  line-height: 1.7;
}

@media (max-width: 767px) {
  .page-id-61 #sec_circle {
    width: 40rem;
    max-width: calc(100% - 2rem);
  }

  .page-id-61 #sec_circle .inner {
    margin-top: -8rem;
  }

  .page-id-61 #sec_circle .logo {
    width: 20rem;
    margin-bottom: 3rem;
  }

  .page-id-61 #sec_circle .lead {
    font-size: 1.6rem;
  }

  .page-id-61 #sec_01 .wrapper {
    padding: 6rem 0 4rem;
  }

  .page-id-61 #sec_01 .pattern_hl_02_cover .text {
    font-size: 1.5rem;
  }

  .page-id-61 #sec_01 .pattern_hl_02_cover .text .copy {
    font-size: 1.8rem;
    margin: 3rem 0 2rem;
  }

  .page-id-61 #sec_01 .sec_image img {
    aspect-ratio: 2 / 1;
    object-fit: cover;
    object-position: center top;
  }

  .page-id-61 #sec_02 .wrapper {
    padding: 5rem 0 6rem;
  }

  .page-id-61 #sec_02 .pattern_hl_02 {
    margin-bottom: 4rem;
  }

  .page-id-61 #sec_02 h3 {
    font-size: 2.4rem;
  }

  .page-id-61 #sec_02 .inner {
    padding: 4rem 2rem;
  }

  .page-id-61 #sec_02 .col {
    margin-top: 4rem;
  }

  .page-id-61 #sec_02 .col .item {
    width: 100%;
    padding: 2rem 2rem 3rem;
  }

  .page-id-61 #sec_02 .col h4 {
    font-size: 1.7rem;
  }
}

/* サービス
**********************************************/
.page-id-66 #sec_01 .wrapper {
  padding: 10rem 0 8rem;
}

.page-id-66 #sec_01 .pattern_hl_02_cover .pattern_hl_02 {
  width: 40%;
}

.page-id-66 #sec_01 .pattern_hl_02_cover .text {
  width: calc(60% - 5rem);
  padding-top: 3rem;
}

.page-id-66 #sec_02 {
  background-color: var(--color-light);
}

.page-id-66 #sec_02 .wrapper {
  padding: 7rem 0 12rem;
}

.page-id-66 #sec_02 .pattern_hl_03 {
  margin-bottom: 7rem;
}

.page-id-66 #sec_02 .col {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 4rem;
  row-gap: 3.3rem;
}

.page-id-66 #sec_02 .col>.item {
  width: calc(50% - 2rem);
  border-radius: 10px;
  box-shadow: 0 0 4px rgba(0, 0, 0, .25);
  background-color: #fff;
  padding: 3rem 5rem 8rem;
  position: relative;
  overflow: hidden;
}

.page-id-66 #sec_02 .col .hl {
  display: flex;
  align-items: start;
  column-gap: 2.3rem;
  flex-wrap: wrap;
  margin-bottom: 2.4rem;
}

.page-id-66 #sec_02 .col .hl img {
  width: 13rem;
}

.page-id-66 #sec_02 .col .hl .textside {
  width: calc(100% - 15.3rem);
  padding-top: 1.5rem;
}

.page-id-66 #sec_02 .col .hl h3 {
  font-size: 2.4rem;
  font-weight: 800;
  color: var(--color-green);
  line-height: 1.45;
  margin-bottom: 1.2rem;
}

.page-id-66 #sec_02 .col .hl p {
  font-size: 1.5rem;
}

.page-id-66 #sec_02 .col h4 {
  font-size: 2rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  margin-bottom: 1rem;
}

.page-id-66 #sec_02 .col h4:after {
  content: "";
  background-color: #b8b8b8;
  margin-left: 2rem;
  flex-grow: 1;
  height: 1px;
}

.page-id-66 #sec_02 .col ul {
  font-weight: 500;
  line-height: 2.27;
}

.page-id-66 #sec_02 .col ul li {
  padding-left: 1.68em;
  position: relative;
}

.page-id-66 #sec_02 .col ul li:before {
  content: "";
  width: 1.125em;
  aspect-ratio: 1 / 1;
  background-image: url(../img/common/check_green_1.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: absolute;
  left: 0;
  top: .5725em;
}

.page-id-66 #sec_02 .col .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: .3rem;
  padding: 1.5rem 2rem;
  min-width: 25rem;
  position: absolute;
  right: 0;
  bottom: 0;
  background-color: var(--color-green);
  font-size: 1.5rem;
  font-weight: 800;
  color: #fff;
  border-radius: 10px 0 10px 0;
  border: 1px solid var(--color-green);
  transition: .2s;
}

.page-id-66 #sec_02 .col .btn:after {
  content: "";
  width: .75em;
  min-width: .75em;
  height: 1em;
  background-image: url(../img/common/arrow_white_3.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.page-id-66 #sec_02 .col .btn:hover {
  background-color: #fff;
  color: var(--color-green);
}

.page-id-66 #sec_02 .col .btn:hover:after {
  background-image: url(../img/common/arrow_green_3.svg);
}

.page-id-66 #sec_03 {
  background: var(--grad-01);
}

.page-id-66 #sec_03 .wrapper_cover {
  padding: 11rem 0 12rem;
}

.page-id-66 #sec_03 .inner {
  background-color: #fff;
  border-radius: 10px;
}

.page-id-66 #sec_03 .inner+.inner {
  margin-top: 4rem;
}

.page-id-66 #sec_03 .inner .wrapper {
  padding: 8rem 0;
}

.page-id-66 #sec_03 .hl {
  padding-left: 16.4rem;
  min-height: 13.2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 5rem;
  position: relative;
}

.page-id-66 #sec_03 .hl p {
  font-size: 2rem;
  font-weight: 600;
}

.page-id-66 #sec_03 .hl img {
  width: 13.2rem;
  height: 13.2rem;
  position: absolute;
  inset: 0 auto 0 0;
  margin: auto 0;
}

.page-id-66 #sec_03 .mediacol {
  display: flex;
  align-items: start;
  column-gap: clamp(3rem,4vw,8rem);
  margin-bottom: 3.4rem;
}

.page-id-66 #sec_03 .mediacol .imgside {
  width: clamp(30rem,32vw,57rem);
  min-width: clamp(30rem,32vw,57rem);
}

.page-id-66 #sec_03 .mediacol .textside {
  width: 100%;
}

.page-id-66 #sec_03 .mediacol .textside .text {
  line-height: 1.85;
}

.page-id-66 #sec_03 .mediacol .textside .text:not(:last-child) {
  margin-bottom: 3.4rem;
}

.page-id-66 #sec_03 .boxcol {
  display: flex;
  column-gap: 2.2rem;
  row-gap: 2rem;
  margin: 6.3rem 0 5rem;
  flex-wrap: wrap;
}

.page-id-66 #sec_03 .boxcol>.pattern_checklist {
  width: calc(50% - 1.1rem);
}

@media (max-width: 767px) {
  .page-id-66 #sec_01 .wrapper {
    padding: 5rem 0 6rem;
  }

  .page-id-66 #sec_02 .wrapper {
    padding: 5rem 0 6rem;
  }

  .page-id-66 #sec_02 .pattern_hl_03 {
    margin-bottom: 4rem;
  }

  .page-id-66 #sec_02 .col>.item {
    width: 100%;
    padding: 2rem 2rem 8rem;
  }

  .page-id-66 #sec_02 .col .hl {
    column-gap: 2rem;
  }

  .page-id-66 #sec_02 .col .hl img {
    width: 7rem;
  }

  .page-id-66 #sec_02 .col .hl .textside {
    padding: 0;
    width: calc(100% - 9rem);
  }

  .page-id-66 #sec_02 .col .hl h3 {
    font-size: 1.8rem;
    margin-bottom: .8rem;
  }

  .page-id-66 #sec_02 .col h4 {
    font-size: 1.8rem;
  }

  .page-id-66 #sec_02 .col .btn {
    width: 100%;
    border-radius: 0 0 10px 10px;
    padding: 1.5rem;
    font-size: 1.3rem;
  }

  .page-id-66 #sec_03 .wrapper_cover {
    padding: 6rem 0;
  }

  .page-id-66 #sec_03 .inner .wrapper {
    padding: 3rem 0 4rem;
  }

  .page-id-66 #sec_03 .hl {
    padding: 8rem 0 0;
    min-height: 8rem;
  }

  .page-id-66 #sec_03 .hl img {
    width: 6rem;
    height: 6rem;
    inset: 0 0 auto;
    margin: 0 auto;
  }

  .page-id-66 #sec_03 .hl p {
    font-size: 1.6rem;
    margin-top: .5rem;
  }

  .page-id-66 #sec_03 .mediacol {
    flex-wrap: wrap;
    row-gap: 2rem;
  }

  .page-id-66 #sec_03 .mediacol .imgside {
    width: 100%;
  }

  .page-id-66 #sec_03 .boxcol>.pattern_checklist {
    width: 100%;
  }

  .page-id-66 #sec_03 .boxcol {
    margin: 2rem 0 3rem;
  }
}

/* サービス子ページ
**********************************************/
.service_child #sec_01 .wrapper {
  padding: 10rem 0 8rem;
}

.service_child #sec_01 .pattern_hl_02_cover .pattern_hl_02 {
  width: 37%;
}

.service_child #sec_01 .pattern_hl_02_cover .text {
  width: calc(63% - 5rem);
  padding-top: 3rem;
}

.service_child #sec_02 {
  background-color: var(--color-light);
}

.service_child #sec_02 .wrapper {
  padding: 7rem 0 10rem;
}

.service_child .front_text {
  text-align: center;
  line-height: 2;
  margin-bottom: 7rem;
}

.service_child #sec_02 .col {
  display: flex;
  flex-wrap: wrap;
  gap: 4rem;
}

.service_child #sec_02 .col>.item {
  width: calc((100% - 8rem) / 3);
  background-color: #fff;
  border-radius: 10px;
  border: 1px solid #d2d2d2;
  padding: 4rem 2rem 3rem;
}

.service_child #sec_02 .col img {
  width: 30rem;
  max-width: 100%;
  margin: 0 auto 2.5rem;
}

.service_child #sec_02 .col p {
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.34;
}

.service_child #sec_03 {
  background-color: var(--color-light);
}

.service_child #sec_03 .wrapper_cover {
  padding: 7rem 0 8rem;
  background: var(--grad-01);
  box-shadow: 0 3px 9px 1px rgba(0,0,0,.15);
}

.service_child #sec_faq {
  background-color: var(--color-light);
}

.service_child #sec_faq .wrapper {
  padding: 10rem 0 18rem;
}

.service_child #sec_faq .front_text {
  margin-bottom: 3.4rem;
}

.service_child #sec_faq .service_faq {
  width: 85rem;
  max-width: 100%;
  margin: 0 auto;
}

.service_child #sec_faq .faq_wrap {
  margin: 0;
  border-radius: 10px;
  overflow: hidden;
  background-color: #fff;
}

.service_child #sec_faq .faq_wrap+.faq_wrap {
  margin-top: 1rem;
}

.service_child #sec_faq .faq_wrap::details-content {
    transition: height .4s, opacity .4s, content-visibility .4s allow-discrete;
    height: 0;
    opacity: 0;
    overflow: clip;
}

.service_child #sec_faq .faq_wrap[open]::details-content {
    opacity: 1;
}

@supports (interpolate-size: allow-keywords) {
    :root {
        interpolate-size: allow-keywords;
    }
    .service_child #sec_faq .faq_wrap[open]::details-content {
        height: auto;
    }
}

.service_child #sec_faq .faq_lead {
  padding: 2rem 10rem 2rem 5.4rem;
  position: relative;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  list-style-type: none;
  transition: background-color .2s;
  outline: none;
}

.service_child #sec_faq .faq_lead:before {
  content: "Q";
  font-family: var(--font-doppio);
  font-size: 1.2em;
  line-height: 1.2;
  position: absolute;
  left: 2.8rem;
  top: 1.8rem;
  color: var(--color-green);
}

.service_child #sec_faq .faq_wrap .faq_lead:after {
  content: "";
  position: absolute;
  inset: 0 3.3rem 0 auto;
  margin: auto 0;
  width: 1.62rem;
  height: 2rem;
  background-image: url(../img/common/plus_02_blue.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  transition: .2s;
}

.service_child #sec_faq .faq_wrap[open] .faq_lead:after {
  background-image: url(../img/common/minus_02_blue.svg);
}

.service_child #sec_faq .faq_content {
  padding: 0 6rem 3rem 5.4rem;
  position: relative;
}

.service_child #sec_faq .faq_content:before {
  content: "";
  width: 1px;
  position: absolute;
  top: -1rem;
  left: 3.6rem;
  bottom: 3rem;
  background-color: var(--color-green);
}

@media (max-width: 767px) {
  .service_child #sec_01 .wrapper {
    padding: 5rem 0 6rem;
  }

  .service_child #sec_02 .wrapper {
    padding: 6rem 0;
  }

  .service_child .front_text {
    text-align: left;
    margin-bottom: 4rem;
  }

  .service_child #sec_02 .col {
    gap: 2rem;
  }

  .service_child #sec_02 .col>.item {
    width: 100%;
    padding: 3rem 2rem;
  }

  .service_child #sec_02 .col p {
    font-size: 1.8rem;
  }

  .service_child #sec_02 .col img {
    width: 24rem;
  }

  .service_child #sec_03 .wrapper_cover {
    padding: 5rem 0 6rem;
  }

  .service_child #sec_faq .wrapper {
    padding: 4rem 0 5rem;
  }

  .service_child #sec_faq .faq_lead:before {
    left: 1.5rem;
  }

  .service_child #sec_faq .faq_lead {
    font-size: 1.6rem;
    padding: 2rem 6rem 2rem 4rem;
  }

  .service_child #sec_faq .faq_wrap .faq_lead:after {
    right: 2rem;
  }

  .service_child #sec_faq .faq_content {
    padding: 0 2rem 3rem 4rem;
  }

  .service_child #sec_faq .faq_content:before {
    left: 2rem;
  }
}

/* キッティング作業
**********************************************/
.page-id-71 #sec_04 {
  background-color: var(--color-light);
}

.page-id-71 #sec_04 .wrapper {
  padding: 11rem 0 13rem;
}

.page-id-71 #sec_04 .pattern_hl_03 {
  margin-bottom: 10rem;
}

.page-id-71 #sec_04 .mediacol {
  display: flex;
  align-items: start;
  column-gap: clamp(3rem,4vw,8rem);
}

.page-id-71 #sec_04 .mediacol .imgside {
  width: clamp(30rem,32vw,57rem);
  min-width: clamp(30rem,32vw,57rem);
}

.page-id-71 #sec_04 .mediacol .textside {
  width: 100%;
}

.page-id-71 #sec_04 .mediacol h3 {
  font-size: 2.4rem;
  font-weight: 800;
  color: var(--color-green);
  line-height: 1.7;
  margin-bottom: 2.5rem;
}

.page-id-71 #sec_04 .mediacol .text {
  line-height: 2;
  margin-bottom: 2.5rem;
}

.page-id-71 #sec_04 .pattern_checklist {
  background-color: #fff;
}

.page-id-71 #sec_04 .pattern_checklist .merit_hl {
  color: var(--color-green);
}

.page-id-71 #sec_04 .pattern_checklist .listcol li:before {
  background-image: url(../img/common/check_green_1.svg);
}

.page-id-71 #sec_05 .wrapper {
  padding: 9rem 0;
}

.page-id-71 #sec_05 .col {
  display: flex;
  flex-wrap: wrap;
  gap: 2.2rem;
}

.page-id-71 #sec_05 .col>.pattern_checklist {
  width: calc(50% - 1.1rem);
}

.page-id-71 #sec_06 .wrapper_cover {
  padding: 7rem 0 8rem;
  background: var(--grad-01);
  box-shadow: 0 3px 9px 1px rgba(0,0,0,.15);
}

.page-id-71 #sec_06 .col {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 2rem;
  row-gap: 5rem;
  counter-reset: number 0;
}

.page-id-71 #sec_06 .col>.item {
  width: calc((100% - 4rem) / 3);
  background-color: #fff;
  border-radius: 10px;
  position: relative;
  padding: 4rem 3.5rem 3rem;
}

.page-id-71 #sec_06 .col img {
  width: 22rem;
  max-width: 100%;
  margin: 0 auto .3rem;
}

.page-id-71 #sec_06 .col .lead {
  font-size: 2rem;
  font-weight: 700;
  color: var(--color-blue);
  text-align: center;
  margin-bottom: 1.4rem;
}

.page-id-71 #sec_06 .col>.item:before {
  counter-increment: number 1;
  content: counter(number, decimal-leading-zero);
  width: 6.6rem;
  padding: .4rem 1rem;
  border-radius: 100px;
  background-color: var(--color-blue);
  position: absolute;
  top: 1.4rem;
  left: 1.4rem;
  font-size: 1.5rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.34;
  text-align: center;
}

.page-id-71 #sec_07 .wrapper {
  padding: 9rem 0 10rem;
}

.page-id-71 #sec_07 .col {
  display: flex;
  flex-wrap: wrap;
  gap: 2.2rem;
}

.page-id-71 #sec_07 .col>.pattern_checklist {
  width: calc(50% - 1.1rem);
}

@media (max-width: 767px) {
  .page-id-71 #sec_04 .wrapper {
    padding: 6rem 0;
  }

  .page-id-71 #sec_04 .pattern_hl_03 {
    margin-bottom: 5rem;
  }

  .page-id-71 #sec_04 .mediacol {
    flex-wrap: wrap;
    row-gap: 2rem;
  }

  .page-id-71 #sec_04 .mediacol .imgside {
    width: 100%;
    min-width: initial;
  }

  .page-id-71 #sec_04 .mediacol h3 {
    font-size: 1.8rem;
  }

  .page-id-71 #sec_05 .wrapper {
    padding: 5rem 0;
  }

  .page-id-71 #sec_05 .col>.pattern_checklist {
    width: 100%;
  }

  .page-id-71 #sec_06 .wrapper_cover {
    padding: 4rem 0 5rem;
  }

  .page-id-71 #sec_06 .col {
    row-gap: 2rem;
  }

  .page-id-71 #sec_06 .col>.item {
    width: 100%;
    padding: 4rem 2rem 3rem;
  }

  .page-id-71 #sec_06 .col img {
    width: 18rem;
    margin-bottom: 1rem;
  }

  .page-id-71 #sec_06 .col .lead {
    font-size: 1.8rem;
  }

  .page-id-71 #sec_07 .wrapper {
    padding: 6rem 0;
  }

  .page-id-71 #sec_07 .col>.pattern_checklist {
    width: 100%;
  }
}

/* パソコン設置・導入展開
**********************************************/
.page-id-75 #sec_03 .mediacol {
  display: flex;
  align-items: center;
  position: relative;
  min-height: 30rem;
  background-color: #fff;
  overflow: hidden;
  border-radius: 10px;
  padding-left: 46rem;
  margin-top: 4rem;
}

.page-id-75 #sec_03 .mediacol img {
  width: 46rem;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

.page-id-75 #sec_03 .mediacol .textside {
  padding: 4rem 6rem;
  width: 100%;
}

.page-id-75 #sec_03 .mediacol .lead {
  font-size: 2.8rem;
  font-weight: 700;
  display: flex;
  flex-wrap: wrap;
  column-gap: 1.2rem;
  row-gap: 1rem;
  align-items: center;
  margin-bottom: 2rem;
}

.page-id-75 #sec_03 .mediacol .lead:before {
  content: "\5C0E\5165\4E8B\4F8B";
  min-width: 12.8rem;
  padding: .5rem 1rem;
  border-radius: 100px;
  background-color: var(--color-blue);
  font-size: 1.5rem;
  font-weight: 700;
  text-align: center;
  color: #fff;
}

.page-id-75 #sec_03 .mediacol .text {
  font-size: 1.8rem;
  line-height: 1.6;
}

.page-id-75 #sec_03 .mediacol dl {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  line-height: 1.2;
  margin-top: 2.5rem;
}

.page-id-75 #sec_03 .mediacol dt {
  font-size: 1.5rem;
  font-weight: 500;
  color: #fff;
  text-align: center;
  padding: .3rem 1rem;
  background-color: var(--color-blue);
}

.page-id-75 #sec_03 .mediacol dd {
  font-size: 1.6rem;
  font-weight: 700;
  margin-left: 1.4rem;
}

.page-id-75 #sec_03 .mediacol dt:not(:first-child) {
  margin-left: 2.6rem;
}

.page-id-75 #sec_04 {
  background-color: var(--color-light);
}

.page-id-75 #sec_04 .wrapper {
  padding: 10rem 0;
}

.page-id-75 #sec_04 .col {
  display: flex;
  flex-wrap: wrap;
  gap: 2.2rem;
}

.page-id-75 #sec_04 .col>.pattern_checklist {
  width: calc(50% - 1.1rem);
  background-color: #fff;
}

.page-id-75 #sec_05 .wrapper {
  padding: 9rem 0 10rem;
}

.page-id-75 #sec_05 .pattern_col_01 .text {
  font-size: 1.4rem;
}

.page-id-75 #sec_06 .wrapper_cover {
  padding: 7rem 0 8rem;
  background: var(--grad-01);
  box-shadow: 0 3px 9px 1px rgba(0,0,0,.15);
}

.page-id-75 #sec_06 .col {
  display: flex;
  flex-wrap: wrap;
  column-gap: 3.6rem;
  row-gap: 3rem;
}

.page-id-75 #sec_06 .col>.item {
  width: calc(50% - 1.8rem);
  background-color: #fff;
  border-radius: 10px;
  padding: 2.5rem 5rem 2.5rem 3rem;
  display: flex;
  align-items: center;
  column-gap: 2rem;
}

.page-id-75 #sec_06 .col img {
  width: 19rem;
}

.page-id-75 #sec_06 .col .textside {
  width: calc(100% - 21rem);
}

.page-id-75 #sec_06 .col .lead {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.34;
  color: var(--color-blue);
  margin-bottom: 1.5rem;
}

.page-id-75 #sec_06 .col .text {
  line-height: 1.47;
}

.page-id-75 #sec_07 .wrapper {
  padding: 8rem 0 12rem;
}

.page-id-75 #sec_07 .pattern_hl_03 {
  margin-bottom: 8rem;
}

.page-id-75 #sec_07 .wrapper .mediacol {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  column-gap: 8rem;
  row-gap: 3rem;
}

.page-id-75 #sec_07 .wrapper .mediacol img {
  width: 57rem;
}

.page-id-75 #sec_07 .wrapper .mediacol .textside {
  width: calc(100% - 65rem);
}

.page-id-75 #sec_07 .wrapper .mediacol .text {
  line-height: 1.85;
}

.page-id-75 #sec_07 .wrapper .mediacol .btn {
  width: 43.6rem;
  max-width: 100%;
  padding: 2rem 3rem;
  border-radius: 5px;
  background-color: var(--color-blue);
  border: 1px solid var(--color-blue);
  position: relative;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.7;
  text-align: center;
  color: #fff;
  margin-top: 5rem;
  transition: .2s;
}

.page-id-75 #sec_07 .wrapper .mediacol .btn:after {
  content: "";
  width: 1rem;
  height: 1rem;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  position: absolute;
  inset: 0 2.3rem 0 auto;
  margin: auto 0;
  transform: rotate(45deg);
}

.page-id-75 #sec_07 .wrapper .mediacol .btn:hover {
  background-color: #fff;
  color: var(--color-blue);
}

.page-id-75 #sec_07 .wrapper .mediacol .btn:hover:after {
  border-color: var(--color-blue);
}

@media (max-width: 767px) {
  .page-id-75 #sec_03 .mediacol {
    padding: 0;
    flex-wrap: wrap;
  }

  .page-id-75 #sec_03 .mediacol img {
    width: 100%;
    height: 45vw;
    position: initial;
  }

  .page-id-75 #sec_03 .mediacol .textside {
    padding: 3rem 2rem 4rem;
  }

  .page-id-75 #sec_03 .mediacol .lead {
    font-size: 2rem;
    width: 100%;
  }

  .page-id-75 #sec_03 .mediacol .lead:before {
    font-size: 1.4rem;
  }

  .page-id-75 #sec_03 .mediacol .text {
    font-size: 1.5rem;
  }

  .page-id-75 #sec_03 .mediacol dl {
    row-gap: .5rem;
  }

  .page-id-75 #sec_03 .mediacol dt {
    width: 8rem;
    padding: .3rem 0;
    margin-left: 0 !important;
  }

  .page-id-75 #sec_03 .mediacol dd {
    width: calc(100% - 9.4rem);
  }

  .page-id-75 #sec_04 .wrapper {
    padding: 5rem 0 6rem;
  }

  .page-id-75 #sec_04 .col>.pattern_checklist {
    width: 100%;
  }

  .page-id-75 #sec_05 .wrapper {
    padding: 5rem 0 6rem;
  }

  .page-id-75 #sec_06 .wrapper_cover {
    padding: 5rem 0 6rem;
  }

  .page-id-75 #sec_06 .col>.item {
    width: 100%;
    justify-content: center;
    padding: 2.5rem 2rem;
    flex-wrap: wrap;
    row-gap: 2rem;
  }

  .page-id-75 #sec_06 .col .textside {
    width: 100%;
  }

  .page-id-75 #sec_06 .col .lead {
    font-size: 1.8rem;
  }

  .page-id-75 #sec_07 .wrapper {
    padding: 5rem 0 6rem;
  }

  .page-id-75 #sec_07 .pattern_hl_03 {
    margin-bottom: 4rem;
  }

  .page-id-75 #sec_07 .wrapper .mediacol .textside {
    width: 100%;
  }

  .page-id-75 #sec_07 .wrapper .mediacol .btn {
    width: 100%;
    font-size: 1.6rem;
    margin-top: 4rem;
  }
}

/* フォームテンプレート
**********************************************/
.contact_page .wrapper_cover {
  background-color: #fff;
  border-radius: 10px 10px 0 0;
  padding: 8rem 0 14rem;
}

.contact_page ~ #footer {
  border-top: 2px solid #b7b7b7;
}

.confirm_wrap,
.thanks_wrap,
.wpcf7-response-output,
.wpcf7-spinner {
    display: none;
}

.form_wrap {
  width: 100%;
}

.form_wrap .table_contact {
  width: 80rem;
  max-width: 100%;
  margin: 0 auto;
  border-collapse: collapse;
}

.form_wrap .table_contact tr {
  display: flex;
  align-items: start;
  flex-wrap: wrap;
}

.form_wrap .table_contact th {
  width: 20rem;
  padding: 3rem 1rem 3rem 0;
  text-align: left;
  line-height: 1.625;
  font-size: 1.8rem;
  font-weight: 700;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  column-gap: 1.8rem;
  row-gap: .5rem;
}

.form_wrap .table_contact th.any:after {
  content: "任意";
  display: inline-block;
  width: 8rem;
  padding: .3rem;
  border-radius: 100px;
  border: 1px solid #739fff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  color: #739fff;
}

.form_wrap .table_contact td {
  width: calc(100% - 20rem);
  padding: 2rem 0;
}

.form_wrap.confirm_wrap .table_contact td {
  line-height: 1.625em;
  padding: 2em 0;
}

.form_wrap .table_contact tr:not(:last-child) {
  border-bottom: 1px dashed #ccc;
}

.form_wrap .table_contact td input[type="text"],
.form_wrap .table_contact td input[type="email"],
.form_wrap .table_contact td input[type="tel"],
.form_wrap .table_contact textarea {
  line-height: 2;
  padding: .9rem 1.5rem;
  border: 1px solid #ccc;
  background-color: #fff;
  border-radius: 5px;
  vertical-align: middle;
  font-family: var(--font-noto);
  font-size: 1.6rem;
  width: 100%;
  font-weight: 500;
  outline: none;
}

.form_wrap .table_contact textarea {
  height: 25rem;
}

.form_wrap .table_contact td input[type="text"]:placeholder-shown,
.form_wrap .table_contact td input[type="email"]:placeholder-shown,
.form_wrap .table_contact td input[type="tel"]:placeholder-shown,
.form_wrap .table_contact textarea:placeholder-shown {
  background-color: #f0f0f0;
}

.form_wrap .table_contact td input::placeholder,
.form_wrap .table_contact td textarea::placeholder {
  color: #9b9b9b;
  line-height: 2;
}

.form_wrap .table_contact td .normalselect {
  padding: 1.2rem 1.5rem;
  border: 1px solid #ccc;
  background-color: #fff;
  border-radius: 5px;
  vertical-align: middle;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.6rem;
  width: 100%;
  outline: none;
}

.form_wrap .table_contact td select {
  -webkit-appearance: none;
  appearance: none;
}

.form_wrap .wpcf7-form-control-wrap {
  display: inline-block;
  width: 100%;
  position: relative;
}

.form_wrap .table_contact .wpcf7-form-control-wrap+.wpcf7-form-control-wrap {
  margin-top: 1.5rem;
}

.form_wrap .table_contact .select_td>.wpcf7-form-control-wrap:after {
  width:0;
  height:0;
  border-style:solid;
  border-width: 8px 5px 0 5px;
  border-color: #969696 transparent transparent transparent;
  position: absolute;
  content: "";
  inset: 0 2.5rem 0 auto;
  margin: auto 0;
}

.form_wrap .table_contact td input[name="zip"] {
  width: 4.5em;
  margin: 0 .5em;
}

.form_wrap .table_contact td input[name="zip1"] {
  width: 5.625em;
  margin: 0 .5em;
}

.form_wrap .table_contact td .address_postal {
  display: flex;
  align-items: center;
  margin-bottom: 3rem;
}

.form_wrap .table_contact td .address_postal .wpcf7-form-control-wrap {
  width: auto;
  margin: 0;
}

.form_wrap .form_fade_box {
  display: none;
  margin-top: .5rem;
}

.form_wrap .form_fade_box p:not(:last-child) {
  margin-bottom: .5rem;
}

.form_wrap .form_fade_box.active {
  display: block;
}

.form_wrap .form_fade_box textarea {
  height: 10rem;
}

.form_wrap .policy_consent {
  width: 80rem;
  max-width: 100%;
  margin: 4rem auto 0;
  border: 1px solid #739fff;
  border-radius: 5px;
  padding: 2.4rem 1rem 2.2rem;
  text-align: center;
  background-color: #dfe9ff;
}

.form_wrap .policy_consent .policy_lead {
  line-height: 1.78;
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 1.6rem;
}

.form_wrap .policy_consent input {
  transform: scale(1.5);
  margin-right: 1.5rem;
}

.form_wrap .policy_consent label {
  font-weight: 500;
  line-height: 2;
  margin-bottom: .6rem;
  display: inline-block;
}

.form_wrap .policy_consent .policy_btn a {
  font-size: 1.5rem;
  color: #2785ff;
  font-weight: 700;
  line-height: 2;
  text-decoration: underline;
}

.form_wrap .submit_btn {
  display: flex;
  flex-wrap: wrap;
  column-gap: 30px;
  row-gap: 10px;
  justify-content: center;
  margin-top: 9rem;
}

.form_wrap .confirm_button {
  width: 47rem;
  max-width: 100%;
  margin: 0;
  display: block;
  height: auto;
  text-align: center;
  padding: 2.4rem 5rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.78;
  background-color: var(--color-green);
  cursor: pointer;
  border: none;
  border-radius: 1000px;
  transition: opacity .2s;
  background-image: url(../img/common/arrow_white_4.svg);
  background-repeat: no-repeat;
  background-size: 2.8rem;
  letter-spacing: .1em;
  background-position: right 3.2rem center;
}

.form_wrap .back_button {
  width: 47rem;
  max-width: 100%;
  margin: 0;
  display: block;
  height: auto;
  text-align: center;
  padding: 2.4rem 5rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.78;
  background-color: #919191;
  cursor: pointer;
  border: none;
  border-radius: 1000px;
  transition: opacity .2s;
  letter-spacing: .1em;
}

.form_wrap .confirm_button:hover,
.form_wrap .back_button:hover {
  opacity: .7;
}

.form_wrap .confirm_button:disabled {
  cursor: no-drop;
  background-color: #ccc;
  opacity: 1 !important;
}

.form_wrap .front_text {
  font-size: 2rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.6;
  margin-bottom: 6.8rem;
}

.form_cta_col {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin-bottom: 10rem;
}

.form_cta_col .item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: calc(50% - 1rem);
  padding: 3rem 1.5rem;
}

.form_cta_col .item.is_tel {
  background-color: #e8fffd;
}

.form_cta_col .item.is_tel .text_1 {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.6;
  text-align: center;
  margin-bottom: 1rem;
}

.form_cta_col .item.is_tel .text_2 {
  font-size: 5rem;
  font-weight: 700;
  font-family: var(--font-lato);
  color: var(--color-green);
  line-height: 1;
  padding-left: 1.1em;
  background-image: url(../img/common/icon_tel_green.svg);
  background-repeat: no-repeat;
  background-size: .8em;
  background-position: left center;
  margin-bottom: 1.3rem;
}

.form_cta_col .item.is_tel .text_3 {
  font-weight: 500;
  line-height: 1.7;
}

.form_cta_col .item.is_mail {
  background-color: #dff6fe;
}

.form_cta_col .item.is_mail h2 {
  text-align: center;
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--color-blue);
  margin-bottom: 1.2rem;
}

.form_cta_col .item.is_mail p {
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.67;
  margin-bottom: 1.8rem;
}

.form_cta_col .item.is_mail .btn {
  font-size: 1.8rem;
  font-weight: 700;
  text-align: center;
  padding: 2rem 3rem 2rem 5rem;
  position: relative;
  border-radius: 5px;
  color: #fff;
  transition: .2s;
  max-width: 100%;
  background-repeat: no-repeat;
}

.form_cta_col .item.is_mail .btn.is_estimate {
  width: 37.3rem;
  background-image: url(../img/common/icon_document_white.svg);
  background-size: 1.67em auto;
  background-position: left 1.67em center;
  background-color: var(--color-blue);
  border: 1px solid var(--color-blue);
}

.form_cta_col .item.is_mail .btn.is_contact {
  width: 34.8rem;
  background-image: url(../img/common/icon_mail_white.svg);
  background-size: 1.39em auto;
  background-position: left 1.67em center;
  background-color: var(--color-green);
  border: 1px solid var(--color-green);
}

.form_cta_col .item.is_mail .btn:after {
  content: "";
  width: 1rem;
  height: 1rem;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  position: absolute;
  inset: 0 2rem 0 auto;
  margin: auto 0;
  transform: rotate(45deg);
}

.form_cta_col .item.is_mail .btn.is_estimate:hover {
  background-color: #fff;
  color: var(--color-blue);
  background-image: url(../img/common/icon_document_blue.svg);
}

.form_cta_col .item.is_mail .btn.is_contact:hover {
  background-color: #fff;
  color: var(--color-green);
  background-image: url(../img/common/icon_mail_green.svg);
}

.form_cta_col .item.is_mail .btn.is_estimate:hover:after {
  border-color: var(--color-blue);
}

.form_cta_col .item.is_mail .btn.is_contact:hover:after {
  border-color: var(--color-green);
}

.form_overview {
  padding: 7rem 1rem 10rem;
  background-color: #fff;
  border: 1px solid #c3c3c3;
  border-radius: 10px;
  margin-bottom: 11rem;
}

.form_hl {
  font-size: 3.2rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.6;
  margin-bottom: 4rem;
}

@media (max-width: 767px) {
  .contact_page .wrapper_cover {
    padding: 6rem 0 8rem;
  }

  .form_wrap .table_contact {
    width: 100%;
  }
  
  .form_wrap .front_text {
    font-size: 1.5rem;
    text-align: left;
    margin-bottom: 5rem;
  }

  .form_cta_col {
    margin-bottom: 6rem;
  }

  .form_cta_col .item {
    width: 100%;
  }

  .form_cta_col .item.is_tel .text_1 {
    font-size: 1.5rem;
  }

  .form_cta_col .item.is_tel .text_2 {
    font-size: 3.6rem;
  }

  .form_cta_col .item.is_tel .text_3 {
    font-size: 1.4rem;
  }

  .form_cta_col .item.is_mail h2 {
    font-size: 1.8rem;
  }

  .form_cta_col .item.is_mail .btn {
    font-size: 1.6rem;
  }

  .form_wrap .table_contact tr {
    padding: 2rem 0;
  }

  .form_wrap .table_contact th,
  .form_wrap .table_contact td {
    width: 100%;
    padding: 0;
  }

  .form_wrap .table_contact th {
    margin-bottom: 1rem;
    font-size: 1.6rem;
  }

  .form_wrap .submit_btn {
    margin-top: 5rem;
  }

  .form_wrap .confirm_button,
  .form_wrap .back_button {
    font-size: 1.6rem;
    padding: 2rem 5rem;
  }

  .form_hl {
    font-size: 2.4rem;
  }

  .form_overview {
    padding: 4rem 1rem 5rem;
    margin-bottom: 6rem;
  }
}

/* デフォルトテンプレート + プライバシーポリシー
**********************************************/
.default_page .wrapper_cover {
  background-color: #fff;
  border-radius: 10px 10px 0 0;
}

.default_page .wrapper_cover .privacy_inner {
  padding: 12rem 0 11rem;
  width: 85rem;
  max-width: calc(100% - 40px);
  margin: 0 auto;
}

.default_page .wrapper_cover .privacy_inner h2 {
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1.4;
  padding-left: .9em;
  position: relative;
  margin-bottom: 2rem;
}

.default_page .wrapper_cover .privacy_inner h2:before {
  content: "";
  width: .4rem;
  height: 1em;
  position: absolute;
  inset: .25em auto auto 0;
  background-color: var(--color-green);
  border-radius: 10px;
}

.default_page .wrapper_cover .privacy_inner p {
  padding-left: 2.2rem;
  line-height: 1.8;
}

.default_page .wrapper_cover .privacy_inner p+p {
  margin-top: 1.8em;
}

.default_page .wrapper_cover .privacy_inner .wp-block-separator {
  margin: 2rem 0 4rem;
  border-top: 1px solid #ebebeb;
}

@media (max-width: 767px) {
  .default_page .wrapper_cover .privacy_inner {
    padding: 6rem 0 8rem;
  }

  .default_page .wrapper_cover .privacy_inner h2 {
    font-size: 1.8rem;
  }

  .default_page .wrapper_cover .privacy_inner p {
    padding-left: 1.6rem;
  }
}