@charset "UTF-8";
/* 
======== CONTENTS ==========================================
    Site Name: コラム
    2023.11.28
=========================================================
*/

/* 既存レイアウト調整 */

.JS #Contents {
    padding: 0;
}
#Contents {
    min-width: 100%;
}
div#fc {
    width: 100%;
}
.hs-contents .hs-container,
div#fb {
    max-width: 100%;
    width: 100% !important;
    padding: 0;
}
.hs-headline {
    display: none;
}

/* ページ用スタイル */
.column .column__container {
    margin: 0 auto 13.3333333333vw;
    padding: 8vw 5.3333333333vw 0;
    width: 100%
}
@media (min-width: 768px) {
    .column .column__container {
        margin-bottom: 110px;
        padding: 46px 20px 0;
        max-width: 1060px
    }
}
@media (min-width: 1100px) {
    .column .column__container {
        padding: 46px 0 0
    }
}
.column .column__text {
    margin-top: 4vw;
    font-weight: 700
}
@media (min-width: 768px) {
    .column .column__text {
        margin-top: 25px;
        letter-spacing: 1px;
        font-size: 18px;
        line-height: 1.95
    }
}
.column .column-anchor {
    margin-top: 50px
}
@media (min-width: 768px) {
    .column .column-anchor {
        margin-top: 70px
    }
}
.column .column-anchor-list {
    display: flex;
    flex-flow: wrap
}
@media (min-width: 768px) {
    .column .column-anchor-list {
        align-items: center;
        flex-flow: row;
        min-height: 68px
    }
}
.column .column-anchor-list__item {
    margin-right: 4vw;
    border-bottom: 1px solid #e6e6e6;
    width: calc(50% - 4vw)
}
@media (max-width: 767px) {
    .column .column-anchor-list__item {
        margin-top: 4.8vw
    }
    .column .column-anchor-list__item:nth-of-type(2n) {
        margin-right: 0
    }
    .column .column-anchor-list__item:first-of-type,
    .column .column-anchor-list__item:nth-of-type(2) {
        margin-top: 0
    }
}
@media (min-width: 768px) {
    .column .column-anchor-list__item {
        margin-right: 40px;
        width: 25%
    }
    .column .column-anchor-list__item:last-child {
        margin-right: 0
    }
}
.column .column-anchor-list__link {
    margin: 4vw 0;
    font-weight: 700
}
@media (min-width: 768px) {
    .column .column-anchor-list__link {
        margin: 20px 0;
        font-size: 16px
    }
}
.content.content--dx .content__heading {
    background-image: url(-/media/57D96A4403DD4B89A58E82A8D11470ED.ashx);
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover
}
@media (min-width: 768px) {
    .content.content--dx .content__heading {
        background-image: url(-/media/DFB712906ABF49B996BA6F74F40F0E05.ashx);
        background-repeat: no-repeat;
        background-position: 50%;
        background-size: cover
    }
}
.content.content--it .content__heading {
    background-image: url(-/media/E08BBB72F74D43E0A1612646B59E68E7.ashx);
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover
}
@media (min-width: 768px) {
    .content.content--it .content__heading {
        background-image: url(-/media/3924CEBC663E416CAA9C547A716F02D0.ashx);
        background-repeat: no-repeat;
        background-position: 50%;
        background-size: cover
    }
}
.content.content--trend .content__heading {
    background-image: url(-/media/835F6C64FDE746849190FA7D20008F0A.ashx);
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover
}
@media (min-width: 768px) {
    .content.content--trend .content__heading {
        background-image: url(-/media/CE42D661CE3F41CEBB177E588966DCDA.ashx);
        background-repeat: no-repeat;
        background-position: 50%;
        background-size: cover
    }
}
.content .content__heading {
    display: flex;
    align-items: center;
    margin: 0 5.3333333333vw;
    padding: 0 8vw;
    height: 38.1333333333vw
}
.content .content__heading h2 {
    color: #fff
}
@media (min-width:768px) {
    .heading-2 {
        font-size: 1.875rem;
        line-height: 1.6666666667
    }
    .heading-2.heading-2--en,
    html[lang=en] .heading-2 {
        font-family: メイリオ, meiryo, arial, helvetica, sans-serif;
        font-size: 2.75rem;
        font-weight: 400;
        line-height: 1.4090909091
    }
}
@media (min-width: 768px) {
    .content .content__heading {
        margin: 45px 20px 0;
        padding: 0 34px;
        max-width: 1060px;
        height: 222px
    }
}
@media (min-width: 1100px) {
    .content .content__heading {
        margin: 45px auto 0
    }
}
.content .content__container {
    margin: 0 auto;
    padding: 8.5333333333vw 5.3333333333vw 12.8vw;
    width: 100%
}
@media (min-width: 768px) {
    .content .content__container {
        padding: 65px 20px 60px;
        max-width: 1060px
    }
}
@media (min-width: 1100px) {
    .content .content__container {
        padding: 65px 0 60px
    }
}
.content .content-list {
    display: flex;
    flex-flow: wrap
}
.content .content-list__item {
    position: relative;
    border: 1px solid #e6e6e6;
    border-radius: 4px;
    width: 100%
}
@media (min-width: 768px) {
    .content .content-list__item {
        margin-top: 25px;
        width: calc(50% - 18px)
    }
    .content .content-list__item:first-of-type,
    .content .content-list__item:nth-of-type(2) {
        margin-top: 0
    }
    .content .content-list__item:nth-of-type(2n) {
        margin-left: 18px
    }
    .content .content-list__item:nth-of-type(odd) {
        margin-right: 18px
    }
}
@media (max-width: 767px) {
    .content .content-list__item:not(:first-child) {
        margin-top: 4vw
    }
}
.content .content-list__link {
    display: block;
    position: relative;
    padding: 5.6vw 8vw 6.6666666667vw;
    width: 100%
}
@media (min-width: 768px) {
    .content .content-list__link {
        padding: 26px 35px 94px;
        transition: opacity .2s cubic-bezier(.39, .575, .565, 1)
    }
    .content .content-list__link:hover {
        opacity: .7
    }
}
.content .content-list__tags {
    display: flex;
    flex-wrap: wrap
}
.content .content-list__tag {
    display: block;
    margin: 1.0666666667vw 2.1333333333vw 1.0666666667vw 0;
    padding: 1.3333333333vw 4vw;
    border: 1px solid #bbb;
    border-radius: 16px;
    background-color: #f0f3f5;
    font-size: 2.6666666667vw
}
@media (min-width: 768px) {
    .content .content-list__tag {
        margin: 4px 8px 4px 0;
        padding: 6px 15px;
        font-size: 10px
    }
}
.content .content-list__heading {
    margin-top: 4.5333333333vw;
    font-size: 4.2666666667vw;
    font-weight: 700
}
@media (min-width: 768px) {
    .content .content-list__heading {
        margin-top: 14px;
        font-size: 20px
    }
}
.content .content-list__text {
    margin-top: 4vw;
    font-size: 3.4666666667vw;
    font-weight: 400
}
@media (min-width: 768px) {
    .content .content-list__text {
        margin-top: 4px;
        font-size: 13px
    }
}
.content .content-list__button {
    margin-top: 5.3333333333vw;
    padding: 0;
    width: 54.9333333333vw;
    height: 10.6666666667vw;
    min-height: inherit;
    text-align: center
}
.content .content-list__button:before {
    background-image: url(/-/media/Project/design2022/common/icon_arrow_white.svg)
}
.content .content-list__button:hover {
    opacity: 1
}
@media (min-width: 768px) {
    .content .content-list__button {
        position: absolute;
        bottom: 40px;
        margin-top: 25px;
        width: 206px;
        height: 40px
    }
}