@charset "UTF-8";

.freepage_column01 .recommendation ul {
    display: flex;
    flex-wrap: wrap;
    margin-top: 46px;
}
.freepage_column01 .recommendation li {
    width: calc((100% - 60px) / 4);
}
.freepage_column01 .recommendation li:not(:nth-child(4)) {
    margin-right: 20px;
}
.recommendation h4 {
    font-size: 14px;
    color: #000000;
    margin: 15px 0 5px 0;
    padding: 0;
    border: none;
    height: 56px;
}
.freepage_column01 .recommendation li p {
    font-size: 12px;
    color: #000000
}
.freepage_column01 .recommendation li p:nth-child(4) {
    text-align: right;
}
.freepage_column01 .recommendation li p span {
    font-size: 14px;
}
.freepage_column01 .recommendation li,
.freepage_column01 .recommendation li a {
    position: relative;
}
.freepage_column01 .recommendation li .icon,
.freepage_column01 .recommendation li .icon a {
    font-size: 10px;
    color: #ffffff;
    margin: 0 2px;
    padding: 2px 4px;
}
.freepage_column01 .recommendation li .icon__wrapper,
.freepage_column01 .recommendation li a .icon__wrapper {
    display: flex;
    margin-top: 15px;
}
.freepage_column01 .recommendation li .icon1,
.freepage_column01 .recommendation li a .icon1 {
    background-color: #d44828;
}
.freepage_column01 .recommendation li .icon2,
.freepage_column01 .recommendation li a .icon2 {
    background-color: #cb856e;
}
.freepage_column01 .recommendation li .icon3,
.freepage_column01 .recommendation li a .icon3 {
  background-color: #D47128;
}
.freepage_column01 .recommendation li .icon3 a {
    margin: 0;
    padding: 0;
    color: #ffffff;
}
.freepage_column01 .recommendation li .icon3 a:hover {
    opacity: 0.7;
}
.freepage_column01 .recommendation li .brand_no-icon {
  height: 19px;
}
.freepage_column01 .recommendation li .icon__wrapper + .icon__wrapper {
  margin-top: 5px;
}

@media screen and (max-width: 768px) {
    .freepage_column01 {
        margin-bottom: 100px;
    }
    .freepage_column01 .column--head p,
    .freepage_column01 .column--body {
        margin: 0 3%;
    }
    .freepage_column01 .column--body h2 {
        margin-top: 40px;
    }
    .freepage_column01 .mb20 {
        margin-bottom: 20px;
    }
    .freepage_column01 .column--head p,
    .freepage_column01 .column--inner p {
        line-height: 1.8;
    }
    .freepage_column01 .column--inner .image_right_ {
        margin-bottom: 20px;
    }
    .freepage_column01 .recommendation ul {
        margin-top: 0;
    }
    .freepage_column01 .recommendation ul li {
        width: calc((100% - 10px) / 2);
        margin-bottom: 24px;
    }
    .freepage_column01 .recommendation li:nth-child(odd) {
        margin-right: 10px;
    }
    .freepage_column01 .recommendation li:nth-child(even) {
        margin-right: 0;
    }
    .freepage_column01 .recommendation ul li img {
        height: auto;
    }
    .freepage_column01 .recommendation h4 {
        font-size: 12px;
        font-weight: 400;
        margin-top: 14px;
        height: 34px;
    }
    .freepage_column01 .recommendation li p:nth-child(4),
    .freepage_column01 .recommendation li h4 + p {
        text-align: right;
        font-size: 14px;
    }
    .freepage_column01 .recommendation li p {
        font-size: 10px;
    }
}