@charset "UTF-8";
.style__h1 {
  background-image: url("../img/service_for_companies/service_for_companies_h1_bg_sp.webp");
}

@media only screen and (min-width: 561px) {
  .style__h1 {
    background-image: url("../img/service_for_companies/service_for_companies_h1_bg.webp");
  }
}

#lead {
  padding: 60px 0 80px;
}

#lead h2.ttl {
  font-size: 30px;
  line-height: 54px;
}

#lead h2.ttl .fzb {
  font-size: 36px;
  color: #2B4CA3;
}

#lead .set1 {
  margin-top: 30px;
}

#lead .set2 {
  margin-top: 40px;
}

#lead .set2 dl {
  padding: 20px;
  box-sizing: border-box;
  background: #2B4CA3;
  border-radius: 5px;
  text-align: center;
  color: #fff;
}

#lead .set2 dl.blue {
  background: linear-gradient(45deg, #4264B9, #3A58A5);
}

#lead .set2 dl.blue dd a {
  color: #3A58A5;
}

#lead .set2 dl.red {
  background: linear-gradient(45deg, #E25152, #CB4647);
}

#lead .set2 dl.red dd a {
  color: #CB4647;
}

#lead .set2 dl.green {
  background: linear-gradient(45deg, #80B47B, #618B5E);
}

#lead .set2 dl.green dd a {
  color: #529A4D;
}

#lead .set2 dl + dl {
  margin-top: 25px;
}

#lead .set2 dl dt {
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 30px;
}

#lead .set2 dl dd {
  display: flex;
  column-gap: 10px;
  margin-top: 20px;
}

#lead .set2 dl dd a {
  flex: 1 1 50%;
  min-height: 95px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 5px 15px;
  box-sizing: border-box;
  background: #fff;
  border: 0;
  border-radius: 5px;
  font-weight: 700;
  text-align: center;
  position: relative;
}

#lead .set2 dl dd a::before {
  content: '';
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  transform: translateX(-50%) rotate(45deg);
  position: absolute;
  bottom: 10px;
  left: 50%;
}

@media only screen and (min-width: 561px) {
  #lead .set2 {
    display: flex;
    justify-content: center;
    column-gap: 20px;
  }
  #lead .set2 dl + dl {
    margin-top: 0;
  }
  #lead .set2 dl dt {
    font-size: 23px;
  }
  #lead .set2 dl dd a {
    flex-basis: 130px;
    width: 130px;
    min-height: 75px;
    padding: 5px 5px 15px;
    font-size: 14px;
    line-height: 21px;
  }
  #lead .set2 dl dd a::before {
    width: 8px;
    height: 8px;
    bottom: 10px;
  }
}

#strength {
  padding: 80px 0;
  background: #EEF3F9;
}

#strength .set-style {
  margin-top: 40px;
  padding: 40px 30px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, 0.04);
}

#strength .set-style .set-style__ttl {
  margin-bottom: 25px;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.5;
}

#strength .set-style .set-style__ttl small {
  font-size: 18px;
  color: #03499B;
}

#strength .set-style .set-style__imgbox {
  margin-top: 30px;
}

@media only screen and (min-width: 561px) {
  #strength .wrap {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
  }
  #strength .set-style {
    display: flex;
    justify-content: space-between;
    column-gap: 20px;
    margin-top: 60px;
    padding: 40px 60px;
    box-shadow: 0px 3px 16px 0 rgba(0, 0, 0, 0.04);
  }
  #strength .set-style .set-style__ttl small {
    font-size: 15px;
  }
  #strength .set-style .set-style__imgbox {
    flex: 1 1 55%;
    max-width: 540px;
    margin-top: 0;
  }
  #strength .set-style .set-style__imgbox img {
    max-width: 100%;
    height: auto;
  }
  #strength .set-style .set-style__txtbox {
    flex: 1 1 45%;
    max-width: 440px;
  }
  #strength .set-style--reverse {
    flex-direction: row-reverse;
  }
}

#contact {
  padding: 60px 0;
  background: url("../img/service_for_companies/service_for_companies_bgi1_sp.webp") center/cover no-repeat;
  color: #fff;
}

#contact h2.ttl {
  font-size: 35px;
  line-height: 60px;
  letter-spacing: 0.05em;
}

#contact h2.ttl small {
  display: inline-block;
  font-size: 18px;
  line-height: 24px;
  letter-spacing: 0.05em;
}

#contact a.style__button {
  margin-top: 30px;
}

@media only screen and (min-width: 561px) {
  #contact {
    padding: 45px 0;
  }
  #contact h2.ttl {
    font-size: 40px;
  }
  #contact h2.ttl small {
    font-size: 24px;
    line-height: 39px;
  }
  #contact a.style__button {
    margin-top: 20px;
    min-width: 300px;
    font-size: 24px;
    padding: 23px 0;
  }
}

#service {
  padding: 80px 0;
}

#service .service {
  padding: 30px 20px;
  box-sizing: border-box;
  background: #fff;
}

#service .service + .service {
  margin-top: 30px;
}

#service .service .service__ttl {
  margin-bottom: 20px;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  font-size: 26px;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--color);
}

#service .service .service__imgbox {
  max-width: max-content;
  margin: 30px auto 0;
  border: 1px solid #D9D9D9;
  text-align: center;
}

#service .service .service__caption {
  margin-bottom: 20px;
  font-weight: 700;
  font-size: 16px;
  line-height: 30px;
  letter-spacing: 0.05em;
  color: var(--color);
}

#service .service .service__list {
  display: flex;
  justify-content: center;
  column-gap: 30px;
  margin-top: 30px;
  isolation: isolate;
}

#service .service .service__list li {
  display: flex;
  position: relative;
  width: 43px;
}

#service .service .service__list li::before {
  content: '';
  width: 80px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 76 16.328'%3E%3Cg transform='translate(-368 -3600.672)'%3E%3Crect width='62' height='5' transform='translate(368 3612)' fill='%23b4ebff'/%3E%3Cpath d='M0-4.328,25,12H0Z' transform='translate(419 3605)' fill='%23b4ebff'/%3E%3C/g%3E%3C/svg%3E") 0 0/contain no-repeat;
  position: absolute;
  top: 15px;
  left: 0;
}

#service .service .service__list li:last-child::before {
  display: none;
}

#service .service .service__list li:nth-child(1) {
  --index: 1;
}

#service .service .service__list li:nth-child(2) {
  --index: 2;
}

#service .service .service__list li:nth-child(3) {
  --index: 3;
}

#service .service .service__list li:nth-child(4) {
  --index: 4;
}

#service .service .service__list li:nth-child(5) {
  --index: 5;
}

#service .service .service__list li:nth-child(6) {
  --index: 6;
}

#service .service .service__list li:nth-child(n) {
  z-index: calc(var(--index) * -1);
}

#service .service .service__list li small {
  font-weight: 700;
  font-size: 12px;
  line-height: 15px;
  letter-spacing: 0.05em;
  color: var(--color);
  transform: translateX(150%);
  position: absolute;
  top: 40px;
  right: 0;
  z-index: 1;
}

#service .service .service__list li > span {
  min-height: 186px;
  display: block;
  padding: 20px 12px;
  background: var(--color);
  font-weight: 700;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 0.15em;
  color: #fff;
  position: relative;
  z-index: 1;
}

#service .service .service__list li.two-rows {
  width: 63px;
}

#service .services {
  margin-top: 40px;
  padding: 30px;
  box-sizing: border-box;
  border-radius: 5px;
}

#service .services--blue {
  --color: #3A58A5;
  background: linear-gradient(45deg, #EAF1F9, #C2D9EF);
}

#service .services--red {
  --color: #CB4647;
  background: linear-gradient(45deg, #FCF2F2, #EDB9B9);
}

#service .services--red .service__list li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 70.648 15.473'%3E%3Cg transform='translate(-0.137)'%3E%3Crect width='58' height='5' transform='translate(0.137 10.473)' fill='%23ffdfb4'/%3E%3Cpath d='M0-4.328,23.284,10.879H0Z' transform='translate(47.5 4.328)' fill='%23ffdfb4'/%3E%3C/g%3E%3C/svg%3E");
}

#service .services--green {
  --color: #529A4D;
  background: linear-gradient(45deg, #EEFDEA, #C0EDBE);
}

#service .services--green .service__list li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 76 16.328'%3E%3Cg id='Group_201904' data-name='Group 201904' transform='translate(-368 -3600.672)'%3E%3Crect width='62' height='5' transform='translate(368 3612)' fill='%23e8f2cb'/%3E%3Cpath d='M0-4.328,25,12H0Z' transform='translate(419 3605)' fill='%23e8f2cb'/%3E%3C/g%3E%3C/svg%3E");
}

@media only screen and (min-width: 561px) {
  #service .service {
    text-align: center;
  }
  #service .service .service__list li::before {
    width: 76px;
    height: 20px;
  }
  #service .service .service__list li small {
    font-size: 14px;
    line-height: 17px;
    top: 40px;
  }
  #service .service .service__list li > span {
    min-height: 182px;
    padding: 20px 12px;
    text-align: left;
  }
  #service .service .gr {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    column-gap: 40px;
  }
  #service .service .gr .service__imgbox {
    margin-left: 0;
    margin-right: 0;
  }
  #service .services {
    margin-top: 80px;
    padding: 60px;
  }
}

@media only screen and (min-width: 561px) and (max-width: 1100px) {
  #service .services {
    padding: 60px 30px;
  }
}

#case_study {
  padding: 80px 0;
  background: #EAF1F9;
}

#case_study h2.ttl {
  margin-bottom: 40px;
}

#case_study .case-study {
  margin-top: 50px;
  padding: 30px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, 0.04);
}

#case_study .case-study + .case-study {
  margin-top: 40px;
}

#case_study .case-study .case-study__ttl {
  margin-top: 15px;
  font-weight: 700;
  letter-spacing: 0.05em;
}

#case_study .case-study .case-study__categories a {
  display: inline-block;
  padding: 0 10px;
  background: #D9D9D9;
  font-weight: 500;
  font-size: 18px;
  line-height: 2;
}

#case_study .case-study .case-study__categories a.bg-blue1 {
  background: #2B4CA3;
  color: #fff;
}

#case_study .case-study hr {
  margin: 15px 0;
  background: none;
  border: 0;
  border-top: 1px solid #D9D9D9;
}

#case_study .case-study table {
  font-weight: 500;
  font-size: 16px;
  line-height: 30px;
}

#case_study .case-study table th {
  color: #2B4CA3;
}

#case_study .case-study table td {
  position: relative;
}

#case_study .case-study table td::before {
  content: '：';
  display: inline-block;
}

#case_study a.style__button {
  margin-top: 50px;
}

@media only screen and (min-width: 561px) {
  #case_study .case-study {
    margin-top: 0;
    padding: 20px 15px;
  }
  #case_study .case-study + .case-study {
    margin-top: 0;
  }
  #case_study .case-study .case-study__ttl {
    margin-top: 10px;
  }
  #case_study .case-study .case-study__categories a {
    font-size: 14px;
  }
  #case_study .case-study hr {
    margin: 15px 0;
  }
  #case_study .case-study table {
    font-size: 14px;
    line-height: 23px;
  }
  #case_study a.style__button {
    margin-top: 30px;
  }
  #case_study .set {
    display: flex;
    justify-content: center;
    column-gap: 15px;
    margin-top: 40px;
  }
}

#qna {
  padding: 80px 0;
  background-color: #F4F8FB;
}

#qna h2.ttl {
  margin-bottom: 40px;
}

#qna .qna {
  background: #fff;
  border-radius: 5px;
}

#qna .qna + .qna {
  margin-top: 25px;
}

#qna .qna .qna__question {
  padding: 15px 30px 15px 70px;
  box-sizing: border-box;
  background: #2B4CA3;
  border-radius: 5px;
  font-weight: 700;
  line-height: 30px;
  color: #fff;
  position: relative;
}

#qna .qna .qna__question::before {
  content: 'Q.';
  font-weight: 700;
  font-size: 24px;
  position: absolute;
  left: 30px;
}

#qna .qna .qna__answer {
  padding: 15px 30px 15px 70px;
  box-sizing: border-box;
  line-height: 30px;
  position: relative;
}

#qna .qna .qna__answer::before {
  content: 'A.';
  font-weight: 700;
  font-size: 24px;
  color: #2B4CA3;
  position: absolute;
  left: 30px;
}

#qna .toggle .toggle-link {
  position: relative;
}

#qna .toggle .toggle-link::before {
  content: '';
  width: 20px;
  height: 62px;
  transition: .3s;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18.903 11.572'%3E%3Cpath d='M0,16.781,8.39,8.391,0,0' transform='translate(17.842 1.061) rotate(90)' fill='none' stroke='%23fff' stroke-width='3'/%3E%3C/svg%3E") center/contain no-repeat;
  position: absolute;
  top: 0;
  right: 20px;
  z-index: 1;
}

#qna .toggle .toggle-link .qna__question {
  padding-right: 50px;
}

#qna .toggle.active .toggle-link::before {
  transform: scaleY(-1);
}

@media only screen and (min-width: 561px) {
  #qna .qna + .qna {
    margin-top: 20px;
  }
  #qna .qna .qna__question {
    padding: 15px 30px 15px 70px;
  }
  #qna .qna .qna__question::before {
    left: 30px;
  }
  #qna .qna .qna__answer {
    padding: 15px 30px 15px 70px;
  }
  #qna .qna .qna__answer::before {
    left: 30px;
  }
  #qna .toggle .toggle-link::before {
    right: 25px;
  }
  #qna .toggle .toggle-link .qna__question {
    padding-right: 50px;
  }
}

#recruitment {
  padding: 80px 0 0;
}

#recruitment .bnr-recruitment {
  padding: 40px 113px 40px 30px;
  box-sizing: border-box;
  background: url("../img/service_for_companies/bnr_recruitment_i_sp.webp") center/cover no-repeat;
  line-height: 30px;
  color: #fff;
  position: relative;
  z-index: 0;
}

#recruitment .bnr-recruitment::before {
  content: '';
  width: 15px;
  height: 100%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18.263 32.283'%3E%3Cpath d='M7342.046,4289.156l15.081,15.081-15.081,15.081' transform='translate(-7340.985 -4288.096)' fill='none' stroke='%23fff' stroke-width='3'/%3E%3C/svg%3E") center/contain no-repeat;
  position: absolute;
  top: 0;
  right: 20px;
}

#recruitment .bnr-recruitment .bnr-recruitment__ttl {
  margin-bottom: 20px;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  font-size: 35px;
  line-height: 1.2;
}

#recruitment .bnr-recruitment .bnr-recruitment__ttl small {
  font-weight: 500;
  font-size: 16px;
}
@media only screen and (min-width: 561px) {
  #recruitment .bnr-recruitment {
    padding: 45px 60px;
    background-image: url("../img/service_for_companies/bnr_recruitment_i.webp");
  }
  #recruitment .bnr-recruitment::before {
    width: 15px;
    right: 30px;
  }
  #recruitment .bnr-recruitment .bnr-recruitment__ttl {
    font-size: 36px;
  }
  #recruitment .bnr-recruitment .bnr-recruitment__ttl small {
    font-size: 15px;
  }
}
@media only screen and (max-width: 560px) {
  #lead {
    padding: 10.71vw 0 14.29vw;
  }
  #lead h2.ttl {
    font-size: 5.36vw;
    line-height: 9.64vw;
  }
  #lead h2.ttl .fzb {
    font-size: 6.43vw;
  }
  #lead .set1 {
    margin-top: 5.36vw;
  }
  #lead .set2 {
    margin-top: 7.14vw;
  }
  #lead .set2 dl {
    padding: 3.57vw;
    border-radius: 0.89vw;
  }
  #lead .set2 dl + dl {
    margin-top: 4.46vw;
  }
  #lead .set2 dl dt {
    font-size: 4.29vw;
    line-height: 5.36vw;
  }
  #lead .set2 dl dd {
    column-gap: 1.79vw;
    margin-top: 3.57vw;
  }
  #lead .set2 dl dd a {
    min-height: 16.96vw;
    padding: 0.89vw 2.68vw;
    border-radius: 0.89vw;
  }
  #lead .set2 dl dd a::before {
    width: 1.43vw;
    height: 1.43vw;
    border-right: 0.36vw solid;
    border-bottom: 0.36vw solid;
    bottom: 1.79vw;
  }
  #strength {
    padding: 14.29vw 0;
  }
  #strength .set-style {
    margin-top: 7.14vw;
    box-shadow: 0.71vw 0.71vw 0.71vw 0 rgba(0, 0, 0, 0.04);
  }
  #strength .set-style .set-style__ttl {
    margin-bottom: 4.46vw;
    font-size: 5.36vw;
  }
  #strength .set-style .set-style__ttl small {
    font-size: 3.21vw;
  }
  #strength .set-style .set-style__imgbox {
    margin-top: 5.36vw;
  }
  #contact {
    padding: 10.71vw 0;
  }
  #contact h2.ttl {
    font-size: 6.25vw;
    line-height: 10.71vw;
  }
  #contact h2.ttl small {
    font-size: 3.21vw;
    line-height: 4.29vw;
  }
  #contact a.style__button {
    margin-top: 5.36vw;
    width: 53.57vw;
  }
  #service {
    padding: 14.29vw 0;
  }
  #service .service {
    padding: 5.36vw 3.57vw;
  }
  #service .service + .service {
    margin-top: 5.36vw;
  }
  #service .service .service__ttl {
    margin-bottom: 3.57vw;
    font-size: 4.64vw;
  }
  #service .service .service__caption {
    margin-bottom: 3.57vw;
    font-size: 2.86vw;
    line-height: 5.36vw;
  }
  #service .service .service__list {
    column-gap: 4.36vw;
    margin-top: 5.36vw;
  }
  #service .service .service__list li {
    width: 7.68vw;
  }
  #service .service .service__list li::before {
    width: 13.29vw;
    height: 3.57vw;
    top: 2.68vw;
  }
  #service .service .service__list li small {
    font-size: 2.14vw;
    line-height: 2.68vw;
    top: 7.14vw;
  }
  #service .service .service__list li > span {
    min-height: 33.21vw;
    padding: 3.57vw 2.14vw;
    font-size: 2.86vw;
    line-height: 3.39vw;
  }
  #service .service .service__list li.two-rows {
    width: 11.25vw;
  }
  #service .services {
    margin-top: 7.14vw;
    padding: 5.36vw;
    border-radius: 0.89vw;
  }
  #case_study {
    padding: 14.29vw 0;
  }
  #case_study h2.ttl {
    margin-bottom: 7.14vw;
  }
  #case_study .case-study {
    margin-top: 8.93vw;
    padding: 5.36vw;
    box-shadow: 0.71vw 0.71vw 0.71vw 0 rgba(0, 0, 0, 0.04);
  }
  #case_study .case-study + .case-study {
    margin-top: 7.14vw;
  }
  #case_study .case-study .case-study__ttl {
    margin-top: 2.68vw;
    letter-spacing: 0.05em;
  }
  #case_study .case-study .case-study__categories a {
    padding: 0 1.79vw;
    font-size: 3.21vw;
  }
  #case_study .case-study hr {
    margin: 2.68vw 0;
    border-top: 0.18vw solid #D9D9D9;
  }
  #case_study .case-study table {
    font-size: 2.86vw;
    line-height: 5.36vw;
  }
  #case_study a.style__button {
    margin-top: 8.93vw;
  }
  #qna {
    padding: 14.29vw 0;
  }
  #qna h2.ttl {
    margin-bottom: 7.14vw;
  }
  #qna .qna {
    border-radius: 0.89vw;
  }
  #qna .qna + .qna {
    margin-top: 4.46vw;
  }
  #qna .qna .qna__question {
    padding: 2.68vw 5.36vw 2.68vw 12.5vw;
    border-radius: 0.89vw;
    line-height: 5.36vw;
  }
  #qna .qna .qna__question::before {
    font-size: 4.29vw;
    left: 5.36vw;
  }
  #qna .qna .qna__answer {
    padding: 2.68vw 5.36vw 2.68vw 12.5vw;
    line-height: 5.36vw;
  }
  #qna .qna .qna__answer::before {
    font-size: 4.29vw;
    left: 5.36vw;
  }
  #qna .toggle .toggle-link::before {
    width: 3.57vw;
    height: 11.07vw;
    right: 3.57vw;
  }
  #qna .toggle .toggle-link .qna__question {
    padding-right: 8.93vw;
  }
  #recruitment {
    padding: 14.29vw 0 0;
  }
  #recruitment .bnr-recruitment {
    padding: 7.14vw 15.18vw 7.14vw 5.36vw;
    line-height: 5.36vw;
  }
  #recruitment .bnr-recruitment::before {
    width: 2.68vw;
    right: 3.57vw;
  }
  #recruitment .bnr-recruitment .bnr-recruitment__ttl {
    margin-bottom: 3.57vw;
    font-size: 6.25vw;
  }
  #recruitment .bnr-recruitment .bnr-recruitment__ttl small {
    font-size: 2.86vw;
  }
}
