@charset "utf-8";
@import url("style.css");

/* event
---------------------------------------------------- */

.event-list {
    margin: 40px 0px;
}

.event-list li {
    display: block;
    float: left;
    width: 300px;
    margin: 0px 50px 30px 0px;
}

.event-list li:nth-child(3n) {
    margin-right: 0px;
}

.event-list li:nth-child(3n + 1) {
    clear: both;
}

.event-list .date {
    line-height: 1.4;
    margin: 10px 0px;
}

.event-list .name {
    line-height: 1.4;
    margin: 10px 0px;
    font-size: 17px;
    font-weight: 700;
}

.event-list dl + dl {
    margin-top: 5px;
}

.event-list dt {
    width: 70x;
    line-height: 1.4;
    float: left;
}

.event-list dd {
    margin-left: 70px;
    line-height: 1.4;
}

@media screen and (max-width: 768px) {
    #event {
        margin: 0px 30px;
    }
    .event-list li,
    .event-list li:nth-child(3n) {
        float: none;
        width: 300px;
        margin: 0px auto 30px;
    }
}

@media screen and (max-width: 480px) {
    #event {
        margin: 0px 20px;
    }
    .event-list {
        margin: 30px 0px;
    }
    .event-list li,
    .event-list li:nth-child(3n) {
        width: auto;
        max-width: 300px;
    }
    .event-list .name {
        font-size: 16px;
    }
    .event-list dt {
        width: 60x;
    }
    .event-list dd {
        margin-left: 60px;
    }
}

@media screen and (max-width: 320px) {
    .event-list .name {
        font-size: 15px;
    }
    .event-list dt {
        width: 55x;
    }
    .event-list dd {
        margin-left: 55px;
    }
}

/* single-post
---------------------------------------------------- */

#single-post-body {
    margin-bottom: 50px;
}

#single-post .date {
    font-size: 16px;
    margin: 25px 0px;
}

#single-post .post-title {
    margin: 30px 0px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
}

#single-post p {
    font-size: 14px;
    line-height: 2;
    margin: 30px 0px;
}

#single-post .catch1 {
    font-size: 16px;
}

#single-post .small {
    font-size: 12px;
}

@media screen and (max-width: 768px) {
    #single-post {
        padding: 0px 30px;
    }
    #single-post-body {
        padding-bottom: 30px;
    }
    #single-post .date {
        margin: 20px 0px 10px;
    }
    #single-post .post-title {
        margin: 0px 0px 30px;
        font-size: 20px;
    }
    #single-post p {
        line-height: 1.8;
    }
    #single-post .catch1 {
        font-size: 15px;
    }
}

@media screen and (max-width: 480px) {
    #single-post {
        padding: 0px 20px;
    }
    #single-post-body {
        padding-bottom: 0px;
    }
    #single-post .date {
        font-size: 15px;
        margin: 20px 0px 3px;
    }
    #single-post .post-title {
        margin: 0px 0px 20px;
        font-size: 16px;
    }
}
