/* ------------------------------
 安心・充実のサポート */
#add_customizer_5_wrapper {
  width: 100%;
  color: #000;
}
#add_customizer_5_wrapper .sentence {
  margin: 2% 0;
}

/* グレーの会話セクション */
#add_customizer_5_wrapper .sentence > .sentence_2 {
  background-color: #f4f4f4;
  margin-top: 8%;
  border-radius: 10px;
  padding: 3%;
  position: relative;
}

#add_customizer_5_wrapper .sentence > .sentence_2 > h4 {
  position: absolute;
  top: -30px;
}
/* 人 + 台詞 wrap */
#add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap {
  display: flex;
  align-items: center;
  width: 70%;
}
@media all and (max-width: 480px) {
  #add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap {
    width: 100%;
  }
}
/*  ~~~ 共通 ~~~ */
/*  画像 */
#add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap > img {
  width: 16%;
}
/*  台詞 */
#add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap .message {
  border-radius: 15px;
  position: relative;
  height: fit-content;
  width: 70%;
  padding: 1% 6%;
  margin-bottom: 8px;
  background-color: #d8d8d8;
}
@media all and (max-width: 480px) {
  #add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap .message {
    width: 80%;
  }
}
/* 吹き出し文字サイズ */
#add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap.wrap_1,
#add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap.wrap_2 {
  font-size: small;
}

/* ~~~ 右向き（左寄せ）~~~ */
#add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap.wrap_1 {
  justify-content: flex-start;
}
@media all and (max-width: 480px) {
  #add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap.wrap_1 {
    margin-bottom: 2em;
  }
}
#add_customizer_5_wrapper
  .sentence
  > .sentence_2
  > .message_wrap
  .message.message_1 {
  margin-right: auto;
  margin-left: 16px;
}
#add_customizer_5_wrapper
  .sentence
  > .sentence_2
  > .message_wrap
  .message.message_1::before {
  left: -8px;
}

/*  ~~~ 左向き（右寄せ）~~~ */
#add_customizer_5_wrapper .sentence > .sentence_2 > .message_wrap.wrap_2 {
  justify-content: flex-end;
  margin-left: auto;
}
#add_customizer_5_wrapper
  .sentence
  > .sentence_2
  > .message_wrap
  .message.message_2 {
  margin-left: auto;
  margin-right: 16px;
  text-align: right;
}
#add_customizer_5_wrapper
  .sentence
  > .sentence_2
  > .message_wrap
  .message.message_2::before {
  right: -8px;
}

/* ~~~ 充実の〜 ~~~ */
#add_customizer_5_wrapper .sentence > .sentence_1 {
  text-align: center;
  margin-top: 16%;
  position: relative;
}
#add_customizer_5_wrapper .sentence > .sentence_1 > .subtitles > .point {
  display: inline-block;
  position: relative;
  z-index: -1;
  font-size: larger;
}
#add_customizer_5_wrapper .sentence > .sentence_1 > .subtitles > .point_text {
  border-bottom: 1px solid #e5e4bf;
  width: 40%;
  margin: auto;
}
@media all and (max-width: 480px) {
  #add_customizer_5_wrapper .sentence > .sentence_1 > .subtitles > .point_text {
    width: 80%;
  }
}
#add_customizer_5_wrapper
  .sentence
  > .sentence_1
  > .subtitles
  > .point_text
  span {
  font-size: 1.7rem;
}
#add_customizer_5_wrapper
  .sentence
  > .sentence_1
  > .subtitles
  > .point_text
  h3 {
  margin-bottom: 0;
}
#add_customizer_5_wrapper .sentence > .sentence_1 > .subtitles img {
  width: 18%;
  position: absolute;
  top: -5em;
  transform: rotate(24deg) translate(44px, -8px);
  z-index: -1;
}
@media all and (max-width: 480px) {
  #add_customizer_5_wrapper .sentence > .sentence_1 > .subtitles img {
    width: 32%;
    top: -3em;
  }
}

#add_customizer_5_wrapper .sentence {
  position: relative;
  width: 100%;
}
/* 下部テキスト */
#add_customizer_5_wrapper .support_images_wrap {
  margin-top: 3em;
}
#add_customizer_5_wrapper .support_images_wrap > .sentence_content.sentence_1 {
  width: 100%;
  margin: auto;
  min-height: 200px; /* ここ（ul）の min-height が子要素（li）の min-height より小さくなるとshadowが見切れるので注意 */
  padding-left: 0;
}
#add_customizer_5_wrapper
  .support_images_wrap
  > .sentence_content.sentence_1
  > .box {
  position: relative;
  padding: 3% 2% 3% 0;
  list-style: none;
  height: 100%;
}
#add_customizer_5_wrapper
  .support_images_wrap
  > .sentence_content.sentence_1
  > .box
  > .texts {
  box-shadow: 0 2px 8px 0px #a8a8a8;
  background-color: #ffffff;
  padding: 6% 3% 6% 0;
  min-height: 200px;
  border-radius: 5px;
  position: relative;
}
#add_customizer_5_wrapper
  .support_images_wrap
  > .sentence_content.sentence_1
  > .box
  > .texts
  .flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 200px;
}
#add_customizer_5_wrapper
  .support_images_wrap
  > .sentence_content.sentence_1
  > .box
  > .texts
  .flex
  .image {
  width: 40%;
}
#add_customizer_5_wrapper
  .support_images_wrap
  > .sentence_content.sentence_1
  > .box
  > .texts
  .flex
  .image
  > img {
  width: 90%;
}
#add_customizer_5_wrapper
  .support_images_wrap
  > .sentence_content.sentence_1
  > .box
  > .texts
  .flex
  .explain {
  width: 60%;
  text-align: left;
}

#add_customizer_5_wrapper
  .support_images_wrap
  > .sentence_content.sentence_1
  > .box
  > .texts
  .title-text {
  vertical-align: middle;
  width: 86%;
  margin-left: auto;
}
#add_customizer_5_wrapper .serif {
  color: #6e91c4;
  /* color: #691aa6; */
  /* color: #8b1da0; */
  font-family: "Merriweather", serif;
  font-weight: 200;
}

#add_customizer_5_wrapper
  .support_images_wrap
  > .sentence_content.sentence_1
  > .box
  .icon {
  color: #6e91c4;
  font-size: 1.6em;
  vertical-align: sub;
}
