header {
    text-align: center;
    margin-top: 1em;
    position: relative;
}
header strong {
    left: 15vw;
    bottom: -2em;
    font-size: 2.5vmax;
    z-index: 1;
}
header h1 {
    font-size: 1em;
    text-align: center;
}

body {
    font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "MS 明朝", serif;
    overflow-wrap: break-word;
}

h2 {
    font-size: 1.5em;
}



main {
    text-align: center;
}
section {
    padding: 0 10vw;
    margin: 0 auto 5vw auto;
    max-width: 1350px;
}



#profile-photo {
    text-align: center;
}
#profile-photo img {
    width: 50vw;
    margin-bottom: 5vw;
}
section#main-visual {
    position: relative;
    max-width: none;
}
#main-visual .tag {
    display: inline-block;
    position: absolute;
    top: 30vw;
    transform: translateY(-20vw);
    left: 19vw;
    text-align: center;
    margin: auto;
    font-size: 2.5vw;
    text-shadow:0 0 1em #fff;
}
#main-visual h1 {
    display: inline-block;
    position: absolute;
    top: 40vw;
    transform: translateY(-16vw);
    right: 1vw;
    text-align: left;
    margin: auto;
    font-size: 5vw;
    text-shadow:0 0 1em #fff;
}
#main-visual .lead {
    display: block;
    max-width: 800px;
    line-height: 1.75em;
    font-size: 1.5em;
    font-weight: bold;
    margin: auto;
}

#achievements ul {
    list-style: none;
}
#achievements ul li {
    position: relative;
}
#achievements ul li::before {
  content: "➤";           /* 矢印に変更 */
  position: absolute;
  left: -1.5em;
  font-size: 0.9em;
}
li img {
    display: block;
    max-width: 25%;
}

.flex-container {
    display: flex;
    text-align: left;
    line-height: 2em;
}
.flex-container img {
    width: 100%;
}
.flex-container h2 {
    flex: 1 0 9em;
    text-align: left;
    padding-right: 1em;
    font-weight: bold;
    position: relative;
    top: -.25em;
}
.flex-container > div {
    width: 100%;
}


footer {
    text-align: center;
    font-size: 0.75em;
    color: #666;
    margin: 5vw auto;
}



@media screen and (max-width: 796px) {
    #main-visual h1 {
        left: 40vw;
        font-size: 4vw;
    }
    #main-visual .lead {
        font-size: 1.2em;
        text-align: left;
    }
    #main-visual .lead br{
        display: none;
    }
    .flex-container {
        flex-direction: column;
    }
    .flex-container h2 {
        flex: none;
        text-align: center;
    }
    li img {
        display: block;
        max-width: 70%;
    }
}