@charset "utf-8";

body {
    background-color: #fffaed;
    font-size: 11px;
    color: #6e5064;
    font-family: "M PLUS Rounded 1c", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

header {
     padding: 10px 30px 30px;
}

h1 {
    text-align: center;
}

.logo {
    width: 70px;
    height: 70px;
}

nav ul {
    margin: 0 auto;
    max-width: 736px;
    padding: 4px 0;
    flex-wrap: wrap;
    display: flex;
    justify-content: center;
    border-top: 2px solid #6e5064;
    border-bottom: 2px solid #6e5064;
    gap: 1rem;
}

nav ul li a {
    font-weight: bold;
}

nav ul li a:hover {
    color: #998675;
}

main {
    text-align: center;
    margin: 0px 30px;
}

.main_title {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 20px;
}

.main_pic {
    margin: 0 auto 20px auto;
    box-shadow: 5px 5px 5px gray;
    width: 100%;
    max-width: 736px;
}

main p {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 30px;
}

.info {
    background-color: #ffe8dc;
    border-radius: 10px;
    box-shadow: 5px 5px 5px gray;
    margin: 0 auto 70px auto;
    padding: 20px 30px;
    max-width: 300px;
    text-align: center;
}

section h3 {
    font-size: 21px;
    font-weight: bold;
    padding-bottom: 15px;
}

table th,
table td {
    text-align: left;
    padding: 5px;
}

.copyright {
    background-color: #998675;
    text-align: center;
    padding: 10px 0;
    color: #fff;
}

@media (min-width:550px) {
    .logo {
        width: 140px;
        height: 140px;
    }

    nav ul {
        font-size: 20px;
        padding: 8px 0px;
        gap: 2rem;
        border-top: 3px solid #6e5064;
        border-bottom: 3px solid #6e5064;
        margin-bottom: 30px;
    }

    .main_title {
        font-size: 46px;
        margin-bottom: 60px;
    }


    main {
        margin: 0px 40px;
    }

    .main_pic {
        margin: 0 auto 60px auto;
    }

    main p {
        font-size: 22px;
        margin-bottom: 60px;
    }

    .info {
        max-width: 450px;
        margin-bottom: 100px;

    }

    section h3 {
        font-size: 30px;
    }

    table th,
    table td {
        font-size: 20px;
        padding: 10px;
    }
}