a {
    text-decoration:none;
}
.black{
    color: #000000;
}
.messageList {
    max-width: 100%;
    margin: 0;
    display: flex;
    gap: 40px 73px;
    flex-wrap: wrap;
    padding: 0 30px;
}
.message .modal__container {
    width: 775px;
}
.messageList li {
    margin-bottom: 40px;
}

.messageList li figcaption {
    color: #000000;
    text-decoration:none;
    width: 230px;
    text-align: start;
}
.img{
    flex-direction: row-reverse;
    column-gap:32px ;

}
.readWith{
    column-gap: 20px;
    margin-top: 40px;
}
.readWith a .img{
    margin-bottom: 5px;
}
.readWith a p{
    margin-bottom: 0;
}
.readWith a .img img{
    width: 385px;
    height: 240px;
}
@media screen and (max-width: 768px){
    .messageList {
        gap: 20px 24px;
        padding: 0;
    }
    .messageList li figcaption {
        width: 150px;
        text-align: center;
    }
    .messageList li .thumb {
        margin: unset;
    }
    .messageList li{
        margin-bottom: 0;
    }
    #contentBody .readWith a p{
        margin-bottom: 30px;
    }
    .sp {
        p{
            font-size: 1.2rem;
        }
        strong{
            font-size: 2rem;
        }
    }
    .readWith a .img img{
        width: 100%;
        height: auto;
    }
}