@charset "UTF-8";

body{
    line-height: 1.7em;
    font-size: 16px;
    margin: 20px auto 0 auto;
    background-color: darkgrey;
}

header{
    max-width: 350px;
    min-width: 250px;
    width: 80vw;
    margin: 0 auto;
    text-align: center;
    background-color: #fff;
    padding: 8px;
}

h1{
    font-size: 20px;
    margin: 0 auto 5px auto;
    background-image: url(../img/logobar@0.5x.png);
    background-size: 85px;
    padding-bottom: 25px;
    background-position: center;
    background-position-y: 24px;
    display: block;
    width: 20vw;
    min-width: 100px;
    max-width: 180px;
    margin: 5px auto;
}
.prof-photo,
.sns-link{
    max-width: 350px;
    min-width: 250px;
    width: 80vw;
    margin:0 auto;
    background-color: #fff;
    padding: 30px 3px;
} 
.prof-photo img{
    display: block;
    width: 20vw;
    min-width: 100px;
    max-width: 150px;
    margin: 5px auto;
}

ul{
    padding: 3px auto 0 auto;
}
li{
    list-style-type: none;
    margin-bottom: 50px;
}
.sns-link a{
    display: block;
    padding: 8px;
    text-align: center;
    /* background-color: black;
    border-radius: 20px; */
    color: rgb(228, 228, 228);
    max-width: 330px;
    width: 75vw;
    margin: 0 auto;
    background-image: url(../img/bi_2.svg);
    background-position: center;
}

section{
padding-bottom: 200px;
}