/*
* product_commitment_quality.css
*
*/
/* --------------------------------
   product_commitment_quality
-------------------------------- */
.l-container::after
{
    height: 445px;
}

.p-contSection
{
    padding-top: 83px;
}
@media (max-width: 767.98px)
{
    .p-contSection
    {
        padding-top: 17.1875vw;
    }
}

@media (min-width: 768px)
{
    .quality___inner
    {
        max-width: 920px;
        margin: 0 auto;
    }
}

@media (max-width: 1309.98px)
{
    .quality___inner
    {
        max-width: inherit;
        margin: 0 2.77778vw;
    }
}

@media (max-width: 767.98px)
{
    .quality___inner
    {
        margin: 0;
        padding: 0 6.25vw;
    }
}

/* keyVisual ---------------- */
.p-keyVisual
{
    height: 294px;

    background: url(/img/product/commitment/quality/commitment_kv.jpg) top center no-repeat;
    background-size: contain;
}
@media (min-width: 768px)
{
    .p-keyVisual
    {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;

        padding-top: 0;

        -webkit-box-pack: center;

            -ms-flex-pack: center;

                justify-content: center;
    }
}
@media (max-width: 1139.98px)
{
    .p-keyVisual
    {
        height: 24.12281vw;
    }
}
@media (max-width: 767.98px)
{
    .p-keyVisual
    {
        background: url(/img/product/commitment/quality/commitment_kv_sm.jpg) top center no-repeat;
        background-size: 87.5vw 31.09375vw;
    }
}
@media (max-width: 767.98px)
{
    .p-keyVisual.-pb-sm
    {
        padding-bottom: 15.625vw;
    }
}

@media (min-width: 768px)
{
    .p-keyVisual__title
    {
        margin: 10px 0 10px;
    }
}

@media (max-width: 1309.98px)
{
    .p-keyVisual__title
    {
        font-size: 3.7037vw; 

        margin: .92593vw 0 .92593vw;
    }
}

@media (max-width: 767.98px)
{
    .p-keyVisual__title
    {
        font-size: 6.875vw;
    }
}

.p-keyVisual__titleEn
{
    width: 255px; 

    opacity: .25;
}
@media (max-width: 767.98px)
{
    .p-keyVisual__titleEn
    {
        width: 40.625vw;
    }
}

.m-mv-commitment
{
    background-image: url(/img/product/commitment/quality/commitment_kv_sm.jpg);
    background-size: cover;
}
@media (min-width: 768px)
{
    .m-mv-commitment
    {
        background-image: url(/img/product/commitment/quality/commitment_kv.jpg);
    }
}

.m-mv_title .jp
{
    line-height: 1.27;

    letter-spacing: 6.6px;
}

.quality__title
{
    padding: 100px 0 0;
}
@media (max-width: 767.98px)
{
    .quality__title
    {
        font-size: 4.0625vw; 

        padding: 15.625vw 0 0;
    }
}

.quality__mottoTitle
{
    font-size: 32px;

    text-align: center; 

    color: #008135;
}
@media (max-width: 767.98px)
{
    .quality__mottoTitle
    {
        font-size: 5.625vw;
    }
}

.quality__mottoList
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-box-orient: horizontal;

    -webkit-box-direction: normal;

        -ms-flex-flow: row;

            flex-flow: row;
}
@media (min-width: 768px)
{
    .quality__mottoList
    {
        margin-top: 70px;
    }
}
@media (max-width: 1309.98px)
{
    .quality__mottoList
    {
        margin: 6.48148vw 0 0;
    }
}
@media (max-width: 767.98px)
{
    .quality__mottoList
    {
        margin-top: 20.3125vw; 

        -webkit-box-orient: vertical; 

        -webkit-box-direction: normal; 

            -ms-flex-flow: column; 

                flex-flow: column;
    }
}
.quality__mottoList li
{
    font-weight: bold;
    line-height: 1.95;

    position: relative;

    width: 33.3%;

    letter-spacing: 1px; 

    border-radius: 22px;
    background-color: #ebf2d9;
}
@media (min-width: 768px)
{
    .quality__mottoList li
    {
        font-size: 18px; 

        padding: 60px 30px;
    }
}
@media (max-width: 1309.98px)
{
    .quality__mottoList li
    {
        font-size: 1.66667vw; 

        padding: 5.55556vw 2.31481vw;
    }
}
@media (max-width: 767.98px)
{
    .quality__mottoList li
    {
        font-size: 4.6875vw;

        width: 100%;
        padding: 12.5vw 6.25vw 10.9375vw;

        letter-spacing: 0;
    }
}
.quality__mottoList li:nth-of-type(3)
{
    width: 33.4%;
}
@media (max-width: 767.98px)
{
    .quality__mottoList li:nth-of-type(3)
    {
        width: 100%;
    }
}
@media (min-width: 768px)
{
    .quality__mottoList li + li
    {
        margin-left: 15px;
    }
}
@media (max-width: 1309.98px)
{
    .quality__mottoList li + li
    {
        margin-left: 1.38889vw;
    }
}
@media (max-width: 767.98px)
{
    .quality__mottoList li + li
    {
        margin-top: 14.0625vw; 
        margin-left: 0;
    }
}
.quality__mottoList li span
{
    display: inline-block;

    width: 100%;

    border-bottom: 1px solid #9ecda6;
}
@media (max-width: 767.98px)
{
    .quality__mottoList li span
    {
        font-size: 4.6875vw;
    }
}
.quality__mottoList li .number
{
    font-size: 22px;
    font-weight: bold;
    font-style: italic;

    position: absolute;
    top: -35px;
    left: 50%;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-sizing: content-box;

            box-sizing: content-box;
    width: 64px;
    height: 64px;

    -webkit-transform: translateX(-50%);

        -ms-transform: translateX(-50%);

            transform: translateX(-50%); 

    color: #fff;
    border: 6px solid #fff;
    border-radius: 50%;
    background-color: #008135;

    -webkit-box-align: center;

        -ms-flex-align: center;

            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
@media (max-width: 767.98px)
{
    .quality__mottoList li .number
    {
        top: -10.15625vw;

        width: 18.75vw;
        height: 18.75vw;
    }
}

.quality__safetyTitle
{
    font-size: 32px;

    text-align: center; 

    color: #008135;
}
@media (max-width: 767.98px)
{
    .quality__safetyTitle
    {
        font-size: 5.625vw;
    }
}

.quality__safetyList
{
    margin-top: 35px;
    padding: 50px 77px;

    border-radius: 22px; 
    background-color: #ebf2d9;
}
@media (max-width: 767.98px)
{
    .quality__safetyList
    {
        padding: 9.375vw 5.46875vw;
    }
}
.quality__safetyList li
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-box-orient: horizontal;

    -webkit-box-direction: normal;

        -ms-flex-flow: row;

            flex-flow: row;
}
.quality__safetyList li + li
{
    padding-top: 15px;
}
@media (max-width: 767.98px)
{
    .quality__safetyList li + li
    {
        padding-top: 4.6875vw;
    }
}
.quality__safetyList li p
{
    padding-top: 5px;
}
@media (max-width: 767.98px)
{
    .quality__safetyList li p
    {
        font-size: 4.0625vw;

        padding-top: 1.5625vw;

        letter-spacing: 0;
    }
}
.quality__safetyList li .number
{
    font-size: 22px;
    font-weight: bold;
    font-style: italic; 

    padding-right: 35px;

    color: #008135;
}
@media (max-width: 767.98px)
{
    .quality__safetyList li .number
    {
        font-size: 5.625vw; 

        padding-right: 3.90625vw;
    }
}

.quality__jfsTitle
{
    font-size: 22px;
    line-height: 1;

    padding: 2px 11px;

    letter-spacing: 1.7px; 

    border-left: 6px solid #008135;
}
@media (max-width: 767.98px)
{
    .quality__jfsTitle
    {
        font-size: 5.3125vw;

        padding: .3125vw 0 0 1.71875vw;

        letter-spacing: 0;
    }
}

.quality__jfsExplanation
{
    margin-top: 35px;
}
@media (max-width: 767.98px)
{
    .quality__jfsExplanation
    {
        margin-top: 5.46875vw;
    }
}
.quality__jfsExplanation p
{
    font-size: 16px;
}
@media (max-width: 767.98px)
{
    .quality__jfsExplanation p
    {
        font-size: 4.0625vw;

        letter-spacing: 0;
    }
}
.quality__jfsExplanation img
{
    margin-top: 35px;
}
@media (max-width: 767.98px)
{
    .quality__jfsExplanation img
    {
        margin-top: 4.6875vw;
    }
}

.quality__acquisition
{
    margin-top: 55px;
}
@media (max-width: 767.98px)
{
    .quality__acquisition
    {
        margin-top: 9.375vw;
    }
}

.quality__acquisitionTitle
{
    font-size: 18px;
    font-weight: bold;
}
@media (max-width: 767.98px)
{
    .quality__acquisitionTitle
    {
        font-size: 4.0625vw;
    }
}

.quality__acquisitionList
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    max-width: 620px;
    margin-top: 15px;
    padding-left: 5px; 

    -ms-flex-flow: wrap; 

        flex-flow: wrap;
}
.quality__acquisitionList li
{
    font-size: 16px;
    line-height: 1.9; 

    position: relative;

    padding-right: 45px;
    padding-left: 5px;
}
@media (max-width: 767.98px)
{
    .quality__acquisitionList li
    {
        font-size: 4.0625vw; 

        padding-right: 0;
        padding-left: 3.125vw;
    }
    .quality__acquisitionList li + li
    {
        padding-top: 2.34375vw;
    }
}
.quality__acquisitionList li::after
{
    position: absolute;
    top: 50%;
    left: -5px;

    width: 4px;
    height: 4px;

    content: '';
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%); 

    border-radius: 50%;
    background-color: #008135;
}
@media (max-width: 767.98px)
{
    .quality__acquisitionList li::after
    {
        width: 1.875vw;
        height: 1.875vw;
    }
}

.quality__acquisitionImg
{
    margin-top: 25px;

    text-align: center;
}
@media (max-width: 767.98px)
{
    .quality__acquisitionImg
    {
        margin-top: 6.25vw;
        padding: 0 14.0625vw;
    }
}