/* Google font */
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Noto+Serif+JP:wght@300;400;500;600;700;900&family=Sawarabi+Mincho&family=Shippori+Mincho:wght@400;500;600;700;800&display=swap');

/*========================
    common
========================*/
html{
    font-size: 62.5%;
    position: relative;
    overflow-x: hidden;
}

body{
    font-size: 1.7rem;
    font-weight: 300;
    font-family: 'Noto Serif JP';
    color: #3C3C3C;
    background-color: #E8E8E8;
    overflow-x: hidden;
}

.inner{
    width: 100%;
    max-width: 1600px;
    margin: auto;
}

img{
    width: 100%;
}

.title{
    font-size: 4.8rem;
    color: #1C1C1C;
    width: 90%;
    max-width: 980px;
    margin: auto;
    font-family: 'Sawarabi Mincho';
    font-weight: 400;
}

.title > span{
    font-size: 1.8rem;
    color: #F08400;
    font-family: 'Libre Baskerville';
    position: relative;
}

.title > span::before{
    content: "";
    display: block;
    width: 306vw;
    height: 1px;
    background-color: #F08400;
    position: absolute;
    top: 50%;
    left: -10px;
    transform: translate(-100%, -50%);
}

br.sp{
    display: none;
}

@media screen and (max-width: 990px){
    .title{
        font-size: 3.6rem;
    }

    .title > span{
        font-size: 1.6rem;
    }
}

@media screen and (max-width: 767px){
    .title{
        font-size: 2.8rem;
        width: 85%;
    }

    .title > span{
        font-size: 1.3rem;
    }

    .title > span::before{
        left: -5px;
    }
}

@media screen and (max-width: 575px){
    .title{
        font-size: 2.5rem;
    }

    br.sp{
        display: block;
    }
}


/*========================
    header
========================*/
.mainvisual{
    position: relative;
    z-index: 1;
}

.header__logo{
    width: 430px;
    position: absolute;
    top: 3.75vw;
    left: 3.75%;
    z-index: 90;
    background-color: rgba(0, 0, 0, 0.25);
}

.header__message-logo{
    width: 100%;
    position: absolute;
    bottom: 100px;
    left: 0%;
    z-index: 80;
}

.header__message-logo__bg{
    width: 100%;
    height: 21.5vw;
    position: absolute;
    bottom: 128px;
    left: 0%;
    z-index: 79;
    background-color: rgba(0, 0, 0, 0.25);
}

.mainvisual-slide.sp{
    display: none;
}

.header__nav{
    padding: 30px 2.8125%;
    background-color: #787878;
}

.header__nav-list{
    display: flex;
    max-width: 1080px;
    margin-left: auto;
}

.header__nav-list > li{
    padding-left: 20px;
    margin-left: auto;
    font-size: 1.4rem;
}

.header__nav-list > li:first-child{
    margin-left: 0;
}

.header__nav-link > span{
    position: relative;
    font-size: 2rem;
    font-family: 'Libre Baskerville';
    color: #F0A678;
    transition: .5s ease;
}

.header__nav-link{
    color: #E8E8E8;
    transition: .5s ease;
}

.header__nav-link > span::before{
    content: "";
    display: block;
    width: 10px;
    height: 1px;
    background-color: #F0A678;
    position: absolute;
    top: 50%;
    left: -5px;
    transform: translate(-100%, -50%);
    transition: .5s ease;
}

.header__nav-link:hover,
.header__nav-link:hover span{
    color: #7D4500;
    transition: .5s ease;
}

.header__nav-link:hover span::before{
    background-color: #7D4500;
    transition: .5s ease;
}

.recruit-theme{
    background-color: #272727;
    display: grid;
    place-items: center;
    width: 100%;
    height: 18vw;
    position: relative;
    z-index: 1;
}
.recruit-theme img{
    width: 72vw;
}

.hamburger-menu,
.drawer-menu{
    display: none;
}

.header__nav.is-hide{
    visibility: hidden;
}

.hamburger-menu.is-show,
.drawer-menu.is-show{
    display: block;
}

.hamburger-menu{
    position: fixed;
    right: 16.2px;
    top: 16.2px;
    width: 40px;
    height: 40px;
    background-color: #F08400;
    cursor: pointer;
    z-index: 100;
}

.bar{
    position: absolute;
    width: 80%;
    height: 3px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #E8E8E8;
    border-radius: 4px;
    transition: ease 0.4s;
}

.bar_top{
    top: 30%;
}

.bar_middle{
    top: 50%;
}

.bar_bottom{
    top: 70%;
}

.close .bar_top {
    top: 45%;
    left: 50%;
    transform: rotate(45deg) translateX(-50%);
    transform-origin: left;
}

.close .bar_middle {
    opacity: 0;
    transition: 0.1s;
}

.close .bar_bottom {
    top: 45%;
    left: 50%;
    transform: rotate(-45deg) translateX(-50%);
    transform-origin: left;
}

.drawer-menu{
    background-color: #E8E8E8;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 90;
    transform: translateX(110%);
    transition: .5s ease;
}

.drawer-menu.slide-in{
    transform: translateX(0);
    transition: .5s ease;
}

.drawer-menu__list{
    width: 85%;
    max-width: 350px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.drawer-menu__list > li{
    margin-top: 20px;
}

.drawer-menu__list > li:first-child{
    margin-top: 0;
}

.drawer-menu__link{
    font-size: 1.4rem;
    color: #1C1C1C;
    transition: .5s ease;
}

.drawer-menu__link > span{
    position: relative;
    font-size: 2rem;
    font-family: 'Libre Baskerville';
    color: #F08400;
    margin-right: 25px;
    display: inline-block;
    transition: .5s ease;
}  

.drawer-menu__link > span::before{
    content: "";
    display: block;
    width: 10px;
    height: 2px;
    background-color: #F08400;
    position: absolute;
    top: 50%;
    right: -7px;
    transform: translate(100%, -50%);
    transition: .5s ease;
}

.drawer-menu__link:hover,
.drawer-menu__link:hover span{
    color: #7D4500;
    transition: .5s ease;
}

.drawer-menu__link:hover span::before{
    background-color: #7D4500;
    transition: .5s ease;
}

@media screen and (max-width: 990px){
    .header__logo{
        width: 330px;
    }

    .header__nav{
        padding: 20px 10px;
    }

    .header__nav-link > span{
        font-size: 1.6rem;
    }

    .header__nav-list > li{
        font-size: 1.2rem;
        padding-left: 15px;
    }

    .header__nav-link > span::before{
        left: -3px;
    }
}

@media screen and (max-width: 767px){
    .header__logo{
        width: 230px;
    }

    .header__message-logo{
        bottom: 0px;
    }

    .header__message-logo__bg{
        bottom: 0px;
    }

    .mainvisual-slide.pc{
        display: none;
    }

    .mainvisual-slide.sp{
        display: block;
    }

    .header__nav{
        display: none;
    }

    .hamburger-menu,
    .drawer-menu{
        display: block;
    }
}

@media screen and (max-width: 575px){
    .header__logo{
        width: 180px;
    }

    .drawer-menu__list > li{
        font-size: 1.2rem;
    }

    .drawer-menu__link > span{
        font-size: 1.7rem;
    }  
    
    
}

/*========================
    message
========================*/
.message{
    padding-top: 70px;
    position: relative;
    z-index: 1;
    background-color: #E8E8E8;
}

.message__contents{
    display: flex;
    align-items: flex-start;
    width: 90%;
    max-width: 1290px;
    margin-top: 60px;
}

.message__img{
   width: 44.65%;    
}

.message__body{
    margin-left: 8.14%;
    font-size: 2rem;
    color: #3C3C3C;
    font-feature-settings: "pkna";
    text-align: justify;
    word-break: auto-phrase;
}

.message__body > p + p{
    margin-top: 40px;
    line-height: 1.9;
}

.message-img__slide{
    margin-top: 120px;
}

.message-img__slide li.slick-slide {
    margin-left: 20px;
}

@media screen and (max-width: 990px){
    .message__body{
        font-size: 1.8rem;
        margin-left: 5%;
    }

    .message__body > p + p{
        margin-top: 30px;
    }
}

@media screen and (max-width: 767px){
    .message__contents{
        flex-direction: column-reverse;
        margin: 40px auto 0;
    }

    .message__img{
        width: 70%;
        margin-left: auto;
     }

    .message__body{
        width: 100%;
        font-size: 1.7rem;
        margin-left: 0;
        margin-bottom: 40px;
    }

    .message__body > p + p{
        margin-top: 20px;
    }

    .message-img__slide li.slick-slide {
        margin-left: 0.5%;
    }
}

@media screen and (max-width: 575px){
    .message{
        padding-top: 50px;
    }

    .massage__body-text{
        font-size: 1.6rem;
    }

    .message__img{
        display: none;
    }

    .message-img__slide{
        margin-top: 35px;
    }
}

/*========================
    culture
========================*/
.culture{
    padding: 110px 0 160px;
    overflow-x: hidden;
    position: relative;
    z-index: 1;
    background-color: #E8E8E8;
}

.culture__contents{
    width: 90%;
    max-width: 1150px;
    margin: 80px auto 0;
}

.culture__item{
    display: flex;
    margin-top: 110px;
    align-items: flex-start;
}

.culture__item:first-child{
    margin-top: 0;
}

.culture__item:nth-child(even){
    flex-direction: row-reverse;
}

.culture__item-img{
    width: 43.48%;
    position: relative;
}

.culture__item-img::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(120, 120, 120, 0.5);
    position: absolute;
    top: 18%;
    left: 0;
    transform: translateX(-45%);
    z-index: -1;
}

.culture__item:nth-child(even) .culture__item-img::before{
    left: auto;
    right: 0;
    transform: translateX(45%);
}

.culture__body{
    margin-left: 3.48%;
    width: 46.1%;
}

.culture__item:nth-child(even) .culture__body{
    margin-left: 0;
    margin-right: 3.48%;
}

.culture__body > span{
    font-size: 3.5rem;
    color: #F08400;
    display: block;
}

.culture__body-text{
    color: #3C3C3C;
    line-height: 1.76;
    margin-top: 15px;
    font-feature-settings: "pkna";
    text-align: justify;
    word-break: auto-phrase;
}

.culture__item:nth-child(even) .culture__body > span{
    text-align: right;
}

@media screen and (max-width: 990px){
    .culture__body > span{
        font-size: 2.8rem;
    }
}

@media screen and (max-width: 767px){
    .culture__contents{
        margin: 55px auto 0;
    }

    .culture__item{
        margin-top: 65px;
        flex-direction: column;
    }

    .culture__item:nth-child(even){
        flex-direction: column;
    }

    .culture__body > span{
        font-size: 2.4rem;
    }

    .culture__item-img{
        width: 100%;
    }

    .culture__item-img::before{
        top: 13%;
        transform: translateX(-15%);
    }

    .culture__item:nth-child(even) .culture__item-img::before{
        top: 13%;
        transform: translateX(15%);
    }

    .culture__body{
        width: 100%;
        margin: 35px 0 0;
    }
}

@media screen and (max-width: 575px){
    .culture{
        padding: 50px 0 100px;
    }

    .culture__body > span{
        font-size: 2.2rem;
    }

    .culture__body-text{
        font-size: 1.6rem;
        line-height: 1.65;
        margin-top: 11px;
    }
}

/*========================
    people
========================*/
.people{
    padding: 90px 0 135px;
    background: url('../img/people/bg.jpg') no-repeat;
    background-size: cover;
    background-position: top;
    background-attachment: fixed;
    position: relative;
    z-index: 0;
}

.people::after{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(120, 120, 120, 0.5);
    position: absolute;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
}

.people > h2.title{
    color: #E8E8E8;
}

.people .inner{
    padding-top: 55px;
    max-width: none;
}

.people .inner > div{
    margin-top: 45px;
}

.people .inner > div:first-child{
    margin-top: 0;
}

.people__item{
    width: 90%;
    max-width: 870px;
    margin: 0 auto;
    position: relative;
}

.people__item > span{
    font-size: 1.5rem;
    font-family: 'Libre Baskerville';
    color: #F08400;
}

.people__item > span span{
    font-size: 2rem;
}

.people__item-body{
    background-color: #F0E5D8;
    height: 25%;
    margin-top: 5px;
    padding: 7.5% 0 15px 2.3%;
    width: 90%;
    position: relative;
}

.interview-title{
    font-size: 2.3rem;
}

.interview-title > span{
    position: relative;
    z-index: 0;
}

.interview-title > span::before{
    content: "";
    display: block;
    width: 100%;
    height: 15px;
    background: url('../img/people/maker.png') no-repeat;
    position: absolute;
    background-size: 100%;
    background-position: center;
    bottom: 10px;
    left: 0;
    transform: translateY(100%);
    z-index: -1;
}

.interview-more{
    display: block;
    text-align: right;
    padding-right: 45px;
    margin-top: 40px;
    margin-right: 40%;
    font-family: 'Libre Baskerville';
    font-size: 1.5rem;
}

.interview-more > span{
    position: relative;
    cursor: pointer;
    transition: .5s ease;
}

.interview-more > span::before{
    content: "";
    display: block;
    width: 42px;
    height: 100%;
    background: url('../img/common/more-deco01.svg') no-repeat;
    position: absolute;
    background-size: 100%;
    background-position: center;
    top: 0;
    left: -5px;
    transform: translateX(-100%);
}

.interview-more > span::after{
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background: url('../img/common/arrow01.svg') no-repeat;
    position: absolute;
    background-size: 100%;
    background-position: center;
    top: 50%;
    right: -10px;
    transform: translate(100%, -50%);
}

.interview-more > span:hover{
    opacity: .7;
    transition: .5s ease;
}

.people__item figure{
    position: absolute;
    top: 50%;
    right: 0;
    width: 46%;
    transform: translate(30%, -50%);
}

.people__contents{
    background-color: rgba(120, 120, 120, 0.5);
    margin-top: 45px;
}

.people__contents-inner{
    width: 90%;
    max-width: 948px;
    margin: auto;
    padding: 55px 0 70px;
}

.people-introduction > ul{
    display: flex;
    justify-content: center;
}

.people-introduction > ul > div + div{
    margin-left: 12.13%;
}

.people-introduction > ul dt{
    width: 146px;
    margin: auto;
}

.people-introduction > ul dd.name{
    font-size: 2rem;
    color: #E8E8E8;
    line-height: 1.5;
    text-align: center;
    margin-top: 10px;
}

.people-introduction > ul dd.text{
    font-size: 1.5rem;
    color: #E8E8E8;
    line-height: 1.47;
    text-align: center;
}

.interview__item{
    margin-top: 75px;
}

.interview__question{
    text-align: center;
    font-size: 3.2rem;
    color: #F08400;
    margin-bottom: 35px;
}

.interview__question > span::before{
    content: "Q.";
}

.interview__item > div{
    display: flex;
    align-items: flex-start;
}

.interview__item > div.reverse{
    flex-direction: row-reverse;
    position: relative;
}

.interview__item > div + div{
    margin-top: 20px;
}

.interview__img{
    width: 120px;
}

.interview__text{
    width: 71.2%;
    margin-left: 6.33%;
    padding: 2.2% 2.6%;
    background-color: #F0E5D8;
    line-height: 1.76;
    font-feature-settings: "pkna";
    text-align: justify;
    word-break: auto-phrase;
}

.interview__text.no-flex{
    margin: 40px auto 0;
    width: 100%;
    max-width: 760px
}

.interview__text.no-flex > p + p{
    margin-top: 20px;
}

.interview__item > div.normal .interview__text{
    position: relative;
}

.interview__item > div.normal .interview__text::before{
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 9px 51px 9px 0;
    border-color: transparent #F0E5D8 transparent transparent;
    position: absolute;
    top: 30%;
    left: 0;
    transform: translateX(-100%);
}

.interview__item > div.reverse .interview__text{
    margin-right: 6.33%;
    margin-left: 0;
    position: relative;
}

.interview__item > div.reverse .interview__text::before{
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 9px 0 9px 51px;
    border-color: transparent transparent transparent #F0E5D8;
    position: absolute;
    top: 30%;
    right: 0;
    transform: translateX(100%);
}

.interview-close{
    width: 35px;
    margin: 35px auto 0;
    cursor: pointer;
    transition: .5s ease;
}

.interview-close > span{
    text-align: center;
    font-size: 1.5rem;
    font-family: 'Libre Baskerville';
    color: #E8E8E8;
    margin-top: 10px;
    display: inline-block;
}

.interview-close:hover{
    opacity: .7;
    transition: .5s ease;
}

@media screen and (max-width: 990px){
    .people__item-body{
        padding: 6.8% 0 15px 2.3%;
    }

    .interview-title{
        font-size: 2rem;
    }

    .interview__question{
        font-size: 2.8rem;
    }

    .interview__item > div.normal .interview__text::before{
        border-width: 9px 38px 9px 0;
    }

    .interview__item > div.reverse .interview__text::before{
        border-width: 9px 0 9px 38px;
    }
}

@media screen and (max-width: 767px){
    .people{
        background-image: none;
    }

    .people{
        position: relative;
    }

    .people::before{
        content: "";
        display: block;
        width: 100%;
        height: 100vh;
        background: url('../img/people/bg-sp.jpg') no-repeat;
        background-size: cover;
        position: fixed;
        top: 0;
        left: 0;
        z-index: -2;
    }

    .people__item-body{
        padding: 6% 0 15px 2.3%;
    }

    .people__item > span{
        font-size: 1.4rem;
    }

    .people__item > span span{
        font-size: 1.8rem;
    }

    .people__contents{
        margin-top: 25px;
    }

    .people__item figure{
        transform: translate(44%, -89%);
    }

    .interview-title{
        font-size: 1.8rem;
    }

    .interview-more{
        font-size: 1.3rem;
        margin-right: 35%;
    }

    .interview-more > span::after{
        width: 20px;
        height: 20px;
    }

    .people__item > figure{
        width: 45%;
    }

    .interview__question{
        font-size: 2.2rem;
    }

    .interview__item > div{
        flex-direction: column;
    }

    .interview__item > div + div{
        margin-top: 40px;
    }

    .interview__item > div.reverse{
        flex-direction: column;
    }

    .interview__item > div.reverse .interview__img{
        margin-left: auto;
    }

    .interview__text{
        width: 100%;
        margin: 30px 0 0;
    }

    .interview__item > div.normal .interview__text::before{
        border-width: 0px 9px 20px 9px;
        top: auto;
        bottom: 100%;
        left: 20%;
        border-color: transparent transparent #F0E5D8  transparent;
    }

    .interview__item > div.reverse .interview__text::before{
        border-width: 0px 9px 20px 9px;
        top: auto;
        bottom: 100%;
        right: 20%;
        border-color: transparent transparent #F0E5D8  transparent;
    }
}

@media screen and (max-width: 575px){
    .people{
        padding: 50px 0 100px;
    }

    .people__item-body{
        padding: 45px 0 15px 2.3%;
        width: 100%;
    }

    .interview-title{
        text-align: center;
        font-size: 1.6rem;
    }

    .interview-more{
        margin-top: 25px;
    }

    .people-introduction > ul > div{
        flex-grow: 1;
    }

    .people-introduction > ul > div + div{
        margin-left: 15px;
    }

    .people .inner > div{
        margin-top: 80px;
    }

    .people__item figure{
        width: 53%;
        transform: translate(-5%, -120%);
    }

    .people-introduction > ul dt{
        width: 110px;
    }

    .people-introduction > ul dd.name{
        font-size: 1.8rem;
    }

    .people-introduction > ul dd.text{
        font-size: 1.4rem;
    }

    .interview__item{
        margin-top: 55px;
    }

    .interview__question{
        font-size: 1.9rem;
        line-height: 1.6;
        text-align: left;
        margin-bottom: 20px;
    }

    .interview__text{
        padding: 20px;
        font-size: 1.5rem;
    }

    .interview__text.no-flex{
        margin-top: 30px;
    }

    .interview__text.no-flex > p + p{
        margin-top: 10px;
    }
}

/*========================
    top-message
========================*/
.top-message{
    padding: 110px 0 145px;
    position: relative;
    background-color: #E8E8E8;
    z-index: 1;
}

.top-message__contents{
    width: 90%;
    max-width: 1290px;
    display: flex;
    margin-top: 60px;
    align-items: flex-start;
}

.top-message__img{
    width: 48.84%;
    max-width: 830px;
    position: relative;
    z-index: 0;
}

.top-message__img::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(120, 120, 120, .5);
    position: absolute;
    top: 15%;
    right: -8%;
    z-index: -1;
}

.top-message__body{
    width: 44.49%;
    flex-grow: 1;
    margin-left: 6.98%;
}

.top-message__body-title{
    font-size: 3.5rem;
    color: #F08400;
    line-height: 1.43;
}

.top-message__body-text{
    color: #3C3C3C;
    line-height: 1.76;
    margin-top: 15px;
    font-feature-settings: "pkna";
    text-align: justify;
    word-break: auto-phrase;
}

.top-message__more{
    text-align: right;
    margin-top: 50px;
}

.top-message__more > span{
    padding-right: 35px;
    position: relative;
    font-size: 1.5rem;
    font-family: 'Libre Baskerville';
    color: #3C3C3C;
    cursor: pointer;
    transition: .5s ease;
}

.top-message__more > span::before{
    content: "";
    display: block;
    width: 42px;
    height: 100%;
    background: url('../img/common/more-deco02.svg') no-repeat;
    position: absolute;
    background-size: 100%;
    background-position: center;
    top: 0;
    left: -5px;
    transform: translateX(-100%);
}

.top-message__more > span::after{
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background: url('../img/common/arrow04.svg') no-repeat;
    position: absolute;
    background-size: 100%;
    background-position: center;
    top: 50%;
    right: -10px;
    transform: translateY(-50%);
}

.top-message__more > span:hover{
    opacity: .7;
    transition: .5s ease;
}

.modal__bg, .modal__application, .modal__application-finished{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(60, 60, 60, 0.8);
    z-index: 100;
    overflow-y: scroll;
    display: none;
}

.modal__wrap{
    width: 90%;
    max-width: 980px;
   margin: 10% auto 0;
}

.modal{
    position: relative;
}

.modal__header{
    display: flex;
}

.modal__header-text{
    flex-grow: 1;
    background-color: #F0E5D8;
    padding: 7.4% 0 20px 6.2%;
    overflow-x: hidden;
}

.modal__title{
    font-size: 3.5rem;
}

.modal__header-text .name{
    font-size: 1.6rem;
    font-family: 'Libre Baskerville';
    margin-top: 35px;
    display: inline-block;
}

.modal__title > span{
    font-family: 'Libre Baskerville';
    font-size: 1.6rem;
    color: #F08400;
    position: relative;
}

.modal__title > span::before{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #F08400;
    position: absolute;
    top: 50%;
    left: -15px;
    transform: translate(-100%, -50%);
}

.modal__header-img{
    width: 47.14%;
}

.modal__body{
    padding: 6.12% 8.16%;
    background-color: #E8E8E8;
}

.modal__item + .modal__item{
    margin-top: 60px;
}

.modal__item:nth-child(2){
    clear: right;
}

.modal__item:nth-child(3){
    clear: left;
}

.modal__body-img{
    width: 50%;
    max-width: 390px;
}

.modal__text-wrap > span{
    font-weight: 500;
    color: #F08400;
    font-size: 2.7rem;
    line-height: 1.33;
    font-family: 'Noto Serif JP';
    margin-left: 30px;
    margin-bottom: 15px;
    display: inline-block;
    position: relative;
}

.modal__text-wrap > span::before{
    content: "";
    display: block;
    width: 20px;
    height: 1px;
    background-color: #F08400;
    position: absolute;
    top: 20px;
    left: -10px;
    transform: translate(-100%, -50%);
}

.modal__text{
    font-weight: 300;
    font-family: 'Noto Serif JP';
    line-height: 1.73;
    font-feature-settings: "pkna";
    text-align: justify;
    word-break: auto-phrase;
}

.modal__text:nth-of-type(2){
    margin-top: 40px;
}

.modal__text-wrap li{
    font-weight: 700;
    font-family: 'Noto Serif JP';
    line-height: 1.73;
}

.modal__item:nth-child(1) .modal__body-img,
.modal__item:nth-child(3) .modal__body-img{
    float: left;
    margin-right: 2.55%;
}

.modal__item:nth-child(2) .modal__body-img{
    float: right;
    margin-left: 2.55%;
}

.modal__body-close{
    width: 40px;
    margin: 70px auto 0;
    cursor: pointer;
    transition: .5s ease;
}

.modal__body-close > span{
    display: block;
    text-align: center;
    font-size: 1.5rem;
    font-family: 'Libre Baskerville';
    margin-top: 10px;
}

.modal__body-close:hover{
    opacity: .7;
    transition: .5s ease;
}

.modal-close{
    position: absolute;
    top: 10px;
    right: 2%;
    cursor: pointer;
    transition: .5s ease;
}

.modal-close:hover{
    opacity: .7;
    transition: .5s ease;
}

@media screen and (max-width: 1024px){
    .top-message__body-title{
        font-size: 3rem;
    }
}

@media screen and (max-width: 990px){
    .top-message__body-title{
        font-size: 2.4rem;
    }

    .top-message__body-text{
        font-size: 1.6rem;
    }

    .modal__header-text{
        padding-top: 6.8%;
    }

    .modal__title{
        font-size: 3rem;
    }

    .modal__header-text .name{
        margin-top: 25px;
    }

    .modal__text-wrap > span{
        font-size: 2.2rem;
    }

    .modal__text-wrap > span::before{
        top: 15px;
    }
}

@media screen and (max-width: 767px){
    .top-message__contents{
        flex-direction: column-reverse;
        width: 90%;
        margin: 40px auto 0;
    }

    .top-message__body{
        margin-left: 0;
        width: 100%;
    }

    .top-message__body-title{
        font-size: 2.1rem;
        line-height: 1.4;
    }

    .top-message__img{
        width: 100%;
        margin-top: 30px;
    }

    .top-message__more > span{
        margin-right: 20px;
    }

    .modal__title{
        font-size: 2.6rem;
    }

    .modal__header-text{
        padding: 30px 0 30px 9.13%;
    }

    .modal__title > span{
        font-size: 1.1rem;
    }

    .modal__title > span::before{
        left: -10px;
    }

    .modal__header-text .name{
        margin-top: 15px;
    }

    .modal__body{
        padding: 30px 25px;
    }

    .modal__text{
        line-height: 1.8;
        font-size: 1.5rem;
    }

    .modal__header-img{
        display: none;
    }

    .modal__body-img{
        width: 100%;
        max-width: none;
    }

    .modal__item:nth-child(1) .modal__body-img,
    .modal__item:nth-child(3) .modal__body-img{
        float: none;
        margin-right: 0;
    }

    .modal__item:nth-child(2) .modal__body-img{
        float: none;
        margin-left: 0;
    }

    .modal__text-wrap{
        margin-top: 20px;
        font-size: 1.6rem;
    }

    .modal__text:nth-of-type(2){
        margin-top: 20px;
    }
}

@media screen and (max-width: 575px){
    .top-message{
        padding: 50px 0 95px;
    }

    .modal__title{
        font-size: 2.4rem;
    }

    .modal__body{
        padding: 25px 20px;
    }

    .modal__text-wrap > span{
        font-size: 1.9rem;
        margin-bottom: 7px;
        line-height: 1.4;
    }
}

/*========================
    faq
========================*/
.faq{
    padding: 90px 0 100px;
    position: relative;
    background-color: #E8E8E8;
    z-index: 0;
}

.faq__list{
    width: 90%;
    max-width: 870px;
    margin: 70px auto 0;
}

.faq__list > div + div{
    margin-top: 20px;
}

.faq-question{
    font-size: 2.1rem;
    font-weight: 300;
    color: #1C1C1C;
    padding-left: 7%;
    padding-bottom: 25px;
    border-bottom: 1px solid #787878;
    cursor: pointer;
    line-height: 1.8;
}

.faq-question > span{
    position: relative;
}

.faq-question > span::before{
    content: "";
    display: block;
    width: 18px;
    height: 1px;
    background-color: #F08400;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -40px;
}

.faq-question > span::after{
    content: "";
    display: block;
    width: 18px;
    height: 1px;
    background-color: #F08400;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    left: -40px;
    transition: .5s ease;
}

.faq-question.is-close > span::after{
    transform: translateY(-50%) rotate(0);
    transition: .5s ease;
}

.faq-question span.tag{
    display: inline-block;
    width: 106px;
    padding: 5px 0;
    margin-right: 10px;
    text-align: center;
    font-size: 1.7rem;
    line-height: 1;
}

.faq-question span.tag-common{
    background-color: #E8E8E8;
    color: #F08400;
}

.faq-question span.tag-companyemployee{
    background-color: #F08400;
    color: #E8E8E8;
}

.faq-question span.tag-parttime{
    background-color: #F0E5D8;
    color: #1C1C1C;
}

.faq-answer{
    line-height: 1.76;
    padding: 25px 3.45% 20px 7.47%;
    background-color: #E8E8E8;
}

@media screen and (max-width: 767px){
    .faq__list{
        margin-top: 37px;
    }

    .faq-question{
        font-size: 1.9rem;
        padding-bottom: 3.8%;
    }

    .faq-question span.tag{
        width: 100px;
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 575px){
    .faq{
        padding: 50px 0 60px;
    }

    .faq-question{
        font-size: 1.5rem;
    }

    .faq-question > span::before{
        left: -30px;
    }
    
    .faq-question > span::after{
        left: -30px;
    }

    .faq-question span.tag{
        width: 70px;
        font-size: 1.2rem;
        display: block;
        margin-bottom: 2px;
    }

    .faq-answer{
        font-size: 1.4rem;
        padding: 15px 5%;
    }
}

/*========================
    search
========================*/
.search{
    padding: 90px 0 140px; 
    overflow-x: hidden;
    position: relative;
    background-color: #E8E8E8;
    z-index: 0;
}

.search__contents{
    margin: 75px auto 0;
}

.contents__inner{
    position: relative;
    z-index: 0;
}

.contents__inner::before{
    content: "";
    display: block;
    width: 39.625vw;
    max-width: 634px;
    height: 21.5vw;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    position: absolute;
    right: 0;
    z-index: -1;
    opacity: 0.5;
}

.contents__inner:nth-child(2)::before{
    background-image: url('../img/search/bg11.jpg');
    top: 2vw;
}

.contents__inner:nth-child(4)::before{
    background-image: url('../img/search/bg12.jpg');
    top: 2vw;
}

.contents__inner:nth-child(6)::before{
    background-image: url('../img/search/bg13.jpg');
    top: 2vw;
}

.search__item{
    width: 90%;
    max-width: 870px;
    font-size: 3rem;
    padding: 30px 60px 30px 5%;
    margin: 20px auto 0;
    position: relative;
    cursor: pointer;
}

.search__item::before{
    content: "";
    display: block;
    width: 20px;
    height: 2px;
    background-color: #3C3C3C;
    position: absolute;
    top: 50%;
    transform: translate(-100%, -50%);
    right: 3%;
}

.search__item::after{
    content: "";
    display: block;
    width: 20px;
    height: 2px;
    background-color: #3C3C3C;
    position: absolute;
    top: 50%;
    transform: translate(-100%, -50%) rotate(90deg);
    right: 3%;
    transition: .5s ease;
}

.search__item.is-close::after{
    transform: translate(-100%, -50%) rotate(0);
    transition: .5s ease;
}

.search__item:nth-of-type(1){
    background-color: #F0C590;
}

.search__item:nth-of-type(3){
    background-color: #F0AF60;
}

.search__item:nth-of-type(5){
    background-color: #F09930;
}

.search__body{
    width: 90%;
    max-width: 870px;
    margin: auto;
    padding: 40px 0 90px;
}

.search__body > div:first-child{
    min-height: 24vw;
}

.search__body-top{
    display: flex;
    position: relative;
}

.search__body-top > div{
    width: calc((100% - 40px) / 2);
    max-width: 415px;
    margin-left: 4.6%;
    padding-top: 30px;
    position: relative;
    z-index: 0;
}

.search__body-top > div:first-child{
    margin-left: 0;
}

.search__body-top > div::before{
    content: "";
    display: block;
    width: 100%;
    height: 120px;
    background-color: #F0E5D8;
    position: absolute;
    top: 0;
    left: 0%;
    z-index: -1;
}

.search__title{
    font-size: 2.1rem;
    color: #1C1C1C;
    text-align: center;
    position: relative;
}

.search-job form,
.search-area form{
    background-color: #E8E8E8;
    width: 77.1%;
    margin: 25px auto 0;
}

.search-job form select,
.search-area form select{
    width: 100%;
    padding: 7.8%;
    color: #3C3C3C;
    cursor: pointer;
}

.search__body-bottom{
    margin-top: 180px;
}

.search__body-bottom > .search__title{
    max-width: 415px;
    margin: 0 auto;
    background-color: #272727;
    padding: 3% 0;
}

.search-brand{
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 40px;
    position: relative;
}

.search-brand__item{
    width: calc((100% - 20px * 3) / 4);
    max-width: 202px;
    margin-right: 20px;
    margin-top: 20px;
}

.search-brand__item:nth-child(4n){
    margin-right: 0;
}

.search-brand__item > a{
    display: block;
    width: 100%;
    height: 100%;
    transition: .5s ease;
}

.search-brand__item > a:hover{
    opacity: .7;
    transition: .5s ease;
}

.search-brand__item span{
    font-size: 1.3rem;
    line-height: 1.4;
    color: #3C3C3C;
    text-align: center;
    display: block;
    margin-top: 5px;
}

.search-close{
    text-align: center;
    font-size: 1.5rem;
    color: #1C1C1C;
    padding-top: 25px;
    border-top: 1px solid #272727;
}

.search-close > span{
    position: relative;
    padding-right: 15px;
    transition: .5s ease;
    cursor: pointer;
}

.search-close > span:hover{
    opacity: .7;
    transition: .5s ease;
}

.search-close > span::before{
    content: "";
    display: block;
    width: 10px;
    height: 100%;
    background: url('../img/common/arrow03.svg') no-repeat;
    background-size: 100%;
    background-position: center;
    position: absolute;
    top: 0;
    right: 0;
}

.job-desc{
    width: 100%;
    max-width: 775px;
    margin: 0 auto;
}

.job-desc__title{
    font-size: 2.3rem;
    color: #3C3C3C;
    padding-left: 25px;
    position: relative;
}

.job-desc__title::before{
    content: "";
    display: block;
    width: 15px;
    height: 1px;
    background-color: #272727;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

.job-desc table{
    margin-top: 20px;
    width: 100%;
}

.job-desc tr{
    border-bottom: 1px solid #272727;
}

.job-desc tr:last-child{
    border-bottom: none;
}

.job-desc th,
.job-desc td{
    font-size: 1.5rem;
}

.job-desc th{
    color: #E8E8E8;
    font-weight: 400;
    background-color: #272727;
    width: 21.3%;
    text-align: center;
    vertical-align: middle;
}

.job-desc td{
    color: #3C3C3C;
    background-color: #F0E5D8;
    padding: 15px 4%;
    line-height: 1.67;
}

.job-desc input:-webkit-autofill,
.job-desc input:-webkit-autofill:hover,
.job-desc input:-webkit-autofill:focus,
.job-desc input:-webkit-autofill:active{
    transition: background-color 5000s ease-in-out 0s;
}

.search__btn{
    margin: 60px auto;
    width: 90%;
    max-width: 372px;
    font-size: 1.9rem;
    color: #E8E8E8;
    text-align: center; 
    box-shadow: 3px 3px #E8E8E8;
    transition: .5s ease;
}
.t_flex{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin: 30px 0 60px;
}

.t_flex .search__btn,
.t_flex .img{
    width: 49%;
}

.t_flex > *{
    margin-top: 30px;
}

.t_flex > *:nth-child(even){
    margin-left: 3%;
}

.t_flex .img{
    max-width: 300px;
    box-shadow: 3px 3px #272727;
    transition: .5s ease;
}

.t_flex .img.img-insta{
    box-shadow: none;
}

.t_flex .img:hover,
.search__btn:hover{
    transform: translate(3px, 3px);
    box-shadow: none;
    transition: .5s ease;
}

.search__btn > a{
    display: block;
    width: 100%;
    height: 100%;
    background-color: #1C1C1C;
    padding: 5.38% 0;
}

.search__btn span{
    position: relative;
    padding-right: 40px;
    display: inline-block;
}

.search__btn span::before{
    content: "";
    display: block;
    width: 23px;
    height: 23px;
    background: url('../img/common/arrow04.svg') no-repeat;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}

select .is-js{
    display: none;
}




.list-item {
    cursor: pointer;
    position: relative;
}
.list-item__img {
    overflow: hidden;
}
.list-item img {
    transition-duration: 0.5s;
}
.list-item:hover img {
    transform: scale(1.2);
    transition-duration: 0.5s;
}
.list-item > input {
    cursor: pointer;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
}
.list-item > span {
    position: relative;
}
.list-item > input:not(:checked) {
    z-index: 4;
}
.list-item > input:not(:checked) ~ span {
    border-bottom: 1px solid rgba(0, 0, 0, 0);
}
.list-item > input:checked ~ span {
    color: #F08400;
    border-bottom: 1px solid #F08400;
}
.list-item > input:checked ~ span::before {
    content: '';
    display: block;

    position: absolute;
    bottom: 0;
    left: 0.2em;
    width: 200px;
    height: 10px;

    border-left: 8px solid #F08400;
    border-bottom: 4px solid #F08400;
    transform: rotate(-45deg) perspective(30px) rotateY(60deg);
    transform-origin: 0 50%;
}

.search-blocks:not(:first-of-type) {
    display: none;
    margin-top: 10rem;
}
.search__category {
    color: #3C3C3C;
    font-size: 1.0em;
    position: relative;
    border-bottom: 1px solid #272727;
    margin-bottom: 10px;
    padding-bottom: 10px;
}
.search__title + .search__category {
    margin-top: 40px;
}
.search__list {
    display: none;
    clear: both;
    overflow: hidden;
}

.search__select {
    border-radius: 2px;
    color: #E8E8E8;
    display: block;
    overflow: hidden;
    position: relative;
    margin: 2em auto;
    width: 80%;
    height: 100%;
}
.search__select > i.search__select-toggle {
    color: #E8E8E8;
    position: absolute;
    top: 1.6em;
    right: 1.5em;
    z-index: 4;
}
.search__select-area > i.search__select-arrow__down::before,
.search__select-jobs > i.search__select-arrow__down::before {
    border-right: 6px solid transparent;
    border-top: 6px solid #E8E8E8;
    border-left: 6px solid transparent;

    content: '';
    pointer-events: none;

    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    padding: 0;

    -webkit-transition: all 250ms cubic-bezier(.4,.25,.3,1);
    transition: all 250ms cubic-bezier(.4,.25,.3,1);
}
.search__select-area > i.search__select-arrow__up::before,
.search__select-jobs > i.search__select-arrow__up::before {
    border-right: 6px solid transparent;
    border-bottom: 6px solid #E8E8E8;
    border-left: 6px solid transparent;

    content: '';
    pointer-events: none;

    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    padding: 0;

    -webkit-transition: all 250ms cubic-bezier(.4,.25,.3,1);
    transition: all 250ms cubic-bezier(.4,.25,.3,1);
}
.search__select .search__select-title,
.search__select .search__select-label {
    background: #E80000;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    cursor: pointer;
    display: block;

    position: relative;
    width: 100%;
    height: 100%;
    padding: 1em 1em;
}
.search__select > input {
    cursor: pointer;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
}
.search__select > input:checked ~ i.search__select-toggle.search__select-arrow__down {
    display: none;
}
.search__select > input:checked ~ i.search__select-toggle.search__select-arrow__up {
    display: block;
}
.search__select > input:checked label.search__select-option .search__select-title {
    display: none !important;
}
.search__select > input:not(:checked) {
    z-index: 4;
}
.search__select > input:not(:checked) ~ label.search__select-option > span.search__select-title {
    display: none;
}
.search__select > input:not(:checked) ~ i.search__select-toggle.search__select-arrow__up {
    display: none;
}
.search__select > input:not(:checked) ~ i.search__select-toggle.search__select-arrow__down {
    display: block;
}
.search__select > span.search__select-label {
    border-top: 0;
    color: #E8E8E8;
    display: inline-block;
    position: relative;
    width: 100%;
    z-index: 0;
}
.search__select label.search__select-option {
    display: block;
    overflow: hidden;
    width: 100%;
    transition: all 1s ease-out;
    z-index: 1;
}
.search__select label.search__select-option span.search__select-title {
    position: relative;
    transition: 0.3s ease-out;
    z-index: 2;
}
.search__select label.search__select-option span.search__select-title:hover {
    background: #272727;
    color: #E8E8E8;
}
.search__select label.search__select-option input {
    display: none;
}
.search__select label.search__select-option input:checked ~ span.search__select-title {
    background: #272727;
    border-top: 0;
    box-shadow: none;
    color: inherit;
    display: block;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 3;
}

table.job-application th {
    text-align: left;
    padding-left: 0.4em;
    padding-right: 0.4em;
}
table.job-application th:has(+ td > *[required]):before {
    background-color: #E80000;
    color: #E8E8E8;
    content: '必須';
    padding: 0.2em 0.4em;
    margin-right: 0.4em;
}
table.job-application td > input {
    line-height: 3em;
    outline: none;
    width: 100%;
}
table.job-application td > select {
    outline: none;
    width: 100%;
}
table.job-application td > textarea {
    height: 20em;
    outline: none;
    width: 100%;
}
.search__btn-application {
    background-color: #272727;
    display: block;
    line-height: 3em;
}
.search__btn-application:disabled {
    cursor: none;
    opacity: 0.5;
    box-shadow: none;
    transition: unset;
}
.search__btn-cancel {
    background-color: #E80000;
    display: block;
    line-height: 3em;
}

.ui-datepicker-title{
    display: flex;
    justify-content: center;
    -webkit-justify-content: center;
 }
 .ui-datepicker select.ui-datepicker-year{
     margin-right: 0.1rem;
     width: auto;
 }
 .ui-datepicker select.ui-datepicker-month{
     margin-left: 0.3rem;
     width: auto;
 }
 .ui-datepicker{
     font-size: 80%;
 }

.modal__application .modal__text-wrap > span,
.modal__application-finished .modal__text-wrap > span{
    font-size: 1.8rem;
    margin-top: 20px;
    margin-bottom: 5px;
}

.modal__application .modal__text-wrap > span::before,
.modal__application-finished .modal__text-wrap > span::before{
    top: 1.2rem;
}




@media screen and (max-width: 767px){
    .search__item{
        font-size: 2.4rem;
    }

    .search__title{
        font-size: 1.8rem;
    }

    .search__contents{
        margin-top: 40px;
    }

    .contents__inner:nth-child(2)::before{
        top: 2vw;
    }

    .contents__inner:nth-child(4)::before{
        top: 2vw;
    }

    .search-brand__item{
        width: calc((100% - 20px * 2) / 3);
    }

    .search-brand__item:nth-child(3n){
        margin-right: 0;
    }

    .search-brand__item:nth-child(4n){
        margin-right: 20px;
    }

    .search-brand__item:nth-child(12){
        margin-right: 0;
    }

    .search__btn{
        font-size: 1.7rem;
    }
    .t_flex{
        display: block;
    }
    .t_flex .search__btn,
    .t_flex .img{
        width: 100%;
        max-width: 303px;
    }

    .t_flex > *{
        margin-left: auto;
        margin-right: auto;
    }

    .t_flex > *:nth-child(even) {
        margin-left: auto;
    }

    .t_flex .img{
        display: block;
    }
}

@media screen and (max-width: 575px){
    .search{
        padding: 50px 0 70px;
    }

    .contents__inner::before{
        width: 230px;
        height: 123px;
    }

    .contents__inner:nth-child(2)::before{
        top: 2vw;
    }

    .contents__inner:nth-child(4)::before{
        top: 2vw;
    }

    .search__item{
        font-size: 1.8rem;
        margin-top: 13px;
    }

    .search__body-top{
        display: block;
    }

    .search__body-top > div{
        width: 100%;
        max-width: 415px;
        margin: auto;
    }

    .search__body-top > div:first-child{
        margin-left: auto;
    }

    .search__body-top > div + div{
        margin-top: 80px;
    }

    .search__body-bottom{
        margin-top: 80px;
    }

    .search-brand{
        justify-content: center;
    }

    .search-brand__item{
        width: calc((100% - 20px) / 2);
    }

    .search-brand__item:nth-child(3n){
        margin-right: 20px;
    }

    .search-brand__item:nth-child(2n){
        margin-right: 0;
    }

    .job-desc th,
    .job-desc td{
        display: block;
        font-size: 1.4rem;
    }

    .job-desc th{
        width: 100%;
        padding: 15px 4%;
    }
}

/*========================
    top-page
========================*/
.top-page{
    display: none;
}

.top-page.is-sp{
    background-color: #F08400;
    z-index: 100;
    position: fixed;
    bottom: 20px;
    right: 10px;
    font-size: 12px;
    width: 45px;
    height: 45px;
    cursor: pointer;
    display: block;
}

.top-page.is-sp > div{
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex;
}

.top-page.is-sp span{
    position: relative;
    margin-top: 20px;
}

.top-page.is-sp span::before{
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    background: url('../img/common/arrow05.svg') no-repeat;
    background-size: 100%;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translate(-50%, -3px);
}


/* @media screen and (max-width: 575px){
    .top-page.is-sp{
        display: block;
        
    }
} */

/*========================
    footer
========================*/
.footer{
    position: relative;
    background-color: #787878;
    z-index: 0;
}

.footer .wrap{
    width: 90%;
    max-width: 980px;
    margin: auto;
    display: flex;
    padding: 35px 0 45px;
}

.footer .wrap > div{
    padding-left: 4%;
    margin-left: auto;
    border-left: 1px solid #E8E8E8;
}

.footer .wrap > div:first-child{
    margin-left: 0;
}

.footer span{
    font-size: 1.5rem;
    color: #E8E8E8;
    display: inline-block;
    margin-bottom: 10px;
}

.footer a{
    display: block;
    font-size: 1.5rem;
    color: #E8E8E8;
    line-height: 1.8;
    transition: .5s ease;
}

.footer a:hover{
    opacity: .7;
    transition: .5s ease;
}

.footer nav a{
    padding-left: 35px;
    position: relative;
}

.footer nav a::before{
    content: "";
    display: block;
    width: 30px;
    height: 1px;
    background-color: #E8E8E8;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

address.copyright{
    font-family: 'Libre Baskerville';
    font-size: 1.5rem;
    font-weight: 400;
    color: #E8E8E8;
    text-align: center;
    background-color: #272727;
    padding: 25px 0 30px;
}

@media screen and (max-width: 990px){
    .footer .wrap{
        width: 95%;
        justify-content: center;
    }

    .footer .wrap > div{
        margin-left: auto;
    }

    .footer span,
    .footer a,
    address.copyright{
        font-size: 1.4rem;
    }

    address.copyright{
        padding: 20px 0 25px;
    }
}

@media screen and (max-width: 767px){
    .footer .wrap{
        width: 90%;
        display: block;
        padding: 35px 0 25px;
    }

    .footer .wrap > div{
        border-left: none;
        border-bottom: 1px solid #E8E8E8;
        padding-bottom: 4%;
        margin-bottom: 4%;
    }

    .footer .wrap > div:last-child{
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .footer span,
    .footer a,
    address.copyright{
        font-size: 1.3rem;
    }

    address.copyright{
        padding: 15px 0 20px;
    }
}

.fa-instagram{
    color: #E8E8E8;
    font-size: 25px;
}

a.icon{
    display: inline-block;
}

footer .icon__wrap{
    margin-top: 10px;
}

@media screen and (max-width: 767px){
    footer .icon__wrap{
        text-align: center;
        margin-top: 20px;
    }
}