@charset "utf-8";

/* ページ見出し */
.body-review .head2 .inner {
    background: url( ../img/review/img_tit.png) no-repeat center right -18px/ contain;
}
/* 営業所シングル */
.body-review single {
    display: flex;
    justify-content: space-between;
    border-radius: 16px;
    padding: 10px;
    margin-bottom: 1.8em;
}
.body-review single figure {
    margin: 0;
}
.body-review single figure img {
    width: 123px;
    border-radius: 8px;
    opacity: 0.8;
}

.body-review single data {
   width : calc(100% - 140px) ;
}


/* 個々の色 */



.body-review #content section:first-of-type h3.head3:after {
    background-color: #f0b055; /* 線色 */
}
.body-review section single:first-of-type img {
    background: #f3c6c6;
}
.body-review section single:nth-of-type(2) img  {
    background: #f3dfc6;
}
.body-review section single:nth-of-type(3) img  {
    background: #e7f3c6;
}
.body-review section single:nth-of-type(4) img  {
    background: #c6f3cd;
}
.body-review section single:nth-of-type(5) img  {
    background: #c6f3f1;
}
.body-review section single:nth-of-type(6) img  {
    background: #d2d4f3;
}



/* 引用 */
blockquote {
  position: relative;
  padding: 42px 25px 25px 25px;
  box-sizing: border-box;
  font-style: italic;
    background: #fff9e1;
  border-radius: 8px;
  color: #333;
}

blockquote:before{
  display: inline-block;
  position: absolute;
  top: 18px;
  left: 20px;
  content: "\f10d";
  font-family: FontAwesome;
  font-size: 28px;
  line-height: 1;
  font-weight: 900;
  color: #ccc;
}

blockquote p {
  padding: 0;
  margin: 10px 0;
  line-height: 1.7;
}

blockquote cite {
  display: block;
  text-align: right;
  font-size: 0.9em;
  color: #999;
}
/* blockquoteの色 */
.body-review section single blockquote{
    background:  #f6f6f6;
    border-right: #d1d1d1 1px solid;
    border-bottom: #d1d1d1 1px solid;
}
.body-review section single:nth-of-type(1) blockquote:before  {
    color: #f3c6c6;
}
.body-review section single:nth-of-type(2) blockquote:before  {
    color: #f3dfc6;
}
.body-review section single:nth-of-type(3) blockquote:before  {
    color: #d2e2a8;
}
.body-review section single:nth-of-type(4) blockquote:before  {
    color: #bbeac2;
}
.body-review section single:nth-of-type(5) blockquote:before  {
    color: #ace5e2;
}
.body-review section single:nth-of-type(6) blockquote:before {
    color: #d2d4f3;
}

@media screen and (max-width: 780px) {
.body-review single figure {
    width: 19%;
}
.body-review single figure img {
    width: 100%;
}
.body-review single data {
   width : calc(100% - 21%) ;
}
blockquote:before{
  font-size: 20px;
}
}