.banner-ads1 {
    padding: 0.875rem 0;
    margin-top: 4.5rem;
    max-height: 118px;
}

.main {
    max-width: 1920px;
    height: auto;
    padding-inline: 8px;
    display: flex;
    justify-content: center;
    padding: 3rem 2rem 2rem 2rem;
}

.top_main {
    max-width: 1920px;
    height: auto;
    padding-inline: 8px;
    display: flex;
    justify-content: center;
    padding: 3rem 2rem 2rem 2rem;
}

img {
    max-width: 872px;
    height: auto;
}



@media (min-width: 1200px) {
    .top_container-box {
        display: grid;
        grid-template-columns: minmax(0, 52.5em) 20.0em;
        grid-template-rows: auto;
        gap: 0px 1rem;
        grid-auto-flow: row;
        grid-template-areas:
            "contents-box right-rail";
    }

    .top_container-detail {
        display: grid;
        grid-template-columns: minmax(0, 51.5em);
        grid-template-rows: auto auto auto auto;
        gap: 0px 3em;
        grid-auto-flow: row;
        grid-template-areas:
            "header"
            "post-header"
            "pre-content"
            "comment";
    }

    .container-box {
        display: grid;
        grid-template-columns: minmax(0, 52.5em) 20.0em;
        grid-template-rows: auto;
        gap: 0px 3rem;
        grid-auto-flow: row;
        grid-template-areas:
            "contents-box right-rail";
    }

    .container-detail {
        display: grid;
        grid-template-columns: minmax(0, 51.5em);
        grid-template-rows: auto auto auto auto;
        gap: 0px 3em;
        grid-auto-flow: row;
        grid-template-areas:
            "header"
            "post-header"
            "pre-content"
            "comment";
    }
}

@media (max-width: 1199px) {
    .top_container-box {
        display: grid;
        grid-template-columns: minmax(0, 56.5em) 18.75em;
        grid-template-rows: auto;
        gap: 0 1rem;
        grid-auto-flow: row;
        grid-template-areas:
            "contents-box right-rail";
    }

    .top_container-detail {
        display: grid;
        grid-template-columns: minmax(0, 56.5em);
        grid-template-rows: auto auto auto auto;
        gap: 0 1rem;
        grid-auto-flow: row;
        grid-template-areas:
            "header"
            "post-header"
            "pre-content"
            "comment";
    }

    .container-box {
        display: grid;
        grid-template-columns: minmax(0, 40.5em) 18.75em;
        grid-template-rows: auto;
        gap: 0px 3em;
        grid-auto-flow: row;
        grid-template-areas:
            "contents-box right-rail";
    }

    .container-detail {
        display: grid;
        grid-template-columns: minmax(0, 40.5em);
        grid-template-rows: auto auto auto auto;
        gap: 0px 3em;
        grid-auto-flow: row;
        grid-template-areas:
            "header"
            "post-header"
            "pre-content"
            "comment";
    }
}

@media (max-width: 992px) {
    .top_container-box {
        display: grid;
        grid-template-columns: minmax(0, 56.5em);
        grid-template-rows: auto auto;
        gap: 0px 3em;
        grid-auto-flow: row;
        grid-template-areas:
            "contents-box"
            "right-rail";
    }

    .top_main {
        margin: 30px 10px;
        padding: 0px;
    }

    .container-box {
        display: grid;
        grid-template-columns: minmax(0, 40.5em);
        grid-template-rows: auto auto;
        gap: 0px 3em;
        grid-auto-flow: row;
        grid-template-areas:
            "contents-box"
            "right-rail";
    }

    .main {
        padding: 3rem 2rem 2rem 2rem;
    }
}

.month_popular_second {
    font-size: 14px;
}

@media ( 500px <= width <= 575.9px) {
    .recently_blog_list
    {
        padding: 0rem 2rem 0rem 2rem;
    }
}

.contents-box {
    grid-area: contents-box;
}

.header {
    grid-area: header;
}

.post-header {
    grid-area: post-header;
}

.left-rail {
    grid-area: left-rail;
}

.pre-content {
    grid-area: pre-content;
}

.pre-content p,
.pre-content h2,
.pre-content h3,
.pre-content ol {
    margin: 0.2rem 0.2rem;
}

.right-rail {
    grid-area: right-rail;
    margin-bottom: 1rem;
}

.comment1 {
    grid-area: comment;
}

.table-of-contents {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}

.table-of-contents .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}

.table-of-contents p {
    margin: 0;
    padding: 0;
}

#toolbar {
    position: sticky;
    top: 0;
    z-index: 1;
}

@media (min-width: 1200px) {
    .create-edit-box {
        display: grid;
        grid-template-columns: minmax(0, 52.5em) 20.0em;
        grid-template-rows: auto;
        gap: 0px 1rem;
        grid-auto-flow: row;
        grid-template-areas:
            "form-box manual-box";
    }

    .container-detail {
        display: grid;
        grid-template-columns: minmax(0, 51.5em);
        grid-template-rows: auto auto auto auto;
        gap: 0px 3em;
        grid-auto-flow: row;
        grid-template-areas:
            "header"
            "post-header"
            "pre-content"
            "comment";
    }
}

.form-box {
    grid-area: form-box;
}

.manual-box {
    grid-area: manual-box;
}