/*==================================================

** change
==================================================*/
#changeExample .conversation + .conversation {
  margin-top: 64px; }
#changeExample .conversation li {
  padding: 0 120px;
  position: relative; }
  #changeExample .conversation li::before, #changeExample .conversation li::after {
    display: block;
    width: 80px;
    height: 80px;
    background: no-repeat center center/40px;
    position: absolute;
    top: 0;
    border: 2px solid #eff1f2;
    border-radius: 1000px; }
  #changeExample .conversation li + li {
    margin-top: 32px; }
#changeExample .conversation dl {
  position: relative;
  padding: 64px 40px 32px;
  background: #f5f7f7; }
  #changeExample .conversation dl::before, #changeExample .conversation dl::after {
    width: 0;
    height: 0;
    border-style: solid;
    position: absolute;
    top: 39px; }
  #changeExample .conversation dl dt {
    border-radius: 0 0 16px 0;
    line-height: 39px;
    color: #fff;
    padding: 0 16px;
    background: #323a3f;
    position: absolute;
    left: 0;
    top: 0; }
#changeExample .conversation .client::before {
  content: '';
  background-image: url("../img/change/ico_client.svg");
  left: 0; }
#changeExample .conversation .client dl::before {
  content: '';
  border-color: transparent #f5f7f7 transparent transparent;
  border-width: 0px 24px 24px 0px;
  left: -24px; }
#changeExample .conversation .client dl dd {
  font-size: 2.2rem; }
#changeExample .conversation .answer::after {
  content: '';
  background-image: url("../img/change/ico_lia.svg");
  right: 0; }
#changeExample .conversation .answer dl {
  background: #e6f0f7; }
  #changeExample .conversation .answer dl::before {
    content: '';
    border-color: #e6f0f7 transparent transparent transparent;
    border-width: 24px 24px 0px 0px;
    right: -24px; }
  #changeExample .conversation .answer dl dt {
    background: #0071bd; }
#changeExample .conversation .answer h3 {
  font-size: 1.8rem;
  color: #0071bd; }
  #changeExample .conversation .answer h3 + * {
    margin-top: 24px; }
#changeExample .othersec {
  max-width: 880px;
  margin: 64px auto 0; }

@media screen and (max-width: 600px) {
  #changeExample .conversation li::before, #changeExample .conversation li::after {
    width: 56px;
    height: 56px;
    background-size: 28px; }
  #changeExample .conversation dl {
    padding: 64px 7.3% 32px; }
  #changeExample .conversation .client {
    padding: 0 0 0 88px; }
    #changeExample .conversation .client dl dd {
      font-size: 2rem; }
  #changeExample .conversation .answer {
    padding: 0 88px 0 0; }
  #changeExample .othersec {
    max-width: 100%; } }
