/*================================================
  page-header
================================================*/
.page-header {
    background-image: url(../../image/quality/page-header-bg.jpg);
}
.page-header-title {
    max-width: 480px;
}
.page-header-title-ja {
    bottom: -20px;
    right: 20px;
}

@media print,
screen and (min-width: 1200px) {
    .page-header-title-ja {
        bottom: 15px;
        right: 110px;
    }
}

/*================================================
  quality-list
================================================*/

.quality-list {
    display: flex;
    justify-content: space-between;
    margin-block: calc(var(--layout-gap) * 2);
}

.quality-list-item {
    width: 32%;
}

@media print,
screen and (min-width: 1200px) {
    .quality-list {
        margin-block: calc(var(--layout-gap) * 2);
    }
}

/*================================================
  quality-iso
================================================*/

.quality-iso {
    background-color: var(--color-white);
    box-shadow: 20px 20px 20px rgba(var(--color-black-rgb), 0.75);
    margin-bottom: calc(var(--layout-gap) * 3);
}

.quality-iso-title {
    background-color: var(--color-footer-gray);
    color: var(--color-white);
    font-size: 2.4rem;
    font-weight: 900;
}

.quality-iso-content {
    padding-block: calc(var(--layout-gap) / 1.5);
    font-weight: 600;
}

@media print,
screen and (min-width: 769px) {
    .quality-iso-content {
        display: flex;
        align-items: center;
    }

    .quality-iso-content img {
        width: 30%;
        margin-left: calc(var(--layout-gap) / 4);

    }

}

@media print,
screen and (min-width: 1200px) {
    .quality-iso-title {
        font-size: 3.2rem;
    }
}