@charset "utf-8";
/* CSS Document */

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

@media screen and ( max-width:1180px ) {
    .systemtree img {
        width: 100%;
    }
}

@media screen and ( max-width:1000px ) {
    body * {
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    h1 {
        margin-left: 20px;
    }
    h1 p:first-child {
        font-size: 14px;
    }
    h1 p:last-child {
        font-size: 24px;
    }
    h2 {
        font-size: 24px;
    }
    h2 span {
        font-size: 16px;
    }
    .bordersec h2 {
        width: 70%;
    }
    h3 {
        width: 100%;
        display: block;
        text-align: center;
        margin: 0 auto 20px;
    }
    h3 br {
        display: block;
    }
    #main_content section {
        width: auto;
        margin-left: 10px;
        margin-right: 10px;
    }
    header {
        height: 50vh
    }
    .headtop {
        padding-bottom: 30px;
    }
    header>div.headtop {
        padding-left: 0;
        position: relative;
    }
    .headtitle {
        left: 20px;
        bottom: 20px;
        font-size: 24px;
    }
    #nav_toggle {
        display: block;
        width: 100%;
        height: 40px;
        padding-top: 6px;
        z-index: 999;
        position: relative;
        background-color: #00479d;
    }
    #nav_toggle div {
        width: 40px;
        position: relative;
        margin-top: 6px;
        margin: 0 auto;
    }
    #nav_toggle span {
        display: block;
        height: 3px;
        background-color: #fff;
        position: absolute;
        width: 100%;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;	
    }
    #nav_toggle span:nth-child(1){
        top:0px;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    #nav_toggle span:nth-child(2){
        top:12px;
    }
    #nav_toggle span:nth-child(3){
        top:24px;
    }
    /*開閉ボタンopen時*/    
    .open #nav_toggle span:nth-child(1) {
        top: 12px;
        -webkit-transform: rotate(135deg);
        -moz-transform: rotate(135deg);
        transform: rotate(135deg);
    }
    .open #nav_toggle span:nth-child(2) {
        width: 0;
        left: 50%;
    }
    .open #nav_toggle span:nth-child(3) {
        top: 12px;
        -webkit-transform: rotate(-135deg);
        -moz-transform: rotate(-135deg);
        transform: rotate(-135deg);
    }
    
    nav {
        display: none;
    }
    .open nav {
        width: 100%;
        position: absolute;
        top: 105px;
        background-color: rgba(255, 255, 255, 0.8);
    }
    .close nav {
        display: none;
    }
    .open nav ul {
        display: block;
        padding-top: 35px;
    }
    nav ul li {
        padding: 0;
        margin: 20px auto;
    }
    nav ul li.pamh {
        margin-bottom: 0;
    }
    nav ul li.contactbox {
        margin: 0 auto;
    }
    footer h1 {
        margin-left: 0;
    }
    footer ul {
        display: none;
    }
    footer div p {
        display: block;
    }
    footer div p span {
        display: block;
    }
/* content */
    .headCleanA {
        left: 0;
        bottom: 20px;
        padding-left: 10px;
        padding-right: 10px;
    }
    .headCleanA p {
        font-size: 24px;
    }
    .headCleanA a {
        font-size: 16px;
    }
    .indexbusines {
        padding: 30px 20px;
    }
    .service .point {
        padding: 20px 0;
        margin: 0 auto;
        border: none;
        display: block;
    }
    .service .flexbox:first-of-type {
        width: 80%;
        display: block;
    }
    .service .flexbox:first-of-type div {
        width: 100%;
    }
    .service .point div:nth-child(2) {
        left: 0;
        right: 0;
        bottom: 0;
        display: block;
        transform: none;
        -webkit-transform: none;
        -ms-transform: none;
    }
    .service .point div:last-child {
        right: 0;
        top:0;
    }
    .service .point div {
        width: 80%;
        height: auto;
        margin: 20px auto 20px;
        position: relative;
        display: block;
    }
    .service .point div:first-child {
        left: 0;
        top: 0;
    }
    .service .flexbox.appoint {
        width: 100%;
        margin-top: 50px;
    }
    .service .flexbox.appoint div a {
        width: 100%;
        padding: 15px;
    }
    .indexbusines ul li span:first-child {
        width: 100%;
    }
    .indexbusines div:first-of-type {
        display: block;
    }
    .indexbusines ul li {
        display: block;
    }
    .indexbusines div div:first-child {
        width: 100%;
    }
    .indexbusines div div:last-child {
        width: 100%;
        justify-content: center;
    }
    .indexbusines a {
        font-size: 18px;
    }
    .indexbusines ul li span {
        width: 100%;
    }
    .indexclean .indexcleanA {
        width: auto;
        margin-left: 10px;
        margin-right: 10px;
        min-height: none;
        display: block;
    }
    .indexclean div div {
        width: 100%;
    }
    .indextoilet>p {
        padding-top: 30px;
    }
    .aboutbk section>div p {
        display: block;
    }
    .aboutbk section>div p>span {
        display: block;
    }
    .message {
        padding: 30px 10px;
    }
    .message p:first-child {
        font-size: 18px;
        margin-top: 30px;
    }
    #main_content .aboutbk section {
        display: block;
    }
    .aboutbk section div {
        width: 100%;
    }
    .aboutbk section div {
        margin-bottom: 60px;
    }
    .cleansystem .flexbox {
        display: block;
    }
    .cleansystem .flexbox p {
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    #main_content .systemtree section {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
    .systemtree ul p:first-child {
        margin-bottom: 10px;
    }
    .systemtree table {
        width: 100%;
        margin-top: 20px;
    }
    .boxt .flexbox table {
        width: 100%;
    }
    .cleansystem .boxt .flexbox div img.arrow {
        transform: rotate( 90deg);
        margin: 10px auto;
        display: block;
    }
    .superbio .routeflex {
        display: block;
    }
    .superbio .routeflex p {
        margin-right: 0;
    }
    .superbio .routeflex p:first-child {
        margin-top: 10px;
    }
    .superbio div p {
        padding: 10px 20px;
        display: block;
    }
    .image_list .flexbox {
        display: block;
    }
    .image_list .flexbox>div {
        width: 100%;
        margin: 0 auto 20px;
    }
    form {
        margin-left: 0;
    }
    #contact ul li {
        display: block;
    }
    #contact ul li p:first-child,
    #contact ul li p:last-child {
        width: 100%;
    }
    #contact ul li p:last-child {
        margin-top: 10px;
    }
    .indextoilet ul.toiletpic,
    .use .flexbox {
        display: block;
    }
    .indextoilet ul.toiletpic li,
    .use .flexbox li {
        width: 100%;
    }
/* 汎用 共用*/
    
    .nosp {
        display: none!important;
    }
    .nopc {
        display: block;
    }
}