@charset 'UTF-8';
/* ----------------------------------------------
　PC設定
------------------------------------------------*/
.p-loadAnime
{
    position: fixed;
    z-index: 100000;
    top: 0;
    left: 0;

    display: flex;

    width: 100%;
    height: 100%;

    transition: all .5s;
    transform: translateX(0%);

    background-color: #fff;

    justify-content: center;
    align-items: center;
}
.p-loadAnime.complate
{
    animation: disnone 1s 0s linear forwards;
}
.p-loadAnime.opacity
{
    background: unset;
}
.p-loadAnime.opacity .load_logo
{
    display: none;
}
.p-loadAnime.reload
{
    z-index: -100 !important;

    display: none !important;

    transform: translateX(-500%) !important;

    opacity: 0 !important;
}
.p-loadAnime__inner
{
    width: 90%;
    max-width: 1000px;

    transition: opacity .5s;

    opacity: 0;
}
.p-loadAnime__inner.load
{
    opacity: 1;
}
.p-loadAnime .cls-1
{
    fill: #359ad2;
}
.p-loadAnime .cls-2
{
    fill: url(#grade);
}
.p-loadAnime .cls-3
{
    fill: #004283;
}

@keyframes disnone
{
    0%
    {
        z-index: 100000;

        display: flex;

        transform: translateX(0%);

        opacity: 1;
    }
    99%
    {
        z-index: 100000;

        display: flex;

        transform: translateX(0%);

        opacity: 0;
    }
    100%
    {
        z-index: -100;

        display: none;

        transform: translateX(-500%);

        opacity: 0;
    }
}
.p-mv
{
    position: relative;
    z-index: 1;

    width: 100%;

    background: url(../images/top/main.webp) top center/131.125% no-repeat;

    aspect-ratio: 16/12;
}
.p-mv::before,
.p-mv::after
{
    position: absolute;
    z-index: -10;
    left: 0;

    display: inline-block;

    width: 100%;

    content: '';
}
.p-mv::before
{
    top: 0;

    height: 55%;

    background: linear-gradient(to bottom, var(--main-white), rgba(255, 255, 255, 0));
}
.p-mv::after
{
    bottom: 0;

    height: 35.33%;

    background: linear-gradient(to top, var(--blue01), rgba(98, 147, 160, 0));

    mix-blend-mode: color-burn;
}
.p-mv__inner
{
    position: absolute;
    top: 42%;
    left: 50%;

    transform: translate(-50%, -50%);
    text-align: center;
}
.p-mv__catch
{
    font-size: var(--fs22_38);
    font-weight: bold;

    margin-bottom: var(--m45);
}
.p-mv__sub-catch
{
    font-size: var(--fs18_26);
    font-weight: bold;

    margin-bottom: .5em;

    color: var(--main-col);
}
.p-mv__text
{
    font-size: var(--fs14_18);

    color: var(--main-col);
}
.p-mv__font
{
    position: absolute;
    right: var(--m75);
    bottom: var(--m90);

    width: 50%;
    max-width: 550px;
}
.p-mv__line
{
    position: absolute;
    z-index: -5;
    top: 50%;
    left: 50%;

    width: calc(100% - var(--m30) * 2);
    height: calc(100% - var(--m40) * 2);

    transform: translate(-50%, -50%);
}
.p-mv__line.is-fade .p-mv__line-path
{
    animation: draw 2s linear forwards;
}
.p-mv__line-border
{
    position: absolute;

    display: block;
    overflow: visible;

    width: 100%;
    height: 100%;

    inset: 0;
}
.p-mv__line-path
{
    fill: none;
    stroke: var(--main-col);
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
    stroke-dasharray: var(--path-length, 0);
    stroke-dashoffset: var(--path-length, 0);
}
.p-mv__bg
{
    position: absolute;
    z-index: -20;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    transition: opacity .5s;

    opacity: 1;
    background-color: var(--main-white);
}
.p-mv__bg.is-fade
{
    opacity: 0;
}

@keyframes draw
{
    to
    {
        stroke-dashoffset: 0;
    }
}
.p-recruit
{
    position: relative;
    z-index: 1;

    padding-top: var(--m100);
    padding-bottom: var(--m160);

    background-color: var(--blue02);
}
.p-recruit::before
{
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;

    display: inline-block;

    width: 8.125%;

    content: '';

    background: url(../images/common/font_recruit.svg) center/contain no-repeat;

    aspect-ratio: 35/191;
}
.p-recruit .c-title
{
    margin-bottom: var(--m80);

    color: var(--main-white);
}
.p-recruit .c-catch
{
    margin-bottom: var(--m100);

    color: var(--main-white);
}
.p-recruit .c-text
{
    margin-bottom: var(--m75);

    color: var(--main-white);
}
.p-recruit .c-text__text
{
    font-size: var(--fs14_18);
    font-weight: 500;

    display: block;

    color: var(--main-white);
}
.p-recruit .c-text__text:not(:last-of-type)
{
    margin-bottom: 2.2em;
}
.p-recruit__section
{
    padding-bottom: var(--m70);

    border-radius: var(--m10);
    background-color: var(--main-white);
    box-shadow: 7px 7px 5px rgba(7, 48, 47, .75);
}
.p-recruit__section:not(:last-of-type)
{
    margin-bottom: var(--m90);
}
.p-recruit__title
{
    font-size: var(--fs16_20);
    font-weight: bold;

    margin-bottom: var(--m55);
    padding: 1em;

    text-align: center;

    color: var(--main-col);
    border-top-left-radius: var(--m10);
    border-top-right-radius: var(--m10);
    background-color: var(--blue03);
}
.p-recruit__box
{
    width: 92%;
    margin-right: auto;
    margin-bottom: var(--m45);
    margin-left: auto;
    padding-bottom: var(--m45);

    border-bottom: 1px solid var(--blue02);
}
.p-recruit__box-title
{
    display: flex;

    width: 50.5%;

    align-items: center;
    grid-gap: var(--m20);
}
.p-recruit__box-title::before
{
    display: inline-block;

    width: var(--m25);
    height: 3px;

    content: '';

    background-color: var(--blue05);
}
.p-recruit__box-tit
{
    font-size: var(--fs18_26);
    font-weight: bold;

    width: calc(100% - var(--m20) - var(--m25));
}
.p-recruit__box-text
{
    font-size: var(--m14_18);
    font-weight: 500;

    margin-bottom: .75em;
}
.p-recruit__box-flex
{
    display: flex;
    flex-direction: row-reverse;

    margin-bottom: var(--m40);

    flex-wrap: wrap;
    justify-content: space-between;
}
.p-recruit__title-row
{
    display: flex;

    margin-bottom: var(--m16);

    flex-wrap: wrap;
    justify-content: space-between;
}
.p-recruit__num
{
    display: flex;

    width: 48.6%;

    border-bottom: 1px solid var(--blue02);

    align-items: center;
}
.p-recruit__num-dt
{
    font-size: var(--fs16_18);
    font-weight: bold;

    min-width: 9em;
    padding: var(--m8_12);

    text-align: center;

    color: var(--main-white);
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    background-color: var(--blue02);
}
.p-recruit__num-dd
{
    font-size: var(--fs18_26);
    font-weight: bold;

    width: calc(100% - var(--fs16_18) * 9);

    text-align: center;

    color: var(--blue02);
}
.p-recruit__detail
{
    display: flex;

    margin-bottom: var(--m40);

    align-items: center;
    grid-gap: var(--m16);
}
.p-recruit__detail-dt
{
    font-size: var(--fs16_18);
    font-weight: 500;

    min-width: 10em;
    padding: var(--m10);

    text-align: center;

    background-color: var(--gray03);
}
.p-recruit__detail-dd
{
    font-size: var(--fs14_18);

    width: calc(100% - var(--fs16_18) * 10 - var(--m16));
}
.p-recruit__text-area
{
    width: 48.68%;
}
.p-recruit__tab-list
{
    display: flex;

    margin-bottom: var(--fs16_20);

    flex-wrap: wrap;
    grid-gap: 10px 7px;
}
.p-recruit__tab
{
    font-size: var(--fs14_16);
    font-weight: 500;

    padding: .15em .5em;

    border-radius: 5px;
    background-color: var(--yellow01);
}
.p-recruit__salary-dt
{
    font-size: var(--fs16_18);
    font-weight: bold;

    position: relative;

    margin-bottom: var(--fs16_20);
    padding: .5em;

    text-align: center;

    background-color: var(--gray03);
}
.p-recruit__salary-dt::before
{
    position: absolute;
    top: 50%;
    left: var(--m25);

    display: inline-block;

    width: var(--fs12_14);

    content: '';
    transform: translateY(-50%);

    background: url(../images/common/icon_yen.svg) center/contain no-repeat;

    aspect-ratio: 14/17;
}
.p-recruit__overview-row
{
    display: flex;

    flex-wrap: wrap;
    align-items: center;
    grid-gap: 14px;
}
.p-recruit__overview-row:not(:first-of-type)
{
    margin-top: var(--fs14_18);
    padding-top: var(--fs14_18);

    border-top: 1px solid var(--gray04);
}
.p-recruit__overview-dt
{
    font-size: var(--fs16_18);
    font-weight: 500;

    padding: .5em 1em;

    border-radius: 4px;
    background-color: var(--gray03);
}
.p-recruit__overview-dd
{
    font-size: var(--fs14_18);
    font-weight: 500;
}
.p-recruit__image
{
    overflow: hidden;

    width: 48.68%;

    aspect-ratio: 537/358;
}
.p-recruit__image img
{
    height: 100%;

    -o-object-fit: cover;

       object-fit: cover;
}
.p-recruit__button-row
{
    display: flex;

    flex-wrap: wrap;
    grid-gap: var(--m20) 2.71%;
    justify-content: center;
}
.p-recruit__button-row .c-button
{
    max-width: 378px;
}
.p-recruit__contact
{
    width: 92%;
    margin-right: auto;
    margin-bottom: var(--m120);
    margin-left: auto;
    padding: var(--m35) var(--m20) var(--m40);

    background-color: var(--blue04);
}
.p-recruit__contact-title
{
    font-size: var(--fs18_20);
    font-weight: bold;

    margin-bottom: .5em;

    text-align: center;

    color: var(--blue02);
}
.p-recruit__contact-text
{
    font-size: var(--fs16_18);
    font-weight: 500;

    margin-bottom: .5em;

    text-align: center;
}
.p-recruit__contact-small
{
    font-size: var(--fs14_16);
    font-weight: 500;

    margin-bottom: 1em;

    text-align: center;
}
.p-recruit__bg
{
    position: absolute;
    z-index: -2;
}
.p-recruit__bg.image01
{
    top: 0;
    left: 50%;

    width: 131.25%;

    transform: translate(-50%, -6.64%);
}
.p-recruit__bg.image02
{
    top: 0;
    left: 0;

    width: 66.125%;

    transform: translate(-26%, 55.95%);
}
.p-recruit__bg.image03
{
    top: 45%;
    right: 0;

    width: 60%;

    transform: translateX(50%);
}
.p-recruit__bg.image04
{
    right: 0;
    bottom: 0;

    width: 112%;
}

.p-shop__section
{
    width: 92%;
    margin-right: auto;
    margin-left: auto;
}
.p-shop__gallery
{
    display: flex;

    margin-bottom: var(--m30);

    flex-wrap: wrap;
    justify-content: space-between;
    grid-gap: var(--m70) 0;
}
.p-shop__gallery-main
{
    overflow: hidden;

    width: 55.83%;
}
.p-shop__gallery-thumbs
{
    width: 38.33%;
}
.p-shop__main-slide img
{
    height: 100%;

    -o-object-fit: cover;

       object-fit: cover;
}
.p-shop__thumbs-inner
{
    display: flex;

    flex-wrap: wrap;
    grid-gap: var(--fs14_20) 4.505%;
}
.p-shop__thumbs-slide
{
    position: relative;
    z-index: 1;

    width: 30.33%;
}
.p-shop__thumbs-slide img
{
    height: 100%;

    -o-object-fit: cover;

       object-fit: cover;
}
.p-shop__thumbs-slide.is-active::after
{
    position: absolute;
    top: 0;
    left: 0;

    display: inline-block;

    width: 100%;
    height: 100%;

    content: '';

    box-shadow: inset 0 0 0 6px var(--blue02);
}
.p-shop__info
{
    display: flex;

    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    grid-gap: var(--fs16_20);
}
.p-shop__name
{
    font-size: var(--fs18_20);
    font-weight: bold;

    width: 100%;

    color: var(--blue02);
}
.p-shop__address
{
    display: flex;

    align-items: center;
    grid-gap: var(--m16);
}
.p-shop__dt
{
    font-size: var(--fs16_18);
    font-weight: 500;

    padding: .25em 4em;

    background-color: var(--gray03);
}
.p-shop__dd
{
    font-size: var(--fs14_18);
    font-weight: 500;

    width: calc(100% - var(--fs16_18) * 11 - var(--m16));
}
.p-shop__map-link
{
    display: flex;

    align-items: center;
    grid-gap: 5px;
}
.p-shop__map-link::before
{
    display: inline-block;

    width: var(--fs14_18);

    content: '';

    background: url(../images/common/icon_map.svg) center/contain no-repeat;

    aspect-ratio: 18/30;
}
.p-shop__map-text
{
    font-size: var(--fs16_20);
    font-weight: 500;

    width: calc(100% - var(--fs14_18) - 5px);

    text-decoration: underline;

    color: var(--blue02);
}

.p-about
{
    position: relative;
    z-index: 1;

    padding-top: var(--m120);
    padding-bottom: var(--m140);

    background-color: var(--blue04);
}
.p-about::before
{
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;

    display: inline-block;

    width: 8.125%;

    content: '';

    background: url(../images/common/font_profile.svg) center/contain no-repeat;

    aspect-ratio: 358/1833;
}
.p-about .c-title
{
    margin-bottom: var(--m85);

    color: var(--blue02);
}
.p-about .c-catch
{
    font-weight: bold;

    margin-bottom: var(--m100);
}
.p-about__flex
{
    display: flex;

    padding-top: var(--m60);
    padding-right: 4%;
    padding-left: 4%;

    border-top: 1px solid var(--blue02);

    flex-wrap: wrap;
    justify-content: space-between;
    grid-gap: var(--m60) 0;
}
.p-about__text
{
    font-size: var(--fs16_20);
    font-weight: 500;
    line-height: 2.2;

    width: 48.64%;

    color: var(--black);
}
.p-about__overview
{
    width: 48.64%;
}
.p-about__overview-row
{
    display: flex;

    flex-wrap: wrap;
    align-items: center;
    grid-gap: 14px;
}
.p-about__overview-row:not(:first-of-type)
{
    margin-top: var(--m35);
    padding-top: var(--m35);

    border-top: 1px solid var(--gray04);
}
.p-about__overview-dt
{
    font-size: var(--fs16_18);
    font-weight: 500;

    min-width: 7em;
    padding-left: 1em;

    border-radius: 4px;
}
.p-about__overview-dd
{
    font-size: var(--fs14_18);
    font-weight: 500;

    width: calc(100% - var(--fs16_18) * 8);
}

.p-contact
{
    position: relative;
    z-index: 1;

    padding-top: var(--m110);
}
.p-contact::before
{
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;

    display: inline-block;

    width: 8.125%;

    content: '';

    background: url(../images/common/font_contact.svg) center/contain no-repeat;

    aspect-ratio: 39/233;
}
.p-contact .c-title
{
    margin-bottom: var(--m100);
}

/* ----------------------------------------------
　PAD以下設定
------------------------------------------------*/
@media all and (max-width: 768px)
{
    .p-recruit__box
    {
        margin-bottom: var(--m90);
        padding-bottom: var(--m90);
    }
    .p-recruit__box-title
    {
        width: 100%;
    }
    .p-recruit__box-flex
    {
        grid-gap: 20px;
    }
    .p-recruit__title-row
    {
        grid-gap: 16px;
    }
    .p-recruit__num
    {
        width: 100%;
    }
    .p-recruit__text-area
    {
        width: 100%;
    }
    .p-recruit__image
    {
        width: 100%;
    }
    .p-about__text
    {
        width: 100%;
    }
    .p-about__overview
    {
        width: 100%;
    }
}
@media all and (max-width: 767px)
{
    .p-shop__section#takasaki .p-shop__text-area
    {
        letter-spacing: unset;
    }
    .p-shop__section#takasaki .p-shop__insta
    {
        margin-right: 0;
    }
    .p-shop__gallery-main
    {
        width: 100%;
    }
    .p-shop__gallery-thumbs
    {
        overflow: scroll;

        width: 100%;

        grid-gap: var(--fs14_20) 4%;
    }
    .p-shop__thumbs-inner
    {
        flex-wrap: nowrap;
    }
    .p-shop__thumbs-slide
    {
        width: 22%;
        min-width: 100px;
    }
    .p-shop__thumbs-slide.is-active::after
    {
        box-shadow: inset 0 0 0 3px var(--main-col);
    }
    .p-shop__info
    {
        justify-content: center;
    }
    .p-shop__address
    {
        flex-wrap: wrap;
    }
}
/* ----------------------------------------------
　SP調整
------------------------------------------------*/
@media all and (max-width: 620px)
{
    .p-mv
    {
        background: url(../images/top/main.webp) top left 30%/cover no-repeat;

        aspect-ratio: 1/1.5;
    }
    .p-mv__inner
    {
        top: 35%;

        width: 90%;
    }
    .p-mv__font
    {
        right: 50%;

        width: 80%;

        transform: translateX(50%);
    }
    .p-recruit::before
    {
        width: 12%;
    }
    .p-recruit__num-dt
    {
        min-width: unset;
    }
    .p-recruit__num-dd
    {
        width: calc(100% - var(--m8_12) * 8 - var(--m8_12) * 2);
    }
    .p-recruit__detail
    {
        flex-wrap: wrap;
    }
    .p-recruit__detail-dt
    {
        width: 100%;
    }
    .p-recruit__detail-dd
    {
        width: 100%;
    }
    .p-recruit__overview-dt
    {
        width: 100%;

        text-align: center;
    }
    .p-recruit__overview-dd
    {
        width: 100%;

        text-align: center;
    }
    .p-recruit__bg.image01
    {
        width: 200%;
    }
    .p-recruit__bg.image02
    {
        transform: translate(-26%, 100%);
    }
    .p-recruit__bg.image04
    {
        width: 200%;
    }
    .p-shop__dt
    {
        width: 100%;

        text-align: center;
    }
    .p-shop__dd
    {
        width: 100%;
    }
    .p-about__overview-dt
    {
        min-width: 4em;
        padding-left: 0;
    }
    .p-about__overview-dd
    {
        width: calc(100% - var(--fs16_18) * 5);
    }
}