@charset "utf-8";

/* ヘッダー */
header p img {
    height: 600px;
    object-fit: cover;
    display: block;
}

header {
    margin-bottom: 80px;
}


/* メイン */
main {
    padding: 0 15px;
}

main h2 {
    font-size: 32px;
    text-align: center;
    margin-bottom: 60px;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
}

/* セクション１ */
.about {
    margin-bottom: 98px;
}

.about img {
    display: block;
    max-width: 100px;
    border-radius: 50%;
    margin: 0 auto 10px;
}

.about h3 {
    font-size: 16px;
    margin-bottom: 7px;
}

/* セクション ２*/
.bicycle {
    margin-bottom: 138px;
}

.bicycle img {
    display: block;
    margin-bottom: 7px;
}

.bicycle dl {
    margin-bottom: 28px;
}

.bicycle dt {
    font-weight: bold;
}

.bicycle dt,
.bicycle dd {
    text-align: center;
}


@media (width >=600px) {

    /* ヘッダー */
    
    header p img {
        height: auto;
    }

    /* メイン */
    main {
        max-width: 960px;
        margin: 0 auto;
    }

    /* セクション１ */
    .about div {
        display: grid;
        grid-template-columns: 1fr 2fr;
        max-width: 650px;
        margin: 0 auto;
    }

    .about .aboutImg {
        grid-row: 1/3;
        grid-column: 1/2;
    }

    .about img {
        margin-bottom: 0;
    }

    .about h3 {
        margin-bottom: 0;
    }

    /* セクション２ */
    .bicycle {
        margin-bottom: 108px;
    }

    .bicycle img {
        max-width: 262.8px;
    }

    .bicycle div {
        display: flex;
        flex-wrap: wrap;
        gap: 16.2px;
        justify-content: center;
    }
}