@charset "UTF-8";
:root {
   --base-width: 1440px;
   --inner-width: calc(var(--base-width) * 0.8333); /* 1200px */
}
.sp {
   display: none;
}
html {
   scroll-behavior: smooth;
}
body {
   font-family: "Noto Sans JP", sans-serif;
   font-optical-sizing: auto;
   font-weight: normal;
   font-style: normal;
   font-size:calc(var(--base-width) * 0.0111); /* 16px */
   box-sizing: border-box;
}
body > div {
   width:100%;
   margin:0 auto;
   max-width: var(--base-width);
}
img {
   width: 100%;
}
header nav ul li:hover,
.service_header ul li:hover,
.submitBtn:hover,
footer a:hover {
   opacity:0.8;
   transition: all 0.3s;
}
.innerWrap {
   width: var(--inner-width);
   margin:0 auto;
}
main > section:not(.fv) {
	padding:calc(var(--base-width) * 0.07) 0; /* 100px 0 */
}
main > section.service {
	padding:calc(var(--base-width) * 0.07) 0 1px; /* 100px 0 20px */
}
h1 {
   width: calc(var(--base-width) * 0.1777); /* 256px */
}
h2 {
   font-size:calc(var(--base-width) * 0.0555); /* 80px */
   letter-spacing: 0.1em;
   color:#E3E3E5;
   margin-bottom: calc(var(--base-width) * 0.0416); /* 60px */
   background-image: url(img/line01.svg);
   background-repeat: no-repeat;
   background-position: left center;
   font-family: "Jost","Noto Sans JP", sans-serif;
}
h2 span {
   display: block;
   width: var(--inner-width);
   margin:0 auto;
   transform: skewX(-8deg);
}
.fv {
   background-image: url(img/bg_fv.jpg);
   background-size: cover;
   width:100%;
   height:calc(var(--base-width) * 0.6388);
}
.fv header {
   display: flex;
   position: relative;
   justify-content: space-between;
   z-index:100;
}
.fv header nav {
   padding: calc(var(--base-width) * 0.0277) calc(var(--base-width) * 0.0138) 0 0; /* 40px 20px 0 0 */
   font-family: "Jost","Noto Sans JP", sans-serif;
}
.fv header nav.pc ul {
   display: flex;
   gap:calc(var(--base-width) * 0.0166); /* 24px */
}
.fv header nav.pc ul li a {
   display: inline-block;
   letter-spacing: 0.04em;
   line-height:calc(var(--base-width) * 0.0361); /* 52px */
}
.fv header nav.pc ul li.nav_contact {
   position:relative;
   border: 1px solid;
   border-image: linear-gradient(to right, #1197E3, #0A5DDC) 1;
   padding:0 calc(var(--base-width) * 0.0111) 0 calc(var(--base-width) * 0.0166); /* 0 16px 0 24px */
   background-color: #fff;
   margin-left:calc(var(--base-width) * 0.0111);
   width:calc(var(--base-width) * 0.1);
}
.fv header nav.pc ul li.nav_contact::before {
   content: "";
   width:calc(var(--base-width) * 0.1);
   height:calc(var(--base-width) * 0.0375);
   border: 1px solid;
   border-image: linear-gradient(to right, #1197E3, #0A5DDC) 1;
   position:absolute;
   top:3px;
   left:3px;
   z-index:-1;
}
.fv header nav.pc ul li.nav_contact span {
   display: inline-block;
   margin-right: calc(var(--base-width) * 0.0111);
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
}
.fv header nav.pc ul li.nav_contact img  {
   vertical-align: middle;
   margin-top:-2px;
   height: calc(var(--base-width) * 0.0097); /* 14px */
   width: calc(var(--base-width) * 0.0048); /* 7px */
}
.fv .fvCatch {
   display: flex;
   flex-flow: column;
   margin:calc(var(--base-width) * 0.0416) 0; /* 60px 0 */
   gap: calc(var(--base-width) * 0.0097); /* 14px */
}
.fv .fvCatch span {
   display: inline-block;
   position: relative;
   z-index: 1;
   font-weight: bold;
   font-size: calc(var(--base-width) * 0.0277); /* 40px */
   letter-spacing: 0.08em;
   text-align: left;
   padding:calc(var(--base-width) * 0.0069) 0.8em;
   color:#fff;
}
.fv .fvCatch span:nth-child(1) {
   width:8.1em;
}
.fv .fvCatch span:nth-child(2) {
   width:11.4em;
}
.fv .fvCatch span:nth-child(3) {
   width:6em;
}
.fv .fvCatch span::before {
   position: absolute;
   z-index: -1;
   top: 0; bottom: 0; left: 0; right: 0;
   transform: skewX(-12deg);
   content: "";
   background: linear-gradient(90deg, #1197E3, #0A5DDC);
}
.fv .fvSubCatch {
   font-size: calc(var(--base-width) * 0.0166); /* 24px */
   line-height: calc(var(--base-width) * 0.025); /* 36px */
   letter-spacing: 0.04em;
}
.about .innerWrap {
   display: flex;
   justify-content: space-between;
}
.about .innerWrap > section {
   margin-left: calc(var(--base-width) * 0.07); /* 100px */
}
.about .innerWrap > section p:first-child {
   font-size: calc(var(--base-width) * 0.0277); /* 40px */
   font-weight: bold;
   letter-spacing: 0.04em;
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   margin-bottom: calc(var(--base-width) * 0.0222); /* 32px */
}
.about .innerWrap > section p:last-child {
   width:calc(var(--base-width) * 0.3319);
   line-height: 2em;
   letter-spacing: 0.04em;
}
.about .innerWrap > p {
   width: calc(var(--base-width) * 0.3472); /* 500px */
   margin-top: calc((var(--base-width) * 0.0951) * -1 ); /* -137px */
}
.service {
   background-image: url(img/bg_service.svg);
   background-size: cover;
   padding-bottom: 0;
}
.service .innerWrap .service_header {
   display: flex;
   justify-content: space-between;
   margin-left: calc(var(--base-width) * 0.07); /* 100px */
   padding-bottom: calc(var(--base-width) * 0.0416);
}
.service .innerWrap .service_header > section:first-child {
   width: calc(var(--base-width) * 0.38); /* 540px */

}
.service .innerWrap .service_header > section:first-child h3 {
   color:#fff;
   font-size: calc(var(--base-width) * 0.0277); /* 40px */
   font-weight: bold;
   letter-spacing: 0.04em;
   line-height: 1.4em;
   margin-bottom: calc(var(--base-width) * 0.0222); /* 32px */
}
.service .innerWrap .service_header > section:first-child h3 span {
   display: inline-block;
}
.service .innerWrap .service_header > section:first-child p {
   color:#c8c8c8;
   line-height: 2em;
   letter-spacing: 0.04em;
   margin-bottom: calc(var(--base-width) * 0.0277); /* 40px */
}
.service .innerWrap .service_header ul li {
   background-color: #fff;
   width: calc(var(--base-width) * 0.1916); /* 276px */
   height: calc(var(--base-width) * 0.0347); /* 50px */
   border-radius: calc(var(--base-width) * 0.0173); /* 25px */
   margin-bottom: calc(var(--base-width) * 0.0083); /* 12px */
   box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.25);
}
.service .innerWrap .service_header ul li a{
   position:relative;
   display: block;
   width: 100%;
   height: 100%;
   border-radius: calc(var(--base-width) * 0.0173); /* 25px */
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   padding:calc((var(--base-width) * 0.0347 - var(--base-width) * 0.0111) / 2) 0;
   padding-left:2em;
}
.service .innerWrap .service_header ul li a img {
   position:absolute;
   top:45%;
   right:8%;
   width: calc(var(--base-width) * 0.0097); /* 14px */
   height: calc(var(--base-width) * 0.0048); /* 7px */
}
.service .innerWrap .service_header > section:nth-child(2) {
   width: calc(var(--base-width) * 0.3222); /* 464px */
   margin-right: calc(var(--base-width) * 0.01);
   text-align: center;
}
.service .innerWrap .service_header > section:nth-child(2) h3 {
   font-size: calc(var(--base-width) * 0.0166); /* 24px */
   padding-left: 1em;
   width:8em;
   margin:0 auto;
   background-image: url(img/line02.svg);
   background-repeat: no-repeat;
   background-position: left center;
}
.service .service_consulting > div {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   padding-bottom:calc(var(--base-width) * 0.0416); /* 60px */
}
.service .service_consulting > div > section {
   flex-basis: calc(var(--base-width) * 0.5138); /* 740px */
   flex-shrink: 0;
   background-color: #fff;
   margin-top: calc(var(--base-width) * 0.07); /* 100px */
   transform: translateX(calc((var(--base-width) * 0.165) * -1 ));
   padding:calc(var(--base-width) * 0.0381) calc(var(--base-width) * 0.0416); /* 55px 60px */
   box-shadow: calc(var(--base-width) * 0.0138) calc(var(--base-width) * 0.0138) 0px 0px rgba(0, 0, 0, 0.1);
}
.service .service_consulting > div > p {
   flex-basis: calc(var(--base-width) * 0.5694); /* 820px */
   flex-shrink: 0;
}
.service .service_consulting > div > section h3 {
   font-size: calc(var(--base-width) * 0.0222); /* 32px */
   font-weight: bold;
   letter-spacing: 0.04em;
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   margin-bottom: calc(var(--base-width) * 0.0222); /* 32px */
}
.service .service_consulting > div > section p {
   font-size: calc(var(--base-width) * 0.0138); /* 20px */
   line-height: 2em;
}
.service .service_sns > div {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   padding-bottom:calc(var(--base-width) * 0.0416); /* 60px */
}
.service .service_sns > div > section {
   flex-basis: calc(var(--base-width) * 0.5138); /* 740px */
   flex-shrink: 0;
   background-color: #fff;
   margin-top: calc(var(--base-width) * 0.07); /* 100px */
   transform: translateX(calc((var(--base-width) * 0.0833) ));
   padding:calc(var(--base-width) * 0.0381) calc(var(--base-width) * 0.0416); /* 55px 60px */
   box-shadow: calc((var(--base-width) * 0.0138) * -1) calc(var(--base-width) * 0.0138) 0px 0px rgba(0, 0, 0, 0.1);
   z-index: 100;
}
.service .service_sns > div > p {
   flex-basis: calc(var(--base-width) * 0.5694); /* 820px */
   transform: translateX(calc((var(--base-width) * 0.0833) * -1 )); /* 120px */
   flex-shrink: 0;
}
.service .service_sns > div > section h3 {
   font-size: calc(var(--base-width) * 0.0222); /* 32px */
   font-weight: bold;
   letter-spacing: 0.04em;
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   margin-bottom: calc(var(--base-width) * 0.0222); /* 32px */
}
.service .service_sns > div > section p {
   font-size: calc(var(--base-width) * 0.0138); /* 20px */
   line-height: 2em;
}
.service .service_issue {
   display: flex;
   justify-content: center;
   position: relative;
   margin-bottom: calc(var(--base-width) * 0.0347); /* 50px */
}
.service .service_issue::after {
   position:absolute;
   content:"";
   background-image: url(img/triangle.svg);
   width: calc(var(--base-width) * 0.0138); /* 20px */
   height:calc(var(--base-width) * 0.0104); /* 15px */
   background-size: contain;
   background-repeat: no-repeat;
   bottom:0;
}
.service .service_issue h4 {
   writing-mode: vertical-rl;
   font-size: calc(var(--base-width) * 0.0222); /* 32px */
   letter-spacing: 0.04em;
   color: #fff;
   font-weight: bold;
   background-image: url(img/line03.svg);
   background-repeat: no-repeat;
   background-position: center top;
   padding: 2em;
   margin-right:calc(var(--base-width) * 0.02);
}
.service .service_issue ul {
   font-size: calc(var(--base-width) * 0.0166); /* 24px */
   color: #c8c8c8;
   letter-spacing: 0.04em;
   line-height: 2.2em;
   margin-top:calc(var(--base-width) * 0.05);
}

.service .service_issue ul li {
   list-style-type: disc;
}
.service .service_features h4 {
   text-align: center;
   color: #fff;
   font-size: calc(var(--base-width) * 0.0222); /* 32px */
   letter-spacing: 0.04em;
   font-weight: bold;
   margin-bottom: calc(var(--base-width) * 0.0486); /* 70px */;
}
.service .service_features ul {
   position: relative;
   z-index: 100;
   display: flex;
   justify-content: space-between;
   text-align: center;
   width:var(--inner-width);
   margin:0 auto;
   margin-bottom: calc(var(--base-width) * 0.0486); /* 70px */;
}
.service .service_features ul li {
   position: relative;
   flex-basis: calc((var(--inner-width) - calc(var(--base-width) * 0.0222 *2)) / 3);
   padding:calc(var(--base-width) * 0.0125); /* 18px */
}
.service .service_features ul li::before,
.service .service_features ul li::after {
   position:absolute;
   left:0;
   top:0;
   width:100%;
   height:100%;
   z-index: -1;
   content: '';
   background-image: url(img/brackets.svg);
   background-repeat: no-repeat;
   background-size: contain;
}
.service .service_features ul li::after {
   transform: scale(-1, -1);
}
.service .service_features ul li div {
   position: relative;
   background-color: #fff;
   border: 1px solid;
   border-image: linear-gradient(to right, #1197E3, #0A5DDC) 1;
   padding:calc(var(--base-width) * 0.027) calc(var(--base-width) * 0.0166); /* 39px 24px */
   height:100%;
}
.service .service_features ul li div span.service_point,
.service .service_features ul li div span.service_point span {
   display:block;
   color:#BBC3E2;
   transform: skewX(-4deg);
}
.service .service_features ul li div span.service_point {
   font-size: calc(var(--base-width) * 0.0083); /* 12px */
   letter-spacing: 0.04em;
   position: absolute;
   width:100%;
   top: calc((var(--base-width) * 0.024) * -1);
   left:0;
}
.service .service_features ul li div span.service_point span {
   font-size: calc(var(--base-width) * 0.0277); /* 40px */
   margin-top: calc((var(--base-width) * 0.0034) * -1); /* -5px */
}
.service .service_features ul li div h5 {
   font-size: calc(var(--base-width) * 0.0166); /* 24px */
   font-weight: bold;
   letter-spacing: 0.04em;
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   margin-bottom: calc(var(--base-width) * 0.0138); /* 20px */
}
.service .service_features ul li div p {
   line-height: 2em;
   letter-spacing: 0.04em;
   text-align: left;
}
.voice .innerWrap {
   width: calc(var(--base-width) * 0.625); /* 900px */
}
.voice .innerWrap > section {
   display: flex;
   justify-content: space-between;
   margin-bottom: calc(var(--base-width) * 0.0277); /* 40px */
}
.voice .innerWrap > section:nth-child(2) {
   flex-flow: row-reverse;
}
.voice .innerWrap > section > section {
   flex-basis: calc(var(--base-width) * 0.3347); /* 482px */
}
.voice .innerWrap > section > p {
   flex-basis: calc(var(--base-width) * 0.243); /* 350px */
}
.voice .innerWrap > section > section h3 {
   font-size: calc(var(--base-width) * 0.0166); /* 24px */
   letter-spacing: 0.04em;
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   margin-bottom: calc(var(--base-width) * 0.0138); /* 20px */
}
.voice .innerWrap > section > section p {
   line-height: 2em;
   letter-spacing: 0.04em;
}
.voice .innerWrap > section > section p:last-child {
   text-align: right;
}
.flow {
   background: linear-gradient(90deg, #1197E3, #0A5DDC);
}
.flow .innerWrap {
   width: calc(var(--base-width) * 0.89375); /* 1287px */
   padding-left: calc(var(--base-width) * 0.0222); /* 32px */
   padding-right: calc(var(--base-width) * 0.0381); /* 55px */
   background-image: url(img/bg_flow.svg);
   background-size: contain;
   background-repeat: no-repeat;
   background-position: left top;
}
.flow .innerWrap ul {
   display: flex;
   justify-content: space-between;
   padding-top: calc(var(--base-width) * 0.05); /* 72px */
}
.flow .innerWrap ul li {
   position: relative;
   flex-basis: calc((var(--inner-width) - calc(var(--base-width) * 0.0222 * 4)) / 5);
   padding:calc(var(--base-width) * 0.0125); /* 18px */
   background-color: #fff;
   box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.25);
}
.flow .innerWrap ul li > p {
   transform: skewX(-4deg);
   position:absolute;
   width: 100%;
   text-align: center;
   left:0;
   top:calc((var(--base-width) * 0.0381) * -1); /* -55px */
   color:#fff;
   font-size: calc(var(--base-width) * 0.0138); /* 20px */
}
.flow .innerWrap ul li > p span {
   font-size: calc(var(--base-width) * 0.0347); /* 50px */
}
.flow .innerWrap ul li div h3 {
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   height:2.4em;
   font-size: calc(var(--base-width) * 0.0166); /* 24px */
   letter-spacing: 0.04em;
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   margin-bottom: calc(var(--base-width) * 0.0138); /* 20px */
}
.flow .innerWrap ul li div p {
   letter-spacing: 0.04em;
   line-height: 2em;
}


.faq .innerWrap {
   width: calc(var(--base-width) * 0.4055); /* 584px */
}
.faq .accordion {
   width: 100%;
   margin-top:calc((var(--base-width) * 0.1) * -1); /* 144px */
}
.faq .toggle {
	display: none;
}
.faq .faqContainer {
	position: relative;
	margin-bottom: calc(var(--base-width) * 0.0138); /* 20px */
}
.faq .question,.faq .anser {
	transform: translateZ(0);
	transition: all 0.3s ease-out;
}
.faq .question {
	border-bottom: solid 1px #E3E3E5;
	padding: calc(var(--base-width) * 0.0034) 0 calc(var(--base-width) * 0.0138);
	display: flex;
   align-items: center;
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   font-size: calc(var(--base-width) * 0.0138); /* 20px */
}
.faq .anser {
	max-height: 0;
	overflow: hidden;
   font-size: calc(var(--base-width) * 0.0138); /* 20px */
}
.faq .anser div span {
   display: inline-block;
   transform: translateY(calc(var(--base-width) * 0.0034));
}
.faq .question span,.faq .anser span {
   font-size: calc(var(--base-width) * 0.0277); /* 40px */
   font-family: "Jost","Noto Sans JP", sans-serif;
   margin-right: calc(var(--base-width) * 0.0166); /* 24px */
}
.faq .question:after {
	content: "";
	position: absolute;
	right: calc(var(--base-width) * 0.0138);
	top: 0;
   bottom: 0;
   margin: auto;
	width: calc(var(--base-width) * 0.0138);
	height: calc(var(--base-width) * 0.0138);
	background-image: url(img/triangle2.svg);
   background-size: contain;
   background-repeat: no-repeat;
	transition: all 0.3s;
}
.faq .anser div {
	margin: 0;
	padding: calc(var(--base-width) * 0.0277) calc(var(--base-width) * 0.0166);
	line-height: 1.8;
}
.faq .toggle:checked + .question + .anser {
	max-height: 500px;
	transition: all 1.5s;
}
.faq .toggle:checked + .question:after {
	transform: rotate(180deg) !important;
   transform-origin:50% 35% 0;
}

.contact {
   background: linear-gradient(90deg, #1197E3, #0A5DDC);
}
.contact .innerWrap {
   width: calc(var(--base-width) * 0.6794); /* 892px */
   color:#fff;
   letter-spacing: 0.04em;
}
.contact .innerWrap > p {
   width:calc(var(--base-width) * 0.3263); /* 470px */
   letter-spacing: 0.04em;
   margin:0 auto;
   line-height: 1.8;
   margin-bottom:calc(var(--base-width) * 0.0173); /* 25px */
}
.contact .innerWrap form .formParts {
   display: flex;
   padding-bottom:calc(var(--base-width) * 0.0173); /* 25px */
   margin-bottom:calc(var(--base-width) * 0.0173); /* 25px */
   border-bottom: 1px solid #fff;
}
.contact .innerWrap form .formTextarea {
    border-bottom: none;
}
.contact .innerWrap form .formParts p.formSubject {
   flex-basis: 30%;
   padding-top: 0.5em;
}
.contact .innerWrap form .formParts p.formSubject span {
   font-size:calc(var(--base-width) * 0.0083); /* 12px */
   padding-left: 1em;
}
.contact .innerWrap form .formParts p.formContents {
   flex-basis: 70%;
}
.contact .innerWrap form .formParts p.formContents input[type="text"],
.contact .innerWrap form .formParts p.formContents input[type="email"],
.contact .innerWrap form .formParts p.formContents textarea {
   background-color: #fff;
   width: 100%;
   height:2.5em;
   color:#000;
}
.contact .innerWrap form input[type="checkbox"] {
   position: relative;
   width:calc(var(--base-width) * 0.0138); /* 20px */
   height:calc(var(--base-width) * 0.0138); /* 20px */
   vertical-align:calc(var(--base-width) * 0.0027 * -1 );
   margin-right:0.8em;
   background-color: #fff;
   -webkit-appearance: none;
      -moz-appearance: none;
           appearance: none;
 }
 
 .contact .innerWrap form input[type="checkbox"]:checked:before {
   position: absolute;
   top: 0;
   left:calc(var(--base-width) * 0.0041);
   transform: rotate(50deg);
   width:calc(var(--base-width) * 0.0055);
   height:calc(var(--base-width) * 0.0111);
   border-right: calc(var(--base-width) * 0.0020) solid #0A5DDC;
   border-bottom: calc(var(--base-width) * 0.0020) solid #0A5DDC;
   content: '';
 }
.contact .innerWrap form .formParts .formCb span {
   display: inline-block;
   margin-right: 3em;
}
.contact .innerWrap form .formParts p.formContents textarea {
   height:10em;
}
.contact .innerWrap form .privacy {
   text-align: center;
   margin-bottom:2.5em;
}
.contact .innerWrap form .submitBtn {
   position: relative;
   background-color: #fff;
   width: calc(var(--base-width) * 0.1916); /* 276px */
   height: calc(var(--base-width) * 0.0416); /* 60px */
   border-radius: calc(var(--base-width) * 0.0208); /* 30px */
   margin-bottom: calc(var(--base-width) * 0.0083); /* 12px */
   box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.25);
   margin:0 auto;
   text-align: center;
}
.contact .innerWrap form .submitBtn::after {
   position: absolute;
   content: '';
   right:8%;
   top:45%;
   width: calc(var(--base-width) * 0.0097); /* 14px */
   height: calc(var(--base-width) * 0.0048); /* 7px */
   background-image: url(img/arrow2.svg);
   background-repeat: no-repeat;
   background-size: contain;
}
.contact .innerWrap form .submitBtn input{
   position:relative;
   display: block;
   width: 100%;
   height: 100%;
   border-radius: calc(var(--base-width) * 0.0173); /* 25px */
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   padding:calc((var(--base-width) * 0.0416 - var(--base-width) * 0.0138) / 2) 0;
   font-size: calc(var(--base-width) * 0.0138); /* 20px */
}
.company h2 {
   width:calc(var(--base-width) * 0.3194); /* 460px */
   margin:0 auto calc(var(--base-width) * 0.0416);
   transform: skewX(-8deg);
   background-image: none;
}
.company .innerWrap dl {
   width:calc(var(--base-width) * 0.3194); /* 460px */
   margin:0 auto;
   display: flex;
   flex-wrap: wrap;
   line-height: 2em;
   letter-spacing: 0.04em;
}
.company .innerWrap dl dt {
   width: 33%;
   font-weight: normal;
   padding:0.2em 0 0.2em 4em;
   border-right:1px solid #000;
   margin-bottom: calc(var(--base-width) * 0.0166); /* 24px */
}
.company .innerWrap dl dd {
   width: 67%;
   padding:0.2em 0 0.2em 2em;
   margin-bottom: calc(var(--base-width) * 0.0166); /* 24px */
}



footer{
   background: linear-gradient(90deg, #1197E3, #0A5DDC);
   text-align: center;
   color: #fff;
   padding:calc(var(--base-width) * 0.0138) 0; /* 20px 0 */
   font-family: "Jost","Noto Sans JP", sans-serif;
   letter-spacing: 0.04em;
}
footer .innerWrap > nav,
footer .innerWrap > p {
   margin-bottom:calc(var(--base-width) * 0.0222) ;

}
footer .innerWrap .footer_logo {
   width: calc(var(--base-width) * 0.1388); /* 200px */
   margin:0 auto;
   margin-bottom:calc(var(--base-width) * 0.01) ;
}
footer .innerWrap nav ul {
   display: flex;
   justify-content: center;
}
footer .innerWrap nav ul li {
   margin:0 calc(var(--base-width) * 0.0069);
}
footer .innerWrap .footer_privacy {
   border-bottom: 1px solid #fff;
   padding-bottom:calc(var(--base-width) * 0.0222) ;
}
footer .innerWrap .footer_privacy span {
   cursor: pointer;
}

@media screen and ( max-width:1440px) {
   :root {
      --base-width: 100vw;
   }
}

@media screen and (min-width:769px) and ( max-width:1200px) {
   :root {
      --base-width: 100vw;
      --inner-width: calc(var(--base-width) * 0.9);
   }
   h2 span{
      width: calc(var(--base-width) * 0.8);
   }
}
@media screen and (min-width:769px) and ( max-width:1000px) {
   :root {
      --base-width: 100vw;
      --inner-width: calc(var(--base-width) * 0.95);
   }
   h2 span{
      width: calc(var(--base-width) * 0.78);
   }
   .flow .innerWrap {
      width: calc(var(--base-width) * 0.95);
   }
   .voice .innerWrap {
      width: calc(var(--base-width) * 0.8);
   }
   .voice .innerWrap > section > section {
      flex-basis: calc(var(--base-width) * 0.3347 * 1.4);
   }
   .voice .innerWrap > section > p {
      flex-basis: calc(var(--base-width) * 0.243 * 1.4);
   }
   .voice .innerWrap > section > section h3 {
      font-size: calc(var(--base-width) * 0.0166 * 1.2);
   }
   .voice .innerWrap > section > section p {
      font-size: calc(var(--base-width) * 0.0111 *1.2);
   }
}
@media screen and ( max-width:768px) {
   .pc {
      display: none;
   }
   .sp {
      display: block;
   }
   :root {
      --base-width: 100vw;
      --inner-width: calc(var(--base-width) * 0.83);
   }
   h2 {
      font-size: 10.66vw;
      background-position: left 0 center;
      background-size: 6vw 1px ;
   }
   .fv {
      background-image: url(img/bg_fv_sp.jpg);
      background-size: cover;
      height:177.86vw;
   }
   .fv header h1 {
      width:24vw;
   }
   .fv header nav.pc {
      display: none;
   }
   .fv .fvCatch {
      margin-top: 70vw;
   }
   .fv .fvCatch span {
      font-size: 8vw;
      letter-spacing: 0.08em;
      padding: calc(var(--base-width) * 0.0069) 0.4em;
   }
   .fv .fvCatch span:nth-child(1) {
      width:7.5em;
   }
   .fv .fvCatch span:nth-child(2) {
      width:10.7em;
   }
   .fv .fvCatch span:nth-child(3) {
      width:5.5em;
   }
   .fv .fvSubCatch {
      font-size: 4.26vw;
      line-height: 1.6;
   }
   .fv .fvSubCatch span {
      display: inline-block;
   }
   .about .innerWrap {
      flex-flow: column-reverse;
   }
   .about .innerWrap > p {
      width: 100%;
      margin-top: 0;
      margin-bottom: 5vw;
   }
   .about .innerWrap > section {
      margin-left: 0;
   }
   .about .innerWrap > section p:first-child {
      font-size: 7.46vw;
      line-height: 1.5;
   }
   .about .innerWrap > section p:first-child span {
      display: inline-block;
   }
   .about .innerWrap > section p:last-child {
      width: 100%;
      font-size: 3.73vw;
      line-height: 2em;
   }
   .service {
      background-image: none;
      background: linear-gradient(90deg, #1197E3, #0A5DDC);
   }
   .service .innerWrap .service_header > section:first-child {
      width: 100%;
   }
   .service .innerWrap .service_header {
      flex-flow: column;
      margin-left: 0;
   }
   .service .innerWrap .service_header > section:first-child h3 {
      font-size: 7.46vw;
      line-height: 1.4em;
   }
   .service .innerWrap .service_header > section:first-child p {
      font-size: 3.73vw;
      color: #c8c8c8;
      line-height: 2em;
      letter-spacing: 0.04em;
      margin-bottom: 5vw;
   }
   .service .innerWrap .service_header > section:nth-child(2) {
      width: 100%;
      margin-right: 0;
   }
   .service .innerWrap .service_header > section:nth-child(2) h3 {
      font-size: 4.8vw;
      color: #fff;
      background-image: url(img/line02_sp.svg);
      background-size: 3.2vw 100%;
      margin-bottom: 2vw;
   }
   .service .innerWrap .service_header > section:nth-child(2) p {
      width: 60vw;
      margin: 0 auto 5vw;
   }
   .service .innerWrap .service_header ul li {
      width: 100%;
      height: 13.33vw;
      border-radius: 5.96vw;
      margin-bottom: 4vw;
   }
   .service .innerWrap .service_header ul li a{
      text-align: left;
      font-size:4.8vw;
      padding:4vw 0;
      padding-left:2em;
   }
   .service .innerWrap .service_header ul li a img {
      top:45%;
      right:8%;
      width: 4.26vw;
      height: 1.86vw;
   }
   .service .service_consulting > div {
      flex-flow: column;
      align-items: flex-start;
   }
   .service .service_consulting > div > section {
      flex-basis: 100%;
      width: var(--inner-width);
      margin:-10vw auto 0;
      transform: translateX(0);
      padding:4vw 6vw;
   }
   .service .service_consulting > div > section h3 {
      font-size: 5.86vw;
   }
   .service .service_consulting > div > section p {
      font-size: 3.73vw;
   }
   .service .service_issue {
      flex-flow: column;
      margin-bottom: 4vw;
   }
   .service .service_issue h4 {
      writing-mode:horizontal-tb;
      text-align: center;
      font-size: 5.86vw;
      background-image: none;
      margin-right: 0;
      padding:2vw;
   }
   .service .service_issue ul {
      font-size: 3.73vw;
      line-height: 2.2em;
      width: 74vw;
      margin:0 auto 4vw;
  }
  .service .service_issue::after {
      position: absolute;
      content: "";
      background-image: url(img/triangle.svg);
      width: 100%;
      height: 2.4vw;
      background-size: 2.4vw;
      background-position:center top;
      bottom: 0;
   }
  .service .service_features h4 {
      font-size: 5.86vw;
   }
   .service .service_features ul {
      flex-flow: column;
      margin-bottom: calc(var(--base-width) * 0.0486);
      gap:5vw;
   }
   .service .service_features ul li {
      flex-basis: 75vw;
      padding: 4vw;
   }
    .service .service_features ul li div {
      padding: 6vw;
   }
   .service .service_features ul li div h5 {
      font-size: 5.4vw;
      margin-bottom: 3.5vw;
   }
   .service .service_features ul li div h5 span {
      display: inline-block;
   }
   .service .service_features ul li div p {
      font-size: 3.73vw;
      line-height: 2em;
  }
  .service .service_features ul li div span.service_point {
     font-size: 2.5vw;
     top: -7vw;
  }
  .service .service_features ul li div span.service_point span {
     font-size: 8.36vw;
     margin-top: -1vw; /* -5px */
  }
  .service .service_sns > div {
      flex-flow: column-reverse;
      padding-bottom: calc(var(--base-width) * 0.0416);
   }
   .service .service_sns > div > p {
      transform: translateX(0);
   }

   .service .service_sns > div > section {
      flex-basis: 100%;
      width: var(--inner-width);
      margin:-10vw auto 0;
      transform: translateX(0);
      padding:4vw 6vw;
   }
   .service .service_sns > div > section h3 {
      font-size: 5.86vw;
   }
   .service .service_sns > div > section p {
      font-size: 3.73vw;
   }
   .voice .innerWrap > section {
      flex-flow: column-reverse;
      margin-bottom:10vw;
   }
   .voice .innerWrap > section:nth-child(2) {
      flex-flow: column-reverse;
   }
   .voice .innerWrap {
      width: var(--inner-width);
   }
   .voice .innerWrap > section > section h3 {
      font-size: 5.5vw;
      line-height: 1.8em;
      margin-bottom: 4vw;
   }
   .voice .innerWrap > section > section p {
      font-size:3.73vw;
   }
   .voice .innerWrap > section > p {
      margin-bottom: 4vw;
   }
   .flow .innerWrap {
      width: var(--inner-width);
      padding-left: 0;
      padding-right: 0;
      background-image: url(img/bg_flow_sp.svg);
      background-position: center top;
   }
   .flow .innerWrap ul {
      flex-flow: column;
      gap:12vw;
      padding: 12vw 0 20vw;
   }
   .flow .innerWrap ul li {
      flex-basis: 50vw;
      padding:4vw 6vw;
   }
   .flow .innerWrap ul li div h3 {
      font-size: 5.86vw;
      margin-bottom: calc(var(--base-width) * 0.0138);
   }
   .flow .innerWrap ul li div p {
      font-size:3.73vw;
   }
   .flow .innerWrap ul li > p {
      top: -10vw;
      font-size:3.73vw;
   }
   .flow .innerWrap ul li > p span {
      font-size: 9.6vw;
   }
   .faq .innerWrap {
      width: var(--inner-width);
   }
   .faq .accordion {
      margin-top: 0;
   }
   .faq .faqContainer {
      margin-bottom: 0;
  }
   .faq .question {
      border-bottom: solid 1px #E3E3E5;
      padding: 0;
      display: flex;
      align-items: center;
      font-size:3.73vw;
      line-height: 1.8;
   }
   .faq .anser div {
      font-size:3.73vw;
      margin: 0;
      padding: calc(var(--base-width) * 0.0277) calc(var(--base-width) * 0.0166);
      line-height: 1.8;
  }
   .faq .question span, .faq .anser span {
      font-size: 6.4vw;
      margin-right: 4vw;
   }
   .faq .question:after {
      width: 2.5vw;
      height: 4.26vw;
   }
   .contact .innerWrap {
      width: var(--inner-width);
      font-size: 4.26vw;
   }
   .contact .innerWrap > p {
      width: 100%;
      font-size: 3.73vw;
      margin-bottom: calc(var(--base-width) * 0.0173);
   }
   .contact .innerWrap form .formParts {
      flex-flow: column;
      padding-bottom: calc(var(--base-width) * 0.0173);
      margin-bottom: calc(var(--base-width) * 0.0173);
      border-bottom: none;
   }
   .contact .innerWrap form .formParts p {
      width: 100%;
   }
   .contact .innerWrap form .formParts p.formSubject {
      margin-bottom: 0.8vw;
   }
   .contact .innerWrap form .formParts p.formSubject span {
      font-size: 2vw;
   }
   .contact .innerWrap form .formParts .formCb {
      display: flex;
      flex-flow: column;
      margin-top:1vw;
   }
   .contact .innerWrap form .formParts .formCb span {
      margin-bottom: 2vw;
   }
   .contact .innerWrap form input[type="checkbox"] {
      width:8vw;
      height:8vw;
      vertical-align:-2.47vw;
      margin-right:0.8em;
    }
    .contact .innerWrap form input[type="checkbox"]:checked:before {
      top: 0;
      left:2.4vw;
      width:3vw;
      height:6vw;
      border-right: 0.8vw solid #0A5DDC;
      border-bottom: 0.8vw solid #0A5DDC;
    }
   .contact .innerWrap form .privacy {
      font-size: 3.73vw;
   }
   .contact .innerWrap form .submitBtn {
      width: 100%;
      height: 13.33vw;
      border-radius: 6.66vw;
   }
   .contact .innerWrap form .submitBtn::after {
      right:8%;
      top:45%;
      width: 3.2vw;
      height: 1.4vw;
   }
   .contact .innerWrap form .submitBtn input{
      padding:calc((var(--base-width) * 0.0416 - var(--base-width) * 0.0138) / 2) 0;
      font-size: 4.26vw;
   }
   .company h2 {
      width: var(--inner-width);
      margin: 0 auto calc(var(--base-width) * 0.0416);
      text-align: center;
  }
  .company .innerWrap dl {
      width: 100%;
      font-size: 4.26vw;
   }
   .company .innerWrap dl dt {
      padding: 0.2em 0 0.2em 0.5em;
   }
   .company .innerWrap dl dd {
      padding: 0.2em 0 0.2em 0.8em;
   }
   footer .innerWrap {
      font-size: 4.26vw;
   }
   footer .innerWrap .footer_logo {
      width: 27.73vw;
      margin-bottom: 6vw;
   }
   footer .innerWrap nav ul {
      flex-flow: column;
      gap:1em;
   }
   footer .innerWrap > nav, footer .innerWrap > p {
      margin-bottom: 6vw;
   }
   footer .innerWrap .footer_privacy {
      border-bottom: 2px solid #fff;
      padding-bottom: 3vw;
   }
}

/* jsでの要素の表示アニメーション */
.fade-in {
   opacity: 0;
   transform: translate(0, 50px);
   transition-duration: 1000ms;
   transition-delay: 250ms;
   transition-property: opacity, transform;
}
.scroll-in {
   opacity: 1;
   transform: translate(0, 0);
}

/* ハンバーガーメニュー（ボタン） */
.menu-btn {
   position: fixed;
   top: 6.13vw;
   right: 10.66vw;
   display: flex;
   height: 32px;
   width: 32px;
   justify-content: center;
   align-items: center;
   z-index: 90;
}
.menu-btn span {
   content: '';
   display: block;
   height: 1px;
   width: 32px;
   position: absolute;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
   content: '';
   display: block;
   height: 2px;
   width: 32px;
   background: linear-gradient(90deg, #1197E3, #0A5DDC);
   position: absolute;
   transition: all 0.5s;
}
.menu-btn span:before {
   bottom: 10px;
}
.menu-btn span:after {
   top: 10px;
}
#menu-btn-check:checked ~ .menu-btn span {
   background: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}
#menu-btn-check:checked ~ .menu-btn span::before {
   bottom: 0;
   transform: rotate(45deg);
   transition: all 0.5s;
}
#menu-btn-check:checked ~ .menu-btn span::after {
   top: 0;
   transform: rotate(-45deg);
   transition: all 0.5s;
}
#menu-btn-check:checked ~ .bodyCover {
   display: block;
}
/* ハンバーガーメニュー（ナビゲーションコンテンツ） */
.menu-content {
   width: 100vw;
   height: 100vh;
   overflow: scroll;
   position: fixed;
   left: 100%;
   z-index: 80;
   background-color: rgba(255, 255, 255, 0.9);
   transition: all 0.5s;/*アニメーション設定*/
}
.menu-content ul {
   padding-top: 20vw;
}
.menu-content ul li {
   text-align: center;
   font-size:5.866vw;
   list-style: none;
   letter-spacing: .04em;
   margin-bottom:2em;
 }
.menu-content ul li a {
   display: block;
   width: 100%;
   text-decoration: none;
   position: relative;
}
.menu-content ul li.nav_contact {
  width:83vw;
  background-color: #fff;
  margin:0 auto;
  height: 13.33vw;
  border-radius: 6.66vw;
  box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.25);
}
.menu-content ul li.nav_contact a {
   position:relative;
   display: block;
   height: 13.33vw;
   background: linear-gradient(90deg, #1197E3 0%, #0A5DDC 100%);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
}
.menu-content ul li.nav_contact a span {
   display: inline-block;
   padding-top:3.5vw;
}
.menu-content ul li.nav_contact a img {
   position:absolute;
   top:45%;
   right:8%;
   width: 4.26vw;
   height: 1.86vw;
}
.menu-content ul li ul {
   padding: 0 25px 0 calc(1em + 15px) ;
}
#menu-btn-check:checked ~ .menu-content {
   left: 0;
}
#menu-btn-check {
   display: none;
}

/************************** モーダル **************************/
 .modal{
   position: fixed;
   top: 0;
   left: 0;
   width: 100vw;
   height: 100vh;
   text-align: center;
   background: rgba(0,0,0,50%);
   padding: 40px 20px;
   opacity: 0;
   visibility: hidden;
   transition: .5s;
   box-sizing: border-box;
   font-size: 12px;
 }
 
 .modal:before{
   content: "";
   display: inline-block;
   vertical-align: middle;
   height: 100%;
   margin-left: -0.2em;
 }
 
 .modal.is-active{
   opacity: 1;
   visibility: visible;
   z-index:1000;
 }
 
 .modal-container{
   position: relative;
   display: inline-block;
   vertical-align: middle;
   max-width: 600px;
   width: 90%;
 }
 
 .modal-close{
   position: absolute;
   display: flex;
   align-items: center;
   justify-content: center;
   top: -20px;
   right: -20px;
   width: 40px;
   height: 40px;
   color: #fff;
   background: #000;
   border-radius: 50%;
   cursor: pointer;
 }
 
 .modal-content{
   background: #fff;
   text-align: left;
   line-height: 1.8;
   padding: 20px;
   height: 90vh;
   overflow-y: scroll;
 }
 
 .modal-content h2 {
   text-align: center;
   font-size: 16px;
   color:#000;
   margin: 2em 0;
   font-weight: bold;
 }

 .modal-content h3{
   margin: 1em 0;
   font-weight: bold;
 }
 .modal-content p{
   margin: 1em 0;
 }
 .modal-content > ul {
   list-style-type: decimal;
   margin-left: 1.2em;
 }
 .modal-content > ul > li > ul {
   list-style-type: lower-alpha;
   margin-left: 2em;
 }
 .modal-content > ul > li > ul li > ul {
   list-style-type: lower-roman;
   margin-left: 2em;
 }