@charset "UTF-8";
@media screen and (max-width: 900px) {
    /*--------------------------------------------------------
    定数
    --------------------------------------------------------*/
    .visible900 {
        display: block;
        margin: auto;
    }
    .hidden900 {
        display: none;
    }
    /*--------------------------------------------------------
    定数（基本的に、全サイト共通に使えるもの）
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    サイト毎に変化のある定数
    --------------------------------------------------------*/
    .contents {
        width: 100%;
    }
    .img_center {
        margin-left: 0px;
    }
    img {
        width: 100%;
        max-width: 100%;
        height: auto;
    }
    /*--------------------------------------------------------
    フッター
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    ↓↓↓ 各種レイアウト ↓↓↓
    --------------------------------------------------------*/
    /* --共通-- */
    /* --共通-- */
    /*--header--*/
    /*--header-end--*/
    /*--contents--*/
    /*--contents-end--*/
    /*--footer--*/
    /*--footer-end--*/
    /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
    --------------------------------------------------------*/
}
@media screen and (max-width: 768px) {
    /*--------------------------------------------------------
    ↓↓↓ 各種レイアウト ↓↓↓
    --------------------------------------------------------*/
    /* --共通-- */
    /* --共通-- */
    /*--header--*/
    /*--header-end--*/
    /*--contents--*/
    /*--contents-end--*/
    /*--footer--*/
    /*--footer-end--*/
    /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    ↓↓↓ フォーム部分 ↓↓↓
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    ↑↑↑ フォーム部分 ↑↑↑
    --------------------------------------------------------*/
}

@media screen and (max-width: 700px) {
    /*--------------------------------------------------------
    ↓↓↓ 各種レイアウト ↓↓↓
    --------------------------------------------------------*/
    /* --共通-- */
    /* --共通-- */
    /*--header--*/
    /*--header-end--*/
    /*--contents--*/
    /*--contents-end--*/
    /*--footer--*/
    /*--footer-end--*/
    /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    ↓↓↓ フォーム部分 ↓↓↓
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    ↑↑↑ フォーム部分 ↑↑↑
    --------------------------------------------------------*/
}

@media screen and (max-width: 650px) {
    /*--------------------------------------------------------
    ↓↓↓ 各種レイアウト ↓↓↓
    --------------------------------------------------------*/
    /* --共通-- */
    /* --共通-- */
    /*--header--*/
    /*--header-end--*/
    /*--contents--*/
    /*--contents-end--*/
    /*--footer--*/
    /*--footer-end--*/
    /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    ↓↓↓ フォーム部分 ↓↓↓
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    ↑↑↑ フォーム部分 ↑↑↑
    --------------------------------------------------------*/
}

@media screen and (max-width: 600px) {
    .visible600 {
        display: block;
        margin: auto;
    }
    .hidden600 {
        display: none;
    }
    body {
        font-size: 1.6rem;
    } /*todo 要調査*/
    /*--------------------------------------------------------
    サイト毎に変化のある定数
    --------------------------------------------------------*/
    /*--------------------------------------------------------
    フッター
    --------------------------------------------------------*/
    .copyright,
    .copyright a {
        font-size: 1.2rem;
    }
    /*--------------------------------------------------------
    ↓↓↓ 各種レイアウト ↓↓↓
    --------------------------------------------------------*/
    /* --共通-- */
    /* --共通-- */
    /*--header--*/
    /*--header-end--*/
    /*--contents--*/
    /*--contents-end--*/
    /*--footer--*/
    /*--footer-end--*/
    /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
    --------------------------------------------------------*/
}
@media screen and (max-width: 500px) {
    .visible500 {
        display: block;
        margin: auto;
    }
    .hidden500 {
        display: none;
    }
    /*--------------------------------------------------------
    ↓↓↓ 各種レイアウト ↓↓↓
    --------------------------------------------------------*/
    /* --共通-- */
    /* --共通-- */
    /*--header--*/
    /*--header-end--*/
    /*--contents--*/
    /*--contents-end--*/
    /*--footer--*/
    /*--footer-end--*/
    /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
    --------------------------------------------------------*/
}
@media screen and (max-width: 400px) {
    .visible400 {
        display: block;
        margin: auto;
    }
    .hidden400 {
        display: none;
    }
    /*--------------------------------------------------------
    ↓↓↓ 各種レイアウト ↓↓↓
    --------------------------------------------------------*/
     /* --共通-- */
    /* --共通-- */
    /*--header--*/
    /*--header-end--*/
    /*--contents--*/
    /*--contents-end--*/
    /*--footer--*/
    /*--footer-end--*/
    /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
    --------------------------------------------------------*/
}
@media screen and (max-width: 319px) {
    body {
        overflow-x: visible;
    }
    .contents {
        min-width: 320px;
    }
    .contents1800 {
        min-width: 320px;
    }
    header {
        min-width: 320px;
    }
    footer {
        min-width: 320px;
    }

}
/* 360px以下の場合　これ以上小さくしたくない場合は横スクロール対応 */
/* @media screen and (max-width: 359px) {
    body {
        overflow-x: hidden;
    }
    .contents {
        min-width: 360px;
    } 
    .contents1800 {
        min-width: 360px;
    }
    header {
        min-width: 360px;
    }
    footer {
        min-width: 360px;
    } 
} */