@media screen and (max-width: 499px) {
    /*　画面サイズ 499pxまで適用　*/
    .header-nav-ul li {
        width: 10%;
        padding: 20px 10px 20px 10px;
    }
    .header-nav-ul li a {
        font-size: 90%;
    }
    .main-content {
        width: 90%;
        margin: 0px 5%;
    }
    .header nav {
        width: 90%;
        margin: auto 5%;
    }
    .mc-profile-container{
        width: 100%;
        margin: 10px auto;
        display: block;
        justify-content:baseline;
    }
    .pc-profile-img {
        width: 100%;
        margin: 0 14%;
    }
    .pc-profile-img img {
        width: 130%;
        margin: 10px auto;
    }

    .pc-profile-content {
        width: 100%;
        margin: 10px 25%;
        text-align: center;
    }

    .pc-content-link {
        width: 95%;
    }

    .main-content-works {
        width: 95%;
        margin: 0 2.5%;
    }

    #text-for-smartphone {
        display: block;
    }

    #text-for-smartphone p {
        color: #e0e0e0;
        padding: 2px 0;
    }

    #text-for-smartphone span {
        color: #ffffff;
        font-size: 22px;
        text-decoration-line: underline;
    }

    #text-for-pc {
        display: none;
    }
}

@media screen and (min-width: 500px) and (max-width: 999px) {
    /*　画面サイズ 500pxから999pxまで適用　*/
    .main-content {
        width: 80%;
        margin: 0 10%;
    }
    .header nav {
        width: 80%;
        margin: auto 10%;
    }
}

@media screen and (min-width: 500px) and (max-width: 999px) {
    /*　画面サイズ 999pxまで適用　*/
    .mc-profile-container{
        width: 90%;
        margin: 10px auto;
        display: block;
        justify-content:start;
    }
    .pc-profile-img {
        margin: 10px auto;
    }
    .pc-profile-img img {
        width: 90%;
    }

    .pc-profile-content {
        width: 100%;
        margin: 10px 25%;
        text-align: center;
    }
}