@media only screen and (min-width: 1280px) {}

@media only screen and (min-width: 1200px) {}

@media only screen and (min-width: 1024px) {}

@media only screen and (min-width: 991px) {
    .openbtn {
        display: none;
    }

}

@media only screen and (min-width: 769px) {}


@media only screen and (min-width: 468px) {}









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


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



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


@media only screen and (max-width: 991px) {

    h2 {
        font-size: 2.8rem;
        line-height: 3.2rem;
    }

    

    h4,
    .heading-size-4 {
        font-size: 1.6rem;
    }


.flow_wrap{
    flex-direction: column;
    gap: 0;
    max-width: 100%;
}


.flow_img{
    width:100%;
    max-width: 500px;
    margin:0 auto;
}

.flow_detail{
    width:100%;
    max-width: 500px;
    margin:0 auto 15rem auto;
    padding:0 1.5rem;
}


.caution_txt{
    padding:0 1.5rem;
}






}


@media only screen and (max-width: 768px) {

    .rightbnr {
        display: none;
    }

    .mailon {
        padding: 8px;
    }

    .mailon:after {
        display: none;

    }

    .mailoff {
        border-bottom: 1px solid #aaa;
        padding: 8px;
    }

    .mailoff:after {
        display: none;
    }

    .mailoffcenter {
        padding: 8px;
    }

    .mailoffcenter:after {
        display: none;
    }

    .mailend {
        padding: 8px;
    }

    .mailcomplete {
        padding: 8px;
    }

    .navbar,
    .navbar .container {
        height: auto;
    }

    #navbarNavDropdown ul li,
    #navbarNavDropdown ul li a {
        border: none !important;
    }

    #navbarNavDropdown ul li a:hover {
        background: #ddd;
    }

    #formarea .submit {

        font-size: 1.4rem;
        letter-spacing: 1px;
        padding: 8px 5px;

    }


    #pagetitle .titlecontact h2 {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        color: #fff;
        margin: 0;
        padding: 0;
        font-size: 2.5rem;

    }



.top_shop_txt {
    width: 100%;
}
.top_shop_img {
    width: 100%;
    display:flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content:space-between;
    flex-direction: column;
    gap:5rem 0rem;
}

.intro_left{
    width:100%;
}
.intro_right{
    width:100%;
}

.intro_left_child_left{
    width:100%;
    
}

.intro_left_child_right{
    width:100%;
    padding:0 2rem;
}
.top_work_list_img{
    width:100%;
}
.top_work_list_txt{
    width:100%;
    order: 2;
    margin-right:3rem;
}



.top_shop_wrap {
    

padding-bottom: 0.3em;
background-image: repeating-linear-gradient(-45deg, #0072BC 0, #0072BC 3px, transparent 3px, transparent 6px);
background-repeat: no-repeat;
    background-position: left 0 top 0;
    background-size: 100% 3%;
}



.top_shop_img01{
    width:100%;
}

.top_shop_img02{
    width:100%;
}

.top_salondem_img01{
    width:100%;
}

.top_salondem_img02{
    width:100%;
}



.lower_img-box{
    margin-bottom:calc(60 / var(--view-size) * 100vw);
}

.item-description_title{
    width:100%;
    margin-bottom:.5rem;
}

.item-description_text{
    width:100%;
    margin-bottom:1rem;
}


.other_works{
    margin-bottom:calc(40 / var(--view-size) * 100vw);
}
.other_works_wrap{
    width:100%;
}

	
	
#workstitle {
    background: url("../imgs/slide_sp09.jpg") no-repeat center top;
    background-size:cover;
}
	
	

}


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

.ol_line {
    flex-direction: column;

}

.ol_detail {
    width: 100%;
}


}



@media screen and (max-width: 736px) {
    .cd-fixed-bg {
        background-size: cover;
        background-attachment: scroll;
    }
}





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

    .flex_wrap {
        flex-direction: column;
    }

    .sec_cnt_v_wrap {
        order:2;
    }

    .profile_img{
        order:1;
        margin-bottom:4rem;
    }


    .sec_title_v_wrap {
        margin-right: 0;
    }

    h2.sec_title_v {
        display: block;
        margin-bottom: 40px;
    }

    h2.sec_title_v span {
        -ms-writing-mode: unset;
        writing-mode: unset;
        -webkit-text-orientation: unset;
        display: block;
    }

    h2.sec_title_v span.ja2 {
        font-size: 2rem;
    }

    h2.sec_title_v span.en1 {
        font-size: .6rem;
    }

    h2.sec_title_v span+span {
        margin-top: .6rem;
    }


}




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

    .brsp {
        display: block;
    }


    .about_intro_txt p{
        width:100%;
        }


}







@media only screen and (max-width: 468px) {

    h2 {
        font-size: 1.8rem;

        line-height: 2.4rem;
        margin-bottom: 1rem;
    }

    .copyright {
        text-align: right;
    }



    .content-wrapper {
        padding-top: 75px;
    }




    .service-area-dark .inner::before {
        content: "";
        position: absolute;

        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 100vh;
        background-repeat: no-repeat;
        background-position: 50% 100%;
        background-image: url(../imgs/bg_06.jpg);
        background-size: cover;
        padding: 200px 0;
    }


    .no-bg {
        padding: 0;
    }

    .service-area-dark .inner {
        padding: 200px 0;
    }


    .service-area-dark {
        position: relative;
        display: block;
        justify-content: space-between;
        flex-wrap: wrap;
        margin: 0 0 300px 0;
        z-index: 2;
        background: none !important;
        background-size: none !important;
        background-attachment: none !important;

    }



    .content-wrapper.philosohpy_bg {
        background: none !important;
        background-size: none;
        background-attachment: none;
    }



    .content-wrapper.philosohpy_bg::before {
        content: "";
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 100vh;
        background-repeat: no-repeat;
        background-position: 50% 100%;
        background-image: url(../imgs/philo_bg02.jpg);
        background-size: cover;
    }




}






@media only screen and (min-width:769px) and (max-width:1000px) {
    #navbarNavDropdown ul li a {
        display: block;

        font-size: 1.2rem;
        padding: .1em .3em;
        letter-spacing: 0.08rem;

    }

    .rightbnr {
        font-size: 0;
        margin-left: 8px;
    }

    .entrybtn {
        text-align: center;

        width: auto;
        margin: 0 0 0 0;
        display: inline-block;
        height: 100px;
        width: 100px;
        position: relative;
    }

    .entrybtn a {
        white-space: nowrap;
        color: #fff;
        padding: 0 0px;
        font-size: 1.2rem;
        letter-spacing: 0;
        text-decoration: none;
        display: block;
        transition: 0.5s;
        background: linear-gradient(90deg, #a0dccc, #a0dccc 150px, #a0dccc 350px, #0080cd);
        background-position: 100% 0;
        background-size: 500px 100px;
    }


}