@charset "utf-8";
/* CSS Document */

/*
* ACHIEVE BG
******************************************************/
.bg01,
.bg02 {
    position: relative;
}
.bg01::before,
.bg02::before {
    content: "";
    display: block;
    position: absolute;
    z-index: 0;
    width: 100%;
    left: 0;
    background-size: 100%;
}
.bg01::before {
    background: url(../img/achieve/bg01.svg) no-repeat top center / cover;
    top: -210px;
    height: 45vw;
}
.bg02::before {
    background: url(../img/achieve/bg02.svg) no-repeat top center / cover;
    top: -310px;
    height: 60vw;
}
@media screen and (min-width:880px) and (max-width:1280px) {
    .bg01::before {
        top: -110px;
    }
    .bg02::before {
        top: -200px;
    }
}
@media screen and (max-width:880px) {
    .bg01::before {
        top: -60px;
    }
    .bg02::before {
        top: -90px;
    }
}
/*
* ACHIEVE LAYER
******************************************************/
.layer-content01,
.layer-content02 {
    position: relative;
}
.achieve-layer01,
.achieve-layer02 {
    position: absolute;
    z-index: 1;
}
.achieve-layer01 {
    left: 0;
    top: 0;
}
.achieve-layer02 {
    right: 0;
    top: -100px;
}
@media screen and (max-width:880px) {
    .achieve-layer01 {
        top: 160px;
    }
    .achieve-layer02 {
        top: -230px;
    }
}

/*
* ACHIEVE HEADING
******************************************************/
.achieve-heading {
    max-width:var(--content-size-page);
    margin: auto;
    padding: 0 0 30px 0;
}
.achieve-heading-c::after {
    bottom: -18px;
}
@media screen and (max-width:650px) {
    .achieve-heading {
        padding: 0;
    }
}

/*
* ACHIEVE CONTENT
******************************************************/
.achieve-content {
    margin: 60px 0;
}
.achieve-content-inner {
    max-width:var(--content-size-page);
    margin: auto;
    padding: 60px 0;
    position:relative;
    z-index:2;
}
@media screen and (max-width:880px) {
    .achieve-content {
        margin: 40px 0;
    }
    .achieve-content-inner {
        padding: 40px 0;
    }
}

/*
* ACHIEVE IMAGES
******************************************************/
.achieve-img-1col {
    text-align: center;
    margin: 0 0 30px 0;
}
.achieve-img-2col,
.achieve-img-2col-h {
    display: grid;
    grid-gap: 30px;
    margin: 0 0 30px 0;
}
.achieve-img-2col {
    grid-template-columns: 1fr 1fr;
}
.achieve-img-2col-h {
    grid-template-columns: 1.07fr 1fr;
}
.achieve-img-2col-items {
    display: block;
}
.achieve-img-2col-item:first-child {
    margin: 0 0 30px 0;
}
@media screen and (max-width:880px) {
    .achieve-img-1col {
        margin: 0 0 20px 0;
    }
    .achieve-img-2col,
    .achieve-img-2col-h {
        grid-gap: 20px;
        margin: 0 0 20px 0;
    }
    .achieve-img-2col-item:first-child {
        margin: 0 0 20px 0;
    }
}

/*
* ACHIEVE TEXT
******************************************************/
.achieve-content-text {
    font-size: 1.4rem;
    line-height: 2.25;
}
.content01,
.content02,
.content03 {
    text-align: center;
}
.content04 {
    width: 550px;
    margin: auto;
}
@media screen and (max-width:640px) {
    .content01,
    .content02,
    .content03 {
        text-align: left;
    }
    .content04 {
        width: auto;
    }
}