@charset "utf-8";
html, body {
    margin: 0px;
    padding: 0px;
   }
   body {
    font-family: "Noto Serif JP", serif;
    font-size: 1em;
    color: #333333;
    line-height:1.8em;
    background-color: #322A00;
    background-image: url(img/back_dot.png);
    }
    a{text-decoration: none;}
    a:link {color: #333333;}  
    #container{
        margin: 0 auto;
        width: 100%;
        height: 100vh;
        max-width :390px;
        background-image: url(1x/bg.png);
        display: grid;
        overflow: hidden;
     }
     
     #nonoka{
        align-items: center;
    }
    #icon{
        margin: -15px 0 0 0;
        display: flex;
        justify-content: center;
        }
 
    #name{
        margin: -51px 0 0 0;
        display: flex;
        justify-content: center;
        }
    
     #bell{
        margin: 63px 0 0 259px;
        }

     
    #photos{
        width: 390px;
        display: flex;
     }
     .box1, .box2,.box3{
         width: 123px;
        height: 133px;
        margin: 10px;
     }
    
     #buttons{
        width:390px;
        display: flex;
     }
     .box4, .box5,.box6{
        width: 80px;
       height: 80px;
       margin: 0 auto 18px 17px;
    }