@charset "UTF-8";

#news-detail {
    background-image: url("/images/bg.jpg");
    background-repeat: repeat;
    background-size: cover;
}

#news-detail > picture img {
    width: 100%;
    height: auto;
}

/* content */
#news-detail .content {
    width: 87.2vw;
    height: auto;
    margin: auto;
    padding: 108px 0 80px;
    text-align: center;
}

#news-detail .date {
    margin-bottom: 8px;
    font-family: "noto-sans-cjk-jp", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 14px;
    font-size: clamp(14px, 0.658rem + 0.92vw, 20px);
    line-height: 1.42em;
    text-align: left;
    color: #2c2c2c;
    display: block;
}

#news-detail .title {
    margin-bottom: 9px;
    font-family: "noto-sans-cjk-jp", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 24px;
    font-size: clamp(24px, 1.211rem + 1.23vw, 32px);
    line-height: 1.5em;
    text-align: left;
    color: #2c2c2c;
}

#news-detail .content img {
    width: 70%;
    height: auto;
    margin-bottom: 30px;
}

#news-detail .content p {
    margin-bottom: 80px;
    font-family: "noto-sans-cjk-jp", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 14px;
    font-size: clamp(14px, 0.731rem + 0.62vw, 18px);
    line-height: 1.42em;
    text-align: left;
    color: #2c2c2c;
    overflow-wrap: break-word;
}

#news-detail .cms-news-body {
    margin-bottom: 80px;
}

#news-detail .cms-news-body p {
    margin-bottom: 1.3em;
}

#news-detail .back-btn {
    font-family: 'Noto Serif JP', serif;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    font-size: clamp(16px, 0.928rem + 0.31vw, 18px);
    letter-spacing: 0.1em;
    text-align: center;
    color: #000000;
    text-decoration: none;
}

/**********************************************************
* min-width: 600px
/**********************************************************/
@media screen and (min-width: 600px) {
    
}

/**********************************************************
* min-width: 1025px
/**********************************************************/
@media screen and (min-width: 1025px) {
    #news-detail {
    }

    #news > picture img {
    }

    /* content */
    #news-detail .content {
        width: 82.08vw;
        padding: 94px 0 202px;
    }

    #news-detail .date {
        margin-bottom: 17px;
        font-size: 24px;
        font-size: clamp(20px, 0.964rem + 0.45vw, 24px);
        line-height: 1.45em;
    }

    #news-detail .title {
        margin-bottom: 44px;
        font-size: 40px;
        font-size: clamp(34px, 1.696rem + 0.67vw, 40px);
        line-height: 1.45em;
    }

    #news-detail .content img {
        margin-bottom: 94px;
    }

    #news-detail .content p {
        margin-bottom: 126px;
        font-size: 24px;
        font-size: clamp(20px, 0.964rem + 0.45vw, 24px);
        line-height: 1.45em;
    }

    #news-detail .cms-news-body {
        margin-bottom: 126px;
    }

    #news-detail .back-btn {
        font-size: 24px;
        font-size: clamp(20px, 0.964rem + 0.45vw, 24px);
        letter-spacing: 0.1em;
    }
}


@media screen and (min-width: 200px) and (max-width: 600px) {
    #news-detail .content img {
        width: 100%;
}
}