@charset "UTF-8";
/*--------------------------------
width
--------------------------------*/
/*--------------------------------
color
--------------------------------*/
/*--------------------------------
レスポンシブ
--------------------------------*/
/* タブレット・SP */
/* SP */
/* PC */
/*--------------------------------
余白
--------------------------------*/
/*--------------------------------
font
--------------------------------*/
/* jp */
/* jp */
/*--------------------------------
ボタン
--------------------------------*/
/*--------------------------------
hoverアニメーション
--------------------------------*/
/*--------------------------------
矢印
--------------------------------*/
/*--------------------------------
アコーディオン
--------------------------------*/
.recommendation-area {
  margin: 35px 0 60px;
}
@media (min-width: 600px) {
  .recommendation-area {
    width: 980px;
    margin: 0 auto 62px;
  }
}
.recommendation-area .recommendation-inner {
  padding: 0 10px;
}
@media (min-width: 600px) {
  .recommendation-area .recommendation-inner {
    padding: 0;
  }
}
.recommendation-area .recommendation-inner .recommendation-title {
  font-size: 18px;
  font-weight: bold;
  text-align: left;
  color: #000066;
  margin-bottom: 34px;
}
@media (min-width: 600px) {
  .recommendation-area .recommendation-inner .recommendation-title {
    font-size: 26px;
  }
}
.recommendation-area .recommendation-inner .flex-area {
  padding: 0 26px;
}
@media (min-width: 600px) {
  .recommendation-area .recommendation-inner .flex-area {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 0;
  }
}
.recommendation-area .recommendation-inner .flex-area .item-block {
  position: relative;
  margin-bottom: 28px;
  border: 2px solid #FF6400;
}
@media (min-width: 600px) {
  .recommendation-area .recommendation-inner .flex-area .item-block {
    margin-bottom: 0;
    width: 32%;
  }
}
.recommendation-area .recommendation-inner .flex-area .item-block:nth-of-type(2) {
  border: 2px solid #FF9102;
}
.recommendation-area .recommendation-inner .flex-area .item-block:nth-of-type(2) .item-flex .right-text {
  width: 57%;
}
.recommendation-area .recommendation-inner .flex-area .item-block:nth-of-type(2) .item-flex .left-block {
  width: 43%;
}
.recommendation-area .recommendation-inner .flex-area .item-block:nth-of-type(3) .item-flex .right-text {
  width: 62%;
}
.recommendation-area .recommendation-inner .flex-area .item-block:nth-of-type(3) .item-flex .left-block {
  width: 38%;
}
.recommendation-area .recommendation-inner .flex-area .item-block .icon-number {
  position: absolute;
  top: 0;
  left: 0;
  width: 50px;
  height: 50px;
}
.recommendation-area .recommendation-inner .flex-area .item-block .icon-number .number-img {
  width: 100%;
}
.recommendation-area .recommendation-inner .flex-area .item-block .item-flex {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  padding: 20px 14px 14px;
}
@media (min-width: 600px) {
  .recommendation-area .recommendation-inner .flex-area .item-block .item-flex {
    padding-top: 30px;
  }
}
.recommendation-area .recommendation-inner .flex-area .item-block .item-flex .right-text {
  width: 54%;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.5;
  color: #000066;
  text-align: left;
}
.recommendation-area .recommendation-inner .flex-area .item-block .item-flex .left-block {
  width: 46%;
}
.recommendation-area .recommendation-inner .flex-area .item-block .item-flex .left-block .left-img {
  width: 100%;
}