span#title {
    color: rgb(193, 138, 255);
    text-shadow: 2px 2px 5px rgb(220, 189, 255);
}

div.hir {
    width: 80%;
    padding: 15px 30px;
    background-color: lavender;
    margin: auto;
    margin-bottom: 40px;
    box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.5);
}

div.hir p.datum {
    margin-bottom: 0px;
    font-style: italic;
}

div.hir h2.cim {
    margin-top: 5px;
    color: rgb(75, 75, 199);
}

div.hir p.content {
    white-space: pre-wrap;
    text-align: justify;
    font-weight: bold;
    hyphens: auto;
}

div.hir div.img {
    overflow: auto;
    width: 100%;
}

div.hir div.img img {
    width: 80%;
    display: block;
    margin: auto;
    min-width: 400px;
}

div.hir table.img td {
    width: 50%;
}

div.hir table.img img {
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
}

@media screen and (max-width: 1360px) {
    div.hir table.img {
        width: 100%;
        display: block;
        overflow: auto;
    }

    div.hir table.img td {
        width: 100%;
        display: block;
    }
    
    div.hir table.img img {
        width: 80%;
        margin:auto;
        display: block;
    }
}

@media screen and (max-width: 1060px) {
    div.hir table.img {
        display: table;
    }

    div.hir table.img td {
        width: 50%;
        display: table-cell;
    }
    
    div.hir table.img img {
        width: 100%;
        min-width: auto;
    }
}

@media screen and (max-width: 925px) {
    div.hir table.img {
        width: 100%;
        display: block;
        overflow: auto;
    }

    div.hir table.img td {
        width: 100%;
        display: block;
    }
    
    div.hir table.img img {
        width: 80%;
        margin:auto;
        display: block;
    }
}

@media screen and (max-width: 815px) {
    div.hir table.img {
        display: table;
    }

    div.hir table.img td {
        width: 50%;
        display: table-cell;
    }
    
    div.hir table.img img {
        width: 100%;
        min-width: auto;
    }
}

@media screen and (max-width: 780px) {
    div.hir table.img {
        width: 100%;
        display: block;
        overflow: auto;
    }

    div.hir table.img td {
        width: 100%;
        display: block;
    }
    
    div.hir table.img img {
        width: 80%;
        margin:auto;
        display: block;
    }
}

@media screen and (max-width: 650px) {
    div.hir h2.cim {
        margin-top: 20px;
    }

    div.hir {
        width: 100%;
    }

    div.hir table.img {
        display: table;
    }

    div.hir table.img td {
        width: 50%;
        display: table-cell;
    }
    
    div.hir table.img img {
        width: 100%;
        min-width: auto;
    }
}

@media screen and (max-width: 580px) {
    div.hir table.img {
        width: 100%;
        display: block;
        overflow: auto;
    }

    div.hir table.img td {
        width: 100%;
        display: block;
    }
    
    div.hir table.img img {
        width: 100%;
        min-width: 400px;
    }
}

@media screen and (max-width: 500px) {
    div.hir {
        padding: 15px;
    }

    div.hir div.img img {
        width: 100%;
    }
}