html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    
}

a{
    a  text-decoration: none;
}

@media screen and (min-width: 701px){
    .header-container {
        position: absolute;
        flex-direction: column; /* 縦方向に並べる */
        align-items: flex-start; /* 必要に応じて center などに変更 */
        justify-content: space-between; /* 要素をコンテナの両端に配置 */
        font-family: 'Poppins', sans-serif;
        color: #5c5c5c;
        display: inline-block;
        background-color: white;
        min-height: 100vh; 
        text-decoration: none;
    }
    
    .myname {
        margin: 50px;
        margin-bottom: 90px;
    }

    .menu_pc {
        display: flex;
        flex-direction: column; /* 縦並びにする */
        align-items: flex-start; /* 必要に応じて center に変更可能 */
        gap: 20px; /* 各リンクの間にスペースを追加 */
    }
      
    .menu_pc a {
        text-decoration: none;
        color: inherit; /* 任意の色 */
        margin-left: 60px;
    }


    .profile {
        position: absolute;
        display: flex;
        flex-direction: column;
        font-family: 'Poppins', sans-serif;
        color: #5c5c5c;
        margin-top: 200px;
        margin-left: 250px;
        margin-right: 50px;
    }

    footer {
        bottom: 0;
        left: 0;
        text-align: left;
        color: #8b8b8b;
        margin-left: 50px;
    }
    
      .socialmedia a {
        margin: 0 10px; /* アイコンの間にスペースを設定 */
        font-size: 24px; /* アイコンのサイズを調整 */
        color: inherit; /* アイコンの色を設定 */
    }
    

}

@media screen and (max-width: 700px){
    .header-container {
        position: absolute;
        right: 0px;
        font-family: 'Poppins', sans-serif;
        color: #5c5c5c;
        min-height: 100dvh; 
        flex-direction: column; /* 縦方向に並べる */
        display: flex;
        text-decoration: none;
        background-color: white;
    }
    
    .myname {
        margin-bottom: 20px;
        margin-left: 20px;
        margin-top: 30px;
        margin-right: 20px;
    }

    .menu_pc {
        display: none;

    }
    
    .profile {
        position: absolute;
        display: flex;
        flex-direction: column;
        font-family: 'Poppins', sans-serif;
        color: #5c5c5c;
        margin-top: 110px;
        margin-right: 20px;
        margin-left: 10px;
        text-decoration: none;
    }

    footer {
        display: none;

    }

}


#button {
    text-decoration: none; /* 下線を取り除く */
    color: inherit;        /* 親要素の色を継承する */
}