@charset "utf-8";


/** ビルボード  
-------------------------------------------------------------------- */
section#hero {
    padding: 0;
}
section#hero .wrap {
    min-height: calc(720 * var(--px));
    justify-content: flex-start;
}
section#hero .heading {
    text-align: left;
    line-height: 1.75;
}
section#hero .tagline {
    letter-spacing: 0.18ic;
}
section#hero .subline {
    margin-top: var(--m2);
    letter-spacing: 0.09ic;
}
section#hero .marker {
    padding-block: 0.1lh;
    padding-inline: 0.3ic;
    border-radius: 6px;
    color: white;
}
section#hero .marker:first-of-type {
    --marker: var(--sub);
    margin-right: 0.3ic;
}
section#hero .marker:last-of-type {
    --marker: var(--main);
    margin-inline: 0.3ic;
}
section#hero .sign {
    margin-top: var(--m2);
    position: relative;
}
section#hero .sign img {
    width: calc(160 * var(--px));
}
section#hero .sign p {
    width: max-content;
    padding-block: 1lh;
    padding-inline: 1.5ic;
    background: white;
    border-radius: 10px;
    box-shadow: 9px 9px 0 0 rgb(from var(--black) r g b / 0.05);

    font-weight: 700;

    position: absolute;
    left: calc(130 * var(--px));
    top: -1ic;
    z-index: -1;
}
section#hero .nav-contact {
    margin-top: var(--m4);
}

@media screen and (max-width: 767px) {
    section#hero .wrap {
        padding-top: var(--m2);
        min-height: calc(700 * var(--px));
        align-items: flex-start;
    }
    section#hero .tagline {
        letter-spacing: 0.06ic;
    }
    section#hero .subline {
        text-align: left;
        line-height: 2.25;
    }
    section#hero .marker:last-of-type {
        margin-left: 0;
    }
    section#hero .sign img {
        width: 35%;
    }
    section#hero .sign p {
        left: 27%;
    }
    section#hero .nav-contact {
        font-size: var(--regular-size);
        margin-inline: auto;
    }
}





/** 施設イメージ  
-------------------------------------------------------------------- */
section#gallery {
    padding-block: 0;
}
section#gallery .swiper-wrapper {
  transition-timing-function: linear;
}
@media screen and (max-width: 767px) {}





/** いちばん星とは  
-------------------------------------------------------------------- */
section#overview {
    background: var(--pale);
}
section#overview .lead {
    margin-top: 0;
}
section:where(#overview) .text + img {
    width: calc(560 * var(--px));
}

@media screen and (max-width: 767px) {}





/** お仕事内容のご紹介  
-------------------------------------------------------------------- */
section#activity {
    padding-inline: var(--m3);
}
section#activity p {
    padding-inline: var(--m7);
}
section#activity .container {
    margin-top: var(--m4);
    justify-content: space-between;
}
section#activity .image {
    width: 48%;
}
section#activity .image:nth-of-type(1) {
    rotate: -5.94deg;
}
section#activity .image:nth-of-type(2) {
    rotate: 3.57deg;
}
section#activity .image:nth-of-type(3) {
    rotate: -1.5deg;
}
section#activity .image:nth-of-type(4) {
    rotate: 2.46deg;
}
section#activity .nav-more {
    margin-top: var(--m3);
}
@media screen and (max-width: 767px) {
    section#activity p {
        padding-inline: 0;
    }
}





/** お仕事のご依頼について  
-------------------------------------------------------------------- */
section#order {
    background: var(--light);
}
section#order .container {
    margin-top: var(--m6);
    position: relative;
}
section#order .block {
    width: 60%;
    padding-block: var(--m3);
    padding-inline: var(--m4);
    position: relative;
}
section#order .block + .block {
    margin-top: var(--m6);
}
section#order .block + .block::before {
    display: block;
    width: 40px;
    height: 20px;
    background: var(--main);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    position: absolute;
    left: 50%;
    bottom: calc(100% + var(--m3));
    translate: -50% 50%;
}
section#order .numbering {
    width: 80px;
    height: 80px;

    color: white;
    font-size: var(--tagline-size);
    font-weight: 700;

    display: grid;
    place-items: center;
    position: absolute;
    left: 0;
    top: 0;
    translate: -50% -50%;
    z-index: 10;
}
section#order .numbering::after {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 24px;
    background: var(--main);
    position: absolute;
    inset: 0;
    z-index: -1;
    rotate: -18deg;
}
section#order h3 {
    font-size: 27px;
    letter-spacing: 0.1ic;
    margin-bottom: 0.3lh;
}
section#order .image {
    width: 50%;
    border-radius: 24px;
    position: absolute;
    right: 0;
    top: var(--m4);
    z-index: -1;
}
section#order .image:last-of-type {
    translate: 0 calc(100% + var(--m4));
}
@media screen and (max-width: 767px) {
    section#order .container {
        margin-top: var(--m8);
        padding-inline: var(--m2);
    }
    section#order .block {
        width: 100%;
        padding-block: var(--m3) var(--m2);
        padding-inline: var(--m2);
    }
    section#order .block + .block::before {
        width: 30px;
        height: 15px;
    }
    section#order .numbering {
        width: 54px;
        height: 54px;
        left: 50%;
        top: 0;
        translate: -50% -50%;
    }
    section#order .numbering::after {
        border-radius: 12px;
    }
    section#order h3 {
        font-size: var(--headline-size);
        text-align: center;
    }
    section#order .image {
        width: 90%;
        border-radius: 12px;
        right: -10%;
        top: calc(-1 * var(--m4));
    }
    section#order .image:last-of-type {
        translate: none;
        top: calc(430 * var(--px));
    }
}





/** 事業所アクセス  
-------------------------------------------------------------------- */
section#access {}
section#access iframe + p {
    margin-top: var(--m3);
    font-weight: 700;
    text-align: center;
}
section#access .nav-more {
    margin-top: var(--m4);
    margin-inline: auto;
}

@media screen and (max-width: 767px) {}
