

@font-face {
    font-family: 'Noto Serif JP';
    font-weight: 400;
    src: url("/Page/column/210818/font/NotoSerifCJKjp-Regular.otf");
}
@font-face {
    font-family: 'Noto Serif JP';
    font-weight: 500;
    src: url("/Page/column/210818/font/NotoSerifCJKjp-Medium.otf");
}
.main-area .contentsTtl{
    margin-top: 50px!important;
}

.main-area ul.topics_area{
    max-width: 1040px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto 50px;
    text-align: center;
}

.main-area ul.topics_area li{
    /* width: 48%; */
    width: 500px;
}
.main-area ul.topics_area li .sp-image {
    width: 100%;
}
.main-area ul.topics_area li .ttl{
   font-family: "游明朝体", YuMincho, "游明朝 Medium", "Yu Mincho","Hiragino Mincho ProN",HGS明朝E ,"yumin","メイリオ",serif;
    font-size: 20px;
    letter-spacing: 0.03em;
    margin: 18px auto;
    line-height: 1;
}
.main-area ul.topics_area li .ttl span{
    font-size: 20px;
    font-family: 'EB Garamond', serif;
    letter-spacing: 0.06em;
}
.main-area ul.topics_area li .ttx{
    font-family: 'EB Garamond', serif;
    font-size: 14px;
    letter-spacing: 0.03em;
    margin-bottom: 50px;
}

.main-area .commonArea .link{
    width: 580px;
    margin: 85px auto 0;
    display: flex;
    justify-content: space-between;
}

.main-area .commonArea .link a > span{
	font-size: 14px;
    line-height: 24px;
    border-bottom: 1px solid;
    padding-bottom: 5px;
    width: 240px;
    font-family: 'EB Garamond',"游明朝体", YuMincho, "游明朝 Medium", "Yu Mincho","Hiragino Mincho ProN",HGS明朝E ,"yumin","メイリオ",serif;
    letter-spacing: 0.04em;
}
.main-area .commonArea .link a > span span{
    display: inline-block;
    font-size: 16px;
    margin: 0;
    margin-top: 2px;
    letter-spacing: 0.06em;
}

.main-area .commonArea .link a > ._07{
    font-size: 12px;
}

.main-area .commonArea .link a > span span .fray{
    font-size: 18px;
    font-family: 'EB Garamond', serif;
    margin-right: 3px;
}

.main-area .commonArea .link a > ._07 .new_01{
    margin: 0 2px 0 5px;
    display: inline-block;
}

.main-area .commonArea .link a > ._07 .new_02{
    margin: 0 5px 0 2px;
    display: inline-block;
}
.main-area .commonArea .link a> ._08{
    font-size: 12px;
    font-family:  "Noto Serif JP",serif;
    /* line-height: calc(26.5 *(100vw / 1200)); */
    padding-top: 4px;
}
.main-area .commonArea .link a> ._08_02{
    font-family: "Noto Serif JP",serif;
    font-size: 18px;
}

@media only screen and (max-width: 1400px) {
    .main-area .contentsTtl{
        margin-top: calc(50 *(100vw / 1400))!important;
    }

    .main-area ul.topics_area{
        max-width: calc(1040 *(100vw / 1400));
        margin: 0 auto calc(50 *(100vw / 1400));
    }

    .main-area ul.topics_area li{
        width: calc(500 *(100vw / 1400));
    }
    .main-area ul.topics_area li .ttl{
        font-size: calc(20 *(100vw / 1400));
        margin: calc(18 *(100vw / 1400)) auto;
    }
    .main-area ul.topics_area li .ttl span{
        font-size: calc(20 *(100vw / 1400));
    }
    .main-area ul.topics_area li .ttx{
        font-size: calc(14 *(100vw / 1400));
        margin-bottom: calc(50 *(100vw / 1400));
    }

    .main-area .commonArea .link{
        width: calc(580 *(100vw / 1400));
        margin: calc(85 *(100vw / 1400)) auto 0;
    }

    .main-area .commonArea .link a > span{
        font-size: calc(14 *(100vw / 1400));
        line-height: calc(24 *(100vw / 1400));
        padding-bottom: calc(5 *(100vw / 1400));
        width: calc(240 *(100vw / 1400));
    }
    .main-area .commonArea .link a > span span{
        font-size: calc(16 *(100vw / 1400));
        margin-top: calc(2 *(100vw / 1400));
    }

    .main-area .commonArea .link a > ._07{
        font-size: calc(12 *(100vw / 1400));
    }
    .main-area .commonArea .link a > ._08{
        font-size: calc(12 *(100vw / 1400));
    }

    .main-area .commonArea .link a > span span .fray{
        font-size: calc(18 *(100vw / 1400));
        margin-right: calc(3 *(100vw / 1400));
    }

    .main-area .commonArea .link a > ._07 .new_01{
        margin: 0 calc(2 *(100vw / 1400)) 0 calc(5 *(100vw / 1400));
        display: inline-block;
    }
    
    .main-area .commonArea .link a > ._07 .new_02{
        margin: 0 calc(5 *(100vw / 1400)) 0 calc(2 *(100vw / 1400));
        display: inline-block;
    }

}