@charset "utf-8";
@media only screen and (min-width:768px) {
    footer {
        margin-top: 60px;
    }
}
/* #container ***********************/
#container {
    margin-top: 30px;
}
@media only screen and (min-width:768px) {
    #container {
        margin-top: 40px;
    }
}
/************************************/
/* #page_title **********************/
#page_title {
    padding: 30px 0 30px 0;
    background-color: rgb(229, 229, 229, 0.5);
    border-bottom: 5px solid var(--color_red);
    .area h1 {
        line-height: 1;
        font-weight: bold;
        display: flex;
        flex-flow: column;
        row-gap: 8px;
        .sub {
            font-size: 1.4rem;
            color: var(--color_red);
        }
        .main {
            font-size: 2.4rem;
        }
    }
}
@media only screen and (min-width:768px) {
    #page_title {
        padding: 40px 0 40px 0;
        .area h1 {
            row-gap: 10px;
            .sub {
                font-size: 1.8rem;
            }
            .main {
                font-size: 3.2rem;
            }
        }
    }
}
/************************************/
/* #summary *************************/
#summary {
    display: flex;
    flex-flow: column;
    row-gap: 30px;
    margin-top: 30px;
    .box {
        background-color: #FFFFFF;
        padding: 20px 0 20px 0;
        display: flex;
        flex-flow: wrap;
        justify-content: center;
        row-gap: calc(30px + 1px + 30px);
        >* {
            width: calc(330 / 352 * 100%);
        }
        .header {
            position: relative;
            &::after {
                content: "";
                display: block;
                width: 100%;
                height: 1px;
                position: absolute;
                bottom: -30px;
                left: 0;
                background-color: #CCCCCC;
            }
        }
        .body {
            dl.number {
                display: flex;
                flex-flow: column;
                row-gap: 30px;
                counter-reset: number 0;
                .block {
                    >dt {
                        font-size: 1.8rem;
                        font-weight: bold;
                        display: flex;
                        flex-flow: nowrap;
                        align-items: flex-start;
                        column-gap: 0.5em;
                        line-height: 1.3;
                        &::before {
                            counter-increment: number 1;
                            content: counter(number)".";
                        }
                    }
                    >dd {
                        ul.disc {
                            padding-left: 1em;
                            >li {
                                display: list-item;
                                list-style: disc;
                            }
                        }
                        address {
                            padding-left: 1em;
                        }
                    }
                }
            }
        }
    }
}
@media only screen and (min-width:768px) {
    #summary {
        .box {
            padding: 30px 0 30px 0;
        }
    }
}
/************************************/