/*
Theme Name: PRIXFIXE
Theme URI:
Description: designed by PRIXFIXE
Author: PRIXFIXE
Author URI:
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: PRIXFIXE
Tested up to: 6.2
Requires PHP: 7.4.33
*/
:root {
  --bg-color: #fff;
  --txt-color: #fff;
}

.header {
  position: fixed;
  z-index: 50;
  opacity: 0;
  background: transparent;
  transition: all 0.2s ease-out;
}
.header .headerLogo .headerLogo__link {
  display: flex;
  align-items: center;
}
.header .gNaviBtn {
  z-index: 1000;
  transition: all 0.2s;
}
.header .gNaviBtn .gNaviBtn__wrap {
  position: relative;
  width: 40px;
  height: 40px;
}
.header .gNaviBtn .gNaviBtn__wrap span {
  position: absolute;
  left: 11px;
  width: 20px;
  border: solid 1px #171819;
  transition: all 0.3s;
}
.header .gNaviBtn .gNaviBtn__wrap span:nth-child(1) {
  top: 12px;
}
.header .gNaviBtn .gNaviBtn__wrap span:nth-child(2) {
  top: 20px;
}
.header .gNaviBtn .gNaviBtn__wrap span:nth-child(3) {
  top: 28px;
}
.header .gNaviBtn.is-active .gNaviBtn__wrap span:nth-child(1) {
  top: 20px;
  transform: rotate(-135deg);
}
.header .gNaviBtn.is-active .gNaviBtn__wrap span:nth-child(2) {
  left: 15px;
  opacity: 0;
}
.header .gNaviBtn.is-active .gNaviBtn__wrap span:nth-child(3) {
  top: 20px;
  transform: rotate(135deg);
}
.header .gNaviMenu {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -5;
  visibility: hidden;
  opacity: 0;
  width: 100%;
  height: 100vh;
  background: #fff;
  overscroll-behavior: contain;
  overflow-y: auto;
  transition: all 0.6s;
}
.header .gNaviMenu .gNaviMenu__wrap .gNaviMenu__ttl {
  margin: 2em 0 0.5em;
  text-align: center;
  font-weight: 700;
  font-family: "Roboto", sans-serif;
  font-size: 0.65rem;
  color: #fff;
}
.header .gNaviMenu .gNaviMenu__wrap .gMenu {
  background: #fff;
  border-radius: 8px;
}
.header .gNaviMenu .gNaviMenu__wrap .gMenu .menu-item {
  padding: 1em;
  border-bottom: solid 1px #d8d8d8;
  font-size: 0.75rem;
  font-family: "Roboto", sans-serif;
  font-weight: 400;
}
.header .gNaviMenu .gNaviMenu__wrap .gMenu .menu-item:last-of-type {
  border-bottom: 0;
}
.header .gNaviMenu .gNaviMenu__wrap .gMenu .current-menu-item {
  color: #c90f7b;
  font-weight: 700;
}
.header .gNaviMenu .gNaviMenu__wrap .nav__area .info {
  display: flex;
  flex-wrap: wrap;
  padding: 1em;
  background: #fff;
  border-radius: 8px;
}
.header .gNaviMenu .gNaviMenu__wrap .nav__area .info .info__ttl {
  width: 6em;
  margin-bottom: 1em;
  padding-bottom: 1em;
  border-bottom: solid 1px #d8d8d8;
  font-size: 0.75rem;
  font-weight: normal;
}
.header .gNaviMenu .gNaviMenu__wrap .nav__area .info .info__ttl:last-of-type {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.header .gNaviMenu .gNaviMenu__wrap .nav__area .info .info__txt {
  width: calc(100% - 6em);
  margin-bottom: 1em;
  padding-bottom: 1em;
  border-bottom: solid 1px #d8d8d8;
  font-size: 0.75rem;
  font-weight: 700;
}
.header .gNaviMenu .gNaviMenu__wrap .nav__area .info .info__txt:last-of-type {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.header .gNaviMenu.is-active {
  z-index: 990;
  visibility: visible;
  opacity: 1;
}
.header .gNaviMenu.is-active::before {
  content: "";
  width: 1px;
  height: calc(100vh + 1px);
}
.header .gNaviMenu.is-active::after {
  content: "";
  width: 1px;
  height: calc(100vh + 1px);
}

@media screen and (max-width: 767px) {
  .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-left: 1em;
  }
  .header .headerLogo {
    width: 100%;
    margin-right: 1em;
  }
  .header .headerLogo .headerLogo__link .headerLogo__img {
    width: 110px;
    height: auto;
  }
  .header .gNaviMenu .gNaviMenu__wrap {
    margin: 1em;
    padding-bottom: 6em;
  }
}
@media screen and (min-width: 768px) {
  .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 2em 4em;
  }
  .header .headerLogo {
    margin-right: 4em;
  }
  .header .headerLogo .headerLogo__link {
    transition: all 0.2s;
  }
  .header .headerLogo .headerLogo__link:hover {
    opacity: 0.5;
  }
  .header .headerLogo .headerLogo__link .headerLogo__img {
    width: 50%;
    height: 50%;
  }
  .header .headerLogo .headerLogo__link .svg .logo__item {
    fill: #000;
    stroke-width: 0px;
  }
  .header .headearNavi {
    display: flex;
    margin-left: auto;
    background: transparent;
  }
  .header .headearNavi .headearNavi__wrap {
    display: flex;
    align-items: center;
  }
  .header .headearNavi .headearNavi__wrap .menu-item {
    display: flex;
    margin-right: 1.4em;
    padding-right: 1em;
    overflow: hidden;
  }
  .header .headearNavi .headearNavi__wrap .menu-item .header_list_link {
    position: relative;
    height: 1.6em;
    color: #fff;
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    cursor: pointer;
  }
  .header .headearNavi .headearNavi__wrap .menu-item .header_list_link:hover {
    transform: translateY(-100%);
  }
  .header .headearNavi .headearNavi__wrap .menu-item .header_list_link:hover span {
    transform-origin: left bottom;
    will-change: transform;
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  }
  .header .headearNavi .headearNavi__wrap .menu-item .header_list_link::after {
    content: attr(title);
    position: absolute;
    color: var(--txt-color);
    top: 0px;
    left: 0;
    transform: translateY(100%);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  }
  .header .headearNavi .headearNavi__wrap .current-menu-item {
    overflow: visible;
  }
  .header .headearNavi .headearNavi__wrap .current-menu-item .header_list_link {
    pointer-events: none;
  }
  .header .headearNavi .headearNavi__wrap .current-menu-item .header_list_link::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 4px;
    width: 4px;
    margin: auto;
    background: var(--bg-color);
    border-radius: 2px;
  }
  .header .headearNavi .headearNavi__wrap .current-menu-item .header_list_link::after {
    content: "";
  }
  .header .headearNavi .headearNavi__wrap .current-menu-item .header_list_link:hover {
    transform: none;
  }
  .header .headearNavi .inquiry {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 10em;
    padding: 0.5em 1.5em;
    color: #fff;
  }
  .header .headearNavi .inquiry::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(130deg, #4c5864, #1e1f20 50%);
    border-radius: 22px;
    transition: all 0.5s;
  }
  .header .headearNavi .inquiry::after {
    content: "";
    position: absolute;
    z-index: -2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(130deg, #a091d3, #9b33ff 20%);
    border-radius: 22px;
  }
  .header .headearNavi .inquiry:hover::before {
    opacity: 0;
  }
  .header .gNaviMenu .gNaviMenu__wrap {
    margin: 4em;
  }
}
.line__dot {
  background-image: linear-gradient(to right, #ddd, #ddd 2px, transparent 4px, transparent 8px);
  background-size: 10px 1px;
  background-position: left top;
  background-repeat: repeat-x;
}

.footer {
  opacity: 0;
  position: relative;
  color: #c9c9c9;
}
.footer .topBox__ttl {
  color: #171819;
}
.footer .topBox__txt {
  color: #171819;
}
.footer .inquiry__btn {
  display: block;
  margin-top: 2em;
  padding: 0.5em 1em;
  border: solid 1px #888;
  border-radius: 25px;
  text-align: center;
  color: #171819;
}
.footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list .menu-item > a {
  color: #171819;
}
.footer .centerBox__footer .bnr__list {
  display: flex;
  flex-wrap: wrap;
}
.footer .centerBox__footer .bnr__list .bnrList__item {
  margin-right: 3em;
}
.footer .centerBox__footer .bnr__list .bnrList__item .bnrList__item--link {
  color: #171819;
}
.footer .bottomBox__footer .bottomBox__wrap .copyright {
  color: #171819;
}
.footer .bottomBox__footer .bottomBox__wrap .footerSub__list .menu-item {
  color: #171819;
}

.breadcrumbs {
  opacity: 0;
}
.breadcrumbs .breadcrumbs__list {
  display: flex;
  border-top: solid 1px #d8d8d8;
  border-bottom: solid 1px #d8d8d8;
}
.breadcrumbs .breadcrumbs__list .breadcrumbs__item {
  position: relative;
  margin-right: 1.4em;
  padding-right: 1em;
  font-size: 0.8rem;
}
.breadcrumbs .breadcrumbs__list .breadcrumbs__item::after {
  position: absolute;
  content: "";
  top: 0;
  bottom: 0;
  right: -0.3em;
  height: 2.2em;
  width: 1px;
  background: #d8d8d8;
  margin: auto;
  transform: rotate(25deg);
}
.breadcrumbs .breadcrumbs__list .breadcrumbs__item:first-child {
  white-space: nowrap;
}
.breadcrumbs .breadcrumbs__list .breadcrumbs__item:last-child::after {
  display: none;
}
.goTop {
  position: fixed;
  opacity: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fff;
}
.goTop .goTop__wrap {
  position: relative;
}
.goTop .goTop__wrap .arrow__normal {
  position: absolute;
  z-index: 30;
  top: 20px;
  left: 0;
  right: 0;
  transform-origin: center;
  transform: rotate(-90deg);
  margin: auto;
}
.goTop .goTop__wrap .goTop__svg {
  transform-origin: center;
  transform: rotate(-90deg);
}
.goTop .goTop__wrap .goTop__svg .goTop__circle {
  stroke-linecap: round;
}

@media screen and (max-width: 767px) {
  .external__links::before {
    border: solid 1px #888;
  }
  .external__links::after {
    border: solid 1px #888;
    background: #fff;
  }
  .footer .topBox__ttl {
    margin-bottom: 1em;
    font-size: 1rem;
    font-weight: 700;
  }
  .footer .topBox__txt {
    font-size: 0.85rem;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--left {
    padding: 1em;
    width: 100%;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right {
    padding: 1em;
    width: 100%;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list .menu-item {
    width: 50%;
    font-size: 0.8rem;
    margin-bottom: 0.5em;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list .menu-item:last-child {
    margin-bottom: 0;
  }
  .footer .centerBox__footer {
    padding: 1em;
    background: #171819;
  }
  .footer .centerBox__footer .bnr__list .bnrList__item .bnrList__item--link {
    color: #e4e4e4;
  }
  .footer .bottomBox__footer {
    padding: 1em 1em 5em;
  }
  .footer .bottomBox__footer .bottomBox__wrap {
    display: flex;
    flex-direction: column-reverse;
  }
  .footer .bottomBox__footer .bottomBox__wrap .copyright {
    font-size: 0.65rem;
  }
  .footer .bottomBox__footer .bottomBox__wrap .footerSub__list .menu-item {
    margin-bottom: 0.5em;
    font-size: 0.8rem;
  }
  .footer .bottomBox__footer .bottomBox__wrap .footerSub__list .menu-item:last-child {
    margin-bottom: 2em;
  }
  .breadcrumbs {
    margin-top: 12em;
    padding: 1em 0;
  }
  .breadcrumbs .breadcrumbs__list {
    width: 100%;
    padding: 1em;
  }
  .goTop {
    bottom: 66px;
    right: 1em;
  }
}
@media screen and (min-width: 768px) {
  .external__links::before {
    border: solid 1px #888;
    transition: all 0.2s;
  }
  .external__links::after {
    border: solid 1px #888;
    background: #fff;
    transition: all 0.3s ease-out;
  }
  .external__links:hover::before {
    transform: scale(1.4);
    transform-origin: left bottom;
  }
  .external__links:hover::after {
    transform: scale(1.4);
    transform-origin: left bottom;
  }
  .footer {
    padding: 4em;
  }
  .footer .topBox__ttl {
    margin-bottom: 1em;
    font-size: 1rem;
  }
  .footer .topBox__txt {
    font-size: 0.75rem;
    line-height: 1.6;
  }
  .footer .inquiry__btn {
    width: 10em;
    transition: all 0.2s;
  }
  .footer .inquiry__btn:hover {
    border: solid 1px #171819;
    background: #171819;
    color: #fff;
  }
  .footer .topBox__footer .topBox__wrap {
    display: flex;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--left {
    width: 50%;
    margin-right: 3em;
    padding-right: 3em;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right {
    display: flex;
    width: 50%;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list {
    width: 50%;
    margin-right: 3em;
    padding-right: 3em;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list .menu-item {
    margin-bottom: 1em;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list .menu-item > a {
    position: relative;
    display: block;
    width: fit-content;
    transition: all 0.5s;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list .menu-item > a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #171819;
    transform: scale(0, 1);
    transform-origin: right top;
    transition: transform 0.2s ease-out;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list .menu-item > a:hover {
    color: #c90f7b;
  }
  .footer .topBox__footer .topBox__wrap .topBox__box--right .footerMenu__list .menu-item > a:hover::after {
    transform: scale(1, 1);
    transform-origin: left top;
  }
  .footer .centerBox__footer {
    margin-top: 3em;
    padding-top: 3em;
  }
  .footer .centerBox__footer .bnr__list .bnrList__item {
    margin-bottom: 1em;
  }
  .footer .centerBox__footer .bnr__list .bnrList__item .bnrList__item--link {
    transition: all 0.5s;
  }
  .footer .centerBox__footer .bnr__list .bnrList__item .bnrList__item--link:hover {
    color: #c90f7b;
  }
  .footer .bottomBox__footer {
    margin-top: 3em;
    padding-top: 3em;
  }
  .footer .bottomBox__footer .bottomBox__wrap {
    justify-content: space-between;
  }
  .footer .bottomBox__footer .bottomBox__wrap .copyright {
    font-size: 0.65rem;
  }
  .footer .bottomBox__footer .bottomBox__wrap .footerSub__list {
    display: flex;
    justify-content: flex-end;
  }
  .footer .bottomBox__footer .bottomBox__wrap .footerSub__list .menu-item {
    margin-left: 1em;
    font-size: 0.65rem;
  }
  .footer .bottomBox__footer .bottomBox__wrap .footerSub__list .menu-item > a {
    position: relative;
    display: block;
    transition: all 0.3s;
  }
  .footer .bottomBox__footer .bottomBox__wrap .footerSub__list .menu-item > a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #171819;
    transform: scale(0, 1);
    transform-origin: right top;
    transition: transform 0.2s ease-out;
  }
  .footer .bottomBox__footer .bottomBox__wrap .footerSub__list .menu-item > a:hover {
    color: #c90f7b;
  }
  .footer .bottomBox__footer .bottomBox__wrap .footerSub__list .menu-item > a:hover::after {
    transform: scale(1, 1);
    transform-origin: left top;
  }
  .breadcrumbs {
    margin-top: 12em;
    padding-left: 4em;
    padding-right: 4em;
  }
  .breadcrumbs .breadcrumbs__list {
    padding: 1em 0;
  }
  .breadcrumbs .breadcrumbs__list .breadcrumbs__item .breadcrumbs__item--link {
    transition: all 0.5s;
  }
  .breadcrumbs .breadcrumbs__list .breadcrumbs__item .breadcrumbs__item--link:hover {
    color: #c90f7b;
  }
  .goTop {
    bottom: 4em;
    right: 4em;
  }
  .goTop .goTop__wrap .arrow__normal {
    transition: all 0.5s;
  }
  .goTop .goTop__wrap .arrow__normal::before {
    transition: all 0.5s;
  }
  .goTop .goTop__wrap .arrow__normal::after {
    transition: all 0.5s;
  }
  .goTop .goTop__wrap .goTop__svg .goTop__circle {
    fill: #fff;
    transition: all 0.5s;
  }
  .goTop:hover .goTop__wrap .arrow__normal {
    background: #fff;
  }
  .goTop:hover .goTop__wrap .arrow__normal::before {
    background: #fff;
  }
  .goTop:hover .goTop__wrap .arrow__normal::after {
    background: #fff;
  }
  .goTop:hover .goTop__wrap .goTop__svg .goTop__circle {
    fill: #171819;
  }
}
@font-face {
  font-family: "icomoon";
  src: url("fonts/icomoon.eot?wb6z5u");
  src: url("fonts/icomoon.eot?wb6z5u#iefix") format("embedded-opentype"), url("fonts/icomoon.ttf?wb6z5u") format("truetype"), url("fonts/icomoon.woff?wb6z5u") format("woff"), url("fonts/icomoon.svg?wb6z5u#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
[class^=icon-], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-hatenabookmark:before {
  content: "\e900";
  color: #ffffff;
}

.icon-feedly:before {
  content: "\e901";
  color: #ffffff;
}

img {
  width: 100%;
  height: auto;
}

body {
  position: relative;
  background: #fff;
  line-height: 1.6;
  font-size: 0.85rem;
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  color: #171819;
  overflow-x: hidden;
}
body .mask__wrap {
  position: relative;
}
body .mask__wrap .mask {
  position: absolute;
  opacity: 0;
  display: block;
  z-index: 5;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: #171819;
}
body .width__normal .ttl__normal {
  margin-bottom: 1em;
}
body .ttl__normal, body .ttl__small {
  overflow: hidden;
  width: fit-content;
}
body .ttl__normal .ttl__normal--inner, body .ttl__small .ttl__normal--inner {
  opacity: 0;
  display: block;
}
body .ttl__small {
  margin-bottom: 1em;
  font-size: 1.2rem;
}
body .txt__normal {
  opacity: 0;
}
body .txt_center {
  text-align: center;
}
body .subTtl__normal {
  display: block;
  overflow: hidden;
  width: fit-content;
  margin-bottom: 1em;
  font-size: 0.65rem;
  font-weight: 700;
  color: #c90f7b;
}
body .subTtl__normal .subTtl__normal--inner {
  opacity: 0;
  display: block;
}
body .blog__item {
  position: relative;
  border: solid 1px #acacac;
  border-radius: 8px;
  background: #fff;
}
body .blog__item .post-categories {
  position: absolute;
  top: 1em;
  left: -0.5em;
}
body .blog__item .post-categories li a {
  display: block;
  width: fit-content;
  margin-bottom: 0.5em;
  padding: 0.5em 1em 0.4em;
  background: #c90f7b;
  color: #fff;
  line-height: 1;
  font-size: 0.7rem;
}
body .blog__item img {
  border-radius: 8px 8px 0 0;
}
body .blog__item .blog__box--bottom {
  padding: 1em;
  background: #fff;
  border-radius: 0 0 8px 8px;
}
body .blog__item .blog__box--bottom .blog__ttl {
  font-size: 1.2rem;
}
body .blog__item .blog__box--bottom .blog__txt {
  margin: 0.5em 0 1em;
}
body .blog__item .blog__box--bottom .blog__attr {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body .blog__item .blog__box--bottom .blog__attr .blog__date {
  font-size: 0.65rem;
}
body .blog__item .blog__box--bottom .blog__attr .anchor {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 30px;
  height: 1.6em;
  border-left: dotted 1px #acacac;
}
body .blog__item .blog__box--bottom .blog__attr .anchor .arrow__normal {
  background: #acacac;
  transition: all 0.5s;
}
body .blog__item .blog__box--bottom .blog__attr .anchor .arrow__normal::before {
  background: #acacac;
}
body .blog__item .blog__box--bottom .blog__attr .anchor .arrow__normal::after {
  background: #acacac;
}
body .blog__item .blog__box--bottom .blog__attr .anchor:hover .arrow__normal {
  transform: translateX(5px);
}

@media screen and (max-width: 767px) {
  body .width__normal {
    width: 100%;
    max-width: calc(1200px + 8em);
    margin-left: auto;
    margin-right: auto;
    padding-right: 1em;
    padding-left: 1em;
  }
  body .width__short {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  body .ttl__normal {
    font-size: 2rem;
  }
  body .txt__normal {
    margin-bottom: 3em;
    line-height: 1.6;
  }
  body .wrap__div .box__left {
    width: 100%;
    margin-right: 0;
  }
  body .wrap__div .box__right {
    width: 100%;
  }
  body .blog__item {
    width: 100%;
    margin-right: 0;
    margin-bottom: 1em;
  }
}
@media screen and (min-width: 768px) {
  .bgChange {
    position: relative;
    z-index: 0;
    overflow: hidden;
    background-color: #171819;
  }
  .bgChange::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background-color: #c90f7b;
    transition: all 0.2s ease-out;
  }
  .bgChange:hover::before {
    width: 100%;
  }
  body .width__normal {
    width: 100%;
    max-width: calc(1200px + 8em);
    margin-left: auto;
    margin-right: auto;
    padding-right: 4em;
    padding-left: 4em;
  }
  body .width__short {
    width: auto;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
  }
  body .ttl__normal {
    font-size: 2rem;
  }
  body .txt__normal {
    line-height: 1.8;
  }
  body .wrap__div {
    display: flex;
  }
  body .wrap__div .box__left {
    width: 50%;
    margin-right: 3em;
  }
  body .wrap__div .box__right {
    width: 50%;
  }
  body .blog__item {
    width: 33.3333333333%;
    margin-right: 3em;
  }
  body .blog__item .post-categories li a {
    position: relative;
    z-index: 0;
    overflow: hidden;
    background-color: #c90f7b;
  }
  body .blog__item .post-categories li a::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #171819;
    transform: scale(0, 1);
    transform-origin: right top;
    transition: transform 0.2s ease-out;
  }
  body .blog__item .post-categories li a:hover::before {
    transform: scale(1, 1);
    transform-origin: left top;
  }
  body .blog__item .img__wrap {
    display: block;
    overflow: hidden;
    width: 100%;
    border-radius: 8px 8px 0 0;
    background: #171819;
  }
  body .blog__item .img__wrap img {
    transition: all 0.3s ease-out;
  }
  body .blog__item .img__wrap:hover img {
    transform: scale(1.2);
    opacity: 0.2;
  }
  body .blog__item .blog__box--bottom .blog__ttl {
    transition: all 0.5s;
  }
  body .blog__item .blog__box--bottom .blog__ttl:hover {
    color: #c90f7b;
  }
}
@keyframes loop-normal {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-100%);
  }
}
@keyframes loop-reverse {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
.arrow__normal, .arrow__reverse {
  position: relative;
  display: block;
  height: 1px;
  width: 14px;
  background: #171819;
}
.arrow__normal::before, .arrow__reverse::before {
  content: "";
  position: absolute;
  display: block;
  top: -6px;
  height: 8px;
  width: 1px;
  background: #171819;
}
.arrow__normal::after, .arrow__reverse::after {
  content: "";
  position: absolute;
  display: block;
  top: -1px;
  height: 8px;
  width: 1px;
  background: #171819;
}

.arrow__reverse::before {
  left: 3px;
  transform: rotate(-135deg);
}
.arrow__reverse::after {
  left: 3px;
  transform: rotate(135deg);
}

.arrow__normal::before {
  right: 3px;
  transform: rotate(-45deg);
}
.arrow__normal::after {
  right: 3px;
  transform: rotate(45deg);
}

.btn__common--large {
  display: block;
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  padding: 1em 2em;
  border-radius: 35px;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.btn__common--small {
  display: block;
  width: fit-content;
  margin: 1em;
  margin-left: auto;
  padding: 1em 1.5em;
  border-radius: 25px;
  font-size: 0.75rem;
  line-height: 1;
  white-space: nowrap;
}

.topPage .topPage__content .hero {
  position: relative;
  width: 100%;
  height: 100vh;
  margin-left: auto;
}
.topPage .topPage__content .hero .slogan {
  position: absolute;
  z-index: 3000;
}
.topPage .topPage__content .hero .slogan .slogan__ttl {
  color: #fff;
}
.topPage .topPage__content .hero .slogan .slogan__ttl .slogan__mask {
  opacity: 0;
  display: block;
  overflow: hidden;
  height: 100%;
  width: 100%;
}
.topPage .topPage__content .hero .slogan .slogan__ttl .slogan__mask .slogan__txt--wrap {
  display: block;
  width: fit-content;
  margin-bottom: 0.2em;
  padding: 0.1em;
  background: #171819;
}
.topPage .topPage__content .hero .slogan .slogan__ttl .slogan__mask .slogan__txt--wrap .slogan__txt--inner {
  display: flex;
  width: fit-content;
  line-height: 1;
}
.topPage .topPage__content .hero .slogan .news {
  opacity: 0;
}
.topPage .topPage__content .hero .slogan .news .news__ttl {
  margin-right: 1em;
}
.topPage .topPage__content .hero .slogan .news .news__ttl .news__ttl--inner {
  display: block;
  background: #8b3ad6;
  padding: 0.3em;
  padding-top: 0.4em;
  color: #fff;
  line-height: 1;
  font-weight: normal;
}
.topPage .topPage__content .hero .slogan .news .news__txt {
  padding: 0.3em 0;
}
.topPage .topPage__content .hero .heroScrolltxt {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 4;
  opacity: 0;
  overflow: hidden;
  height: 104vh;
  margin-left: auto;
}
.topPage .topPage__content .hero .heroScrolltxt .heroScrolltxt__bg .scroll__normal {
  animation: loop-normal 150s infinite linear 5s both;
}
.topPage .topPage__content .hero .heroScrolltxt .heroScrolltxt__bg .scroll__reverse {
  animation: loop-reverse 150s infinite linear 5s both;
}
.topPage .topPage__content .hero .heroScrolltxt .heroScrolltxt__bg .heroBg .heroBg__item {
  opacity: 0.3;
}
.topPage .topPage__content .area__level {
  display: flex;
  align-items: center;
}
.topPage .topPage__content .message {
  position: relative;
  background: url("./images/noise.png");
  background-repeat: repeat;
  background-position: top left;
  overflow: hidden;
}
.topPage .topPage__content .message .message__bg--focus {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  background-image: url("./images/top_middle_image-min.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.topPage .topPage__content .message .width__short {
  position: relative;
  z-index: 1;
  padding-top: 3em;
  border-top: solid 2px #171819;
  border-bottom: solid 1px #171819;
}
.topPage .topPage__content .message .width__short .subTtl__normal {
  margin-left: auto;
  margin-right: auto;
}
.topPage .topPage__content .message .width__short .ttl__normal {
  margin: auto;
  padding-bottom: 1em;
}
.topPage .topPage__content .message .width__short .txt__normal {
  border-top: solid 1px #171819;
  opacity: 1;
}
.topPage .topPage__content .service {
  position: relative;
}
.topPage .topPage__content .service .width__normal {
  z-index: 5;
}
.topPage .topPage__content .service .width__normal .ttl__normal {
  margin-bottom: 1em;
  text-align: left;
}
.topPage .topPage__content .service .width__normal .txt__normal {
  width: 50%;
}
.topPage .topPage__content .service .box__right {
  display: flex;
  flex-wrap: wrap;
}
.topPage .topPage__content .service .box__right .service__types {
  position: relative;
}
.topPage .topPage__content .service .box__right .service__types::after {
  content: "";
  position: absolute;
  height: 1px;
  background: #acacac;
}
.topPage .topPage__content .service .box__right .service__types .number {
  width: fit-content;
  padding: 0.4em;
  background: #171819;
  border-radius: 8px;
  color: #fff;
  line-height: 1;
}
.topPage .topPage__content .service .box__right .service__types .ttl {
  padding: 1em 0.8em 0;
  font-size: 1.2rem;
  font-weight: bold;
}
.topPage .topPage__content .service .box__right .service__types .txt {
  padding: 1em 1em 1em 1em;
}
.topPage .topPage__content .service .service__bg {
  position: absolute;
  right: 0;
  min-height: 110vh;
  background: #B059EF;
}
.topPage .topPage__content .blog {
  position: relative;
}
.topPage .topPage__content .blog .width__normal {
  z-index: 3;
}
.topPage .topPage__content .blog .width__normal .ttl__normal {
  margin-bottom: 1em;
  text-align: left;
}
.topPage .topPage__content .blog .blog__bg {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  min-height: 100vh;
  background: #D82AD8;
}
.topPage .topPage__content .blog .swiper__blog {
  position: relative;
}
.topPage .topPage__content .blog .swiper__blog .swiper-wrapper .swiper-slide {
  margin-right: 3em;
}
.topPage .topPage__content .blog .swiper__blog .swiper-button-prev::after, .topPage .topPage__content .blog .swiper__blog .swiper-button-next::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  height: 0;
  width: 0;
  margin: auto;
}
.topPage .topPage__content .blog .swiper__blog .swiper-button-prev {
  left: 0;
}
.topPage .topPage__content .blog .swiper__blog .swiper-button-next {
  left: 50px;
}
.topPage .topPage__content .mission {
  position: relative;
  background-image: url("./images/top_bottom_image-min.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.topPage .topPage__content .mission .width__short {
  z-index: 15;
  max-width: 100%;
}
.topPage .topPage__content .mission .width__short .ttl__normal {
  position: relative;
  width: 100%;
  line-height: 1;
}
.topPage .topPage__content .mission .width__short .ttl__normal .ttl__normal--inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0;
  color: #171819;
}
.topPage .topPage__content .mission .width__short .txt__normal {
  position: relative;
  overflow: hidden;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2em;
  color: #171819;
  text-align: center;
  font-size: 1rem;
  font-family: "Open Sans";
  font-weight: 700;
}
.topPage .topPage__content .mission .width__short .txt__normal .border__side--left, .topPage .topPage__content .mission .width__short .txt__normal .border__side--right, .topPage .topPage__content .mission .width__short .txt__normal .border__side--top, .topPage .topPage__content .mission .width__short .txt__normal .border__side--bottom {
  position: absolute;
  display: block;
  height: 0;
  width: 0;
  background: none transparent;
}
.topPage .topPage__content .mission .width__short .txt__normal .border__side--left {
  left: 0;
  bottom: 0;
  height: 100%;
  width: 1px;
}
.topPage .topPage__content .mission .width__short .txt__normal .border__side--right {
  right: 0;
  top: 0;
  height: 100%;
  width: 1px;
}
.topPage .topPage__content .mission .width__short .txt__normal .border__side--top {
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
}
.topPage .topPage__content .mission .width__short .txt__normal .border__side--bottom {
  bottom: 0;
  right: 0;
  width: 100%;
  height: 1px;
}
.topPage .topPage__content .mission .width__short .txt__normal .txt__normal--inner {
  opacity: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 0.5em;
  padding-right: 0.5em;
  background: #171819;
  color: #fff;
}
.topPage .topPage__content .mission .mission__bg {
  position: absolute;
  z-index: 5;
  right: 0;
  min-height: 104vh;
  background: #dd2f86;
}
.topPage .topPage__content .mission .mission__mask {
  position: absolute;
  top: -2%;
  left: 0;
  z-index: 1;
  height: 104%;
  width: 100%;
  background: #fff;
}

@media screen and (max-width: 767px) {
  .btn__common--large {
    padding: 1em;
    background: #171819;
    color: #fff;
  }
  .btn__common--small {
    padding: 1em;
    background: #c90f7b;
    color: #fff;
  }
  .topPage .topPage__content .hero .slogan {
    bottom: 13%;
    left: 5%;
  }
  .topPage .topPage__content .hero .slogan .slogan__ttl {
    font-size: 7vw;
    letter-spacing: -0.05em;
  }
  .topPage .topPage__content .hero .slogan .news {
    margin-top: 1em;
  }
  .topPage .topPage__content .hero .slogan .news .news__ttl {
    width: fit-content;
  }
  .topPage .topPage__content .hero .slogan .news .news__ttl .news__ttl--inner {
    font-size: 0.5rem;
  }
  .topPage .topPage__content .hero .slogan .news .news__txt {
    padding-right: 1em;
    font-size: 0.75rem;
    line-height: 1.6;
  }
  .topPage .topPage__content .hero .heroScrolltxt {
    width: 80%;
    clip-path: polygon(15% 100%, 0% 0%, 100% 0%, 100% 100%);
  }
  .topPage .topPage__content .hero .heroScrolltxt .heroScrolltxt__bg .heroBg .heroBg__item {
    margin-bottom: 1%;
  }
  .topPage .topPage__content .area__level {
    min-height: 100vh;
    padding: 8em 1em;
  }
  .topPage .topPage__content .message .width__short {
    padding-top: 1em;
    padding-bottom: 3em;
  }
  .topPage .topPage__content .message .width__short .subTtl__normal {
    margin-bottom: 1em;
  }
  .topPage .topPage__content .message .width__short .ttl__normal {
    font-size: 6vw;
  }
  .topPage .topPage__content .message .width__short .txt__normal {
    padding: 2em 0;
    margin-bottom: 0;
  }
  .topPage .topPage__content .service .width__normal .txt__normal {
    width: 100%;
  }
  .topPage .topPage__content .service .box__right .service__types {
    width: 100%;
  }
  .topPage .topPage__content .service .box__right .service__types::after {
    top: calc((6vw + 1.2em) / 2);
    left: calc(6vw + 1.6em + 3%);
    width: calc(100% - (6vw + 1.6em + 3%));
  }
  .topPage .topPage__content .service .box__right .service__types .number {
    font-size: 6vw;
  }
  .topPage .topPage__content .service .service__bg {
    width: 60%;
    clip-path: polygon(15% 100%, 0% 0%, 100% 0%, 100% 100%);
  }
  .topPage .topPage__content .blog .blog__bg {
    width: 30%;
    clip-path: polygon(18% 100%, 0% 0%, 100% 0%, 100% 100%);
  }
  .topPage .topPage__content .blog .swiper__blog .swiper-button-prev, .topPage .topPage__content .blog .swiper__blog .swiper-button-next {
    top: auto;
    bottom: -70px;
    right: auto;
    height: 40px;
    width: 40px;
  }
  .topPage .topPage__content .mission {
    padding: 1em;
  }
  .topPage .topPage__content .mission .width__short .ttl__normal .ttl__normal--inner {
    line-height: 1.6;
  }
  .topPage .topPage__content .mission .width__short .txt__normal {
    margin-bottom: 1em;
  }
  .topPage .topPage__content .mission .mission__bg {
    width: 20%;
    clip-path: polygon(20% 100%, 0% 0%, 100% 0%, 100% 100%);
  }
}
@media screen and (min-width: 768px) {
  .btn__common--large {
    padding: 1.5em 2em;
    background: #171819;
    color: #fff;
    transition: all 0.3s;
  }
  .btn__common--large:hover {
    background: #c90f7b;
  }
  .btn__common--small {
    padding: 1em 1.5em;
    background: #fff;
    color: #171819;
    transition: all 0.3s;
  }
  .btn__common--small:hover {
    background: #171819;
    color: #fff;
  }
  .topPage .topPage__content .hero .slogan {
    bottom: 10%;
    left: 5%;
  }
  .topPage .topPage__content .hero .slogan .slogan__ttl {
    font-size: 5vh;
    letter-spacing: -0.05em;
  }
  .topPage .topPage__content .hero .slogan .news {
    display: flex;
    margin-top: 2em;
  }
  .topPage .topPage__content .hero .slogan .news .news__ttl .news__ttl--inner {
    line-height: 1;
    font-size: 0.8rem;
  }
  .topPage .topPage__content .hero .slogan .news .news__txt {
    line-height: 1;
    font-size: 0.9rem;
  }
  .topPage .topPage__content .hero .heroScrolltxt {
    width: 90%;
    clip-path: polygon(7% 100%, 0% 0%, 100% 0%, 100% 100%);
  }
  .topPage .topPage__content .hero .heroScrolltxt .heroScrolltxt__bg .heroBg .heroBg__item {
    margin-bottom: 10px;
  }
  .topPage .topPage__content .area__level {
    min-height: 100vh;
    padding: 8em 0;
  }
  .topPage .topPage__content .message .width__short {
    max-width: 600px;
    padding-top: 3em;
    padding-bottom: 5em;
  }
  .topPage .topPage__content .message .width__short .ttl__normal {
    font-size: 1.6rem;
  }
  .topPage .topPage__content .message .width__short .txt__normal {
    padding: 4em 5em;
    line-height: 2;
    font-size: 1rem;
  }
  .topPage .topPage__content .service .width__normal .txt__normal {
    width: 50%;
  }
  .topPage .topPage__content .service .box__right .service__types {
    width: 50%;
  }
  .topPage .topPage__content .service .box__right .service__types::after {
    top: 21.595px;
    left: 51.73px;
    width: calc(100% - 46.73px - 5px);
  }
  .topPage .topPage__content .service .box__right .service__types .number {
    font-size: 1.5rem;
  }
  .topPage .topPage__content .service .box__right .service__types .txt {
    line-height: 1.8;
  }
  .topPage .topPage__content .service .service__bg {
    width: 60%;
    clip-path: polygon(7% 100%, 0% 0%, 100% 0%, 100% 100%);
  }
  .topPage .topPage__content .blog .blog__bg {
    width: 30%;
    clip-path: polygon(12% 100%, 0% 0%, 100% 0%, 100% 100%);
  }
  .topPage .topPage__content .blog .swiper__blog .swiper-button-prev, .topPage .topPage__content .blog .swiper__blog .swiper-button-next {
    top: auto;
    bottom: -70px;
    right: auto;
    height: 40px;
    width: 40px;
    border-radius: 20px;
    transition: all 0.5s;
  }
  .topPage .topPage__content .blog .swiper__blog .swiper-button-prev:hover, .topPage .topPage__content .blog .swiper__blog .swiper-button-next:hover {
    background: #e0e0e0;
  }
  .topPage .topPage__content .mission .mission__bg {
    width: 20%;
    clip-path: polygon(16% 100%, 0% 0%, 100% 0%, 100% 100%);
  }
}
.contentsArea .subPage__bg {
  position: absolute;
  opacity: 0;
  z-index: -1;
  top: -2em;
  right: 0;
  height: 380px;
  width: 70%;
  background: #B059EF;
  clip-path: polygon(12% 100%, 0% 0%, 100% 0%, 100% 100%);
}

.subPage {
  position: relative;
  min-height: 100vh;
}
.subPage .attribute__list .post-categories li a {
  display: block;
  width: fit-content;
  margin-bottom: 0.5em;
  padding: 0.5em 1em 0.4em;
  background: #171819;
  color: #fff;
  line-height: 1;
  font-size: 0.7rem;
}
.subPage .subContent .content {
  opacity: 0;
  background: url("images/noise.png");
  background-repeat: repeat;
  background-position: top left;
  border-radius: 8px;
  font-size: 1rem;
  line-height: 1.8;
}
.subPage .subContent .content h2.wp-block-heading {
  margin-bottom: 1em;
  padding: 1em;
  background: rgba(255, 255, 255, 0.3);
  border-top: solid 1px rgba(0, 0, 0, 0.2);
  border-bottom: solid 1px rgba(0, 0, 0, 0.2);
  font-weight: 700;
}
.subPage .subContent .content h3.wp-block-heading, .subPage .subContent .content h3.term-tag {
  margin-bottom: 0.5em;
  padding-left: 1em;
  padding-right: 1em;
  font-weight: 700;
}
.subPage .subContent .content .simple-sitemap-wrap {
  font-size: 0.85rem;
}
.subPage .subContent .content .term-tag {
  font-weight: 700;
}
.subPage .subContent .content p, .subPage .subContent .content figure, .subPage .subContent .content ul.pp__list {
  margin-bottom: 3em;
  font-size: 0.85rem;
}
.subPage .subContent .content p a, .subPage .subContent .content figure a, .subPage .subContent .content ul.pp__list a {
  color: #8b3ad6;
}
.subPage .subContent .content p, .subPage .subContent .content ul.pp__list {
  padding-left: 1em;
  padding-right: 1em;
}
.subPage .subContent .content .wp-block-image img {
  border-radius: 8px;
}
.subPage .subContent .content ul.pp__list {
  list-style-type: disc;
}
.subPage .subContent .content ul.pp__list li {
  margin-left: 1em;
}
.subPage .subContent .sns {
  display: flex;
  justify-content: center;
  margin-top: 1em;
}
.subPage .subContent .sns .sns__item {
  height: 2em;
  width: 5em;
  margin-right: 1em;
  border-radius: 1em;
  color: #fff;
}
.subPage .subContent .sns .sns__item:last-child {
  margin-right: 0;
}
.subPage .subContent .sns .sns__item a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
.subPage .subContent .sns .facebook {
  background: #3b5998;
}
.subPage .subContent .sns .x {
  background: #14171a;
}
.subPage .blog .blog__content, .subPage .blog__other .blog__content {
  display: flex;
  flex-wrap: wrap;
}
.subPage .blog .blog__content .blog__item, .subPage .blog__other .blog__content .blog__item {
  opacity: 0;
  margin-bottom: 3em;
}
.subPage .blog .blog__content .blog__item:nth-child(3n), .subPage .blog__other .blog__content .blog__item:nth-child(3n) {
  margin-right: 0;
}
.subPage .data {
  display: flex;
  flex-wrap: wrap;
  border-top: solid 1px rgba(0, 0, 0, 0.2);
}
.subPage .data .data__ttl {
  width: 30%;
  border-bottom: solid 1px rgba(0, 0, 0, 0.2);
  font-size: 0.85rem;
  font-weight: normal;
  color: #3f3f3f;
}
.subPage .data .data__txt {
  width: 70%;
  border-bottom: solid 1px rgba(0, 0, 0, 0.2);
  font-size: 0.85rem;
  color: #171819;
}
.subPage .flow {
  display: flex;
  background: #fff;
  border-radius: 8px;
}
.subPage .flow .flow__item {
  width: 33.3333333333%;
  padding: 0.5em;
  border-right: solid 1px #f0f0f0;
  text-align: center;
}
.subPage .flow .flow__item:last-of-type {
  border-right: 0;
}
.subPage .flow .is__active {
  background: #171819;
  color: #fff;
}
.subPage .flow .is__active:first-child {
  border-radius: 8px 0 0 8px;
}
.subPage .flow .is__active:last-child {
  border-radius: 0 8px 8px 0;
}
.subPage .form {
  display: flex;
  overflow-x: hidden;
}
.subPage .form .form__item {
  scroll-behavior: smooth;
  flex-shrink: 0;
  width: 100%;
  margin-right: 10%;
}
.subPage .form .form__item .form__wrap .form__ttl {
  display: flex;
  margin-top: 2em;
  font-size: 0.95rem;
}
.subPage .form .form__item .form__wrap .form__ttl .form__label {
  display: flex;
  justify-content: center;
  align-items: center;
  width: fit-content;
  margin-right: 1em;
  padding: 0.5em;
  line-height: 1;
  color: #fff;
  font-weight: normal;
  font-size: 0.75rem;
}
.subPage .form .form__item .form__wrap .form__ttl .form__option {
  background: #494949;
}
.subPage .form .form__item .form__wrap .form__ttl .form__requirement {
  background: #c90f7b;
}
.subPage .form .form__item .form__wrap .form__input {
  width: 100%;
  margin: 1em 0 0;
}
.subPage .form .form__item .form__wrap .form__input .form__input--item, .subPage .form .form__item .form__wrap .form__input .form__textarea--item {
  width: 100%;
  padding: 0.5em;
  background: #ffffff;
  border: solid 1px #c5c5c5;
  border-radius: 8px;
  line-height: 1.6;
  font-size: 0.85rem;
}
.subPage .form .form__item .form__wrap .form__input .error {
  display: block;
  margin-top: 0.5em;
  font-size: 0.7rem;
  font-weight: 700;
  color: #940f0f;
}
.subPage .form .form__item .btns {
  display: flex;
  margin-top: 3em;
  justify-content: center;
}
.subPage .form .form__item .btns .btns__btn {
  margin-right: 1em;
}
.subPage .form .form__item .btns .btns__btn:last-of-type {
  margin-right: 0;
}
.subPage .form .form__item .btns .btns__btn .btn {
  padding: 1em 2em;
  border-radius: 24px;
  font-size: 0.85rem;
  text-align: center;
}
.subPage .form .form__item .btns .btns__btn .btn__confirm {
  background: #171819;
  color: #fff;
}
.subPage .form .form__item .btns .btns__btn .btn__correct {
  border: solid 1px #171819;
}
.subPage .form .form__item .btns .btns__btn .btn__send {
  background: #171819;
  color: #fff;
}
.subPage .single {
  min-height: 100vh;
}
.subPage .service .service__content {
  margin-top: 5em;
}
.subPage .service .service__content .service__box {
  opacity: 0;
}
.subPage .service .service__content .service__box .service__ttl {
  position: relative;
  border-bottom: solid 1px #acacac;
}
.subPage .service .service__content .service__box .service__ttl::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 22px;
  left: 0;
  height: 1px;
  width: 100%;
  background: #acacac;
}
.subPage .service .service__content .service__box .service__ttl .service__number {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: fit-content;
  padding: 0.4em;
  background: #8b3ad6;
  border-radius: 8px;
  color: #fff;
  line-height: 1;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
}
.subPage .service .service__content .service__box .service__ttl .service__ttl--inner {
  position: relative;
  z-index: 4;
  font-weight: bold;
  text-align: center;
}
.subPage .service .service__content .service__box .service__ttl .service__words {
  position: absolute;
  z-index: -1;
  right: 0;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  color: #eee9f1;
  line-height: 1;
  letter-spacing: -0.1em;
}
.subPage .service .service__content .service__box .service__txt .service__txt--inner {
  margin-bottom: 3em;
  line-height: 1.8;
}
.subPage .service .service__content .service__box .service__txt .service__txt--inner p {
  margin-bottom: 1em;
}
.subPage .service .service__content .service__box .service__txt .service__txt--inner h3 {
  margin-bottom: 1em;
  font-weight: bold;
}
.subPage .service .service__content .service__box .service__txt .service__txt--inner dl dt {
  padding: 0.5em;
}
.subPage .service .service__content .service__box .service__txt .service__txt--inner dl dd {
  padding: 0.5em;
  text-align: right;
}
.subPage .service .service__content .service__box .service__txt .service__txt--inner dl dd:last-of-type {
  border-bottom: 0;
}
.subPage .service .service__content .service__box .service__txt .service__txt--inner a {
  color: #c90f7b;
}
.subPage .service .service__example .example__ttl {
  margin-bottom: 0.5em;
  font-weight: bold;
  text-align: center;
}
.subPage .service .service__example .example__txt a {
  color: #c90f7b;
}
.subPage .service .service__bottom {
  background: url("images/noise.png");
  background-repeat: repeat;
  background-position: top left;
  border-radius: 8px;
}
.subPage .service .service__bottom .serviceBottom__box--left {
  line-height: 1.8;
}
.subPage .service .service__bottom .serviceBottom__box--right {
  display: flex;
  justify-content: center;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .subPage .layout__common {
    margin-top: 5em;
  }
  .subPage .subContent .content {
    padding: 1em;
    line-height: 1.6;
  }
  .subPage .blog .blog__content .blog__item, .subPage .blog__other .blog__content .blog__item {
    width: 100%;
    margin-right: 0;
    margin-bottom: 1em;
  }
  .subPage .inquiry .txt__normal {
    width: 100%;
  }
  .subPage .data .data__ttl {
    padding: 1em 0;
    font-size: 0.85rem;
  }
  .subPage .data .data__txt {
    padding: 1em 0 1em 1em;
    font-size: 0.85rem;
  }
  .subPage .flow .flow__item {
    font-size: 0.85rem;
  }
  .subPage .blog__other {
    margin-top: 3em;
  }
  .subPage .service .service__content {
    margin-top: 5em;
  }
  .subPage .service .service__content .service__box {
    width: 100%;
  }
  .subPage .service .service__content .service__box:nth-last-child(-n+1) {
    border-bottom: solid 1px #e2e2e2;
  }
  .subPage .service .service__content .service__box .service__ttl::after {
    top: 22px;
  }
  .subPage .service .service__content .service__box .service__ttl .service__number {
    padding: 0.4em;
    font-size: 1.5rem;
  }
  .subPage .service .service__content .service__box .service__ttl .service__ttl--inner {
    padding: 2.5em 1em 1.5em;
    font-size: 1.5rem;
  }
  .subPage .service .service__content .service__box .service__ttl .service__words {
    z-index: -1;
    bottom: -0.12em;
    font-size: 14vw;
    letter-spacing: -0.1em;
  }
  .subPage .service .service__content .service__box .service__txt {
    padding: 3em 0;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner {
    margin-bottom: 3em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner p {
    margin-bottom: 1em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner h3 {
    margin-bottom: 1em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner dl {
    margin-bottom: 0.5em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner dl dt {
    padding: 0.5em;
    background: url("images/noise.png");
    background-repeat: repeat;
    background-position: top left;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner dl dd {
    padding: 0.5em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner .caution {
    font-size: 0.65rem;
  }
  .subPage .service .service__example {
    margin-top: 3em;
  }
  .subPage .service .service__example .example__ttl {
    text-align: left;
    font-size: 1.3rem;
  }
  .subPage .service .service__example .example__txt {
    text-align: left;
    line-height: 1.6;
  }
  .subPage .service .service__example .example__txt br {
    display: none;
  }
  .subPage .service .service__example .picture {
    margin-top: 2em;
  }
  .subPage .service .service__bottom {
    margin-top: 5em;
    padding: 1.5em;
  }
  .subPage .service .service__bottom .serviceBottom__box--left {
    line-height: 1.8;
  }
  .subPage .service .service__bottom .serviceBottom__box--right .btn__common--large {
    margin-top: 1.5em;
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  .subPage .layout__common {
    margin-top: 12em;
  }
  .subPage .wrap__div .box__left {
    width: 40%;
    margin-right: 3em;
  }
  .subPage .wrap__div .box__right {
    width: 60%;
  }
  .subPage .attribute__list .post-categories li a {
    display: block;
    position: relative;
    z-index: 0;
    overflow: hidden;
    width: fit-content;
    background-color: #171819;
  }
  .subPage .attribute__list .post-categories li a::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #c90f7b;
    transform: scale(0, 1);
    transform-origin: right top;
    transition: transform 0.2s ease-out;
  }
  .subPage .attribute__list .post-categories li a:hover::before {
    transform: scale(1, 1);
    transform-origin: left top;
  }
  .subPage .subContent .content {
    padding: 3em;
  }
  .subPage .subContent .content p {
    line-height: 2;
  }
  .subPage .subContent .content p a {
    transition: all 0.3s;
  }
  .subPage .subContent .content p a:hover {
    opacity: 0.3;
  }
  .subPage .subContent .sns .sns__item a span, .subPage .subContent .sns .sns__item a i {
    transition: all 0.1s ease-out;
  }
  .subPage .subContent .sns .sns__item a:hover span, .subPage .subContent .sns .sns__item a:hover i {
    transform: scale(1.3);
  }
  .subPage .blog .blog__content .blog__item, .subPage .blog__other .blog__content .blog__item {
    width: calc(33.3333333333% - 2em);
    margin-right: 3em;
    margin-bottom: 3em;
  }
  .subPage .inquiry .txt__normal {
    width: 70%;
  }
  .subPage .data .data__ttl {
    padding: 1em;
  }
  .subPage .data .data__txt {
    padding: 1em 1em 1em 0;
  }
  .subPage .flow {
    margin-bottom: 1em;
  }
  .subPage .flow .flow__item {
    font-size: 0.85rem;
  }
  .subPage .form .form__item .btns .btns__btn .btn__correct {
    transition: all 0.5s;
  }
  .subPage .form .form__item .btns .btns__btn .btn__correct:hover {
    opacity: 0.1;
  }
  .subPage .blog__other {
    margin-top: 8em;
  }
  .subPage .service .leadTxt {
    width: 30em;
  }
  .subPage .service .service__content {
    display: flex;
    flex-wrap: wrap;
    margin-top: 5em;
  }
  .subPage .service .service__content .service__box {
    width: 50%;
  }
  .subPage .service .service__content .service__box:nth-child(even) {
    border-left: solid 1px #e2e2e2;
  }
  .subPage .service .service__content .service__box:nth-last-child(-n+2) {
    border-bottom: solid 1px #e2e2e2;
  }
  .subPage .service .service__content .service__box .service__ttl::after {
    top: 22px;
  }
  .subPage .service .service__content .service__box .service__ttl .service__number {
    padding: 0.4em;
    font-size: 1.5rem;
  }
  .subPage .service .service__content .service__box .service__ttl .service__ttl--inner {
    padding: 2.5em 1em 1.5em;
    font-size: 1.5rem;
  }
  .subPage .service .service__content .service__box .service__ttl .service__words {
    z-index: -1;
    bottom: -0.12em;
    font-size: 5.5vw;
    letter-spacing: -0.1em;
  }
  .subPage .service .service__content .service__box .service__txt {
    padding: 3em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner {
    margin-bottom: 3em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner p {
    margin-bottom: 1em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner h3 {
    margin-bottom: 1em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner dl {
    display: flex;
    flex-wrap: wrap;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner dl dt {
    width: 16em;
    padding: 0.5em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner dl dt:nth-of-type(odd) {
    background: url("images/noise.png");
    background-repeat: repeat;
    background-position: top left;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner dl dd {
    width: calc(100% - 16em);
    padding: 0.5em;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner dl dd:nth-of-type(odd) {
    background: url("images/noise.png");
    background-repeat: repeat;
    background-position: top left;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner a {
    transition: all 0.3s;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner a:hover {
    color: #8b3ad6;
  }
  .subPage .service .service__content .service__box .service__txt .service__txt--inner .caution {
    font-size: 75%;
  }
  .subPage .service .service__example {
    margin-top: 8em;
  }
  .subPage .service .service__example .example__ttl {
    font-size: 1.5rem;
  }
  .subPage .service .service__example .example__txt {
    text-align: center;
    line-height: 1.6;
  }
  .subPage .service .service__example .picture {
    margin-top: 4em;
  }
  .subPage .service .service__bottom {
    display: flex;
    margin-top: 3em;
    padding: 3em;
  }
  .subPage .service .service__bottom .serviceBottom__box--left {
    width: 50%;
    line-height: 1.8;
  }
  .subPage .service .service__bottom .serviceBottom__box--right {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .sp {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .pc {
    display: none;
  }
}