/*================================================
  our-services
================================================*/

.page-mainvisual {
    background-image: url(../../image/our-services/page-mainvisual.jpg);
}

/*================================================
  our-strengths
================================================*/

.our-strengths {
    padding-block: var(--layout-gap);
}

.our-strengths-text {
    margin-top: calc(var(--layout-gap) / 2);
    margin-bottom: var(--layout-gap);
    font-size: 1.6rem;
}

.our-strengths-list li {
    background-color: var(--color-white);
    padding: calc(var(--layout-gap) / 2);
    margin-bottom: var(--layout-gap);
    box-shadow: 10px 10px 30px rgba(var(--color-black-rgb), 0.1);
}

/* left */
/* .our-strengths-left {
    padding-inline: calc(var(--layout-gap) / 2);
} */

.our-strengths-item-title {
    font-weight: bold;
    /* font-size: 2.4rem; */
    font-size: clamp(2rem, 1.84rem + 0.8vw, 2.8rem);
    color: var(--color-page-lead);
    position: relative;
    margin-left: 1.5em;
}

.num {
    color: rgba(var(--color-primary-rgb), 0.5);
    font-size: 5.2rem;
    font-weight: bold;
    line-height: 1;
    position: absolute;
    top: -15%;
    /* left: -32px; */
    left: -0.75em;
}

.our-strengths-item-text {
    line-height: 1.7;
    /* font-size: 1.7rem; */
    margin-top: calc(var(--layout-gap) / 2);
    margin-bottom: calc(var(--layout-gap) / 2);
}

/* right */
.our-strengths-right img {
    height: 200px;
    object-fit: cover;
}

@media print,
screen and (min-width: 769px) {
    .our-strengths-list li {
        display: flex;
        flex-wrap: wrap;
        padding: calc(var(--layout-gap) / 1.5);
        /* padding: calc(var(--layout-gap) / 2) var(--layout-gap); */
        margin-bottom: calc(var(--layout-gap) * 1.5);
    }

    /* left */
    .our-strengths-left {
        width: 50%;
        padding-right: calc(var(--layout-gap) / 2);
        /* padding-inline: var(--layout-gap); */
    }

    .our-strengths-item-title {
        /* font-size: 2.8rem; */
        margin-left: 2em;
    }
    .our-strengths-item-text {
        font-size: clamp(1.2rem, 0.8659rem + 0.695vw, 1.7rem);
    }

    .num {
        font-size: 7rem;
        top: -20%;
        /* left: -45px; */
    }

    /* right */
    .our-strengths-right {
        width: 50%;
    }

    .our-strengths-right img {
        height: 315px;
    }

}

@media print,
screen and (min-width: 1200px) {
    .our-strengths {
        padding-block: calc(var(--layout-gap) * 2);
    }
    .our-strengths-list li {
        /* padding-left: 80px; */
        padding-left: 90px;
        padding-right: 40px;
        justify-content: space-between;
    }
    .our-strengths-item-title {
        margin-left: 0;
        margin-top: 0.5em;
    }
    .our-strengths-text {
        margin-bottom: calc(var(--layout-gap) * 1.8);
    }
    .our-strengths-left {
        width: calc(50% - 40px);
    }
}

/*================================================
  our-services
================================================*/

.our-services {
    padding-block: var(--layout-gap);
}

.our-services-list {
    margin-top: calc(var(--layout-gap) / 1.5);
}

.our-services-item {
    position: relative;
    margin-bottom: var(--layout-gap);
}

.our-services-item:nth-child(even) {
    text-align: right;
}

.our-services-item img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

.our-services-text {
    background-color: rgba(var(--color-page-lead-rgb), 0.9);
    color: var(--color-white);
    /* padding: calc(var(--layout-gap) / 2.5) calc(var(--layout-gap) / 2); */
    padding: 1.75em 1.5em;
    max-width: 95%;
    margin-top: -20px;
    position: relative;
    z-index: 2;
}

.our-services-title {
    /* font-size: 2.2rem; */
    font-size: clamp(2.2rem, 2rem + 1vw, 3.2rem);
    font-weight: bold;
    line-height: 1;
    /* margin-bottom: calc(var(--layout-gap) / 4); */
    margin-bottom: 1em;
}

.our-services-text ol {
    /* font-size: 1.7rem; */
    font-size: clamp(1.4rem, 1.34rem + 0.3vw, 1.7rem);
    line-height: 1.7;
    /* line-height: 1.5; */
}
.our-services-text ol > li {
    /* margin-top: 1em; */
    margin-top: 0.5em;
    text-indent: -2em;
    margin-left: 2em;
}
.our-services-item:nth-child(odd) .our-services-text {
    margin-left: auto;
}

.our-services-item:nth-child(even) .our-services-text {
    text-align: left;
}

@media print,
screen and (min-width: 769px) {
    .our-services-text {
        padding: 2em;
        max-width: 85%;
    }
    .our-services-item img {
        width: 100%;
        height: 350px;
        object-fit: cover;
    }
}

@media print,
screen and (min-width: 1200px) {
    .our-services {
        padding: calc(var(--layout-gap) * 2);
    }

    .our-services-list {
        margin-top: calc(var(--layout-gap) * 1.5);
    }

    .our-services-item {
        margin-bottom: calc(var(--layout-gap) * 2);
        position: relative;
    }

    .our-services-item img {
        /* width: 95%; */
        width: calc(100% - 2em);
        height: 500px;
    }

    .our-services-item:nth-child(2) img {
        object-position: center top;
    }

    .our-services-text {
        /* padding: calc(var(--layout-gap) / 1.8) calc(var(--layout-gap) * 1.2); */
        position: absolute;
        /* bottom: -20px; */
        bottom: -2em;
        max-width: 90%;
        min-width: 440px;
    }

    .our-services-title {
        font-size: 3.2rem;
    }

    .our-services-item:nth-child(odd) .our-services-text {
        right: 0;
    }

    .our-services-item:nth-child(even) .our-services-text {
        left: 0;
    }

    .our-services-item:nth-child(3) .our-services-text {
        /* bottom: -200px; */
        bottom: -235px;
    }

    .our-services-item:nth-child(3) {
        /* margin-bottom: calc(var(--layout-gap) * 6); */
        margin-bottom: 290px;
    }
}


/*================================================
  qualification-support
================================================*/

.qualification-support {
    padding-block: var(--layout-gap);
    font-size: 1.6rem;
}

.content-title {
    max-width: 560px;
}

.qualification-support-lead{
    margin-top: calc(var(--layout-gap) / 2);
    margin-bottom: var(--layout-gap);
}

.qualification-support ul {
    padding-left: calc(var(--layout-gap) / 1.5);
    margin-top: calc(var(--layout-gap) / 2);
    margin-bottom: calc(var(--layout-gap) / 2);
    display: grid;
    gap: 1em;
}

.qualification-support dt{
    font-weight: 400;
}

.skill-test{
    display: flex;
}

.award-content dd{
    padding-left: calc(var(--layout-gap) / 2);
}


.qualification-support h5 {
    position: relative;
}

.qualification-support h5::before {
    content: '';
    position: absolute;
    /* top: 50%; */
    top: 7px;
    left: -24px;
    /* transform: translateY(-50%); */
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: var(--color-primary);
}

@media print,
screen and (min-width: 1200px) {
    .qualification-support {
        padding-block: calc(var(--layout-gap) * 1.5);
    }

    .qualification-support-lead{
        margin-top: calc(var(--layout-gap) / 1.8);
    }

}
