@charset "UTF-8";

@media only screen and (min-width: 768px) {
    .news-subpage::before {
        background-image: url(../images/news/news-title.png);
    }
}

/*@media only screen and (min-width: 768px) and (max-width: 1151px) {
    .news-list > li {
        padding-bottom: 2.857143em;
    }

    .news-list > li:nth-child(odd) {
        position: relative;
    }

    .news-list > li:nth-child(odd)::after {
        content: '';
        display: block;
        position: absolute;
        left: -10%;
        width: 240%;
        height: 1px;
        background-color: #36c9dc;
        top: 100%;
    }

    .news-list > .fade-in-up:nth-child(even) {
        -webkit-transition-delay: 0.5s;
        transition-delay: 0.5s;
    }
}*/

@media only screen and (min-width: 768px) {
    .news-list {
        max-width: 1200px;
        margin-bottom: 3.75em;
    }

    .news-list > li {
        width: 26.666667%;
        margin: 6.25em 3.333333% 0;
        padding-bottom: 6.25em;
    }

    .news-list > li:nth-child(3) {
        margin-top: 0;
    }

    .news-list > li:nth-child(3n+1) {
        position: relative;
    }

    .news-list > li:nth-child(3n+1)::after {
        content: '';
        display: block;
        position: absolute;
        left: -12.666666%;
        width: 375%;
        height: 1px;
        background-color: #36c9dc;
        top: 100%;
    }

    /* .news-list > .fade-in-up:nth-child(3n-1) {
        -webkit-transition-delay: 0.5s;
        transition-delay: 0.5s;
    }

    .news-list > .fade-in-up:nth-child(3n-3) {
        -webkit-transition-delay: 1s;
        transition-delay: 1s;
    }

    .news-date > .new {
        width: 4em;
    } */
}

/* @media only screen and (min-width: 960px) {
    .news-date > .new {
        width: 6.25em;
    } */
}

.news-pagination {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.news-pagination > li {
    margin: 0;
    display: none;
}

.news-pagination > li.left-arrow,
.news-pagination > li.right-arrow {
    display: list-item;
}

.news-pagination > li.left-arrow {
    margin: 0 auto 0 0;
}

.news-pagination > li.right-arrow {
    margin: 0 0 0 auto;
}

.news-pagination a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    line-height: 1;
    border: 1px solid #32c8dc;
    text-align: center;
    color: #00bed6;
    text-decoration: none;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.2s ease-in-out;
    width: 3.214286em;
    height: 3.214286em;
}

.news-pagination .current a,
.news-pagination li:not(.left-arrow) a:hover,
.news-pagination li:not(.right-arrow) a:hover {
    background-color: #32c8dc;
    color: #fff;
}

.news-pagination > li.left-arrow a,
.news-pagination > li.right-arrow a {
    background-color: #bef0f5;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 0.821429em auto;
    border-color: #bef0f5;
}

.news-pagination > li.left-arrow a {
    background-image: url(../images/common/arrow-prev.png);
}

.news-pagination > li.right-arrow a {
    background-image: url(../images/common/arrow-next.png);
}

.news-pagination > li.left-arrow a:hover {
    background-image: url(../images/common/arrow-prev_on.png);
    border-color: #32c8dc;
}

.news-pagination > li.right-arrow a:hover {
    background-image: url(../images/common/arrow-next_on.png);
    border-color: #32c8dc;
}

@media only screen and (min-width: 768px) {
    .news-pagination {
        max-width: 91.666668%;
    }

    .news-pagination > li {
        margin: 0 0.625em;
        display: list-item;
    }

    .news-pagination > li.left-arrow {
        margin: 0 0.625em 0 0;
    }

    .news-pagination > li.right-arrow {
        margin: 0 0 0 0.625em;
    }

    .news-pagination a {
        width: 2.5em;
        height: 2.5em;
    }

    .news-pagination > li.left-arrow a,
    .news-pagination > li.right-arrow a {
        background-size: 0.625em auto;
    }
}

.detail-header {
    margin: 0 0 2em;
    border-bottom: 1px solid #36c9dc;
    padding-bottom: 0.5em;
}

.detail-header .date {
    font-size: 1.125em;
    margin-bottom: 0.75em;
}

.detail-header h2 {
    font-size: 1.5em;
    font-weight: 400;
    margin: 0;
}

.detail-image {
    margin: 5em auto;
    padding: 0;
    line-height: 1;
    text-align: center;
}

.detail-image img {
    width: auto;
}

.news-detail .button1 {
    width: 21.25em;
}

@media only screen and (min-width: 768px) {
    .news-detail {
        max-width: 1200px;
        width: 94%;
        margin-left: auto;
        margin-right: auto;
    }

    .detail-image {
        width: 83.333333%;
    }
}
