@charset "UTF-8";
/*クオリティページ共通*/
.p2 {
    margin-bottom: 0.5em; 
}

h4 {
    text-align: left;
    font-size: 24px;
    font-weight: bold;
    padding: 0px 0 10px;
}
.container {
    width: 80%;
    margin: 0 auto;
}
#quality {
    font-size: 15vw;
    font-family: var(--fontAlpha);
    margin: -7vw auto;
    max-width: 1060px;
    max-width: 80%; /*--20251205--*/
}
#quality-span {
    font-size: 1.8vw;
    font-weight: bold;
}
.line {
    font-size: 1.8vw;
}
.quality_above_pc {
    width: 100%;
    display: block;
}
.quality_above_sp {
    display: none;
}
.title {
    font-family: var(--fontAlpha);
    text-align: center;
    font-size: 40px;
}

.title2 {
    text-align: left;
    font-size: 24px;
    font-weight: bold;
}

/*EASTOOLの品質管理ページ*/
#QualityPolicy {
    margin: 70px auto;
}

/* 画像とテキストを50%ずつに配置 */
.QualityPolicy-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 30px;
    margin: 0 auto 50px;
}

.pc_mode_1col {
    display: block;
    width: 50%;
}
.sp_mode_1col {
    display: none;
}

/* 画像を50%・縦横比固定 */
#QualityPolicy .pc_mode_2col {
    padding: 0;
    width: 50%;
    height: auto;
    object-fit: contain;
    margin-top: 0;
}

/* テキストを50%に */
.QualityPolicy-flex .text-content {
    width: 50%;
    text-align: left;
    margin-left: 0;
}
.QualityPolicy-flex .text-content p {
    line-height: 1.8;
}

#ability {
    margin: 70px auto 150px;
}

#ability-flex {
    display: flex;
    flex-wrap: wrap; 
    justify-content: space-between; 
    margin: 0 100px 30px; /*--20251209yokota-- */
}
.ability-item {
    width: 70%;
    margin-bottom: 40px;
    text-align: center; 
}
.ability-item img {
    width: 100%; 
    height: auto;
    margin-bottom: 15px; 
}
.ability-item p {
    line-height: 1.8;
    text-align: left;
}

/* Ability画像を適切な大きさに調整 */
.pc_mode_4col {
    display: block;
    width: 85%;
    max-width: 1000px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

/* スマホ用画像の設定 */
.sp_mode_4col {
    display: none;
    width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

/*具体的な取り組みページ*/
#action-above-p {
    max-width: 700px;
    margin: 30px auto;
}
#action-above-p p {
    line-height: 1.8;
}
#storage {
    margin: 70px auto;
}
.storage-flex {
    display: flex;
    margin: 0 auto 50px;
}
.pc_mode_2col {
    display: block;
    width: 50%;
    padding: 0 50px;
}
.sp_mode_2col {
    display: none;
}
.storage-flex .text-content {
    width: 50%;
    text-align: left;
}
.storage-flex .text-content p {
    line-height: 1.8;
}
#production {
    margin: 70px auto 150px;
}
#production-flex {
    display: flex;
    flex-wrap: wrap; 
    justify-content: space-between; 
    margin: 0 auto;
}
.production-item {
    width: 31%;
    margin-bottom: 40px;
    text-align: center; 
}
.production-item img {
    width: 100%; 
    height: auto;
    margin-bottom: 15px; 
}
.production-item p {
    line-height: 1.8;
    text-align: left;
}
.pc_mode_3col {
    display: block;
}
.sp_mode_3col {
    display: none;
}

@media (max-width:992px) {
    .container {
        width: 95%;
    }
    .quality_above_sp {
        height: auto;
        width: 100%;
        display: block;
    }
    .quality_above_pc {
        display: none;
    }

    #ability-flex {
        margin: 0 20px 30px;
    }

    /* タブレットでもPC版のAbility画像を表示 */
    .pc_mode_4col {
        width: 90%;
    }

    .sp_mode_2col {
        display: none;
    }
}

@media (max-width:768px) {
    .QualityPolicy-flex {
        display: block;
        margin: 0 auto 50px;
    }

    /* スマホでPC用画像を隠し、SP用画像を表示 */
    #QualityPolicy .pc_mode_2col,
    .pc_mode_2col,
    .pc_mode_4col {
        display: none;
    }
    .sp_mode_2col,
    .sp_mode_4col {
        display: block;
        width: 100%;
        padding: 0 20px;
    }

    .QualityPolicy-flex .text-content {
        width: 100%;
        margin-left: 0;
    }

    .storage-flex {
        display: block;
    }
    .storage-flex p {
        width: 100%;
    }
    .storage-flex .text-content {
        width: 100%;
        text-align: left;
    }
    .production-item {
        width: 100%;
        margin-bottom: 40px;
        text-align: center; 
    }
    .pc_mode_3col {
        display: none;
    }
    .sp_mode_3col {
        display: block;
        width: 100%;
        padding: 0 20px;
    }
}

.QualityPolicy-flex img {
    width: 100%;
    height: auto;
    margin-bottom: 15px;
}