main {
  background-color: #faf9f5;
}

.about_heading {
  background-color: #fff;
  text-align: center;
}
.about_head_jp {
  font-size: 0;
  line-height: 1;
  margin-inline: auto;
}
.about_head_en {
  font-family: var(--fontEnW);
  line-height: 1;
}
@media screen and (min-width:751px) {
  .about_heading {
    /* margin-top: 200px; */
    padding-top: 200px;
    padding-bottom: 520px;
  }
  .about_head_jp {
    width: 489px;
  }
  .about_head_en {
    margin-top: 28px;
    font-size: 18px;
  }
}
@media screen and (max-width:750px) {
  .about_heading {
    /* margin-top: 28.666vw; */
    padding-top: 28.666vw;
    padding-bottom: 66.666vw;
  }
  .about_head_jp {
    width: 50.4vw;
  }
  .about_head_en {
    margin-top: 4vw;
    font-size: 2.667vw;
  }
}


/* outline */
.outline-inner {
  background-color: #349639;
}
.outline_head {
  overflow-x: clip;
}
.outline_head .head_en {
  font-family: var(--fontEnW);
  color: #fff;
}
.outline_head .head_jp {
  color: #fff;
  line-height: 1;
  scale: 1.33 1;
  letter-spacing: 0.065em;
}
.outline_txt {
  color: #fff;
}
@media screen and (min-width:751px) {
  .outline {
    margin-top: -400px;
  }
  .outline-inner {
    padding-block: 105px 125px;
    border-radius: 400px 0 400px 400px;
  }
  .outline_head {
    text-align: center;
  }
  .outline_head .head_en {
    font-size: 73px;
    line-height: 1.154;
  }
  .outline_head .head_jp {
    margin-top: 20px;
    font-size: 23.5px;
  }
  .outline_txt {
    margin-top: 42px;
    font-size: 18px;
    line-height: 2.444;
    letter-spacing: 0.05em;
    text-align: center;
  }
}
@media screen and (max-width:750px) {
  .outline {
    margin-top: -49.6vw;
    /* background-color: #fff; */
  }
  .outline-inner {
    padding-block: 19.466vw 29.867vw;
    border-radius: 0 100vmax 100vmax 100vmax;
  }
  .outline_head {
    /* margin-inline: auto; */
    margin-left: 14%;
    /* width: 73.933%; */
  }
  .outline_head .head_en {
    font-size: calc((( 70.4 / var(--media_sp)) * 100) * var(--vw));
    line-height: 1.154;
    letter-spacing: 0.035em;
  }
  .outline_head .head_jp {
    margin-top: 3.599vw;
    transform-origin: left;
    font-size: calc((( 29 / var(--media_sp)) * 100) * var(--vw));
  }
  .outline_txt {
    margin-top: 9.066vw;
    /* margin-inline: auto; */
    /* width: 73.933%; */
    margin-left: 13.001%;
    margin-right: 6%;
    font-size: calc((( 28 / var(--media_sp)) * 100) * var(--vw));
    line-height: 2.143;
    letter-spacing: 0.025em;
  }
}
/* outline */

/* group */
.group {
  position: relative;
}
.group-inner {
  position: relative;
  display: block;
  margin-inline: auto;
}
.group_fig {
  position: relative;
  margin-inline: auto;
}
.group_fig figcaption {
  color: #349639;
}
.group_list {
  margin-inline: auto;
}
.group_content .img-wrap {
  overflow: hidden;
  border-radius: 100vmax 100vmax 100vmax 0;
}
.group_content .desc {
  color: #323232;
}
.group_content .lnk {
  display: flex;
  /* justify-content: space-between; */
  align-items: center;
}
.group_content .lnk .line {
  display: block;
  background-color: #d2d2d2;
}
.group_content .lnk .txt {
  color: #349639;
  line-height: 1;
}
.group_content .lnk .arrow {
  display: block;
  height: auto;
  aspect-ratio: 1 / 1;
}
@media screen and (min-width:751px) {
  .group {
    margin-top: 260px;
  }
  .group-inner {
    padding-top: 1px;
    padding-bottom: 200px;
    background-color: #fff;
    border-radius: 0 400px 400px 400px;
  }
  .group_fig {
    margin-top: -130px;
    width: 866px;
  }
  .group_fig figcaption {
    position: absolute;
    inset: 0;
    top: -13px;
    left: -13px;
    margin: auto;
    width: fit-content;
    height: fit-content;
    color: #349639;
    font-size: 22.8px;
    line-height: 1.945;
    text-align: center;
  }
  .group_list {
    margin-top: 145px;
    width: 850px;
  }
  .group_list ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    row-gap: 56px;
  }
  .group_content {
    width: 29.577%;
  }
  .group_content .txt-wrap {
    margin-top: 16px;
  }
  .group_content .desc {
    margin-top: 14px;
    font-size: 14px;
    line-height: 1.857;
  }
  .group_content .lnk {
    margin-top: 4px;
    gap: 8px;
  }
  .group_content .lnk .line {
    width: 150px;
    height: 1px;
  }
  .group_content .lnk .txt {
    font-size: 14px;
  }
  .group_content .lnk .arrow {
    width: 15px;
  }
  .group_content.chisho .name {
    width: 111px;
  }
  .group_content.resi .name {
    width: 203px;
  }
  .group_content.design .name {
    width: 154px;
  }
  .group_content.home .name {
    width: 163px;
  }
  .group_content.build .name {
    width: 218px;
  }
  .group_content.mec .name {
    width: 158px;
  }
}

@media screen and (max-width:750px) {
  .group {
    background-color: #faf9f5;
    margin-top: 114.267vw;
  }
  .group-inner {
    padding-top: 1px;
    padding-bottom: 23.734vw;
    background-color: #fff;
    border-radius: 0 29.745vw 29.745vw 29.745vw;
  }
  .group_fig {
    margin-top: calc(-90.533vw - 1px);
  }
  .group_fig .img-wrap {
    margin-top: 5.334vw;
    margin-inline: auto;
    width: 94.504vw;
  }
  .group_fig figcaption {
    color: #349639;
    font-size: calc((( 32 / var(--media_sp)) * 100) * var(--vw));
    line-height: 1.921;
    text-align: center;
  }
  .group_list {
    margin-top: 25.6vw;
    width: 67.733%;
  }
  .group_list ul > * + * {
    margin-top: 8.667vw;
  }
  .group_content .txt-wrap {
    margin-top: 4.4vw;
  }
  .group_content .desc {
    margin-top: 3.333vw;
    font-size: 3.734vw;
    line-height: 1.857;
  }
  .group_content .lnk {
    margin-top: 1.466vw;
    gap: 2.266vw;
  }
  .group_content .lnk .line {
    width: 40.114vw;
    height: 1px;
  }
  .group_content .lnk .txt {
    font-size: 3.734vw;
  }
  .group_content .lnk .arrow {
    width: 3.982vw;
  }
  .group_content.chisho .name {
    width: 29.629vw;
  }
  .group_content.resi .name {
    width: 54.17vw;
  }
  .group_content.design .name {
    width: 41.753vw;
  }
  .group_content.home .name {
    width: 43.363vw;
  }
  .group_content.build .name {
    width: 58.252vw;
  }
  .group_content.mec .name {
    width: 42.209vw;
  }
}
/* group */

/* field */
.field {
  position: relative;
  background-color: #fff;
}
.field .head {
  display: flex;
  align-items: center;
  margin-inline: auto;
}
.field .head .ico {
  display: block;
}
.field .head .txt {
  display: block;
  transform-origin: left;
  scale: 1.27325 1;
  color: #349639;
}
.field_fig {
  position: relative;
  margin-inline: auto;
}
.field_cap {
  color: #323232;
  text-align: right;
}
.field_cap .color {
  border-radius: 100vmax;
  background-color: #c6e2c8;
  display: inline-block;
}
@media screen and (min-width:751px) {
  .field {
    margin-top: 105px;
    padding-block: 164px;
    border-radius: 400px 400px 0 400px;
  }
  .field .head {
    width: 1000px;
  }
  .field_fig {
    margin-top: 40px;
    width: 1000px;
  }
  .field .head .ico {
    margin-right: 16px;
    width: 64px;
  }
  .field .head .txt {
    display: block;
    font-size: 28px;
    line-height: 1.486;
  }
  .field_cap {
    margin-top: 12px;
    font-size: 12px;
    letter-spacing: 0.03em;
  }
  .field_cap .color {
    margin-inline: 6px;
    width: 38px;
    height: 10px;
  }
}
@media screen and (max-width:750px) {
  .field {
    margin-top: 17.066vw;
    padding-block: 18.267vw 17.333vw;
    border-radius: 29.332vw 29.332vw 0 29.332vw;
  }
  .field .head {
    width: 84%;
  }
  .field_fig {
    margin-top: 6vw;
    width: 84%;
  }
  .field .head .ico {
    margin-right: 2.475vw;
    width: 9.812vw;
  }
  .field .head .txt {
    display: block;
    font-size: 4.533vw;
    line-height: 1.486;
  }
  .field_cap {
    margin-top: 4.933vw;
    font-size: 2.64vw;
  }
  .field_cap .color {
    margin-inline: 1.067vw;
    width: 8.239vw;
    height: 2.312vw;
  }
}
/* field */


/* needs */
.needs .head {
  display: flex;
  align-items: center;
  margin-inline: auto;
}
.needs .head .ico {
  display: block;
}
.needs .head .txt {
  display: block;
  transform-origin: left;
  scale: 1.27325 1;
  color: #349639;
}
.needs_txt {
  font-family: "中ゴシックBBB JIS2004 AP";
  margin-inline: auto;
  line-height: 2;
}
.needs_notes {
  margin-inline: auto;
  line-height: 1;
  color: #349639;
}
@media screen and (min-width:751px) {
  .needs {
    margin-top: 138px;
    padding-bottom: 200px;
    border-radius: 400px 400px 0 400px;
  }
  .needs .head {
    width: 1000px;
  }
  .needs_fig {
    width: 1000px;
  }
  .needs .head .ico {
    margin-right: 16px;
    width: 64px;
  }
  .needs .head .txt {
    display: block;
    font-size: 28px;
    line-height: 1.486;
  }
  .needs_txt {
    margin-top: 28px;
    width: 1000px;
    font-size: 16px;
  }
  .needs_notes {
    margin-top: 16px;
    width: 1000px;
    font-size: 14px;
  }
}
@media screen and (max-width:750px) {
  .needs {
    margin-top: 34.667vw;
    padding-bottom: 20.629vw;
    border-radius: 29.332vw 29.332vw 0 29.332vw;
  }
  .needs .head {
    width: 84%;
  }
  .needs_fig {
    width: 84%;
  }
  .needs .head .ico {
    margin-right: 2.475vw;
    width: 9.812vw;
  }
  .needs .head .txt {
    display: block;
    font-size: 4.533vw;
    line-height: 1.486;
  }
  .needs_txt {
    margin-top: 2.933vw;
    width: 84%;
    font-size: 3.734vw;
  }
  .needs_notes {
    margin-top: 2.933vw;
    width: 84%;
    font-size: 3.2vw;
  }
}
/* needs */
/* アコーディオン */
.needs_case .details {
  margin-inline: auto;
}
.needs_case .summary {
  background-color: #349639;
  color: #fff;
  border-radius: 0 100vmax 100vmax 100vmax;
  cursor: pointer;
}
.needs_case .summary-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  line-height: 1;
}
.needs_case .summary-inner_txt {
  transform-origin: left;
  scale: 1.27 1;
}
.needs_case .summary .button {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
}
.needs_case .summary .button .line {
  position: absolute;
  inset: 0;
  margin: auto;
  display: block;
  background-color: #fff;
  width: 100%;
  transform-origin: center;
}
.needs_case .summary .button .line + .line {
  transition: rotate 0.4s;
  rotate: 90deg;
}
.needs_case .js-is-opened .summary .button .line + .line {
  rotate: 180deg;
}


.js-content {
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition: height 0.4s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.4s;
}

.js-content.expanding,
.js-content.expanded {
  opacity: 1;
}




.needs_case .case {
  overflow: hidden;
}
.needs_case .case_ttl {
  background-color: #fff;
  line-height: 1;
}
.needs_case .case_ttl .class {
  position: relative;
  display: inline-block;
  font: inherit;
  color: #349639;
}
.needs_case .case_ttl .class .underline {
  line-height: 1;
}
.needs_case .case_ttl .class .underline::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #349639;
}
.needs_case .case_content {
  background-color: #fff;
}
.needs_case .case_group ul {
  display: flex;
}
.needs_case .case_group-field {
  display: flex;
}
.needs_case .case_desc {
  word-break: break-word;
}
.needs_case .case_group-name {
  color: #bebebe;
  border-color: #bebebe;
  line-height: 1;
}
.needs_case .case_group_item.is-active .case_group-name {
  color: #000;
  border-color: #bebebe;
}
.needs_case .case_group-field {
  position: relative;
}
.needs_case .field-icon {
  display: block;
  height: 100%;
}
.needs_case .field-icon.kikaku {
  background: url(../img/concept/tag_kikaku.svg) no-repeat center center/cover;
  aspect-ratio: 1 / 0.63124;
}
.needs_case .field-icon.design {
  background: url(../img/concept/tag_sekkei.svg) no-repeat center center/cover;
  aspect-ratio: 1 / 0.63124;
}
.needs_case .field-icon.sekou {
  background: url(../img/concept/tag_sekou.svg) no-repeat center center/cover;
  aspect-ratio: 1 / 0.63124;
}
.needs_case .field-icon.sozai {
  background: url(../img/concept/tag_sozai.svg) no-repeat center center/cover;
  aspect-ratio: 1 / 0.30482;
}
.needs_case .field-icon.kakou {
  background: url(../img/concept/tag_kakou.svg) no-repeat center center/cover;
  aspect-ratio: 1 / 0.38158;
}
.needs_case .field-icon.jigyo {
  background: url(../img/concept/tag_jigyo.svg) no-repeat center center/cover;
  aspect-ratio: 1 / 0.44093;
}
.needs_case .field-icon.const {
  background: url(../img/concept/tag_const.svg) no-repeat center center/cover;
  aspect-ratio: 1 / 0.17041;
}
@media screen and (min-width:751px) {
  .needs_case .field-icon.const {
    position: absolute;
    top: 0;
    left: 17px;
    display: block;
  }
}
@media screen and (max-width:750px) {
  .needs_case .field-icon.const {
  background: url(../img/concept/tag_const_sp.svg) no-repeat center center/cover;
  aspect-ratio: 1 / 0.12608;
}
}
.needs_case .case_img-container {
  margin-inline: auto;
  /* display: grid; */
}
.needs_case .desc_item {
  line-height: 1.857;
  word-break: break-word;
}
.needs_case .case_list_lnk-wrap {
  margin-inline: auto;
  border-radius: 0 100vmax 100vmax 100vmax;
  border: 1px solid #349639;
}
.needs_case .case_list_lnk-wrap a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  line-height: 1;
  color: #349639;
}
.needs_case .case_list_lnk-wrap a .arrow {
  display: block;
  height: auto;
  aspect-ratio: 1 / 1;
  line-height: 1;
}
@media screen and (min-width:751px) {
  .needs_case .content-inner {
    padding-block: 30px;
  }
  .needs_case .content-inner > * + * {
    margin-top: 30px;
  }
  .needs_case .case {
    border-radius: 0 50px 50px 50px;
  }
  .needs_case .details {
    margin-top: 48px;
    width: 1000px;
  }
  .needs_case .details + .details {
    margin-top: 20px;
  }
  .needs_case .summary {
    padding: 34px 47px 34px 67px;
  }
  .needs_case .summary-inner {
    font-size: 22px;
  }
  .needs_case .summary .button {
    width: 22px;
  }
  .needs_case .summary .button .line {
    height: 2px;
  }
  .needs_case .case_ttl {
    padding-block: 26px 18px;
    padding-inline: 64px;
    border-bottom: 4px solid #faf9f5;
  }
  .needs_case .case_ttl .class {
    margin-right: 15px;
    font-size: 25px;
  }
  .needs_case .case_ttl .class .underline::after {
    height: 4px;
    bottom: -20px;
  }
  .needs_case .case_ttl .project {
    font-size: 22px;
  }
  .needs_case .case_content {
    padding-block: 27px;
    padding-inline: 60px;
  }
  .needs_case .case_group-name {
    margin-top: 8px;
    font-size: 16px;
  }
  .needs_case .case_group ul > * + * .case_group-name {
    border-left: 2px solid;
    padding-inline: 17px;
  }
  .needs_case .case_group ul > * + * .case_group-field {
    padding-inline: 17px;
  }
  .needs_case .case_group_item:first-of-type .case_group-name,
  .needs_case .case_group_item:first-of-type .case_group-field {
    padding-inline-end: 16px;
  }
  .needs_case .case_group-field {
    height: 21px;
  }
  /* .needs_case .case_desc {
    height: 21px;
  } */
  .needs_case .case_img-container {
    margin-top: 20px;
    margin-inline: auto;
    /* grid-template-columns: 2fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 2px; */
  }
  .needs_case .pc-gr-1-3 {
    grid-row: 1 / 3;
  }
  .needs_case .pc-gr-1-2 {
    grid-row: 1 / 2;
  }
  .needs_case .pc-gr-2-3 {
    grid-row: 2 / 3;
  }
  .needs_case .pc-gc-1-2 {
    grid-column: 1 / 2;
  }
  .needs_case .pc-gc-2-3 {
    grid-column: 2 / 3;
  }
  .needs_case .pc-gc-3-4 {
    grid-column: 3 / 4;
  }
  .needs_case .desc_item {
    margin-right: .5em;
    font-size: 14px;
  }
  .needs_case .desc_ttl {
    color: #349639;
  }
  .needs_case .case_list_lnk-wrap {
    width: 372px;
    aspect-ratio: 1 / 0.1526;
  }
  .needs_case .case_list_lnk-wrap a {
    font-size: 14px;
    gap: 12px;
  }
  .needs_case .case_list_lnk-wrap a .arrow {
    width: 15px;
  }
}
@media screen and (max-width:750px) {
  .needs_case {
    margin-top: 4.667vw;
  }
  .needs_case .content-inner {
    padding-block: 5.334vw;
  }
  .needs_case .content-inner > * + * {
    margin-top: 5.334vw;
  }
  .needs_case .details {
    width: 84%;
  }
  .needs_case .details + .details {
    margin-top: 6.4vw;
  }
  .needs_case .summary {
    padding: 6.267vw 8.533vw 6.267vw 12.8vw;
  }
  .needs_case .summary-inner {
    font-size: 4.267vw;
  }
  .needs_case .summary .button {
    width: 4.16vw;
  }
  .needs_case .summary .button .line {
    height: 2px;
  }
  .needs_case .case {
    border-radius: 0 8.501vw 8.501vw 8.501vw;
    margin-top: 5.334vw;
  }
  .needs_case .case_ttl .class {
    display: block;
    padding-block: 4.533vw 2.933vw;
    padding-inline: 5.334vw;
    font-size: 4.251vw;
    border-bottom: 2px solid #faf9f5;
  }
  .needs_case .case_ttl .project {
    display: block; 
    padding-block: 4.267vw 3.734vw;
    padding-inline: 5.334vw;
    font-size: 3.734vw;
    border-bottom: 2px solid #faf9f5;
  }
  .needs_case .case_ttl .class .underline {
    position: relative;
    display: block;
    width: fit-content;
  }
  .needs_case .case_ttl .class .underline::after {
    height: 2px;
    bottom: calc(-2.933vw - 2px);
    /* bottom: -3.333vw; */
  }
  .needs_case .case_content {
    padding-block: 4.533vw;
    /* padding-inline: 5.334vw; */
  }
  .needs_case .case_group_item {
    display: flex;
    align-items: center;
    gap: 1.867vw;
  }
  .needs_case .case_group {
    padding-inline: 5.334vw;
  }
  .needs_case .case_group-name {
    font-size: 3.734vw;
  }
  .needs_case .case_group ul {
    display: block;
  }
  .needs_case .case_group ul > * + * {
    margin-top: 1.6vw;
  }
  .needs_case .case_group-field {
    order: 2;
    height: 5.283vw;
  }
  .needs_case .case_img-container {
    margin-top: 4.667vw;
    margin-inline: auto;
    /* grid-template-columns: 1fr 1fr;
    grid-template-rows: 2fr 1fr 1fr;
    gap: 2px; */
  }
  .needs_case .sp-gr-1-2 {
    grid-row: 1 / 2;
  }
  .needs_case .sp-gr-2-3 {
    grid-row: 2 / 3;
  }
  .needs_case .sp-gr-3-4 {
    grid-row: 3 / 4;
  }
  .needs_case .sp-gc-1-2 {
    grid-column: 1 / 2;
  }
  .needs_case .sp-gc-1-3 {
    grid-column: 1 / 3;
  }
  .needs_case .sp-gc-2-3 {
    grid-column: 2 / 3;
  }
  .needs_case .case_desc {
    margin-top: 3.734vw;
    padding-inline: 5.334vw;
  }
  .needs_case .desc_item {
    display: block;
    font-size: 3.2vw;
    line-height: 1.667;
    text-indent: -1em;
    padding-left: 1em;
  }
  .needs_case .desc_ttl {
    color: #349639;
  }
  .needs_case .case_list_lnk-wrap {
    width: 84vw;
    aspect-ratio: 1 / 0.18033;
  }
  .needs_case .case_list_lnk-wrap a {
    font-size: 3.2vw;
    gap: 2.4vw;
  }
  .needs_case .case_list_lnk-wrap a .arrow {
    width: 4vw;
  }
}
/* アコーディオン */