@charset "utf-8";

.pageHeadVisual-ttl {
  /* align-items: start; */
  max-width: 1060px;
  padding: 0 20px;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .pageHeadVisual-ttl {
    align-items: center;
    text-align: center;
  }
}

.groupBox {
  display: grid;
  align-items: center;
  gap: 0 3.9%;
  grid-template-columns: 1fr 51.7%;
  padding: 60px;
  background: linear-gradient(89.9deg, rgba(26, 43, 84, 0.005) 2.97%, rgba(26, 43, 84, 0.04) 13.05%, rgba(58, 96, 186, 0.02) 53.39%, rgba(26, 43, 84, 0.05) 95.17%, rgba(26, 43, 84, 0.005) 101.42%);
}
@media screen and (max-width: 768px) {
  .groupBox {
    gap: 6.66vw 0;
    grid-template-columns: 100%;
    padding: 5.33vw 2.66vw 8vw;
  }
}

@media screen and (max-width: 768px) {
  .groupBox-txtArea {
    order: 2;
  }
}

@media screen and (max-width: 768px) {
  .groupBox-imgArea {
    order: 1;
  }
}

@media screen and (max-width: 768px) {
  .groupBox-imgArea img {
    width: 100%;
  }
}

.groupBox-ttl {
  color: #1E295E;
  font-family: "Noto Serif JP";
  font-size: 38px;
  font-weight: 700;
  line-height: 1.21;
}
@media screen and (max-width: 768px) {
  .groupBox-ttl {
    font-size: 7.46vw;
    line-height: 1.42;
    text-align: center;
  }
}

.groupBox-txt {
  margin-top: 40px;
  font-size: 17px;
  line-height: 1.76;
}
@media screen and (max-width: 768px) {
  .groupBox-txt {
    margin-top: 3.46vw;
    font-size: 4vw;
    line-height: 1.86;
    text-align: center;
  }
}

.introductionBox {
  display: grid;
  align-items: center;
  gap: 0 40px;
  grid-template-columns: min(38.36vw,440px) 1fr;
  background-color: #FFF;
}
@media screen and (max-width: 768px) {
  .introductionBox {
    gap: 0;
    grid-template-columns: 100%;
  }
}

@media screen and (max-width: 768px) {
  .introductionBox-imgArea img {
    width: 100%;
  }
}

.introductionBox-txtArea {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding: 30px 30px 30px 0;
}
@media screen and (max-width: 768px) {
  .introductionBox-txtArea {
    padding: 9.6vw 7.19vw 13.33vw;
  }
}

.introductionBox-inner {
  max-width: 500px;
}
@media screen and (max-width: 768px) {
  .introductionBox-inner {
    max-width: 100%;
  }
}

.introductionBox-txt {
  color: #000;
  font-size: 24px;
  font-weight: 700;
  line-height: 2;
}
@media screen and (max-width: 768px) {
  .introductionBox-txt {
    font-size: 5.33vw;
    line-height: 1.5;
    text-align: center;
  }
}

.introductionBox .btnLinkWrap {
  max-width: 280px;
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
  .introductionBox .btnLinkWrap {
    max-width: 74.66vw;
    margin-top: 6.66vw;
  }
}

@media screen and (max-width: 768px) {
  .accordion .table1 col[width="30%"] {
    width: 35%;
  }
}

@media screen and (max-width: 768px) {
  .accordion .table1 col[width="70%"] {
    width: 65%;
  }
}

@media screen and (max-width: 768px) {
  .accordion .table1 td {
    font-size: 4vw;
    word-break: break-word;
  }
}

.bizBoxWrap {
  position: relative;
  z-index: 1;
  /*max-width: 1180px;*/
  margin: 0 auto;
  /*padding-top: 90px;*/
}

.bizBoxWrap + .bizBoxWrap {
  margin-top: 120px;
}
@media screen and (max-width: 768px) {
.bizBoxWrap + .bizBoxWrap {
  margin-top: 60px;
}
}

.bizBoxWrap::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: auto;
  aspect-ratio: 152/60;
/*  aspect-ratio: 152/79;*/
  background: no-repeat center top/cover;
  content: "";
}
@media screen and (max-width: 768px) {
  .bizBoxWrap::before {
    aspect-ratio: 152/120;
  }
}

/*.bizBoxWrap[data-biz="suits-01"]::before {
  background-image: url(/group/img/bg_business_mens_suits_01.jpg);
}

.bizBoxWrap[data-biz="suits-02"]::before {
  background-image: url(/group/img/bg_business_mens_suits_02.jpg);
}

.bizBoxWrap[data-biz="suits-03"]::before {
  background-image: url(/group/img/bg_business_mens_suits_03.jpg);
}

.bizBoxWrap[data-biz="suits-04"]::before {
  background-image: url(/group/img/bg_business_mens_suits_04.jpg);
}

.bizBoxWrap[data-biz="suits-05"]::before {
  background-image: url(/group/img/bg_business_mens_suits_05.jpg);
}

.bizBoxWrap[data-biz="card-01"]::before {
  background-image: url(/group/img/bg_business_card_01.jpg);
}

.bizBoxWrap[data-biz="print-01"]::before {
  background-image: url(/group/img/bg_business_print_01.jpg);
}

.bizBoxWrap[data-biz="sundries-01"]::before {
  background-image: url(/group/img/bg_business_sundries_01.jpg);
}

.bizBoxWrap[data-biz="repair-01"]::before {
  background-image: url(/group/img/bg_business_repair_01.jpg);
}

.bizBoxWrap[data-biz="franchisee-01"]::before {
  background-image: url(/group/img/bg_business_franchisee_01.jpg);
}

.bizBoxWrap[data-biz="franchisee-02"]::before {
  background-image: url(/group/img/bg_business_franchisee_02.jpg);
}

.bizBoxWrap[data-biz="franchisee-03"]::before {
  background-image: url(/group/img/bg_business_franchisee_03.jpg);
}

.bizBoxWrap[data-biz="franchisee-04"]::before {
  background-image: url(/group/img/bg_business_franchisee_04.jpg);
}

.bizBoxWrap[data-biz="realestate-01"]::before {
  background-image: url(/group/img/bg_business_realestate_01.jpg);
}

.bizBoxWrap[data-biz="other-01"]::before {
  background-image: url(/group/img/bg_business_other_01.jpg);
}

.bizBoxWrap[data-biz="other-02"]::before {
  background-image: url(/group/img/bg_business_other_02.jpg);
}*/

.bizBoxDetails {
  display: grid;
  gap: 30px;
  grid-template-areas:
  'a b'
  'c c'
  'd d';
  grid-template-columns: min(32.24vw,398px) 1fr;
  /*margin: 0 30px;
  padding: 30px 30px 0;*/
  background-color: #FFF;
}
@media screen and (max-width: 768px) {
  .bizBoxDetails {
    gap: 5.33vw;
    grid-template-areas: 'a''b''c''d';
    grid-template-columns: 100%;
    margin: 0 5.33vw;
    padding: 4vw 4vw 0;
  }
}

.bizBoxDetails-img {
  grid-area: a;
  border: 1px solid #e0e0e0;
}

.bizBoxDetails-img img {
  width: 100%;
  height: auto;
  object-fit: cover;
  overflow-clip-margin: unset;
}

.bizBoxDetails-head {
  align-self: center;
  grid-area: b;
}

.bizBoxDetails-ttl {
  font-size: 30px;
}
@media screen and (max-width: 768px) {
  .bizBoxDetails-ttl {
    font-size: 6.4vw;
  }
}

.bizBoxDetails-txt {
  grid-area: c;
}

.bizBoxAccordion {
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  transition: .3s;
}

.bizBoxAccordion-inner {
  margin: 0 30px;
  padding: 0 30px;
}
@media screen and (max-width: 768px) {
  .bizBoxAccordion-inner {
    margin: 0 5.33vw;
    padding: 0 4vw;
  }
}

.bizBox-table {
  grid-area: d;
  width: 100%;
}

.bizBoxAccordion .bizBox-table {
  border-bottom: 1px solid #E5E5E5;
}

.bizBox-table th,
.bizBox-table td {
  padding: 16px 0;
  border-top: 1px solid #E5E5E5;
}
@media screen and (max-width: 768px) {
  .bizBox-table th,
  .bizBox-table td {
    display: block;
    width: 100% !important;
    padding: 4.26vw 0;
  }
}

.bizBox-table th {
  width: 20%;
  min-width: 150px;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .bizBox-table th {
    min-width: 26.66vw;
  }
}

.bizBoxImg {
  margin: 50px 130px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .bizBoxImg {
    margin: 8vw 0 0 0;
  }
}

@media screen and (max-width: 768px) {
  .bizBoxImg img {
    width: 100%;
    object-fit: cover;
  }
}

.bizBoxImg-top {
  display: grid;
  gap: 40px;
  grid-template-columns: repeat(2,auto);
}
@media screen and (max-width: 768px) {
  .bizBoxImg-top {
    gap: 4vw;
    grid-template-columns: 100%;
  }
}

.bizBoxImg-bottom {
  display: grid;
  gap: 0 40px;
  grid-template-columns: repeat(3,auto);
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
  .bizBoxImg-bottom {
    gap: 4vw;
    grid-template-columns: 100%;
    margin-top: 4vw;
  }
}

.bizMore {
  display: block;
  width: calc(100% - 120px);
  margin: 30px 60px 0;
  padding: 16px;
  background-color: #F2F2F2;
  color: #333;
  font-weight: 500;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .bizMore {
    width: calc(100% - 10.66vw);
    margin: 8vw 5.33vw 0;
    padding: 4.26vw;
  }
}

.bizMore span {
  position: relative;
  padding-left: 24px;
}
@media screen and (max-width: 768px) {
  .bizMore span {
    padding-left: 6.4vw;
  }
}

.bizMore span::before,
.bizMore span::after {
  position: absolute;
  top: calc(50% + 1px);
  left: 0;
  translate: 0 -50%;
  width: 12px;
  height: 2px;
  background-color: #333;
  content: "";
}
@media screen and (max-width: 768px) {
  .bizMore span::before,
  .bizMore span::after {
    width: 3.2vw;
  }
}

.bizMore span::after {
  rotate: 90deg;
  transition: rotate .3s;
}

.bizMore.is-active span::after {
  rotate: 180deg;
}