@charset "utf-8";

/* ----- MV ----- */
.page_mv {
    padding: min(17rem, 170px) 0 min(10rem, 100px);
    background: #fff;
}

.page_mv .container {
    position: relative;
    padding: 0;
    z-index: 1;
    width: calc(100% - 40px);
}

.page_mv .container::before {
    content: "";
    display: inline-block;
    width: min(9.3rem, 93px);
    height: min(68rem, 68px);
    background-image: url(../img/strengths/mv_deco01.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    vertical-align: middle;
    position: absolute;
    left: min(6.8rem, -68px);
    top: min(10.6rem, 106px);
}

.page_mv .container::after {
    content: "";
    display: inline-block;
    width: min(12rem, 120px);
    height: min(11.2rem, 112px);
    background-image: url(../img/strengths/mv_deco02.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    vertical-align: middle;
    position: absolute;
    right: min(-2rem, -20px);
    top: min(24rem, 240px);
}

.page_mv_title {
    font-size: min(2.4rem, 24px);
    font-weight: 500;
    font-family: var(--font-ebGaramond);
    color: var(--color-navy);
}

.page_mv_title span {
    font-size: min(7rem, 70px);
    display: block;
    margin-bottom: min(1rem, 10px);
    ;
}

.page_mv_img {
    width: min(82rem, 820px);
    position: absolute;
    top: min(-9rem, -90px);
    left: min(41.3rem, 413px);
    z-index: -1;
}

.bread {
    margin-top: min(14.5rem, 145px);
}

.bread ul {
    display: flex;
    align-items: center;
    gap: min(1rem, 10px);
}

.bread ul li {
    font-size: min(1.3rem, 13px);
}

.bread ul li:empty::before {
    content: "";
    display: inline-block;
    width: min(.5rem, 5px);
    height: min(1rem, 10px);
    background-image: url(../img/icon_arrow_right_gray.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.bread ul li a {
    color: var(--color-navy);
}

.page_mv_text {
    text-align: center;
    margin-top: min(14rem, 140px);
    font-weight: bold;
    font-size: min(2.2rem, 22px);
    line-height: 1.8;
}

@media screen and (max-width:799px) {
    .page_mv {
        padding: 4rem 0 2rem;
    }

    .page_mv .container::before {
        width: 6rem;
        height: 4rem;
        left: 1rem;
        top: 20rem;
    }

    .page_mv .container::after {
        width: 8rem;
        height: 6rem;
        right: -2rem;
        top: 3rem;
    }

    .page_mv_title {
        font-size: 1.6rem;
    }

    .page_mv_title span {
        font-size: 4rem;
        margin-bottom: 1rem;
    }

    .page_mv_img {
        width: 100%;
        position: unset;
        position: relative;
        top: -2rem;
        left: 20px;
    }

    .bread {
        margin-top: 2rem;
    }

    .bread ul {
        gap: 1rem;
    }

    .bread ul li {
        font-size: 1.2rem;
    }

    .bread ul li:empty::before {
        width: .5rem;
        height: 1rem;
    }


    .page_mv_text {
        margin-top: 2rem;
        font-size: 1.4rem;
    }
}

/* ----- MV ----- */
.strengths_sec {
    padding: 0 0 min(32rem, 320px);
}

.strengths_sec .container {
    padding: min(10rem, 100px) 20px min(12rem, 120px);
}

.strengths_sec_title {
    color: var(--color-navy);
    font-size: min(3.4rem, 34px);
    text-align: center;
}

.strengths_sec_list {
    display: flex;
    flex-flow: column;
    gap: min(5rem, 50px);
    margin-top: min(6rem, 60px);
}

.strengths_sec_item {
    display: flex;
    border-radius: min(1.5rem, 15px);
    overflow: hidden;
    background: #fff;
}

.strengths_sec_itemHead {
    width: 400px;
    position: relative;
    padding: min(5.5rem, 55px) min(5rem, 50px) min(5.2em, 52px);
    display: flex;
    flex-flow: column;
    justify-content: center;
}

.type1 .strengths_sec_itemHead {
    background: #2590C9;
}

.type2 .strengths_sec_itemHead {
    background: #12BA94;
}

.type3 .strengths_sec_itemHead {
    background: #EB5E7A;
}

.type4 .strengths_sec_itemHead {
    background: #A788D0;
}

.strengths_sec_itemHead_title {
    font-weight: bold;
    font-size: min(2.4rem, 24px);
    line-height: min(3.8rem, 38px);
    color: #fff;
}

.strengths_sec_itemHead_title span {
    font-weight: 500;
    font-size: min(7.6rem, 76px);
    letter-spacing: 0.04em;
    font-family: var(--font-ebGaramond);
    display: block;
    margin-bottom: min(1rem, 10px);
}

.strengths_sec_itemHead_img {
    width: min(13rem, 130px);
    position: absolute;
    top: min(2.5rem, 25px);
    right: min(3rem, 30px);
}

.strengths_sec_itemBox {
    flex: 1;
    padding: min(4.5rem, 45px) min(5rem, 50px) min(6rem, 60px);
}

.strengths_sec_itemBox_text {
    border-bottom: 1px dotted #bfbfbf;
    padding: min(1.5rem, 15px) 0 min(1.5rem, 15px) min(1.5rem, 15px);
    position: relative;
    line-height: min(2.5rem, 25px);
    font-size: min(1.8rem, 18px);
}

.type1 .strengths_sec_itemBox_text::before {
    content: "";
    display: inline-block;
    width: min(1rem, 10px);
    height: min(1rem, 10px);
    border-radius: 50%;
    background: #2590c9;
    position: absolute;
    left: 0;
    top: min(2.3rem, 23px);
}

.type2 .strengths_sec_itemBox_text::before {
    content: "";
    display: inline-block;
    width: min(1rem, 10px);
    height: min(1rem, 10px);
    border-radius: 50%;
    background: #12ba94;
    position: absolute;
    left: 0;
    top: min(2.3rem, 23px);
}

.type3 .strengths_sec_itemBox_text::before {
    content: "";
    display: inline-block;
    width: min(1rem, 10px);
    height: min(1rem, 10px);
    border-radius: 50%;
    background: #eb5e7a;
    position: absolute;
    left: 0;
    top: min(2.3rem, 23px);
}

.strengths_sec_itemBox_title {
    font-weight: bold;
    font-size: min(2rem, 20px);
    margin-top: min(1.5rem, 15px);
}

.strengths_sec_itemBox_title::before {
    content: "";
    display: inline-block;
    width: min(1rem, 10px);
    height: min(1rem, 10px);
    border-radius: 50%;
    background: #a788d0;
    margin-right: min(.5rem, 5px);
    position: relative;
    top: min(-0.2rem, -2px);
}

.strengths_slider .slick-slide {
    width: min(35rem, 350px);
    margin: 0 min(1.5rem, 15px);
}

@media screen and (max-width:799px) {
    .strengths_sec {
        padding: 0 0 15rem;
    }

    .strengths_sec .container {
        padding: 6rem 20px 3rem;
    }

    .strengths_sec_title {
        font-size: 2rem;
    }

    .strengths_sec_list {
        gap: 4rem;
        margin-top: 3rem;
    }

    .strengths_sec_item {
        display: block;
    }

    .strengths_sec_itemHead {
        width: 100%;
        padding: 1.5rem 3rem;
    }


    .strengths_sec_itemHead_title {
        font-size: 1.6rem;
        line-height: 1.6;
    }

    .strengths_sec_itemHead_title span {
        font-size: 4rem;
        margin-bottom: 1rem;
    }

    .strengths_sec_itemHead_img {
        width: 8rem;
        top: 2rem;
        right: 2rem;
    }

    .strengths_sec_itemBox {
        flex: 1;
        padding: 2rem;
    }

    .strengths_sec_itemBox_text {
        padding: 1rem 1rem, 1rem;
        line-height: 1.6;
        font-size: 1.4rem;
    }

    .strengths_sec_itemBox_title {
        font-size: 1.8rem;
        margin-top: .5rem;
    }


    .strengths_slider .slick-slide {
        width: 15rem;
        margin: 0 1rem;
    }
}