/* ------------------------------
 区分投資sim・自宅販売sim
 ["func-room-inv", "func-myhome", "func-aireport"] */

.add_customizer_functions_detail_wrapper .content.container {
  position: relative;
}
.add_customizer_functions_detail_wrapper .content.container .title_style2 {
  margin-bottom: 0;
}

/* ------- 機能説明サブタイトル ------- */
.add_customizer_functions_detail_wrapper .paragraph > .sub_title {
  text-align: left;
  margin: 10% 0 0;
  /* white-space: nowrap; */
  font-weight: bolder;
}

/* ------- 機能説明カード ------- */
.add_customizer_functions_detail_wrapper .paragraph > .contents_detail {
  width: 100%;
  margin: 2em 0;
  padding: 1em 4% 2em;
  background-color: #fafafa;
  border: 1px solid;
  border-color: #fafafa;
  border-radius: 8px;
  height: auto;
}
@media all and (min-width: 768px) {
  .add_customizer_functions_detail_wrapper .paragraph > .contents_detail {
    min-height: 70vh;
  }
}
.add_customizer_functions_detail_wrapper .paragraph > .contents_detail.color {
  position: relative;
  z-index: 3;
}
/* 区分投資sim：背景色は機能によって変更 */
.add_customizer_functions_detail_wrapper.func-room-inv
  .paragraph
  > .contents_detail.color {
  background-color: #ebf9f4;
  border: 3px double;
  border-color: #11867e;
}
/* 一棟投資sim */
.add_customizer_functions_detail_wrapper.func-building-inv
  .paragraph
  > .contents_detail.color {
  background-color: #f2f0f9;
  border: 3px double;
  border-color: #7165b0;
}
/* 自宅所有sim */
.add_customizer_functions_detail_wrapper.func-myhome
  .paragraph
  > .contents_detail.color {
  background-color: #f8f4ce;
  border: 3px double;
  border-color: #b3af55;
}
/* 確定申告 */
.add_customizer_functions_detail_wrapper.func-tax-return
  .paragraph
  > .contents_detail.color {
  background-color: #fff0e3;
  border: 3px double;
  border-color: #d59b3a;
}
/* AIレポート */
.add_customizer_functions_detail_wrapper.func-aireport
  .paragraph
  > .contents_detail.color {
  background-color: #f1f6f9;
  border: 3px double;
  border-color: #4d91b0;
}
/* ハザード */
.add_customizer_functions_detail_wrapper.func-hazard
  .paragraph
  > .contents_detail.color {
  background-color: #f2f5ff;
  border: 3px double;
  border-color: #30609b;
}
/* ビッグデータ連携 */
.add_customizer_functions_detail_wrapper.func-bigdata
  .paragraph
  > .contents_detail.color {
  background-color: #fbf4f9;
  border: 3px double;
  border-color: #cc8cc5;
}

.add_customizer_functions_detail_wrapper
  .paragraph
  > .contents_detail
  > .texts {
  width: 100%;
  align-content: center;
  align-content: center;
}
@media all and (min-width: 768px) {
  .add_customizer_functions_detail_wrapper
    .paragraph
    > .contents_detail
    > .texts {
    height: 62vh;
  }
}
.add_customizer_functions_detail_wrapper
  .paragraph
  > .contents_detail
  > .texts
  > .text_header {
  margin-top: 3%;
}

/* ------- スクロールセクション ------- */
.add_customizer_wrapper > .content > .scroll_section_wrap {
  position: relative;
  width: 100%;
  display: flex;
}

/* ------- 左側 ------- */
.add_customizer_wrapper
  > .content
  > .scroll_section_wrap
  > .scroll_section_text {
  position: relative;
  width: 100%;
}
@media all and (min-width: 768px) {
  .add_customizer_wrapper
    > .content
    > .scroll_section_wrap
    > .scroll_section_text {
    width: 40%;
  }
}

/* ------- 右側 ------- */
.add_customizer_wrapper
  > .content
  > .scroll_section_wrap
  > .scroll_section_images_lg {
  position: -webkit-sticky;
  position: sticky;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  top: 30%;
  height: 100%;
  width: 70%;
  z-index: 2;
  transition: 0.5s;
  margin-top: 8%;
  margin-bottom: 4%;
}
.add_customizer_wrapper
  > .content
  > .scroll_section_wrap
  > .scroll_section_images_lg
  > .inner_image {
  position: absolute;
  top: 48%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0;
  z-index: -1;
  width: 64%;
  object-fit: cover;
}

.add_customizer_wrapper
  > .content
  > .scroll_section_wrap
  > .scroll_section_images_lg
  > img {
  /* width: 80%; */
  object-fit: scale-down;
}

/* ------- 活用事例 ------- */
.add_customizer_functions_detail_wrapper .paragraph > .presentation_title {
  display: flex;
  align-items: center;
  font-weight: normal;
  margin: 1em 0 0;
}
.add_customizer_functions_detail_wrapper
  .paragraph
  > .presentation_title::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 30px;
  background-color: #84cdbf;
  vertical-align: bottom;
  margin-right: 8px;
}
.add_customizer_functions_detail_wrapper .paragraph > .presentation {
  width: 100%;
  padding: 4em 2em;
  background-color: #f4f4f4;
  vertical-align: bottom;
  margin-top: 8px;
  display: flex;
}
.add_customizer_functions_detail_wrapper .paragraph > .presentation > .image {
  align-items: center;
  display: flex;
  width: 15%;
  margin-left: 16px;
}
@media all and (max-width: 1199px) {
  .add_customizer_functions_detail_wrapper .paragraph > .presentation > .image {
    width: 30%;
  }
}
@media all and (max-width: 767px) {
  .add_customizer_functions_detail_wrapper .paragraph > .presentation {
    flex-direction: column;
  }
  .add_customizer_functions_detail_wrapper .paragraph > .presentation > .image {
    width: 100%;
    max-width: 342px;
    margin: auto;
  }
}
.add_customizer_functions_detail_wrapper
  .paragraph
  > .presentation
  > .image
  > img {
  width: 100%;
  border-radius: 3px;
}
@media all and (min-width: 768px) {
  .add_customizer_functions_detail_wrapper
    .paragraph
    > .presentation
    > .explain {
    width: 85%;
    padding: 0 2.5em;
  }
}
.add_customizer_functions_detail_wrapper
  .paragraph
  > .presentation
  > .explain
  > .presentation_sub_title {
  margin: -8px auto 8px;
}
@media all and (max-width: 767px) {
  .add_customizer_functions_detail_wrapper
    .paragraph
    > .presentation
    > .explain
    > .presentation_sub_title {
    margin: 16px 0 8px;
  }
}

/* ------- その他：アイコン ------- */
.add_customizer_functions_detail_wrapper .icon1 {
  color: #84cd9e;
}
.add_customizer_functions_detail_wrapper .icon2 {
  color: #469b8b;
  vertical-align: super;
  margin: 3px;
}