@charset "UTF-8";

nav {
    padding-left: 10px;
    padding-right: 10px;
    width: auto;
    margin-left: auto;
    margin-right: auto;
    border-color: #BBDEFB;
    border-top-style: solid;
    border-top-width: thin;
    border-bottom-style: solid;
    border-bottom-width: thin;
    background-color: #FFFFFF
}


.nav1 {
    font-family: 'Kosugi Maru', sans-serif;

}



.nav1 ul {
    background-color: #FFFFFF;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
    list-style: none;
}



.nav1 a {
    color: #2196F3;
    display: block;
    padding: 14px;
    font-size: 12px;
    text-decoration: none;
}

.nav1 a:hover {
    color: #FFFFFF;
    background-color: #2196F3
}

/*ここに768px以上向けのスタイルを記述*/
@media (min-width:768px) {
nav {
    padding-left: 10px;
    padding-right: 10px;
    width: 800px;
    margin-left: auto;
    margin-right: auto;
    border-color: #BBDEFB;
    border-top-style: solid;
    border-top-width: thin;
    border-bottom-style: solid;
    border-bottom-width: thin;
    background-color: #FFFFFF
}


.nav1 {
    font-family: 'Kosugi Maru', sans-serif;

}



.nav1 ul {
    background-color: #FFFFFF;
    display: flex;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
    list-style: none;
}



.nav1 a {
    color: #2196F3;
    display: block;
    padding: 14px;
    font-size: 12px;
    text-decoration: none;
}

.nav1 a:hover {
    color: #FFFFFF;
    background-color: #2196F3
}
}