-Flexbox-L7-

-HTML-

-CSS-

* {
    margin: 0;
    padding: 0;
}
img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
span {
    display: inline-block;
    text-indent: 1em;
    font-size: 12px;
}
#wrap {
    margin: 20px auto 0;
    width: 90%;
    max-width: 860px;
    background: rgb(241, 235, 195);
}
/* header */
header div {
    display: flex;
    align-items: stretch;
    text-align: center;
}
header h1 {
    line-height: 1.7;
    background: rgb(255,255,255);
    text-align: center;
}
header div p:first-of-type {
    padding: 10px;
}
header div p:last-of-type {
    flex-basis: 200px;
    min-width: 200px;
}
section {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    flex-basis: 47%;
}
section div p:first-of-type {
    flex-basis: 40%;
}
section div p:last-of-type {
    flex-basis: 54%;
    padding: 10px 3%;
    line-height: 1.7;
}
section div {
    flex-basis: 33.33%;
}
section div h2 {
    flex-basis: 100%;
    padding: 70px 0 5px;
    background: rgb(255,255,255);
    text-align: center;
    font-size: 20px;
}
section div p {
    padding: 2%;
    height: 200px;
}