@charset "utf-8";

html, body { 
    margin: 0px;
    padding: 0px;
   }
  
  body {
      font-family: "みぞれ"; 
      font-size: 1em;
      color: #333333;
      line-height:1.8em;
      background-color: #322A00;
      background-image: url(img/haikei.jpg);
      
      }

      .header{
        display: flex;
        height: 20px;
        background-color: #E9C946;
        padding: 10px;
    }

    .header__hamburger {
      width: 48px;
      height: 100%;
    }
    
    .hamburger {
      background-color: transparent; 
      border-color: transparent; 
      z-index: 9999;
      cursor: pointer;
    }

    .hamburger span {
      width: 100%;
      height: 1px;
      background-color: #000;
      position: relative;
      transition: ease .4s; 
      display: block;
    }
    
    .hamburger span:nth-child(1) {
      top: 0;
    }
    
    .hamburger span:nth-child(2) {
      margin: 8px 0;
    }
    
    
    .hamburger span:nth-child(3) {
      top: 0;
    }


   

    .profile{
      position: relative;

      .card{
        margin: 18px 20px 10px 20px;
        
      }

      .name{
          position: absolute;
          top: 13px;
          left: 64px;
          font-size: 20px;
          color: black;
          padding:0;
          margin:0;
          min-width: 150px;
        }

      .koukou{
          position: absolute;
          top: 60px;
          left: 55px;
          font-size:15px;
          color: black;
          padding:0;
          margin:0px;
          min-width: 200px;
      }

      .daigaku{
          position: absolute;
          top: 133px;
          left: 70px;
          font-size:12px;
          color: black;
          padding:0;
          margin:0px;
          min-width: 240px;
      }

    }


    .task{
      margin: 10px 10px 0px 33px;
      max-width: 330px;
    }

    .time{
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin: 10px 20px 10px 20px;
      min-width: 340px;
      max-width: 360px;
    }
     
    .footer {
      background-color: #f6f6f6;
      height: 60px;
      display: flex;
    }
    .music_button{
      margin: 14px 0px 13px 10px;
    max-block-size: 30px;
    }
    .music_icon{
      margin: 0px;
    }
    .music_tex{
      margin: 5px 5px 10px 0px;
    }