@media (width < 640px) {
  .sm-hide {
    display: none;
  }
}
@media (width >= 640px) {
  .md-hide {
    display: none;
  }
}
@media (width >= 960px) {
  .lg-hide {
    display: none;
  }
}

#main_contents {
  margin: 0 !important;
  color: #333;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
}

#main_contents .heading-lg {
  font-size: 24px;
  text-align: center;
}
@media (width >= 640px) {
  #main_contents .heading-lg {
    font-size: 36px;
  }
}

#main_contents .heading-sm {
  font-size: 24px;
  text-align: center;
}
@media (width >= 640px) {
  #main_contents .heading-sm {
    font-size: 28px;
  }
}

:where(#main_contents) p {
  font-size: inherit !important;
  line-height: 1.8 !important;
  text-align: inherit !important;
}

:where(#main_contents) a {
  display: inline-block;
  color: inherit;
}

:where(#main_contents) img {
  max-width: 100%;
  height: auto;
}

@media (width < 640px) {
  :where(#main_contents) img.lg {
    display: none;
  }
  :where(#main_contents) img.md {
    display: none;
  }
}
@media (width >= 640px) {
  :where(#main_contents) img.sm {
    display: none;
  }
}
@media (640px <= width < 960px) {
  :where(#main_contents) .md + img.lg {
    display: none;
  }
}
@media (width >= 960px) {
  :where(#main_contents) img.md {
    display: none;
  }
}

:where(#main_contents) em {
  font-style: normal;
}

:where(#main_contents) summary {
  display: block;
  cursor: pointer;
}

:where(#main_contents) summary::-webkit-details-marker {
  display: none;
}

:where(#main_contents details) .content {
  overflow: hidden;
}

:where(#main_contents) button {
  padding: 0;
  border: none;
  background-color: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.post_content p,
.post_content ul, .post_content ol, .post_content dl {
  margin-bottom: 0;
}

.section-wrapper {
  padding-right: calc(16/390*100vw);
  padding-left: calc(16/390*100vw);
}
@media (width >= 640px) {
  .section-wrapper {
    padding-right: min(calc(64/768*100vw), 120px);
    padding-left: min(calc(64/768*100vw), 120px);
  }
}

.section-inner {
  max-width: 1396px;
  margin-right: auto;
  margin-left: auto;
}

.intro {
  position: relative;
  padding-top: 64px;
  padding-bottom: 56px;
  background-color: #f4fafb;
}
@media (width >= 640px) {
  .intro {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

.intro::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: -45px;
  left: 0;
  width: 121px;
  height: 45px;
  margin-right: auto;
  margin-left: auto;
  background-color: inherit;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
@media (width >= 640px) {
  .intro::after {
    bottom: -105px;
    width: 293px;
    height: 105px;
  }
}

.intro .section-inner {
  max-width: 1112px;
}

.intro h2 {
  margin-bottom: 24px;
  font-size: 28px;
  font-weight: 500;
  line-height: 2.25;
  letter-spacing: 0.036em;
  text-align: center;
}
@media (width >= 640px) {
  .intro h2 {
    font-size: 30px;
    line-height: 2.2;
  }
}
@media (width >= 960px) {
  .intro h2 {
    font-size: 36px;
  }
}

.intro h2 > span {
  background-image: linear-gradient(to top, rgb(from #f6fe20 r g b / 0.8), rgb(from #f6fe20 r g b / 0.8) 25%, transparent 25%, transparent 100%);
}

.intro h2 em {
  font-weight: 700;
}

.intro h2 em span {
  position: relative;
}

.intro h2 em span::before {
  content: '';
  position: absolute;
  top: -8px;
  right: 0;
  left: 0;
  width: 8px;
  height: 8px;
  margin-right: auto;
  margin-left: auto;
  border-radius: 50%;
  background-color: #feca21;
}

.intro .container {
  display: grid;
  justify-items: center;
  padding: 40px calc(10/390*100vw);
  border-bottom: 1px dashed #9b9b9b;
}
@media (width >= 640px) {
  .intro .container {
    grid-template-columns: auto 1fr;
    justify-items: start;
    gap: 36px 32px;
    padding-right: 0;
    padding-left: 0;
  }
}
@media (width >= 960px) {
  .intro .container {
    padding-left: min(76px, calc(76/1120*100vw));
  }
}

.intro h3 {
  display: grid;
  gap: 16px;
  align-items: center;
  grid-template-columns: auto 1fr;
  font-size: 22px;
}
@media (width < 640px) {
  .intro h3 {
    margin-right: -0.5em;
    margin-left: -0.5em;
  }
}
@media (width >= 640px) {
  .intro h3 {
    justify-self: center;
    grid-column: 1 / 3;
    gap: 32px;
    font-size: 28px;
  }
}
@media (width >= 960px) {
  .intro h3 {
    justify-self: start;
  }
}

.intro h3 span {
  padding: 5px 11px 7px;
  border-radius: 10px;
  background-color: #009ab2;
  color: #fff;
  font-size: 14px;
}
@media (width >= 640px) {
  .intro h3 span {
    padding: 9px 29px 10px;
    font-size: 20px;
  }
}

.intro .container img {
  margin-top: 41px;
  margin-bottom: 32px;
}
@media (width >= 640px) {
  .intro .container img {
    align-self: center;
    margin-top: 0;
    margin-bottom: 0;
  }
}

.intro .container ul {
  list-style: disc !important;
  display: grid;
  gap: 8px;
  margin-left: 1.5em !important;
  line-height: 1.8;
}
@media (width >= 640px) {
  .intro .container ul {
    font-size: 18px;
  }
}

.solution {
  padding-top: calc(40px + 120px);
  padding-bottom: 120px;
  text-align: center;
}
@media (width >= 640px) {
  .solution {
    padding-top: calc(96px + 105px);
  }
}
@media (width >= 960px) {
  .solution {
    padding-top: calc(160px + 105px);;
  }
}

.solution h2 {
  font-weight: 500;
  line-height: 2;
}
@media (width < 640px) {
  .solution h2 {
    margin-right: -0.5em;
    margin-left: -0.5em;
  }
}

.solution h2 span {
  background-image: linear-gradient(to top, rgb(from #f6fe20 r g b / 0.8), rgb(from #f6fe20 r g b / 0.8) 33.333%, transparent 33.333%, transparent 100%);
  font-weight: 700;
}

.solution h2 + p {
  margin-top: 20px;
  line-height: 1.8 !important;
}
@media (width < 640px) {
  .solution h2 + p {
    max-width: 358px;
    margin-right: auto;
    margin-left: auto;
    font-size: 15px !important;
  }
}
@media (width >= 640px) {
  .solution h2 + p {
    margin-top: 32px;
  }
}

.solution .container {
  display: grid;
  justify-items: center;
  gap: 40px;
  margin-top: 40px;
  font-size: 0 !important;
  line-height: 1 !important;
}
@media (width >= 640px) {
  .solution .container {
    gap: 20px;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: end;
  }
  .solution .container img {
    width: 100%;
  }
}

@media (width < 640px) {
  .solution .container .arrow {
    margin-top: -19px;
    margin-bottom: -19px;
    rotate: 90deg;
  }
}
@media (width >= 640px) {
  .solution .container .arrow {
    align-self: stretch;
    display: grid;
    align-items: end;
    padding-bottom: calc(80/17*100%);
  }
  .solution .container svg {
    width: min(calc(17/768*100vw), 38px);
    height: auto;
  }
}
@media (width >= 1024px) {
  .solution .container .arrow {
    padding-bottom: calc(187/38*100%);
  }
}


#main_contents .solution .banner {
  margin-top: 60px;
  text-align: center;
}
@media (width >= 640px) {
  #main_contents .solution .banner {
    margin-top: 48px;
  }
}
@media (width >= 960px) {
  #main_contents .solution .banner {
    margin-top: 96px;
  }
}

.cta {
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: #f4fafb;
}
@media (width >= 640px) {
  .cta {
    padding-top: 64px;
    padding-bottom: 64px;
  }
}
@media (width >= 960px) {
  .cta {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media (width < 640px) {
  .cta h2 {
    font-size: 22px;
  }
}

.cta .container {
  display: grid;
  justify-items: center;
  gap: 24px;
  margin-top: 30px;
}
@media (width >= 640px) {
  .cta .container {
    gap: 30px;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    max-width: 750px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media (width >= 960px) {
  .cta .container {
    margin-top: 51px;
  }
}

.cta .container a {
  line-height: 1;
  transition:  translate 0.3s;
}

.cta .container a:focus-visible {
  translate: 0 -3px;
}
@media (any-hover: hover) {
  .cta .container a:hover {
    translate: 0 -3px;
  }
}

.service {
  display: grid;
  justify-items: center;
  padding-top: 120px;
  padding-bottom: 48px;
  text-align: left;
}
@media (width >= 960px) {
  .service {
    padding-top: 160px;
  }
}

@media (width < 640px) {
  .service h2 {
    font-size: 28px;
  }
}

.service h2 + p {
  margin-top: 34px;
  letter-spacing: 0.02em;
}

.feature {
  padding-top: 60px;
  padding-bottom: 60px;
  background-color: #f4fafb;
}
@media (width >= 640px) {
  .feature {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media (width >= 960px) {
  .feature {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
@media (width < 640px) {
  .feature {
    padding-right: calc(32/390*100vw);
    padding-left: calc(32/390*100vw);
  }
}

.feature ul {
  display: grid;
  gap: 22px;
  margin-top: 33px;
  font-size: 22px;
}
@media (width >= 640px) {
  .feature ul {
    grid-template-columns: repeat(auto-fit, minmax(312px, 1fr));
    gap: 16px;
    font-size: 20px;
  }
}
@media (width >= 960px) {
  .feature ul {
    font-size: 28px;
  }
}
@media (width >= 1056px) {
  .feature ul {
    grid-template-columns: repeat(auto-fit, minmax(425px, 1fr));
    gap: 20px;
  }
}

.feature li {
  display: grid;
  justify-items: center;
  gap: 24px;
  padding: 30px 20px 32px;
  background-color: #fff;
  border-radius: 20px;
  border: 1px solid #e6e6e6;
  text-align: center;
}
@media (width >= 640px) {
  .feature li {
    gap: 20px;
    padding-top: 34px;
    padding-bottom: 37px;
  }
}
@media (width >= 960px) {
  .feature li {
    gap: 30px;
    padding-top: 52px;
    padding-bottom: 56px;
  }
}

.feature li .fa-solid {
  color: #007f94;
  font-size: 62px;
  line-height: 1;
}
@media (width >= 640px) {
  .feature li .fa-solid {
    font-size: 49px;
  }
}
@media (width >= 960px) {
  .feature li .fa-solid {
    font-size: 70px;
  }
}

.feature li p {
  font-weight: 700;
  line-height: 1.45 !important;
}

.ota {
  padding-top: 64px;
  padding-bottom: 64px;
  text-align: center;
}
@media (width >= 640px) {
  .ota {
    padding-bottom: 140px;
  }
}
@media (width >= 960px) {
  .ota {
    padding-top: 120px;
    padding-bottom: 160px;
  }
}
.ota p {
  margin-bottom: 42px;
}
@media (width >= 640px) {
  .ota p {
    margin-bottom: 60px;
  }
}
@media (width >= 960px) {
  .ota p {
    margin-bottom: 40px;
  }
}

.detail {
  padding-top: 60px;
  padding-bottom: 60px;
  background-color: #f4fafb;
}
@media (width >= 640px) {
  .detail {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media (width >= 960px) {
  .detail {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

.detail h2 {
  font-size: 24px;
  line-height: 1.8;
  text-align: center;
}
@media (width >= 640px) {
  .detail h2 {
    font-size: 30px;
  }

  .detail h2 + p {
    text-align: center !important;
  }
}
@media (width >= 960px) {
  .detail h2 {
    font-size: 36px;
  }
}

.detail .container {
  display: grid;
  align-items: start;
  gap: 24px;
  margin-top: 40px;
}
@media (width >= 1024px) {
  .detail .container {
    grid-template-columns: 1fr 1fr;
  }
}

.detail .wrapper  {
  padding: 24px 16px;
  border-radius: 20px;
  border: 1px solid #f5f5f5;
  box-shadow: 0 8px 24px rgb(0 0 0 / 0.05);
  background-color: #fff;
}
@media (width >= 640px) {
  .detail .wrapper {
    padding: 40px;
  }
}

.detail h3 {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-bottom: 26px;
  font-size: 22px;
  line-height: 1.45;
}
@media (width >= 640px) {
  .detail h3 {
    gap: 15px;
    font-size: 28px;
    line-height: 1.42;
  }
}

.detail h3 .fa-solid {
  flex: 0 0 auto;
  color: #009ab2;
  font-size: 20px;
  line-height: 1.6;
}
@media (width >= 640px) {
  .detail h3 .fa-solid {
    font-size: 24px;
    line-height: 1.67;
  }
}

.detail details {
  margin-top: 25px;
}

.detail summary {
  display: flex;
  gap: 20px;
  font-weight: 700;
  transition: color 0.3s ease-out;
}

.detail summary:focus-visible {
  color: #007f94;
}
@media (any-hover: hover) {
  .detail summary:hover {
    color: #007f94;
  }
}

.detail summary .icon {
  flex: 0 0 20px;
  display: grid;
  align-items: center;
}

.detail summary .fa-circle-minus {
  display: none;
}
.detail details[open] summary .fa-circle-minus {
  display: inline;
}
.detail details[open] summary .fa-circle-plus {
  display: none;
}

.detail .content-inner {
  margin-top: 24px;
  padding: 24px 24px 24px 20px;
  border-radius: 12px;
  background-color: #f4fafb;
}
@media (width >= 640px) {
  .detail .content-inner {
    padding: 40px;
  }
}

#main_contents .detail details ul {
  list-style: disc !important;
  margin-left: 1.5em !important;
  font-size: 15px;
  line-height: 1.92;
}
@media (width >= 640px) {
  #main_contents .detail details ul {
    font-size: 16px;
    line-height: 1.8;
  }
}

.record {
  padding-top: 120px;
  padding-bottom: 120px;
}
@media (width >= 960px) {
  .record {
    padding-top: 160px;
    padding-bottom: 160px;
  }
}

.record .section-inner {
  display: grid;
  justify-items: center;
  max-width: 1680px;
}

.record .banner {
  order: -1;
  margin-bottom: 64px;
}
@media (width >= 960px) {
  .record .banner {
    margin-bottom: 120px;
  }
}

.record h2 {
  margin-bottom: 33px;
}
@media (width >= 640px) {
  .record h2 {
    margin-bottom: 40px;
  }
}

#main_contents .record .list {
  display: grid;
  gap: 20px;
  width: 100%;
  margin-left: 0 !important;
}
@media (width >= 640px) {
  #main_contents .record .list {
    gap: 16px;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (width >= 1280px) {
  #main_contents .record .list {
    gap: 24px;
    grid-template-columns: repeat(4,1fr);
  }
}

.record .list li {
  position: relative;
}

.record .eyecatch {
  aspect-ratio: 402 / 259;
}

.record .eyecatch img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.record .wrapper {
  padding: 30px;
  background-color: #fff;
  transition: background-color 0.3s ease-out;
}

.record .tag {
  font-size: 12px !important;
  font-weight: 700;
  line-height: 1.46 !important;
}
@media (width >= 960px) {
  .record .tag {
    font-size: 18px !important;
  }
}

.record .list a {
  display: block;
  margin-top: 20px;
  margin-bottom: 32px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.8;
}

.record .list a::after {
  content: '';
  position: absolute;
  inset: 0;
}

.record .wrapper:has(a:focus-visible) {
  background-color: #f4fafb;
}
@media (any-hover: hover) {
  .record .wrapper:has(a:hover) {
    background-color: #f4fafb;
  }
}

.record .excerpt {
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  max-height: 6lh;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (width >= 960px) {
  .record .excerpt {
    -webkit-line-clamp: 4;
    max-height: 4lh;
  }
}

#main_contents p:has(a) {
  width: 100%;
  text-align: center !important;
}

.record .link {
  box-sizing: border-box;
  width: 100%;
  max-width: 330px;
  margin-top: 30px;
  margin-right: auto;
  margin-left: auto;
  padding: 19px 34px;
  border: 1px solid #007f94;
  border-radius: 100px;
  background-color: #fff;
  color: #007f94;
  font-weight: 700;
  text-align: center;
  transition: background-color 0.3s ease-out, color 0.3s ease-out;
}

.record .link:focus-visible {
  background-color: #007f94;
  color: #fff;
}
@media (any-hover: hover) {
  .record .link:hover {
    background-color: #007f94;
    color: #fff;
  }
}

.diagnosis {
  background-color: #f4fafb;
  text-align: center;
}

.check {
  display: grid;
  justify-items: center;
  max-width: 640px;
  margin-right: auto;
  margin-left: auto;
  padding-top: 60px;
}
@media (width >= 640px) {
  .check {
    padding-top: 80px;
  }
}
@media (width >= 960px) {
  .check {
    max-width: 1335px;
    padding-top: 100px;
  }
}

.check .start {
  margin-top: 40px;
}

.start:hover img {
  opacity: 0.7;
  transition: opacity 0.3s ease;
}

.check form {
  display: grid;
  align-items: start;
  gap: 20px;
  width: 100%;
  margin-top: 36px;
}
@media (width >= 640px) {
  .check form {
    margin-top: 50px;
  }
}
@media (width >= 960px) {
  .check form {
    grid-template-columns: 1fr 1fr;
    gap: 32px 52px;
    margin-top: 80px;
  }
}

#diagnosis-content,
#diagnosis-result {
  overflow: hidden;
  transition: opacity 0.3s ease-in-out 0.2s;
}

#diagnosis-content {
  width: 100%;
}

#diagnosis-content[inert],
#diagnosis-result[inert] {
  opacity: 0;
  height: 0;
}

.check .item {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 15px;
  border-radius: 12px;
  border: 2px solid #007f94;
  background-color: #fff;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
@media (width >= 640px) {
  .check .item {
    padding: 32px;
    font-size: 18px;
  }
}
@media (width >= 960px) {
  .check .item {
    padding: 40px;
    font-size: 20px;
  }
}

.check .item:has(input:checked) {
  background-color: #f4fafb;
}

.check .checkbox {
  flex: 0 0 auto;
  position: relative;
  display: grid;
  place-content: center;
  width: 24px;
  height: 24px;
}
@media (width >= 640px) {
  .check .checkbox {
    width: 26px;
    height: 26px;
  }
}
@media (width >= 960px) {
  .check .checkbox {
    width: 29px;
    height: 29px;
  }
}

.check .checkbox:has(input:checked)::after {
  content: '✓';
  position: absolute;
  bottom: 7px;
  left: 8px;
  color: #e5533d;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}
@media (width >= 640px) {
  .check .checkbox:has(input:checked)::after {
    bottom: 8px;
    left: 9px;
  }
}
@media (width >= 960px) {
  .check .checkbox:has(input:checked)::after {
    bottom: 9px;
    left: 10px;
  }
}

.check input[type="checkbox"] {
  appearance: none;
  width: 16px;
  height: 16px;
  margin: 0;
  border-radius: 2px;
  border: 1px solid #000;
  background-color: #fff;
}

.check .result {
  box-sizing: border-box;
  width: 100%;
  max-width: 330px;
  margin-top: 48px;
  margin-right: auto;
  margin-left: auto;
  padding: 19px 34px;
  border: 1px solid #007f94;
  border-radius: 100px;
  background-color: #007f94;
  color: #fff;
  font-weight: 700;
  text-align: center;
  transition: background-color 0.3s ease-out, color 0.3s ease-out;
}
@media (width >= 640px) {
  .check .result {
    margin-top: 64px;
  }
}
@media (width >= 960px) {
  .check .result {
    grid-column: 1 / 3;
    margin-top: 80px;
  }
}

.check .result:focus-visible {
  background-color: #fff;
  color: #007f94;
}
@media (any-hover: hover) {
  .check .result:hover {
    background-color: #fff;
    color: #007f94;
  }
}

.result-container {
  padding-top: 48px;
  padding-bottom: 60px;
  text-align: left;
}
@media (width >= 640px) {
  .result-container {
    padding-top: 96px;
    padding-bottom: 75px;
  }
}
@media (width >= 960px) {
  .result-container {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

.result-container .wrapper {
  display: grid;
  gap: 24px;
  max-width: 1342px;
  margin-right: auto;
  margin-left: auto;
  padding: 24px min(24px,calc(16/390*100vw));
  border-radius: 20px;
  background-color: #3095ab;
  font-size: 15px;
}
@media (width >= 640px) {
  .result-container .wrapper {
    font-size: 16px;
  }
}
@media (width >= 1280px) {
  .result-container .wrapper {
    padding: 40px;
    gap: 40px;
  }
}

.result-container .wrapper > div {
  margin: 0;
  padding: 24px;
  border-radius: 16px;
  border: none;
  background-color: rgb(255 255 255 / 0.9);
}
@media (width >= 1280px) {
  .result-container .wrapper > div {
    padding: 40px;
  }
}

.result-container .chart {
  display: grid;
  gap: 40px;
}

@media (width >= 640px) {
  .result-container .chart {
    grid-template-columns: 254px 1fr;
    gap: 26px;
  }
}
@media (width >= 1280px) {
  .result-container .chart {
    grid-template-columns: 284px 1fr;
    gap: 60px;
  }
}

.result-container :where(h3, h4) {
  font-size: 18px;
}
@media (width >= 640px) {
  .result-container :where(h3, h4) {
    font-size: 20px;
  }
}

.result-container h3 {
  margin-bottom: 25px;
}
@media (width >= 1280px) {
  .result-container h3 {
    margin-bottom: 18px;
  }
}

.chart-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background-color: #fff;
}

.result-container .potential canvas {
  width: 100% !important;
  height: 100% !important;
}

.result-container .potential p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  line-height: 1 !important;
}

.result-container .potential p .value {
  display: flex;
  align-items: flex-end;
  margin-left: 20px;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
}

.result-container .potential .value::before {
  content: attr(data-total-value);
  font-size: 72px;
  line-height: 1.2;
}
@media (width >= 640px) {
  .result-container .potential .value::before {
    font-size: 63px;
  }
}

.result-container h4 {
  margin-bottom: 25px;
}
@media (width >= 640px) {
  .result-container .chart h4 {
    margin-bottom: 19px;
  }
}
@media (width >= 1280px) {
  .result-container .chart h4 {
    margin-bottom: 30px;
  }
}

.result-container .chart ul {
  display: grid;
  gap: 24px;
  font-size: 14px;
  font-weight: 700;
}
@media (width >= 640px) {
  .result-container .chart ul {
    font-size: 16px;
  }
}
@media (width >= 960px) {
  .result-container .chart ul {
    grid-template-columns: 1fr 1fr;
  }
}

.result-container .chart li {
  display: grid;
  gap: 27px;
  padding: 24px 24px 30px;
  border-radius: 10px;
  background-color: #fff;
}

.result-container .chart .text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  line-height: 1 !important;
}

.result-container .chart .text::after {
  content: '';
  font-family: "Roboto", sans-serif;
  font-size: 30px;
}

.result-container .detail-content .text::after {
  content: attr(data-chart-value);
}
.result-container .detail-strategy .text::after {
  content: attr(data-chart-value);
}
.result-container .detail-channel .text::after {
  content: attr(data-chart-value);
}
.result-container .detail-operation .text::after {
  content: attr(data-chart-value);
}

.result-container .line-chart {
  position: relative;
  width: 100%;
  height: 10px;
  border-radius: 10px;
  background-color: #e5e7eb;
  overflow: hidden;
}

.result-container .line-chart::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  border-radius: 10px;
  background-color: #3095ab;
}

.result-container .detail-content .line-chart::before {
  width: calc(var(--chart-content, 20)/20*100%);
}
.result-container .detail-strategy .line-chart::before {
  width: calc(var(--chart-strategy, 30)/30*100%);
}
.result-container .detail-channel .line-chart::before {
  width: calc(var(--chart-channel, 20)/30*100%);
}
.result-container .detail-operation .line-chart::before {
  width: calc(var(--chart-operation, 10)/20*100%);
}

.result-container .comment ul {
  list-style: disc !important;
  margin-left: 1.5em !important;
  font-weight: 700;
  line-height: 1.8;
}

.result-container .comment .link-wrapper {
  display: grid;
  gap: 16px;
  max-width: 278px;
  margin-top: 25px;
}
@media (width >= 1280px) {
  .result-container .comment .link-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
    max-width: 100%;
    margin-top: 29px;
  }
}

.result-container .link-wrapper  .link {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  width: 278px;
  height: 68px;
  border-radius: 10px;
  border: 1px solid #0b6f7f;
  background-color: #0b6f7f;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-align: center;
  transition: background-color 0.3s ease-out, color 0.3s ease-out;
}

.result-container .link-wrapper .basic {
  border-color: #0f8b9f;
  background-color: #0f8b9f;
}
.result-container .link-wrapper .contact {
  border-color: #e87e1e;
  background-color: #e87e1e;
}
.result-container .link-wrapper .light {
  border-color: #04a6b7;
  background-color: #e8f3f5;
  color: #04a6b7;
}

.result-container .link-wrapper  .link:focus-visible {
  background-color: #fff;
}
.result-container .link-wrapper .pro:focus-visible {
  color: #0b6f7f;
}
.result-container .link-wrapper .basic:focus-visible {
  color: #0f8b9f;
}
.result-container .link-wrapper .contact:focus-visible {
  color: #e87e1e;
}
@media (any-hover: hover) {
  .result-container .link-wrapper  .link:hover {
    background-color: #fff;
  }
  .result-container .link-wrapper .pro:hover {
    color: #0b6f7f;
  }
  .result-container .link-wrapper .basic:hover {
    color: #0f8b9f;
  }
  .result-container .link-wrapper .contact:hover {
    color: #e87e1e;
  }
}

.result-container .link-wrapper  .link .fa-solid {
  font-size: 20px;
  line-height: inherit;
}

.result-container .link-wrapper .return {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-weight: 700;
}

.result-container .link-wrapper .return::after {
  content: '｜';
  order: 1;
}

.result-container .return button {
  transition: color 0.3s ease-out;
}

.result-container .return button:focus-visible {
  color: #2a97ae;
}
@media (any-hover: hover) {
  .result-container .return button:hover {
    color: #2a97ae;
  }
}

.result-container .link-wrapper .restart {
  order: 2;
}

#diagnosis-result[data-total-score="middle"] *[data-score-show]:not([data-score-middle]) {
  display: none;
}
#diagnosis-result[data-total-score="high"] *[data-score-show]:not([data-score-high]) {
  display: none;
}
#diagnosis-result[data-total-score="low"] *[data-score-show]:not([data-score-row]) {
  display: none;
}

#diagnosis-result {
  position: relative;
}

#diagnosis-result[inert] .loading {
  opacity: 0;
}

#diagnosis-result .loading {
  position: fixed;
  inset: 0;
  z-index: 10;
  display: grid;
  place-content: center;
  gap: 17px;
  background-color: #f4fafb;
  font-size: 18px;
}

#diagnosis-result .loading.hide {
  position: absolute;
  opacity: 0;
  transition: opacity 0.3s ease-out;
  pointer-events: none;
}

#diagnosis-result .loading-bar {
  position: relative;
  width: min(90vw, 536px);
  height: 16px;
  margin-bottom: 23px;
  border-radius: 16px;
  background-color: #e6e6e6;
  overflow: hidden;
}

#diagnosis-result .loading-bar::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 16px;
  border-radius: 16px;
  background-color: #007f94;
  translate: 0;
  transition: translate 1s ease-in-out 0.5s;
}
#diagnosis-result[inert] .loading-bar::before {
  translate: calc(-100% + 16px) 0;
}

#diagnosis-result .loading p:nth-of-type(1) {
  font-weight: 700;
}

.package {
  max-width: 1254px;
  padding-top: 60px;
  padding-bottom: 60px;
}
@media (width >= 640px) {
  .package {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
@media (width >= 1280px) {
  .package {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media (width < 640px) {
  .package h2 {
    font-size: 28px !important;
  }
}

.package-container {
  display: grid;
  gap: 40px;
  align-items: start;
  margin-top: 32px;
}
@media (width >= 640px) {
  .package-container {
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 46px;
  }
}
@media (width >= 1280px) {
  .package-container {
    gap: 24px;
    margin-top: 67px;
  }
}

.package-wrapper {
  position: relative;
  padding: 30px 16px 40px;
  box-shadow: 0 3px 6px rgb(0 0 0 / 0.16);
  border-radius: 20px;
  border: 1px solid #fff;
  background-color: #fff;
  font-weight: 700;
  text-align: left;
}
@media (width >= 640px) {
  .package-wrapper {
    padding: 20px 16px 36px;
    font-size: 14px;
  }
}
@media (width >= 1280px) {
  .package-wrapper {
    padding: 40px 30px 60px;
  }
}

.package-container:has(.package-wrapper:target) .package-wrapper {
  opacity: 0.6;
}

.package-wrapper:target {
  border-color: var(--plan-color);
  opacity: 1 !important;
}

.package-wrapper.light {
  --plan-color: #04a6b7;
}

.package-wrapper.basic {
  --plan-color: #0f8b9f;
}

.package-wrapper.pro {
  --plan-color: #0b6f7f;
}

.package-wrapper h3 {
  display: grid;
  gap: 20px;
  justify-items: center;
  margin-bottom: 0;
  padding: 30px 10px;
  border-radius: 16px;
  background-color: var(--plan-color);
  color: var(--plan-color);
  font-size: 15px;
  text-align: center;
}
@media (width >= 640px) {
  .package-wrapper h3 {
    gap: 15px;
    padding: 16px;
  }
}
@media (width >= 1280px) {
  .package-wrapper h3 {
    gap: 24px;
    padding: 35px 30px;
  }
}

.package-wrapper h3 .plan {
  box-sizing: border-box;
  width: 277px;
  padding: 7px 8px 8px;
  border-radius: 10px;
  background-color: #fff;
  font-size: 30px;
  font-weight: 500;
}
@media (width >= 640px) {
  .package-wrapper h3 .plan {
    width: 100%;
    padding-top: 2px;
    padding-bottom: 2px;
    font-size: 22px;
  }
}
@media (width >= 1280px) {
  .package-wrapper h3 .plan {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 34px;
  }
}

.package-wrapper.light h3 {
  background-color: #e8f3f5;
}

:where(.package-wrapper.basic, .package-wrapper.pro) h3 .plan + span {
  color: #fff;
}

.package-wrapper h3 .badge {
  position: absolute;
  top: -17px;
  right: 0;
  left: 0;
  width: 120px;
  margin-right: auto;
  margin-left: auto;
  padding: 5px;
  border-radius: 120px;
  background-color: var(--plan-color);
  color: #fff;
  font-weight: 700;
}

.package-inner {
  display: grid;
  padding-right: 34px;
  padding-left: 34px;
}
@media (width >= 640px) {
  .package-inner {
    padding-right: 0;
    padding-left: 0;
  }
}

.package-wrapper .package-list {
  margin-top: 24px;
  margin-bottom: 24px;
}
@media (width >= 1280px) {
  .package-wrapper .package-list {
    margin-top: 40px;
    margin-bottom: 40px;
  }
}

#main_contents .package-wrapper ul {
  display: grid;
  gap: 13px;
  margin-left: 0 !important;
  font-size: 15px;
}
@media (width >= 640px) {
  #main_contents .package-wrapper ul {
    font-size: 14px;
  }
  #main_contents .package-wrapper ul li {
    line-height: 1.42;
  }
}
@media (width >= 960px) {
  #main_contents .package-wrapper ul {
    font-size: 16px;
  }
}

.package-wrapper li[aria-hidden="true"] {
  color: #c4bebe;
}

.package-wrapper summary {
  display: flex;
  align-items: center;
  gap: 20px;
  color: var(--plan-color);
}
@media (width >= 640px) {
  .package-wrapper summary {
    font-size: 16px;
  }
}

.package-wrapper summary .fa-solid {
  line-height: normal;
}

.package-wrapper .fa-circle-minus {
  display: none;
}

.package-wrapper details[open] .fa-circle-plus {
  display: none;
}
.package-wrapper details[open] .fa-circle-minus {
  display: block;
}

.package-wrapper details ul {
  padding-top: 24px;
}
@media (width >= 1280px) {
  .package-wrapper details ul {
    padding-top: 30px;
  }
}

.package-wrapper a {
  box-sizing: border-box;
  width: 100%;
  max-width: 330px;
  margin-top: 30px;
  padding: 19px 34px;
  border: 1px solid var(--plan-color);
  border-radius: 100px;
  background-color: var(--plan-color);
  color: #fff;
  font-weight: 700;
  text-align: center;
  transition: background-color 0.3s ease-out, color 0.3s ease-out;
}
@media (640px < width <= 1280px) {
  .package-wrapper a {
    padding: 8px;
  }
}
@media (width >= 1280px) {
  .package-wrapper a {
    max-width: 282px;
    margin-top: 40px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 23px;
    padding-bottom: 23px;
    font-size: 18px;
  }
}

.package-wrapper a:focus-visible {
  background-color: #fff;
  color: var(--plan-color);
}
@media (any-hover: hover) {
  .package-wrapper a:hover {
    background-color: #fff;
    color: var(--plan-color);
  }
}

.option {
  padding-top: 64px;
  padding-bottom: 60px;
}
@media (width >= 960px) {
  .option {
    padding-top: 120px;
    padding-bottom: 80px;
  }
}


.option ul {
  display: grid;
  gap: 24px;
  margin-top: 24px;
}
@media (width >= 640px) {
  .option ul {
    max-width: 670px;
    margin-top: 32px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media (width >= 960px) {
  .option ul {
    grid-template-columns: 1fr 1fr;
    max-width: 100%;
    margin-top: 41px;
  }
}

.option li {
  padding: 28px;
  border-radius: 10px;
  background-color: #f4fafb;
}
@media (width >= 640px) {
  .option li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px 40px;
    padding: 26px 30px;
  }
}

.option li p:not([class]) {
  display: flex;
  align-items: center;
  gap: 16px;
}

.option li .price {
  margin-top: 16px;
  font-weight: 700;
  text-align: right !important;
}
@media (width >= 640px) {
  .option li .price {
    flex: 1 0 auto;
    margin-top: 0;
  }
}

.meo {
  padding-top: 60px;
  text-align: center;
}
@media (width >= 640px) {
  .meo {
    padding-top: 34px;
  }
}
@media (width >= 960px) {
  .meo {
    padding-top: 80px;
  }
}

@media (width < 640px) {
  .meo h2 {
    font-size: 28px !important;
  }
}

.meo p {
  margin-top: 32px;
  margin-bottom: 40px;
}
@media (640px <= width <= 960px) {
  .meo p {
    margin-right: -1em;
    margin-bottom: 33px;
    margin-left: -1em;
  }
}

.partner {
  padding-top: 64px;
  padding-bottom: 60px;
  text-align: center;
}
@media (width >= 640px) {
  .partner {
    padding-top: 96px;
  }
}
@media (width >= 960px) {
  .partner {
    padding-top: 120px;
    padding-bottom: 80px;
  }
}

.partner .section-inner {
  max-width: 1304px;
}

.partner h2 + p {
  margin-top: 24px;
  margin-bottom: 42px;
}
@media (width >= px) {
  .partner h2 + p {
    margin-top: 33px;
    margin-bottom: 40px;
  }
}

.partner ul {
  display: grid;
  gap: 48px;
}
@media (width >= 640px) {
  .partner ul {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 16px;
  }
}
@media (width >= 960px) {
  .partner ul {
    grid-template-columns: repeat(3, 1fr);
    gap: 48px;
  }
}

.partner li img {
  width: 100%;
  border: 1px solid #e6e6e6;
}

.partner li p {
  padding: 20px;
  font-weight: 700;
}

.blog {
  padding-top: 60px;
}
@media (width >= 640px) {
  .blog {
    padding-top: 80px;
  }
}

.page-header {
  position: relative;
  background-image: linear-gradient(to right, #007f94 0%, #009ab2 100%);
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.8;
}

.page-header::before {
  content: '';
  position: absolute;
  z-index: 0;
  right: 10px;
  bottom: 82px;
  width: 282px;
  height: 189px;
  background: transparent url(../images/consulting/bg-fv.png) center / 100% auto no-repeat;
  opacity: 0.6;
}
@media (width >= 640px) {
  .page-header::before {
    right: 64px;
    bottom: 91px;
    width: 410px;
    height: 274px;
  }
}
@media (width >= 960px) {
  .page-header::before {
    content: none;
  }
}

.page-header-inner {
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  max-width: 1428px;
  height: 509px;
  margin-right: auto;
  margin-left: auto;
  padding: 30px 16px;
}
@media (width >= 640px) {
  .page-header-inner {
    padding-top: 90px;
    padding-left: 64px;
  }
}
@media (width >= 960px) {
  .page-header-inner {
    background: transparent url(../images/consulting/bg-fv.png) right center / 663px auto no-repeat;
  }
}

.page-header .lead {
  font-size: 18px !important;
  line-height: 1.44 !important;
}

.page-header h1 {
  margin-top: 14px;
  margin-bottom: 18px;
  font-size: 36px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-shadow: 0 3px 6px rgb(0 0 0 / 0.16);
}
@media (width >= 640px) {
  .page-header h1 {
    margin-bottom: 30px;
    font-size: 50px;
  }
}

.page-header p {
  max-width: 316px;
  line-height: 1.8 !important;
  text-shadow: 0 3px 6px rgb(0 0 0 / 0.16);
}
@media (width >= 640px) {
  .page-header p {
    max-width: 465px;
  }
}

.page-header .link-wrap {
  display: grid;
  gap: 12px;
  margin-top: 30px;
}
@media (width >= 640px) {
  .page-header .link-wrap {
    grid-template-columns: auto 1fr;
    gap: 24px;
  }
}

.page-header .link-wrap a {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 240px;
  height: 62px;
  border-radius: 10px;
  border: 2px solid currentColor;
  background-color: #007f94;
  color: #fff;
  font-weight: 700;
  text-align: center;
  transition: background-color 0.3s ease-out, color 0.3s ease-out;
}

.page-header .link-wrap a:focus-visible {
  background-color: #fff;
  border-color: #007f94;
  color: #007f94;
}
@media (any-hover: hover) {
  .page-header .link-wrap a:hover {
    background-color: #fff;
    border-color: #007f94;
    color: #007f94;
  }
}

.page-header .link-wrap .free {
  gap: 16px;
  justify-content: start;
  padding-left: 10px;
  background-color: #e87e1e;
  border-color: #e87e1e;
}

.page-header .link-wrap .free:focus-visible {
  background-color: #fff;
  color: #e87e1e;
}
@media (any-hover: hover) {
  .page-header .link-wrap .free:hover {
    background-color: #fff;
    color: #e87e1e;
  }
}

.page-header .free span {
  display: grid;
  place-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background-color: #fff;
  color: #e87e1e;
}


.page-header .link-wrap .free:focus-visible span {
  background-color: #e87e1e;
  color: #fff;
}
@media (any-hover: hover) {
  .page-header .link-wrap .free:hover span {
    background-color: #e87e1e;
    color: #fff;
  }
}


.floating-link {
  position: fixed;
  z-index: 2;
  display: none;
  width: 110px;
  height: 234px;
  right: -15px;
  bottom: 70px;
  translate: 4px 0;
  transition: translate 0.3s ease-out;
}
@media (width >= 640px) {
  .floating-link {
    display: block;
  }
}
@media (width >= 960px) {
  .floating-link {
    bottom: 80px;
  }
}

.floating-link img {
  filter: drop-shadow(0 2px 10px rgb(0 0 0 / 0.16));
}

.floating-link:focus-visible {
  translate: 0 0;
}
@media (any-hover: hover) {
  .floating-link:hover {
    translate: 0 0;
  }
}

.web-consulting .floating-link {
  bottom: 65px;
  width: 190px;
  height: 133px;
  translate: 0 0;
}

.web-consulting .floating-link img {
  position: absolute;
  inset: 0;
  transition: opacity 0.3s ease-in-out;
}
.web-consulting .floating-link img.hover {
  z-index: 1;
  opacity: 0;
}

.web-consulting .floating-link:focus-visible img.hover {
  opacity: 1;
}
@media (any-hover: hover) {
  .web-consulting .floating-link:hover img.hover {
    opacity: 1;
  }
}


.page-id-24476 #main_contents {
  max-width: 1112px;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 6% !important;
  padding-left: 6% !important;
}
#main_contents .tab-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-bottom: 40px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.05em;
}

#main_contents .tab-wrapper button {
  display: grid;
  place-content: center;
  height: 80px;
  border: none;
  background-color: #f5f5f5;
  color: #009ab2;
  font: inherit;
}

#main_contents .tab-wrapper button[aria-selected="true"] {
  background-color: #009ab2;
  color: #fff;
}

#main_contents *[role="tabpanel"] p {
  font-weight: 400;
}

#main_contents *[role="tabpanel"][inert] {
  height: 0;
  opacity: 0;
  overflow: hidden;
}

#main_contents #page_content {
  max-width: 100% !important;
}

.contact-form-wrap {
  padding-right: 0;
  padding-left: 0;
}

.contact-form-wrap .post_content p {
  margin-bottom: 0;
}

.contact-form-wrap .form-item {
  display: grid;
  padding-top: 20px;
  padding-bottom: 20px;
}
@media (width >= 960px) {
  .contact-form-wrap .form-item {
    grid-template-columns: 360px 1fr;
  }
}

.contact-form-wrap form > p {
  margin-bottom: 24px !important;
}

.contact-form-wrap .form-label {
  display: flex;
  gap: 20px;
  padding-top: 20px;
}

.contact-form-wrap .form-label span {
  flex: 0 0 auto;
  display: grid;
  place-content: center;
  width: 48px;
  height: 32px;
  border-radius: 5px;
  background-color: #6b7280;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}


.contact-form-wrap .form-label span.required {
  background-color: #d64545;
}

.contact-form-wrap form input {
  padding: 24px 20px;
  border-radius: 5px;
  border: 1px solid #d9d9d9;
  background-color: #fafafa;
}

.contact-form-wrap div.acceptance-btn {
  margin-top: 64px;
  text-align: center;
}

.contact-form-wrap .acceptance-btn a {
  text-underline-offset: 4px;
}

.contact-form-wrap .wpcf7-form-control.wpcf7-submit {
  display: grid;
  place-content: center;
  width: 328px;
  height: 80px;
  margin-top: 41px;
  padding: 0;
  border-radius: 10px;
  border: 2px solid #007f94 !important;
  background-color: #fff;
  color: #1C8E94;
  font: inherit;
  font-weight: 700;
  transition: background-color 0.3s ease-out, color 0.3s ease-out;
}

.contact-form-wrap .wpcf7-form-control.wpcf7-submit:focus-visible {
  background-color: #007f94;
  color: #fff;
}
@media (any-hover: hover) {
  .contact-form-wrap .wpcf7-form-control.wpcf7-submit:hover {
    background-color: #007f94;
    color: #fff;
  }
}

.contact-form-wrap .wpcf7-form-control-wrap {
  padding-top: 22px;
}

.contact-form-wrap .wpcf7-form-control.wpcf7-checkbox,
.contact-form-wrap .wpcf7-form-control.wpcf7-radio {
  display: flex;
  align-items: center;
  gap: 15px 36px;
  flex-wrap: wrap;
}

.contact-form-wrap .wpcf7-list-item {
  margin-left: 0;
}

#product_single {
  padding-right: 16px;
  padding-bottom: 40px;
  padding-left: 16px;
  background-color: #f9f9f9;
}
@media (width >= 640px) {
  #product_single {
    padding-bottom: 70px;
  }
}
@media (width >= 960px) {
  #product_single {
    padding-bottom: 140px;
  }
}

#product_single.web-consulting .content_header,
#product_single.web-consulting #related_product {
  display: none;
}

.web-consulting #main_contents {
  box-sizing: border-box;
  display: block;
  width: min(calc(640/768*100vw), 972px);
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 40px 16px;
  background-color: #fff;
}
@media (width >= 640px) {
  .web-consulting #main_contents {
    padding: 80px 24px;
  }
}
@media (width >= 960px) {
  .web-consulting #main_contents {
    padding: 140px 80px;
  }
}

.web-consulting #main_col {
  width: 100% !important;
}

.web-consulting .product_content {
  padding-bottom: 0;
  border-bottom: none;
}

.web-consulting .product_content .top_sub_title {
  margin-top: 25px;
  text-align: center !important;
}

.web-consulting .post-thumbnail-wrapper {
  margin-top: 40px;
  margin-bottom: 40px;
  text-align: center;
}
@media (width >= 640px) {
  .web-consulting .post-thumbnail-wrapper {
    margin-top: 60px;
    margin-bottom: 60px;
  }
}

.web-consulting .overview-case-wrapper {
  margin-bottom: 40px;
  padding: 30px;
  border-radius: 16px;
  border: 1px solid #e8e8e8;
}
@media (width >= 640px) {
  .web-consulting .overview-case-wrapper {
    margin-bottom: 60px;
    padding: 40px;
  }
}

.web-consulting .overview-case-wrapper h4 {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid #e8e8e8;
}

.web-consulting .post_content ul {
  list-style: disc;
  display: grid;
  gap: 1em;
  margin-top: 30px;
  margin-bottom: 30px;
}

.web-consulting .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h3 {
  margin-top: 40px;
  margin-bottom: 24px;
  padding-left: 20px;
  border-left: 4px solid #007f94;
}

@media (width >= 640px) {
  .web-consulting .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h3 {
    margin-top: 60px;
    font-size: 24px;
  }
}

.web-consulting hr {
  margin-top: 40px;
  margin-bottom: 40px;
  border-top-color: #e8e8e8;
}
@media (width >= 640px) {
  .web-consulting hr {
    margin-top: 60px;
    margin-bottom: 60px;
  }
}

.web-consulting p + p {
  margin-top: 30px;
}

.web-consulting p:has(img) {
  margin-top: 40px;
  margin-bottom: 40px;
  text-align: center;
}
@media (width >= 640px) {
  .web-consulting p:has(img) {
    margin-top: 60px;
    margin-bottom: 60px;
  }
}

.web-consulting-footer {
  margin-top: 40px;
  font-size: 14px;
}
@media (width >= 640px) {
  .web-consulting-footer {
    margin-top: 60px;
    font-size: 16px;
  }
}

.web-consulting-footer h2 {
  position: relative;
  width: 100%;
  margin-bottom: 24px;
  padding-bottom: 13px;
  font-size: 18px;
  font-weight: 700;
}
@media (width >= 640px) {
  .web-consulting-footer h2 {
    font-size: 22px;
  }
}

.web-consulting-footer h2::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background-image: linear-gradient(to right, #007f94 0%, #48bf9d 100%);
}

.web-consulting-footer ul {
  display: grid;
  gap: 1em;
  margin-top: 25px;
  margin-left: 1.5em;
  font-weight: 700;
  list-style: disc;
}