html{
    scroll-behavior: smooth;
}
body{
    font-family: 'Noto Serif JP', serif;
    color: #1A1311;
    text-size-adjust: none;
    letter-spacing: 0.5px;
}
body.no-scroll{
    overflow: hidden;
}
h1, h2, h3, p ,a , li{
    font-family: 'Noto Serif JP', serif;
    color: #707070;
    line-height: 1.5;
}
img{
    height: auto;
    width: 100%;
}
.section-fade-in{
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}
.section-visible{
    opacity: 1;
}

/*****header*****/
.l-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    box-shadow:  0 4px 6px rgba(0, 0, 0, 0.1);
    height: 16vw;
    width: 100%;
    position: fixed;
    z-index: 1000;
}
.l-header__logo{
    margin: 1.8vw 0 0 4.2vw;
    cursor: pointer;
}
.l-header__logo img{
    width: 31.5vw; 
}
.sp-hide{
    display: none;
}

/*****floatingBanner****/
.floating-banner{
    position: fixed;
    bottom: 0;
    right: 2.5%;
    margin: auto;
    transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
    transform: translateY(100%);
    opacity: 0;
    visibility: hidden;
    z-index: 90;
}
.floating-banner.show{
    transform: translateY(0);
    opacity: 1;
    display: flex;
    visibility: visible;
}
.floating-banner a{
    display: block;
    background-image: url(../img/img_floating_banner.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 22vw;
    width: 95vw;
    margin: auto;
}

/*****navi*****/
.hamburger-menu{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 16vw;
    height: 16vw;
    background-color: #9D846E;
    cursor: pointer;
    box-sizing: border-box;
    padding: 4.6vw 4vw;
    justify-content: space-between;
}
.bar{ 
    width: 100%;
    height: 0.6vw; 
    background-color: #FFF; 
    border-radius: 50px;
}
.sidebar{
    transition: right 0.3s ease; 
    padding-top: 20vw;
    position: fixed;
    top: 0;
    right: -100%; 
    width: 100%;
    height: 100%;
    background-color: #704C2B;
    z-index: 100;
}
.sidebar.active{
    overflow-y: auto;
    right: 0;
}
.hamburger-menu.active .bar{
    background-color: transparent;
} 
.hamburger-menu.active .bar:before,
.hamburger-menu.active .bar:after{
    content: '';
    position: absolute;
    top: 50%;
    right: -2vw;
    height: 0.6vw;
    width: 10vw;
    border-radius: 50px;
    background-color: #fff;
}
.hamburger-menu.active .bar:before{
    transform: translate(-50%, -50%) rotate(40deg);
}
.hamburger-menu.active .bar:after{
    transform: translate(-50%, -50%) rotate(-40deg);
}
.sidebar__list{
    list-style: none;
    padding: 0;
    margin: auto;
    list-style: none;
    padding-bottom: 50vw;
    width: 82.6vw;
}
.sidebar__list__item a{
    display: block;
    padding: 5.2vw 0;
    font-size: 5.2vw;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    border-bottom: 1px solid #fff;
    color: #fff;
    font-weight: bold;
}
.sidebar__list__item:nth-child(6) a{
    border: none;
}
.sidebar__list__item:nth-child(7) a{
    border: none;
    line-height: 1.1;
    width: 100%;
    height: 16.1vw;
    background-color: #F4ECE4;
    border-radius: 10px;
    color: #704C2B;
    box-sizing: border-box;
    margin: 4vw auto;
    font-weight: bold;
    font-size: 4.2vw;
    padding: 5.7vw 0;
}
.sidebar__list__item:nth-child(8) a{
    line-height: 0.7;
    width: 100%;
    height: 12.8vw;
    border: 1px solid #F4ECE4;
    border-radius: 10px;
    color: #F4ECE4;
    box-sizing: border-box;
    font-weight: bold;
    padding: 4vw;
}

/*****firstView*****/
.firstView__wrapper{
    background-image: url(../img/webp/img_fv_sp.webp);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 18vw 0;
    position: relative;
}
.top__wrap{
    padding-top: 16vw;
}
.firstView__wrapper__heading-text{
    font-size: 7.1vw;
    color: #707070;
    font-weight: bold;
    line-height: 1.7;
    letter-spacing: 2px;
    text-align: center;
    padding: 21vw 0 77vw;
}
.firstView__wrapper__linkBtn{
    position: absolute;
    right: 0;
    bottom: -2vw;
}
.firstView__wrapper__linkBtn-bg{
    background-image: url(../img/img_link_bg.svg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 45vw;
}
.firstView__wrapper__linkBtn-text{
    text-align: center;
    font-size: 3vw;
    font-weight: bold;
    color: #8D8D8D;
    top: 11vw;
    left: 15vw;
    position: absolute;
}

/*****About*****/
.about__wrapper{
    background-image: url(../img/img_about_bg.svg);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    padding: 0 2.6vw;
    position: relative;
}
.about__decor{
    position: absolute;
    bottom: 4vw;
    left: 0;
}
.about__textArea-heading{
    font-size: 5.1vw;
    font-weight: bold;
    color: #fff;
    text-align: center;
    padding: 10.3vw 0 0.5vw;
}
.about__textArea-subHeading{
    font-size: 2.8vw;
    color: #fff;
    text-align: center;
    font-weight: 500;
}
.about__textArea-text{
    font-size: 3.5vw;
    color: #fff;
    text-align: center;
    font-weight: 500;
    line-height: 2.15;
    padding: 7.6vw 0;
}
.about__image{
    margin: auto;
    padding-bottom: 14vw;
}
/*****Planner*****/
.planner__wrapper{
    background-image: url(../img/webp/img_planner_bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    padding: 0 2.6vw;
}
.planner__heading{
    font-size: 5.1vw;
    font-weight: bold;
    padding: 10.3vw 0 0.5vw;
    color: #704C2B;
    text-align: center;
}
.planner__text{
    width: 50vw;
    font-size: 3.6vw;
    color: #707070;
    font-weight: 500;
    line-height: 1.8;
    padding: 15vw 0;
    margin-left: 42vw;
    text-align: left;
}
.planner__imgPc, .planner__decorPc{
    display: none;
}

/*****Menu*****/
.menu__wrapper{
    position: relative;
    background-image: url(../img/webp/img_menu_bg_sp.webp);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    padding: 0 2.6vw;
    z-index: 2;
}
.menu__heading{
    font-size: 5.1vw;
    font-weight: bold;
    padding: 20.5vw 0 0;
    color: #fff;
    text-align: center;
}
.menu__subHeading{
    font-size: 2.8vw;
    color: #fff;
    text-align: center;
    font-weight: 500;
}
.menu__container{
    padding: 7.6vw 0 0;
}
.menu__wrapper .menu__container:last-of-type{
    padding: 7.6vw 0 14vw;
}
.menu__container-title{
    font-size: 4.1vw;
    color: #fff;
    font-weight: bold;
    padding: 5.1vw 0 2vw;
}
.menu__container-titleDecor{
    width: 5vw;
    margin: auto;
}
.menu__container-titleDecor span{
   background-color: #D9CEC3;
   width: 100%; 
}
.menu__container-titleDecor span:nth-child(1){
    height: 0.6vw;
    margin-bottom: 0.4vw;
    display: block;
}
.menu__container-titleDecor span:nth-child(2){
    height: 0.3vw;
    display: block;
}
.menu__container-text{
    font-size: 3.5vw;
    color: #fff;
    font-weight: 500;
    padding: 2.5vw 0 5.1vw;
}
.menu__container-detail{
    text-align: center;
    margin: 0 auto;
    display: inline-block;
    font-size: 3.5vw;
    font-weight: 500;
}
.menu__container-detail p{
    text-align: left;
    color: #fff;
    padding-bottom: 1.2vw;
}

 /*****ClientStory*****/
 .clientStory__decorPc1, .clientStory__decorPc2{
    display: none;
 }
.clientStory__wrapper{
    position: relative;
    background-image: url(../img/img_tab_bg_sp.svg);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    padding: 0 2.6vw;
    z-index: 1;
}
.clientStory__heading{
    font-size: 5.1vw;
    font-weight: bold;
    padding: 6vw 0 0.5vw;
    color: #704C2B;
    text-align: center;
}
.clientStory__subHeading{
    font-size: 2.8vw;
    color: #704C2B;
    text-align: center;
    font-weight: 500;
}
.clientStory__text{
    font-size: 3.6vw;
    color: #707070;
    padding: 5.1vw 0;
}
.clientStory__tab-wrapper{
    padding-bottom: 7.6vw;
}
.clientStory__tab-buttonWrap{
    display: flex;
}
.clientStory__tab-button{
    height: 13.3vw;
    width: 50%;
    border: none;
    font-size: 3.3vw;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 0.8px;
    font-weight:  500;
    background-color: #F4ECE4;
    color:  #707070;
    cursor: pointer;
}
.clientStory__tab-button.active{
    background-color: #9D846E;
    color:  #F4ECE4;
}
.clientStory__tab-img2{
    display: none;
}
.clientStory__tab-title{
    font-size: 4.1vw;
    font-weight: bold;
    color:  #707070;
    padding: 3.5vw 0 1vw;
}
.clientStory__container-titleDecor{
    width: 5vw;
    margin: auto;
}
.clientStory__container-titleDecor span{
    background-color: #D9CEC3;
    width: 100%; 
}
.clientStory__container-titleDecor span:nth-child(1){
    height: 0.6vw;
    margin-bottom: 0.4vw;
    display: block;
}
.clientStory__container-titleDecor span:nth-child(2){
    height: 0.3vw;
    display: block;
}
.clientStory__tab-text{
    font-size: 3.6vw;
    color:  #707070;
    padding: 5.1vw 0 2.5vw;
    text-align: center;
}
.clientStory__tab-detail{
    margin: 0 auto;
    font-size: 3.6vw;
    font-weight: 500;
    text-align: left;
}
.clientStory__tab-detail p{
    padding-bottom: 1.2vw;
}

 /*****Gallery*****/
.gallery__wrapper{
    background-color: #F4ECE4;
    padding-top: 5vw;
    padding-bottom: 5vw;
}
.gallery__slider{
    display: block;
    text-align: center;
}
.gallery__slider-img{
    width: 79.4vw;
    height: auto;
    margin: auto;
}
.gallery__slider-title{
    font-size: 4.1vw;
    font-weight: bold;
    color:  #707070;
    padding: 2.5vw 0;
    width: 75vw;
    margin: auto;
}
.gallery__slider-detail{
    text-align: center;
    margin: 0 auto;
    display: inline-block;
    font-size: 3.5vw;
    font-weight: 500;
}
.gallery__slider-detail p{
    text-align: left;
    color:  #707070;
    padding-bottom: 1.2vw;
}
.slick-prev{
    left: 7vw;
    z-index: 10;
    top: 24vw;
    mix-blend-mode: multiply;
}
.slick-prev:before{
    content: url(../img/slick_btn_left_sp.svg);
    scale: 1.2;
    display: block;
}
.slick-next.slick-disabled:before, .slick-prev.slick-disabled:before{
    opacity: 0;
}
.slick-next{
    right: 9vw;
    z-index: 10;
    top: 24vw;
    mix-blend-mode: multiply;
}
.slick-next:before{
    content: url(../img/slick_btn_right_sp.svg);
    scale: 1.2;
    display: block;
}
.slick-dots{
    bottom: -31px;
}
.slick-dots li{
    margin: 0.5vw;
}
.slick-dots li.slick-active button:before{
    color: #9D846E;
    opacity: 1;
}
.slick-dots li button:before{
    color: #fff;
    opacity: 1;
}

/*****Flow****/
.flow__wrapper{
    position: relative;
}
.flow__heading-decor{
    position: absolute;
    top: 9vw;
    z-index: 1;
}
.flow__heading{
    font-size: 5.1vw;
    font-weight: bold;
    padding: 10.3vw 0 0.5vw;
    color: #704C2B;
    text-align: center;
    position: relative;
    z-index: 2;
}
.flow__subHeading{
    font-size: 2.8vw;
    color: #704C2B;
    text-align: center;
    font-weight: 500;
    padding-bottom: 8vw;
}
.flow__container{
    text-align: center;
}
.flow__container__item{
    margin-bottom: 12vw;
}
.flow__container__item-title{
    z-index: 5;
    background-image: url(../img/img_flow_title.svg);
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    box-sizing: border-box;
    width: 35.8vw;
    height: 7.6vw;
    margin: 0 auto -4vw;
}
.flow__container__item-title.longTitle{
    background-image: url(../img/img_flow_title_long.svg);
    width: 77.1vw;
}
.flow__container__item-titleStep{
    color: #AF8B15;
    font-size: 3.5vw;
    font-weight: bold;
}
.flow__container__item-titleStep span{
    color: #707070;
    font-size: 4.1vw;
    font-weight: bold;
}
.flow__container__item-img{
    width: 87.9vw;
    height: 46.9vw;
}
.flow__container__item-text{
    font-size: 3.6vw;
    font-weight: 500;
    width: 87.9vw;
    margin: auto;
    position: relative;
    line-height: 1.8;
}
.flow__container__item-text::after{
    left: 42vw;
    content: url(../img/img_flow_arrow.svg);
    top: 26vw;
    position: absolute;
}
.flow__container__item:last-child .flow__container__item-text::after{
    content: none;
}
.flow__container__item:nth-child(2) .flow__container__item-text::after{
    top: 20vw;
}
.flow__container__item:nth-child(3) .flow__container__item-text::after{
    top: 40vw;
}
.flow__container__item:nth-child(4) .flow__container__item-text::after{
    top: 59vw;
}

/*****FAQ****/
.faq__wrapper{
    background-image: url(../img/webp/img_faq_bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 0 3vw 10vw;
    position: relative;
}
.faq__decor{
    position: absolute;
    top: -5vw;
    left: 0;
    mix-blend-mode: multiply;
}
.faq__heading{
    font-size: 5.1vw;
    font-weight: bold;
    padding: 11vw 0 0.5vw;
    color: #704C2B;
    text-align: center;
    position: relative;
    z-index: 2;
}
.faq__subHeading{
    font-size: 2.8vw;
    color: #704C2B;
    text-align: center;
    font-weight: 500;
    padding-bottom: 5.1vw;
}
.faq__container{
    border-radius: 2.6vw;
    margin-bottom:2.6vw;
    background-color: #fff;
}
.faq-question{
    padding: 3vw;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: baseline;
    justify-content: center;
}
.faq-question h3{
    flex-basis: 72.7vw;
    font-size: 4.1vw;
    font-weight: 500;
}
.faq__question-mark{
    text-align: center;
    line-height: 1.8;
    font-weight: bold;
    font-size: 4.2vw; 
    color: #704C2B;
    margin-right: 2vw;
}
.faq-toggle{
    background-color: #704C2B;
    border-radius: 50px;
    width: 4.1vw;
    height: 0.5vw;
    margin-left: 3vw;
    position: relative; 
    top: -1vw;
    transition: transform 0.5s ease-in-out;
}
.faq-toggle::before{
    content: '';
    background-color: #704C2B;
    border-radius: 50px;
    width: 0.5vw;
    height: 4.1vw; 
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
    transition: opacity 0.3s ease-in-out; 
}
.faq-toggle.fade-out-line::before{
    opacity: 0;
}
.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;
}
.faq-inner{
    display: flex;
    padding: 0 3vw 3vw;
}
.faq-answer.open {
    max-height: 150vw; 
    transition: max-height 1.4s ease-in-out;
}
.faq-toggle.open::before {
    transition: max-height 1.4s ease-in-out;
    content: none;
}
.faq-answer p{
    border-top: 1px solid #F4ECE4 ;
    flex-basis: 69.7vw;
    font-size: 4.1vw;
    line-height: 1.6;
    font-weight: 500;
    padding-top: 3vw;
}
.faq__answer-mark{
    padding-top: 3vw;
    text-align: center;
    line-height: 1.8;
    font-weight: bold;
    font-size: 4.2vw; 
    color: #704C2B;
    margin-right: 2vw;
}

/*****Instagram****/
.instagram__wrapper{
    padding: 11vw 3vw;
    text-align: center;
}
.instagram__heading{
    width: 38.2vw;
    margin-right: 7vw;
}
.instagram-media{
    border: none!important;
}
.instagram__heading__under{
    margin: 2vw auto; 
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 89vw;
}
.instagram__heading__under-user{
    display: inline-flex;
    font-size: 3vw;
    font-weight: bold;
}
.instagram__heading__under-user p{
    margin: auto;
}
.instagram__heading__under-user img{
    width: 16vw;
    height: 16vw;
    border-radius: 50%;
    border: 1px solid;
    object-fit: cover;
    margin-right: 3vw;
}
.instagram__heading__under-followBtn{
    padding: 1.2vw;
    width: 30vw;
    height: 8vw;
    box-sizing: border-box;
    border-radius: 5px;
    font-size: 3.5vw;
    font-weight: bold;
    color: #FFF;
    background-color: linear-gradient(45deg, rgba(254, 212, 117, 1) 0%,
                rgba(229, 61, 93, 1) 50%,
                rgba(194, 49, 134, 1) 70%,
                rgba(156, 56, 187, 1) 100%) !important;
}
.instagram__container{
    display: flex;
    flex-wrap: wrap;
    margin: auto;
    justify-content: center;
}
.instagram__container__item{
    background-color: #8D8D8D;
    width: 29vw;
    height: 29vw;
    margin-bottom: 1vw;
    margin-right: 1vw;
}
.instagram__container__item:nth-child(3n){
    margin-right: 0;
}

/*****Application****/
.application__wrapper{
    background-image: url(../img/webp/img_application_bg_sp.webp);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 21.7vw 0;
    text-align: center;
}
.application__title{
    font-size: 6.4vw;
    font-weight: bold;
    color: #fff;
    padding-bottom: 3.5vw;
}
.application__subTitle{
    font-size: 4.1vw;
    font-weight: bold;
    color: #fff;
    padding-bottom: 12vw;
}
.application__btn{
    display: block;
    padding: 5.6vw;
    width: 87.1vw;
    height: 17.6vw;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 80px;
    box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.2);
    font-size: 4vw;
    font-weight: bold;
    color: #704C2B;
    margin: auto;
    text-decoration: none;
}


/*****Footer****/
.footer__wrapper{
    height: 26.6vw;
    background-color: #704C2B;
    text-align: center;
    padding-top: 5.1vw;
    box-sizing: border-box;
}
.footer__logo img{
    width: 31.5vw;
    display: block;
    margin: auto;
}
.footer__copyright{
    color: #fff;
    font-size: 2.6vw;
    padding: 2.2vw 0 4.7vw;
}




/*************** Tablet *****************/
@media screen and ( min-width : 768px ){


/*****header*****/
    .l-header{
        height: 10vw;
    }
    .l-header__logo{
        margin: 0.8vw 0 0 3.2vw;
    }
    .l-header__logo img{
        width: 20.5vw;
    }
    .floating-banner a{
        height: 14vw;
        width: 50vw;
    }
/*****navi*****/
    .hamburger-menu{
        width: 10vw;
        height: 10vw;
        padding: 2.8vw 2vw;
    }
    .bar{
        height: 0.35vw;
    }
    .hamburger-menu.active .bar:before, .hamburger-menu.active .bar:after{
        height: 0.35vw;
        width: 7vw
    }
    .sidebar{
        padding-top: 13vw;
    }
    .sidebar__list{
        width: 60vw;
        padding-bottom: 20vw;
    }
    .sidebar__list__item a{
        padding: 3vw 0;
        font-size: 2.35vw;
    }
    .sidebar__list__item:nth-child(7) a{
        height: 8.4vw;
        font-size: 2.35vw;
        padding: 3vw 0;
    }
    .sidebar__list__item:nth-child(8) a{
        height: 10vw;
    }


/*****firstView*****/
    .top__wrap{
        padding-top: 10vw;
    }
    .firstView__wrapper{
        padding: 40vw 0;
    }
    .firstView__wrapper__heading-text{
        font-size: 5.1vw;
        padding: 1vw 0 60vw;
    }
    .firstView__wrapper__linkBtn{
        margin-top: 10vw;
    }
    .firstView__wrapper__linkBtn-bg{
        width: 34vw;
    }
    .firstView__wrapper__linkBtn-text{
        font-size: 2vw;
        top: 8vw;
        left: 12vw;
    }

    /*****about*****/
    .about__wrapper{
        padding: 0 2.6vw 6vw;
    }
    .about__textArea-heading{
        font-size: 3.1vw;
    }
    .about__textArea-subHeading{
        font-size: 1.5vw;
    }
    .about__textArea-text{
        font-size: 2.05vw;
        padding: 3vw 0;
    }
    .about__image{
        display: block;
        width: 80%;
        margin: auto;
    }

/*****planner*****/
    .planner__wrapper{
        position: relative;
        z-index: -1;
        padding: 0vw 2.6vw 32vw;
    }
    .planner__heading{
        font-size: 3.1vw;
        padding: 18.3vw 0 0.5vw;
        margin: -10vw 0 0;
    }
    .planner__text{
        font-size: 2.2vw;
        width: 45vw;
    }

/*****menu*****/    
    .menu__heading{
        font-size: 3.1vw;
        padding: 10.5vw 0 0;
    }
    .menu__subHeading{
        font-size: 1.5vw;
    }
    .menu__container{
        padding: 3.6vw 0 0;
    }
    .menu__wrapper .menu__container:last-of-type{
        padding: 3.6vw 0 6vw;
    }
    .menu__container-img{
        width: 70%;
    }
    .menu__container-title{
        font-size: 2.1vw;
        padding: 4.1vw 0 1vw;
    }
    .menu__container-titleDecor{
        width: 3vw;
    }
    .menu__container-titleDecor span:nth-child(1){
        height: 0.3vw;
        margin-bottom: 0.2vw;
    }
    .menu__container-titleDecor span:nth-child(2){
        height: 0.1vw;
    }
    .menu__container-text{
        font-size: 2.1vw;
        padding: 1.5vw 0 3.1vw;
    }
    .menu__container-detail{
        font-size: 2.1vw;
    }


/*****clientStory*****/
    .clientStory__heading{
        font-size: 3.1vw;
        padding: 8.3vw 0 0.5vw;
    }
    .clientStory__subHeading{
        font-size: 1.5vw;
    }
    .clientStory__text{
        font-size: 2.1vw;
        padding: 3.1vw 0;
    }
    .clientStory__tab-wrapper{
        padding-bottom: 3.6vw;
    }
    .clientStory__tab-title{
        font-size: 2.1vw;
        padding: 4.1vw 0 1vw;
    }
    .clientStory__container-titleDecor{
        width: 3vw;
    }
    .clientStory__container-titleDecor span:nth-child(1){
        height: 0.3vw;
        margin-bottom: 0.2vw;
    }
    .clientStory__container-titleDecor span:nth-child(2){
        height: 0.1vw;
    }
    .clientStory__tab-buttonWrap{
        justify-content: center;
    }
    .clientStory__tab-button{
        height: 9.3vw;
        width: 40%;
        font-size: 2.1vw;
    }
    .clientStory__tab-img1, .clientStory__tab-img2{
        width: 80%;
        margin: auto;
    }
    .clientStory__tab-text{
        font-size: 2.1vw;
        padding: 2.1vw 0 1.5vw;
    }
    .clientStory__tab-detail{
        font-size: 2.1vw;
        margin-left: 8.7vw;
    }


/*****planner*****/
    .slick-slide img{
        width: 40.4vw;
    }
    .slick-prev{
        left: 6vw;
        top: 13vw;
    }
    .slick-next{
        right: 7vw;
        top: 13vw;
    }
    .gallery__slider-title{
        font-size: 2.1vw;
        padding: 1.5vw 0;
        width: 40.4vw;
    }
    .gallery__slider-detail{
        font-size: 2vw;
    }
    .gallery__slider-detail p{
        padding-bottom: 0.8vw
    }
    .slick-dots{
        bottom: -47px;
    }


/*****flow*****/
    .flow__heading{
        font-size: 3.1vw;
        padding: 6.3vw 0 0.5vw;
    }
    .flow__subHeading{
        font-size: 1.5vw;
        padding-bottom: 5.8vw;
        position: relative;
        z-index: 2;
    }
    .flow__container__item{
        margin-bottom: 8vw;
    }
    .flow__container__item-title{
        width: 27.8vw;
        height: 7vw;
        background-size: 100%;    
    }
    .flow__container__item-title.longTitle{
        width: 63vw;
    }
    .flow__container__item-titleStep{
        font-size: 2.3vw;
        padding-top: 0.5vw;
    }
    .flow__container__item-titleStep span{
        font-size: 3vw;
    }
    .flow__container__item-img{
        width: 72vw;
        height: auto;
    }
    .flow__container__item-text{
        font-size: 2.1vw;
        width: 72vw;
    }
    .flow__container__item-text::after{
        left: 34vw;
        top: 12vw;
    }
    .flow__container__item:nth-child(2) .flow__container__item-text::after{
        top: 8vw;
    }
    .flow__container__item:nth-child(3) .flow__container__item-text::after{
        top: 16vw;
    }
    .flow__container__item:nth-child(4) .flow__container__item-text::after{
        top: 23vw;
    }

/*****faq*****/
    .faq__wrapper{
        padding: 0px 3vw 5vw;
    }
    .faq__heading{
        font-size: 3.1vw;
        padding: 7vw 0 0.5vw;
    }
    .faq__subHeading{
        font-size: 1.5vw;
        padding-bottom: 3.1vw;
    }
    .faq__container{
        border-radius: 0.6vw;
    }
    .faq-question{
        padding: 2vw;
        justify-content: flex-start;
    }
    .faq__question-mark{
        font-size: 2.5vw;
    }
    .faq-question h3{
        flex-basis: 80vw;
        font-size: 2.1vw;
    }
    .faq-toggle{
        width: 2.1vw;
        height: 0.3vw;
        top: -0.8vw;
    }
    .faq-toggle::before{
        width: 0.3vw;
        height: 2.1vw;
    }
    .faq-inner{
        padding: 0 2vw 2.6vw;
    }
    .faq__answer-mark{
        padding-top: 2vw;
        font-size: 2.5vw;
        margin-right: 2vw;
    }
    .faq-answer p{
        flex-basis: 80vw;
        font-size: 2.1vw;
        padding-top: 2.6vw;
    }


/*****instagram*****/
    .instagram__wrapper{
        padding: 10vw 3vw;
    }
    .instagram__heading{
        width: 28.2vw;
        margin-bottom: 3vw;
    }
    .instagram-media {
        margin: auto !important;
    }
    .instagram__heading__under-user img{
        width: 10vw;
        height: 10vw;
        margin-right: 1vw;
    }
    .instagram__heading__under-user{
        font-size: 2vw;
    }
    .instagram__heading__under-followBtn{
        padding: 1vw;
        width: 23vw;
        height: 5vw;
        font-size: 2vw;
    }

/*****application*****/
    .application__wrapper{
        padding: 14.7vw 0;
    }
    .application__title{
        font-size: 4.4vw;
        padding-bottom: 2.5vw;
    }
    .application__subTitle{
        font-size: 2.1vw;
    }
    .application__btn{
        padding: 4vw;
        width: 70vw;
        height: 12.6vw;
        font-size: 3.1vw;
    }

/*****footer*****/
    .footer__wrapper{
        height: 17.6vw;
        padding-top: 3.1vw;
    }
    .footer__logo img{
        width: 21.5vw;
    }
    .footer__copyright{
        font-size: 1.5vw;
        padding: 2.2vw 0 2.7vw;
    }
}



/*************** PC *****************/
@media screen and ( min-width : 1024px ){

/*****header*****/
    .l-header{
        height: 80px;
    }
    .l-header__logo {
        margin: 6px 0 0 15px;
    }
    .l-header__logo img{
        width: 190px;
    }
    .floating-banner{
        right: 0;
    }
    .floating-banner a{
        right: -9px;
        bottom: 30px;
        position: relative;
        display: block;
        background-image: url(../img/img_floating_bannerPc.svg);
        width: 340px;
        height: 115px;
    }
    .floating-banner a:hover{
        opacity: 0.5;
    }
    .sp-hide{
        display: block;
    }
/*****navi*****/
    .hamburger-menu{
        width: 80px;
        height: 80px;
        padding: 24px 20px;
    }
    .hamburger-menu:hover{
        opacity: 0.5;
    }
    .bar{
        height: 2px;
    }
    .hamburger-menu.active .bar:before,
    .hamburger-menu.active .bar:after{
        right: -10px;
        height: 2px;
        width: 49px;
    }
    .sidebar{
        width: 390px;
        padding-top: 110px;
        transition: right 0.6s ease;
        background-color: rgba(112, 76, 43, 0.9);
    }
    .sidebar__list{
        padding-bottom: 100px;
        width: 330px;
    }
    .sidebar__list__item a{
        padding: 20px;
        font-size: 20px;
    }
    .sidebar__list__item a:hover{
        color: #B8A695;
    }
    .sidebar__list__item:nth-child(7) a{
        height: 63px;
        margin: 20px auto;
        font-size: 16px;
        padding: 23px;
    }
    .sidebar__list__item:nth-child(7) a:hover{
        border: 1px solid #FFF;
        background-color: transparent;
        color: #fff;
    }
    .sidebar__list__item:nth-child(8) a{
        height: 50px;
        margin: 20px auto;
        padding: 15px;
    }

/*****firstView*****/
    .top__wrap{
        padding-top: 80px;
    }
    .firstView__wrapper{
        background-image: url(../img/webp/img_fv_pc.webp);
        background-repeat: no-repeat;
        background-size: 100%;
        padding: 23vw 0;
        background-position: center center;
    }
    .firstView__wrapper__heading-text{
        left: 9%;
        font-size: 2.6vw;
        position: absolute;
        padding: 0;
        top: 30vw;
    }
    .firstView__wrapper__linkBtn{
        bottom: 1vw;
        margin-right: 5vw;
    }
    .firstView__wrapper__linkBtn-bg{
        width: 298px;
    }
    .firstView__wrapper__linkBtn-bg:hover{
        opacity: 0.7;
    }
    .firstView__wrapper__linkBtn-text{
        font-size: 18px;
        top: 92px;
        left: 57px;
        letter-spacing: 0px;
    }
    .pc-hide{
        display: none;
    }

/*****about*****/
    .about__wrapper{
        background:#857663;
        background-repeat: no-repeat;
        background-size: cover;
        text-align: center;
        padding: 80px 60px;
        position: relative;
    }
    .about__textArea-heading{
        font-size: 26px;
        padding: 0 0 5px;
    }
    .about__textArea-subHeading{
        font-size: 11px;
    }
    .about__textArea-text{
        font-size: 16px;
        padding: 30px 0 50px;
    }
    .about__image{
        width: 900px;
        height: auto;
        margin: auto;
        padding: 0;
    }
    .about__decor{
        top: 30px;
        position: absolute;
        left: 0;
    }

/*****Planner*****/
    .planner__wrapper{
        background-image: url(../img/webp/img_planner_bgPc.webp);
        background-size: cover;
        text-align: center;
        padding: 70px;
        position: relative;
    }
    .planner__heading{
        font-size: 26px;
        padding: 34% 0 0;
        margin-left: 30px;
        text-align: left;
    }
    .planner__text{
        font-size: 16px;
        margin: 0;
        width: max-content;
        padding: 30px 35px 30px 35px;
    }
    .planner__decorPc{
        display: block;
        position: absolute;
        left: 0;
        mix-blend-mode: multiply;
        top: 100px;
    }
    .planner__imgPc{
        display: block;
        width: 375px;
        height: 500px;
    }
    .planner__contents{
        display: flex;
        width: 900px;
        margin: auto;
        justify-content: center;
        align-items: center;
    }
    .planner__textArea{
        margin-bottom: 50px;
    }

/*****Menu*****/
    .menu__wrapper{
        background-image: url(../img/webp/img_menu_bg_pc.webp);
        padding: 85px 0 50px;
    }
    .menu__heading{
        padding: 0 0 5px;
        font-size: 26px;
    }
    .menu__subHeading{
        font-size: 11px;
    }
    .menu__container, .menu__wrapper .menu__container:last-of-type{
        padding: 0;
    }
    .menu__container__flex{
        display: flex;
        width: 900px;
        margin: 30px auto 0;
        justify-content: space-between;
    }
    .menu__container-img{
        width: 430px;
        height: auto;
    }
    .menu__container-title{
        font-size: 18px;
        padding: 20px 0 10px;
    }
    .menu__container-titleDecor{
        width: 19px;
    }
    .menu__container-titleDecor span:nth-child(1){
        height: 3px;
        margin-bottom: 2px;
    }
    .menu__container-titleDecor span:nth-child(2){
        height: 1px;
    }
    .menu__container-text{
        font-size: 16px;
        padding: 10px 0 20px;
    }
    .menu__container-detail{
        font-size: 14px;
    }
    .menu__container-detail p{
        padding-bottom: 5px;
    }

/*****clientStory*****/
    .clientStory__wrapper{
        background: none;
        padding: 0;
    }
    .clientStory__decorPc1{
        display: block;
        position: absolute;
        left: 0;
        mix-blend-mode: multiply;
        top: 3%;
    }
    .clientStory__decorPc2{
        display: block;
        position: absolute;
        left: 0;
        mix-blend-mode: multiply;
        bottom: 0;
        transform: scaleY(-1);
    }
    .clientStory__heading{
        font-size: 26px;
        padding: 86px 0 5px;
    }
    .clientStory__subHeading{
        font-size: 11px;
    }
    .clientStory__text{
        font-size: 16px;
        padding: 20px 0 40px;
    }
    .clientStory__flex{
        display: flex;
        width: 900px;
        justify-content: space-between;
        margin: auto;
    }  
    .clientStory__tab-wrapper{
        padding-bottom: 60px;
        width: 430px;
    }
    .clientStory__tab-buttonWrap{
        position: relative;
        z-index: 2;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        cursor: pointer;
    }
    .clientStory__tab-button{
        width: 215px;
        height: 52px;
        font-size: 13px;
    }
    .clientStory__tab-button:hover{
        opacity: 0.5;
    }
    .clientStory__tab-title{
        font-size: 16px;
        padding: 20px 0 10px;
    }
    .clientStory__tab-img1, .clientStory__tab-img2{
        width: 100%;
    }
    .clientStory__container-titleDecor{
        width: 19px;
    }
    .clientStory__container-titleDecor span:nth-child(1){
        height: 3px;
        margin-bottom: 2px;
    }
    .clientStory__container-titleDecor span:nth-child(2){
        height: 1px;
    }
    .clientStory__tab-text{
        font-size: 16px;
        padding: 20px 0;
        margin-left: 0;
        line-height: 1.8;
    }
    .clientStory__tab-detail{
        font-size: 14px;
        margin-left: -6px;
    }
    .clientStory__tab-detail p{
        padding-bottom: 5px;
    }

/*****gallery*****/
    .gallery__wrapper{
        padding: 20px 0 40px;
    }
    .gallery__slider-title{
        width: 281px;
        font-size: 16px;
        padding: 20px 0 10px;
    }
    .gallery__slider-detail{
        font-size: 14px;
    }
    .gallery__slider-detail p{
        padding-bottom: 5px;
    }
    .slick__slider{
        width: 900px;
        margin: auto;
    }
    .slick-slide img{
        width: 280px;
    }
    .slick-prev{
        left: -37px;
        top: 137px;
    }
    .slick-next{
        right: -27px;
        top: 137px;
    }

/*****Flow*****/
    .flow__wrapper{
        padding-bottom: 90px;
    }
    .flow__heading{
        font-size: 26px;
        padding: 96px 0 2px;
    }
    .flow__subHeading{
        font-size: 11px;
        padding-bottom: 77px;
    }
    .flow__heading-decor{
       top: 0;
       left: 0; 
       mix-blend-mode: multiply;
    }
    .flow__container{
        width: 900px;
        display: flex;
        margin: auto;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .flow__container__item{
       margin-bottom: 50px;
    }
    .flow__container__item:last-of-type{
        margin: auto;
    }
    .flow__container__item-text::after{
        transform: rotate(-90deg);
        left: 443px;
        top: -131px;
    }
    .flow__container__item:nth-child(2) .flow__container__item-text::after{
        display: none;  
    }
    .flow__container__item:nth-child(3) .flow__container__item-text::after{
        transform: rotate(-90deg);
        left: 443px;
        top: -131px;
    }
    .flow__container__item:nth-child(4) .flow__container__item-text::after{
        transform: rotate(0);
        left: -27px;
        top: 243px;
    }
    .flow__container__item-title{
        width: 186px;
        height: 40px;
        margin: 0 auto -20px;
    }
    .flow__container__item-title.longTitle{
        width: 400px;
        height: 40px;
    }
    .flow__container__item-titleStep{
        font-size: 16px;
        padding-top: 3px;
    }
    .flow__container__item-titleStep span{
        font-size: 20px;
    }
    .flow__container__item-img{
        width: 430px;
        height: auto;
    }
    .flow__container__item-text{
        font-size: 16px;
        width: 430px;
    }

/*****faq*****/
    .faq__wrapper{
        background-image: url(../img/webp/img_faq_bgPc.webp);
        padding-bottom: 60px;
        background-repeat: repeat;
        background-size: 100%;
    }
    .faq__decor{
        position: absolute;
        left: 0;
        top: -70px;
    }
    .faq__heading{
        font-size: 26px;
        padding: 94px 0 2px;
    }
    .faq__subHeading{
        font-size: 11px;
        padding-bottom: 40px;
    }
    .faq__container{
        margin: auto;
        width: 900px;
        margin-bottom: 15px;
        border-radius: 5px;
    }
    .faq__container:hover{
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }
    .faq-question{
        padding: 14px 20px 16px; 
    }
    .faq__question-mark{
        font-size: 18px;
        margin-right: 10px;
    }
    .faq-question h3{
        font-size: 16px;
        flex-basis: 810px;
    }
    .faq-inner{
        padding: 15px 20px;
    }
    .faq__answer-mark{
        font-size: 18px;
        margin-right: 10px;
        padding-top: 11px;
    }
    .faq-answer p{
        font-size: 16px;
        padding-top: 15px;
        flex-basis: 810px;
    }
    .faq-toggle{
        width: 16px;
        height: 2px;
        margin-left: 0;
        position: relative;
        top: -6px;
    }
    .faq-toggle::before{
        width: 2px;
        height: 16px;
    }

/*****instagram*****/
   .instagram__wrapper{
        padding: 70px 0 50px;
   }
   .instagram__heading{
        width: 200px;
        margin: auto;
   }
   .instagram-media{
        margin: auto !important;
   }
   .instagram__heading__under{
        width: 900px;
        margin: 50px auto 10px;
   }
   .instagram__heading__under-user{
        font-size: 16px;
   }
   .instagram__heading__under-user img{
        width: 60px;
        height: 60px;
        margin-right: 10px;
   }
   .instagram__container{
        max-width: 900px;
   }
   .instagram__container__item{
        width: 290px;
        height: 290px;
        margin: 5px;
   }
   .instagram__heading__under-followBtn{
        padding: 6px;
        width: 150px;
        height: 36px;
        font-size: 16px;
   }

/*****application*****/
   .application__wrapper{
        background-image: url(../img/webp/img_application_bg_pc.webp);
        padding: 160px 0;
   }
   .application__title{
        font-size: 30px;
        padding-bottom: 15px;
   }
   .application__subTitle{
        font-size: 18px;
        padding-bottom: 80px;
   }
   .application__btn{
        width: 440px;
        height: 70px;
        font-size: 20px;
        padding: 20px;
   }
   .application__btn:hover{
        background-color: transparent;
        border: solid 1px #fff;
        box-shadow: none;
        color: #fff;
   }

/*****footer*****/
    .footer__wrapper{
        height: 104px;
        padding-top: 19px;
    }
    .footer__logo img{
        width: 122px;
    }
    .footer__copyright{
        font-size: 10px;
        padding: 9px 0 19px;
    }
 }


 @media screen and ( min-width : 1366px ){

/*****firstView*****/
    .firstView__wrapper__heading-text{
        top: 25vw;
    }

/*****slick*****/
    .slick__slider{
        width: 1100px;
    }
    .slick-slide img{
        width: 352px;
    }
    .slick-next{
        top: 160px;
        scale: 1.3;
        right: -34px;
    }
    .slick-prev{
        top: 160px;
        scale: 1.3;
        left: -50px;
    }
 }