@charset 'UTF-8';

h3
{
    font-family: 'Mukta';
}

/*-----------------------------------
fv
--------------------------------------------------------*/
#bg-news
{
    height: 320px;

    background-image: url(../img/bg-news.jpg);
}

@media (max-width:960px)
{
    #bg-news
    {
        height: 160px;
    }
}

/*-----------------------------------
ニュース一覧ページ
--------------------------------------------------------*/
.news-list
{
    width: 60%;
    margin: auto;
    margin-bottom: 120px;
}

.news-card
{
    display: flex;

    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;

    border-bottom: 1px solid rgba(0,0,0,.1);
}

.news-card .news-image
{
    height: 120px;

    object-fit: cover;
}

.news-card .eye-catch
{
    width: 30%;
}

.news-card .news-summary
{
    font-size: 80%;

    width: 70%;
    padding: 10px 20px 10px 20px;
}
.news-card .news-summary h4
{
    font-size: 140%;
    font-weight: bold;

    margin-bottom: 2px;
}

.news-card .news-summary .category
{
    font-size: 80%;

    margin-bottom: 10px;
}
.news-card .news-summary .arrow
{
    padding-top: 20px;

    text-align: right;
}

.news-card .news-summary .arrow a
{
    margin-right: 15px;
}

.news-card .news-summary .stickarrow
{
    width: 60px;
    height: 8px;
    margin-top: 8px;
    margin-left: auto;

    transform: skew(45deg);

    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
}

.news-card .news-summary .arrow:hover
{
    margin-right: -5px;

    transition: .3s;
}

@media (max-width:960px)
{
    .news-list
    {
        width: 80%;
    }

    .news-card
    {
        padding-top: 10px;
        padding-right: 10px;
        padding-bottom: 10px;
        padding-left: 10px;
    }

    .news-card .news-summary
    {
        width: 70%;
        padding: 10px 0 5px 10px;
    }
}

@media (max-width:560px)
{
    .news-list
    {
        width: 90%;
    }
}


/*-----------------------------------
個別ニュースページCSS
--------------------------------------------------------*/
.news-page
{
    margin-bottom: 80px;
}
.news-page .eye-catch
{
    text-align: center;
}

.news-content
{
    width: 70%;
    margin: auto;
}

.news-content h2
{
    font-weight: bold;

    margin: 10px auto 10px;
}


.news-content .news-p
{
    margin: 40px auto 40px ;
}



@media (max-width:960px)
{
    .news-content
    {
        width: 80%;
    }
}


#news-btn
{
    text-align: center;
}

#link-newspage
{
    font-family: 'Mukta';

    display: inline-block;

    width: 40%;
    margin: auto;
    margin-top: 20px;
    padding-top: 8px;
    padding-right: 16px;
    padding-bottom: 8px;
    padding-left: 16px;

    color: #333;
    border: 1px #666 solid;
    box-shadow: 4px 4px 0 #666;
}

#link-newspage:hover
{
    margin-top: 22px;
    margin-bottom: -2px;

    background-color: rgba(0,0,0,.1);
    box-shadow: 2px 2px 0 #666;
}

@media (max-width:960px)
{
    #link-newspage
    {
        width: 80%;
    }
}

.eye-catch img
{
    width: 100%;
    height: auto;
    margin: auto;

    object-fit: cover;
}
@media (max-width:960px)
{
    .eye-catch img
    {
        width: 100%;
        height: auto;
        margin: auto;

        object-fit: cover;
    }
    .news-content .news-title
    {
        font-size: 160%;
    }
}

.category
{
    font-size: 80%;

    display: inline-block;

    padding: 1px 4px;

    color: #fff;
    background-color: #333;
}

.news-content a
{
    text-decoration: underline;

    color: #03c;
    outline: none;
}

.created_at
{
    opacity: .5;
}
