@charset "utf-8";
/* 管理組合運営事業 */
#S01 .flexBox4 ul {
  justify-content: center;
}
#S02 .flexBox3 {}
#S02 .flexBox3 ul {
  flex-wrap: wrap;
  justify-content: center;
}
#S02 .flexBox3 ul li {
  padding: 20px;
  margin: 5px;
  border: 1px solid #c7cbcb;
  background: #e6f5e9;
}
#S02 .flexBox3 ul h3 {
  padding: 0 0 10px;
  margin: 0;
}
#S02 .flexBox3 ul p {
  text-align: left;
  padding: 0;
  font-size: 90%;
}
#S03 .detailBox {
  padding: 0;
}
#S03 .leftBox {
  width: 45%;
  padding: 2%;
}
#S03 .rightBox {
  width: 45%;
  padding: 2%;
}
#S03 .leftBox h4 {
  background: #666;
  color: #fff;
}
#S03 .leftBox h5 {
  border: 1px solid #666;
}
#S03 .rightBox h4 {
  background: #17bed2;
  color: #fff;
}
#S03 .rightBox h5 {
  border: 1px solid #2e686f;
}
#S03 .rightBox h5.wh {
  border: 1px solid #fff;
}
#S03 h5 {
  position: relative;
  display: block;
}
#S03 h5::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 50px solid transparent;
  border-left: 50px solid transparent;
  border-top: 60px solid #555555;
  border-bottom: 0;
}
#S03 h5::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-top: 8px solid #17bed2;
  border-bottom: 0;
  bottom: -9px;
  left: 20%;
}
#S03 h5:nth-last-child(1)::after {
  display: none;
}

/*----------------------------------------------------------- 640px */
@media screen and (max-width: 640px) {
#S01 .flexBox4 ul {flex-flow: wrap;}
#S01 .flexBox4 ul li {width: calc(100% / 2);}
#S03 .detailBox {flex-flow: column;}
#S03 .leftBox {width: 100%;}
#S03 .rightBox {width: 100%;}

}