@charset "UTF-8";
/*===============================
scss 変数ファイル
================================*/
/*
カラー
================================*/
/*
メディアクエリ
================================*/
#about .p_heading {
 position: relative;
}
@media screen and (min-width: 1024px) {
 #about .p_heading .heading-style1 {
  position: absolute;
  top: 50%;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_heading .heading-style1 {
  white-space: nowrap;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_heading--left .heading-style1 {
  left: 30px;
  -webkit-transform: translateY(-50%) rotate(180deg);
  transform: translateY(-50%) rotate(180deg);
 }
}
@media screen and (min-width: 1024px) {
 #about .p_heading--right .heading-style1 {
  right: 30px;
  -webkit-transform: translateY(-50%) rotate(0deg);
  transform: translateY(-50%) rotate(0deg);
 }
}
@media screen and (min-width: 1024px) {
 #about .p_heading .heading-style2 {
  position: absolute;
  top: 80%;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_heading .heading-style2 {
  white-space: nowrap;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_heading--left .heading-style2 {
  left: 15px;
  -webkit-transform: translateY(-50%) rotate(180deg);
  transform: translateY(150%) rotate(-90deg);
 }
}
@media screen and (min-width: 1024px) {
 #about .p_heading--right .heading-style2 {
  right: 30px;
  -webkit-transform: translateY(-50%) rotate(0deg);
  transform: translateY(-50%) rotate(0deg);
 }
}
#about .p_about {
 overflow-x: hidden;
}
#about .p_about__about {
 position: relative;
}
#about .p_about__about:before {
 content: "";
 display: block;
 position: absolute;
 z-index: -1;
 top: 0;
 right: -100px;
 background-image: url("../../images/page/about/logo_back.svg");
 background-repeat: no-repeat;
 background-position: top right;
 background-size: 100% auto;
 width: 400px;
 height: 401px;
 opacity: 0.05;
}
@media screen and (min-width: 640px) {
 #about .p_about__about:before {
  width: 450px;
  height: 451px;
 }
}
@media screen and (min-width: 768px) {
 #about .p_about__about:before {
  background-size: contain;
  width: 100%;
  height: 100%;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__about:before {
  right: -50px;
 }
}
@media screen and (min-width: 1500px) {
 #about .p_about__about:before {
  right: 0;
 }
}
#about .p_about__about--text__inner--heading {
 display: block;
 font-size: 3.4rem;
 letter-spacing: 2px;
 overflow: hidden;
}
@media screen and (min-width: 640px) {
 #about .p_about__about--text__inner--heading {
  font-size: 4rem;
 }
}
@media screen and (min-width: 768px) {
 #about .p_about__about--text__inner--heading {
  font-size: 6rem;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__about--text__inner--heading {
  font-size: 8rem;
 }
}
#about .p_about__about--text__inner--heading:not(:first-child) {
 margin-top: 15px;
}
@media screen and (min-width: 768px) {
 #about .p_about__about--text__inner--heading:not(:first-child) {
  margin-top: 20px;
 }
}
#about .p_about__about--text__inner--heading:nth-child(3) {
 margin-top: 10px;
}
#about .p_about__about--text .paragraphs {
 margin-top: 20px;
 max-width: 650px;
 margin-right: auto;
}
@media screen and (min-width: 768px) {
 #about .p_about__about--text .paragraphs {
  margin-top: 30px;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__about--text .paragraphs {
  margin-top: 40px;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_about__about--text .paragraphs {
  margin-top: 50px;
 }
}
#about .p_about__about--btn {
 position: relative;
 margin-top: 50px;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
}
#about .p_about__about--btn p {
 margin-right: 30px;
 letter-spacing: 1px;
 font-size: 1.6rem;
}
@media screen and (min-width: 768px) {
 #about .p_about__about--btn p {
  margin-right: 40px;
  font-size: 1.8rem;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__about--btn p {
  margin-right: 50px;
 }
}
#about .p_about__about--btn a {
 position: relative;
 display: block;
 padding: 25px 26px;
 background-color: #1a1414;
 border-radius: 50%;
}
@media screen and (min-width: 768px) {
 #about .p_about__about--btn a {
  padding: 25px 27px;
 }
}
#about .p_about__about--btn a:before,
#about .p_about__about--btn a:after {
 content: "";
 display: block;
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 margin: auto;
 width: 100%;
 height: 100%;
 border: 1px solid #1a1414;
 border-radius: 50%;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 pointer-events: none;
 -webkit-animation: pulse 2s linear infinite;
 animation: pulse 2s linear infinite;
}
#about .p_about__about--btn a:after {
 -webkit-animation-delay: 1s;
 animation-delay: 1s;
}
#about .p_about__about--btn a img {
 max-width: 15px;
}
@-webkit-keyframes pulse {
 0% {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
 }
 100% {
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
  opacity: 0;
 }
}
@keyframes pulse {
 0% {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
 }
 100% {
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
  opacity: 0;
 }
}
#about .p_about__what {
 margin-bottom: -10px;
}
@media screen and (min-width: 768px) {
 #about .p_about__what__text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
 }
}
#about .p_about__what__text--heading {
 text-align: center;
 font-size: 2.2rem;
 font-weight: 900;
 line-height: 1.6em;
}
@media screen and (min-width: 768px) {
 #about .p_about__what__text--heading {
  font-size: 2.4rem;
 }
}
@media screen and (min-width: 768px) {
 #about .p_about__what__text--heading {
  font-size: 2.6rem;
  width: 50%;
  margin-right: 50px;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__what__text--heading {
  font-size: 3rem;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_about__what__text--heading {
  width: 575px;
  font-size: 3.2rem;
 }
}
#about .p_about__what__text .paragraphs {
 margin-top: 20px;
}
@media screen and (min-width: 768px) {
 #about .p_about__what__text .paragraphs {
  margin-top: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
 }
}
#about .p_about__slider {
 display: none;
}
#about .p_about__slider__item img {
 max-width: 300px;
}
@media screen and (min-width: 640px) {
 #about .p_about__slider__item img {
  max-width: 400px;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__slider__item img {
  max-width: 100%;
 }
}
#about .p_about__service__container {
 position: relative;
}
@media screen and (min-width: 1024px) {
 #about .p_about__service__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
 }
}
#about .p_about__service__container__backSlider {
 display: none;
}
@media screen and (min-width: 1024px) {
 #about .p_about__service__container__backSlider {
  border: 3px solid #1a1414;
  display: block;
  width: 40%;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_about__service__container__backSlider {
  width: 45%;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__service__container__inner {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin-right: 80px;
 }
}
#about .p_about__service__container__inner__block:not(:first-child) {
 margin-top: 50px;
}
@media screen and (min-width: 1024px) {
 #about .p_about__service__container__inner__block:not(:first-child) {
  margin-top: 80px;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_about__service__container__inner__block:not(:first-child) {
  margin-top: 100px;
 }
}
#about
 .p_about__service__container__inner__block:first-child
 .p_about__service__container__inner__block__text--heading:before {
 content: "01";
}
#about
 .p_about__service__container__inner__block:nth-child(2)
 .p_about__service__container__inner__block__text--heading:before {
 content: "02";
}
#about
 .p_about__service__container__inner__block:nth-child(3)
 .p_about__service__container__inner__block__text--heading:before {
 content: "03";
}
#about
 .p_about__service__container__inner__block:nth-child(4)
 .p_about__service__container__inner__block__text--heading:before {
 content: "04";
}
#about .p_about__service__container__inner__block__text {
 -webkit-transition: color 0.3s linear;
 transition: color 0.3s linear;
 padding-left: 35px;
}
@media screen and (min-width: 768px) {
 #about .p_about__service__container__inner__block__text {
  padding-left: 40px;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__service__container__inner__block__text {
  padding-left: 0;
 }
}
#about .p_about__service__container__inner__block__text--heading {
 position: relative;
 letter-spacing: 1px;
 font-size: 2.4rem;
}
@media screen and (min-width: 640px) {
 #about .p_about__service__container__inner__block__text--heading {
  font-size: 3rem;
 }
}
@media screen and (min-width: 768px) {
 #about .p_about__service__container__inner__block__text--heading {
  font-size: 3.2rem;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_about__service__container__inner__block__text--heading {
  font-size: 3.8rem;
 }
}
#about .p_about__service__container__inner__block__text--heading:before {
 position: absolute;
 top: calc(50% - 7px);
 left: -35px;
 font-size: 1.6rem;
}
@media screen and (min-width: 768px) {
 #about .p_about__service__container__inner__block__text--heading:before {
  left: -40px;
  font-size: 1.8rem;
 }
}
@media screen and (min-width: 1024px) {
 #about .p_about__service__container__inner__block__text--heading:before {
  left: -50px;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_about__service__container__inner__block__text--heading:before {
  left: -55px;
 }
}
#about .p_about__service__container__inner__block__text .paragraphs {
 margin-top: 20px;
}
@media screen and (min-width: 768px) {
 #about .p_about__service__container__inner__block__text .paragraphs {
  margin-top: 25px;
 }
}
#about .p_about__member__container__block {
 border: 1px solid #ccc;
}
#about .p_about__member__container__block__img {
 position: relative;
}
#about .p_about__member__container__block__img img {
 width: 100%;
}
#about .p_about__member__container__block__text {
 position: relative;
 overflow: hidden;
 padding: 30px 30px;
}
#about .p_about__member__container__block__text__meta--heading {
 font-size: 2.4rem;
 letter-spacing: 1px;
}
#about .p_about__member__container__block__text__meta--heading span {
 display: inline-block;
 margin: 0 -3px 0 -4px;
}
#about .p_about__member__container__block__text__meta--title {
 margin-top: 10px;
 font-size: 1.6rem;
}
#about .p_about__member__container__block__text__meta--title span {
 display: inline-block;
 font-size: 1.2rem;
 -webkit-transform: translateY(-3px);
 transform: translateY(-3px);
}
#about .p_about__member__container__block__text .paragraphs {
 margin-top: 15px;
 font-size: 1.4rem;
}
#about .p_about__member__container--sp {
 position: relative;
 padding-bottom: 30px;
}
#about .p_about__member__container--sp .swiper-pagination {
 bottom: 0;
}
#about
 .p_about__member__container--sp
 .swiper-pagination
 .swiper-pagination-bullet-active {
 background-color: #1a1414;
}
#about .p_about__member__container--pc {
 display: none;
}
@media screen and (min-width: 768px) {
 #about .p_about__member__container--pc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
 }
}
@media screen and (min-width: 768px) {
 #about .p_about__member__container--pc .p_about__member__container__block {
  width: 50%;
 }
}
@media screen and (min-width: 1200px) {
 #about .p_about__member__container--pc .p_about__member__container__block {
  width: 25%;
 }
}
@media screen and (min-width: 768px) {
 #about
  .p_about__member__container--pc
  .p_about__member__container__block:not(:last-child) {
  border-right: none;
 }
}
@media screen and (min-width: 768px) {
 #about
  .p_about__member__container--pc
  .p_about__member__container__block__text {
  border-right: none;
 }
}

#about .p_about__container__client .heading-style2 {
 font-size: 1.8rem;
 margin-bottom: 40px;
 letter-spacing: 1px;
}

#about .p_about__container__client__list {
 display: flex;
 flex-wrap: wrap;
}
@media screen and (min-width: 640px) {
 #about .p_about__container__client__list {
  flex: 1;
 }
}
#about .p_about__container__client__list .item {
 width: calc(50% - 10px);
 margin-right: 20px;
}
@media screen and (min-width: 640px) {
 #about .p_about__container__client__list .item {
  width: calc(20% - 16px);
 }
}
#about .p_about__container__client__list .item:nth-child(2n) {
 margin-right: 0;
}
@media screen and (min-width: 640px) {
 #about .p_about__container__client__list .item:nth-child(2n) {
  margin-right: 20px;
 }
}
@media screen and (min-width: 640px) {
 #about .p_about__container__client__list .item:nth-child(5n) {
  margin-right: 0;
 }
}
#about .p_about__container__client__list .item img {
 width: 100%;
}