@charset "utf-8";

main {
    overflow: hidden;
}

.about-title-box01 {
    display: flex;
    align-items: center;
}

.about-title-decoration01 {
    max-width: 6.4rem;
    width: 100%;
    margin: 0 1rem 0 0;
}

.about-sub-title01 {
    font-size: 2.5rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    line-height: 1.44em;
    margin: 0 0 0 3rem;
}

.about-img-decoration01 {
    mask-image: url(../../../../uploads/top_menu_mask.svg);
    -webkit-mask-image: url(../../../../uploads/top_menu_mask.svg);
    mask-size: cover;
    -webkit-mask-size: cover;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    width: 100%;
}

/* ==========================================
about01
========================================== */

.about01-wrapper {
    padding: 14.5rem 0 5rem;
    position: relative;
}

.about01-inner {
    max-width: 174rem;
    width: 100%;
    padding: 0 1.5rem;
    margin: auto;
    position: relative;
    z-index: 9;
}

.about01-area01 {
    max-width: 147rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 16rem 3rem 0;
    margin: 0 0 0 auto;
    position: relative;
    z-index: 9;
}

.about01-img-block01 {
    max-width: 61rem;
    width: 100%;
    padding: 0 0 9.4rem 11.8rem;
    position: relative;
}

.about01-img01 {
    max-width: 49.3rem;
    width: 80.81%;
    position: absolute;
    left: 0;
    bottom: 0;
}

.about01-img02 {
    max-width: 49.3rem;
    width: 100%;
    mask-image: url(../../../../uploads/top_menu_mask.svg);
    -webkit-mask-image: url(../../../../uploads/top_menu_mask.svg);
    mask-size: cover;
    -webkit-mask-size: cover;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    width: 100%;
    position: relative;
}

.about01-img02>img {
    object-fit: cover;
    width: 100%;
    height: 100% !important;
}

.about01-text-block01 {
    max-width: 61.6rem;
    width: 100%;
}

.about-title01 {
    text-align: center;
}

.about01-text-box01 {
    line-height: 2.22em;
    margin: 6rem 0 0;
    text-align: center;
}

.about01-area02 {
    max-width: 148.4rem;
    width: 100%;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin: 10rem 0 0 auto;
    position: relative;
}

.about01-img-block02 {
    max-width: 65rem;
    mask-image: url(../../../../uploads/top_menu_mask.svg);
    -webkit-mask-image: url(../../../../uploads/top_menu_mask.svg);
    mask-size: cover;
    -webkit-mask-size: cover;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    width: 100%;
}

.about01-text-block02 {
    max-width: 77.4rem;
    width: 100%;
    margin: 5rem 0 0;
}

.about01-text-box02 {
    max-width: 65rem;
    width: 100%;
    line-height: 2.22em;
    margin: 5rem 0 0 auto;
}

.about-decoration01 {
    max-width: 17.6rem;
    width: 100%;
    position: absolute;
    right: 0;
    bottom: 0;
}

.about-decoration02 {
    max-width: 62.5rem;
    width: 100%;
    position: absolute;
    left: 10.6rem;
    bottom: 10.6rem;
}

/* ==========================================
about02
========================================== */

.about02-wrapper {
    background: url(../../../../uploads/about03.jpg) no-repeat center / cover;
}

.about02-inner {
    max-width: 140rem;
    width: 100%;
    padding: 0 1.5rem;
    margin: auto;
    position: relative;
    z-index: 99;
}

.about02-area {
    max-width: 108.8rem;
    width: 100%;
    padding: 0 16.5rem 0 0;
    margin: 0 0 0 auto;
    position: relative;
}

.about02-text-box {
    max-width: 80rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    line-height: 2.22em;
    margin: 5rem 0 0 auto;
}

.about02-text>strong {
    font-size: 2.5rem;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.6em;
}

.about-decoration03 {
    max-width: 16.7rem;
    width: 100%;
    position: absolute;
    right: 0;
    bottom: 0;
}

.about-decoration04 {
    max-width: 52.1rem;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    z-index: 9;
}

/* ==========================================
about03
========================================== */

.about03-wrapper {
    padding: 6rem 0 0;
    position: relative;
}

.about03-inner {
    max-width: 151.4rem;
    width: 100%;
    padding: 0 1.5rem;
    margin: auto;
    position: relative;
    z-index: 9;
}

.about03-area {
    max-width: 140.2rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.about03-img-block {
    max-width: 59.7rem;
    width: 100%;
    margin: 11rem 0 0;
}

.about03-text-block {
    max-width: 80.6rem;
    width: 100%;
}

.about03-text-box {
    max-width: 68.3rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    line-height: 2.22em;
    margin: 5rem 0 0 auto;
}

.about03-text>strong {
    font-size: 2.5rem;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.66em;
    color: var(--primary);
}

.about-decoration05 {
    max-width: 71.1rem;
    width: 100%;
    position: absolute;
    right: 0;
    bottom: -6rem;
}

/* ==========================================
about04
========================================== */

.about04-wrapper {
    padding: 7rem 0 0;
}

.about04-inner {
    max-width: 168.4rem;
    width: 100%;
    padding: 0 1.5rem;
    margin: auto;
}

.about04-area {
    max-width: 156rem;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    margin: 0 0 0 auto;
}

.about04-img-block {
    max-width: 71.5rem;
    width: 100%;
    position: relative;
}

.about04-img01 {
    max-width: 52.6rem;
    width: 73.56%;
    position: relative;
    z-index: 9;
}

.about04-img02 {
    max-width: 41.4rem;
    width: 57.9%;
    margin: -13.5rem 0 0 auto;
    z-index: 9;
    position: relative;
}

.about04-text-block {
    max-width: 72.4rem;
    width: 100%;
}

.about04-text-box {
    max-width: 60rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    line-height: 2.22em;
    margin: 5rem 0 0 auto;
}

.about04-text>strong {
    font-size: 2.5rem;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.66em;
    color: var(--primary);
}

/* ==========================================
about05
========================================== */

.about05-wrapper {
    padding: 8rem 0 0;
    position: relative;
}

.about05-inner {
    max-width: 112.7rem;
    width: 100%;
    padding: 0 1.5rem;
    margin: auto;
    position: relative;
    z-index: 9;
}

.about05-area {
    max-width: 101.4rem;
    width: 100%;
}

.about05-text-box {
    max-width: 88.4rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    line-height: 2.22em;
    margin: 5rem 0 0 auto;
}

.about05-text>strong {
    font-size: 2.5rem;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.66em;
    color: var(--primary);
}

.about-decoration06 {
    max-width: 72.2rem;
    width: 100%;
    position: absolute;
    top: -24rem;
    left: 0;
}

/* ==========================================
about06
========================================== */

.about06-wrapper {
    padding: 12.5rem 0 0;
    position: relative;
}

.about06-inner {
    max-width: 158.5rem;
    width: 100%;
    padding: 0 1.5rem 0 0;
    margin: 0 auto 0 0;
    position: relative;
    z-index: 9;
}

.about06-area {
    display: flex;
    justify-content: space-between;
}

.about06-img-block {
    max-width: 65.8rem;
    width: 100%;
    position: relative;
}

.about06-img01 {
    max-width: 31.8rem;
    width: 48.32%;
    margin: 0 0 0 auto;
    position: relative;
    z-index: 9;
}

.about06-img02 {
    max-width: 49.9rem;
    width: 75.83%;
    margin: -9rem 0 0;
}

.about06-text-block {
    max-width: 82.4rem;
    width: 100%;
    margin: 3rem 0 0;
}

.about06-text-box {
    max-width: 70rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    line-height: 2.22em;
    margin: 5rem 0 0 auto;
}

.about06-text>strong {
    font-size: 2.5rem;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.66em;
    color: var(--primary);
}

.about-decoration07 {
    max-width: 51.5rem;
    width: 100%;
    position: absolute;
    top: 0;
    right: 20.5rem;
}

/* ==========================================
about07
========================================== */

.about07-wrapper {
    padding: 8rem 0 0;
    position: relative;
}

.about07-inner {
    max-width: 135rem;
    width: 100%;
    padding: 0 1.5rem;
    margin: auto;
    position: relative;
    z-index: 9;
}

.about07-area {
    max-width: 118.5rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    margin: 0 0 0 auto;
}

.about07-img-block {
    max-width: 36.5rem;
    width: 100%;
    margin: 0 0 0 -10.4rem;
}

.about07-img01 {
    max-width: 31.8rem;
    width: 48.32%;
    margin: 0 0 0 auto;
    position: relative;
    z-index: 9;
}

.about07-img02 {
    max-width: 49.9rem;
    width: 75.83%;
    margin: -9rem 0 0;
}

.about07-text-block {
    max-width: 82.4rem;
    width: 100%;
    margin: 7rem 0 0;
}

.about07-text-box {
    max-width: 80rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    line-height: 2.22em;
    margin: 5rem 0 0 auto;
}

.about07-text>strong {
    font-size: 2.5rem;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.66em;
    color: var(--primary);
}

.about-decoration08 {
    max-width: 41.3rem;
    width: 100%;
    position: absolute;
    top: 8rem;
    left: 21.5rem;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <=1024px) {

    .about-sub-title01 {
        font-size: 2.2rem;
    }

    /* ==========================================
about01
========================================== */

    .about01-area01 {
        display: block;
        padding: 0 0 3rem;
    }

    .about01-img-block01 {
        margin: auto;
    }

    .about01-text-block01 {
        margin: 6rem auto 0;
    }

    .about01-text-box01 {
        margin: 4rem 0 0;
    }

    .about01-area02 {
        display: block;
        margin: 6rem auto 0;
    }

    .about01-img-block02 {
        margin: auto;
    }

    .about01-text-block02 {
        max-width: 100%;
        margin: 3rem auto 0;
    }

    .about01-text-box02 {
        max-width: 100%;
        margin: 3rem 0 0;
    }

    /* ==========================================
about02
========================================== */

    .about02-text-box {
        max-width: 100%;
        gap: 2rem;
        margin: 3rem 0 0;
    }

    .about02-text>strong {
        font-size: 2.2rem;
    }

    /* ==========================================
about03
========================================== */

    .about03-area {
        display: block;
    }

    .about03-img-block {
        margin: auto;
    }

    .about03-text-block {
        max-width: 100%;
        margin: 4rem auto 0;
    }

    .about03-text-box {
        max-width: 100%;
        gap: 2rem;
        margin: 3rem auto 0;
    }

    .about03-text>strong {
        font-size: 2.2rem;
    }

    /* ==========================================
about04
========================================== */

    .about04-area {
        display: block;
    }

    .about04-img-block {
        margin: auto;
    }

    .about04-text-block {
        max-width: 100%;
        margin: 4rem auto 0;
    }

    .about04-text-box {
        max-width: 100%;
        gap: 2rem;
        margin: 3rem auto 0;
    }

    /* ==========================================
about05
========================================== */

    .about05-text-box {
        max-width: 100%;
        gap: 2rem;
        margin: 3rem auto 0;
    }

    .about05-text>strong {
        font-size: 2.2rem;
    }

    /* ==========================================
about06
========================================== */

    .about06-area {
        display: block;
    }

    .about06-img-block {
        margin: auto;
    }

    .about06-text-block {
        max-width: 100%;
        margin: 4rem 0 0;
    }

    .about06-inner {
        padding: 0 1.5rem;
    }

    .about06-text-box {
        max-width: 100%;
        gap: 2rem;
        margin: 3rem auto 0;
    }

    .about06-text>strong {
        font-size: 2.2rem;
    }

    /* ==========================================
about07
========================================== */

    .about07-area {
        display: block;
    }

    .about07-img-block {
        max-width: 100%;
        text-align: center;
        margin: auto;
    }

    .about07-text-block {
        max-width: 100%;
        margin: 4rem 0 0;
    }

    .about07-text-box {
        max-width: 100%;
        gap: 2rem;
        margin: 3rem 0 0;
    }

    .about07-text>strong {
        font-size: 2.2rem;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <=768px) {

    .about-decoration01 {
        max-width: 12rem;
    }

    .about-decoration02 {
        max-width: 40rem;
        left: 5rem;
        bottom: 5rem;
    }

    .about-decoration03 {
        max-width: 12rem;
    }

    .about-decoration04 {
        max-width: 30rem;
    }

    .about-decoration05 {
        max-width: 50rem;
        bottom: -3rem;
    }

    .about-decoration06 {
        max-width: 50rem;
        top: -10rem;
    }

    .about-decoration07 {
        max-width: 30rem;
        right: auto;
        left: 5rem;
    }

    .about-decoration08 {
        max-width: 31rem;
        top: -8rem;
        left: auto;
        right: 0;
    }

    .about-sub-title01 {
        font-size: 1.8rem;
    }

    /* ==========================================
about02
========================================== */

    .about02-text>strong {
        font-size: 1.8rem;
    }

    /* ==========================================
about03
========================================== */

    .about03-text>strong {
        font-size: 1.8rem;
    }

    .about02-wrapper {
        background: url(http://tsawork.com/sennarelax.com/wp-content/uploads/sp_about03.jpg) no-repeat center / cover;
    }

    /* ==========================================
about05
========================================== */

    .about05-text>strong {
        font-size: 1.8rem;
    }

    /* ==========================================
about06
========================================== */

    .about06-text>strong {
        font-size: 1.8rem;
    }

    /* ==========================================
about07
========================================== */

    .about07-text>strong {
        font-size: 1.8rem;
    }

    .about01-wrapper {
        padding: 8rem 0 5rem;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <=576px) {

    .about-title-box01 {
        flex-wrap: wrap;
    }

    .about-sub-title01 {
        width: 100%;
        margin: 0 0 0 7.4rem;
    }

    .about-decoration01 {
        display: none;
    }

    .about02-area {
        padding: 0;
    }

    .about-decoration03 {
        display: none;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */