@charset "utf-8";
/* --1023px以下の解像度
----------------------------------------------------------------------------------------------------
*DESIGN1
*01-BASE/共通
    01-body
	02-globalStyles
	03-link
	04-buttons
	05-forms
	06-table
    07-list
    08-content
	09-box
    10-footer
	11-header
	12-Navigation
	13-title
	
*02-TOP/トップページ
    //A-共通スタイルをトップページのみスタイル変更したい場合　id="index"　を親にして変更する//
    ----------------------------------------------------
    A-01-content
	A-02-footer
	A-03-header
	A-04-Navigation
    ----------------------------------------------------
    //B-TOP PAGE専用スタイル
    B-01-content
    B-02-box
	B-03-title
	B-04-info//お知らせ
	B-05-listLink//リンク設定
	B-06-login//ログイン
	----------------------------------------------------

*03-FREE/トップページ用自由項目
	01-title
	02-other//管理画面データ入力時に使用スタイル

*04-MYPAGE/マイページ
	01-buttons
	02-box
	03-title
	04-info//お知らせ
	05-listLink//リンク設定

*05-CONTACT/お問い合わせ

*06-JQUERY CUSTOM/jquery ui使用箇所にカスタマイズスタイルをあてる

*07-OTHER/システムで使用されているその他のページ

*08-REG/登録ページ
	01-buttons
	02-forms
	03-table
	04-content
    05-box
*
*09-FREE SPACE
    //上記に用意していないスタイルを記述
    //任意のスタイルを追加してください --author nameをクラス名に使うなど差別化のおすすめ
*---------------------------------------------------------------------------- */

@media (max-width: 1023px) {
/* ----------------------------------------------------------------------------
*
*01-BASE//
*
*---------------------------------------------------------------------------- */
/* ==========================================================================
01-01
========================================================================== */

    body {
        font-size: 13px;
    }

/* ==========================================================================
01-02/03/04/05/
========================================================================== */
/* ==========================================================================
01-06
========================================================================== */
    .btn {
    }

/* ==========================================================================
01-07
========================================================================== */
    /* --定義つきリスト横並び　解除-- */

    .dl-horizontal dt {
        float: none;
        padding: 0.25em 0 0 0;
    }

    .dl-horizontal dd {
        padding-left: 0;
    }


    /* ---------------------------------------------- */
    /* --定義つきリスト縦並び-- */

    .dl-vertical {
    }

        .dl-vertical dt {
        }

        .dl-vertical dd {
        }


/* ==========================================================================
01-08
========================================================================== */
    .container {
        width: auto;
        min-width: 280px;
    }

    #main {
        width: auto;
    }

/* ==========================================================================
01-09
========================================================================== */

       #main .col_6 {
            padding-top: 1em;
        }

    .wrap > .row {
        width: auto;
        margin: 0;
    }

    .content {
        width: auto;
        padding: 0 1em;
    }

        .content > .inner {
        }

    /* --グリッドレイアウト-- */

    .row {
        display: block;
        margin-bottom: 0;
    }

    .col_1, .col_2, .col_3, .col_4, .col_5, .col_6, .col_7, .col_8, .col_9, .col_10, .col_11, .col_12 {
        width: 100%;
        float: none;
        clear: both;
    }

    .area-btn {
        padding-top: 0.5em;
    }
/* ==========================================================================
01-10
========================================================================== */

    footer {
        width: auto;
    }

    .inner-footer {
        height: auto;
        width: 100%;
        position: relative;
        overflow: hidden;
    }
    /* --フッターテキスト-- */
    .footer-copy {
        padding: 0.5em 0;
        /*color: #fff;*/
        width: auto;
        height: auto;
        margin: 0 auto;
    }
    /* --フッター画像-- */

    footer img.img-footer {
        display: block;
        position: static;
        -webkit-transform: translate(0%, 0%);
        transform: translate(0%, 0%);
        width: 100%;
    }
    /* ----------------------------------------------------- */
    /* --スクロール-- */

    .scroll {
        right: 1em;
    }
/* ==========================================================================
01-11
========================================================================== */
    .header {
        width: auto;
    }
    /* ----------------------------------------------------- */
    /* --ヘッダー画像-- */
    .img-head {
        width: 100%;
        display: block;
        margin: 0 auto;
        position: static;
        -webkit-transform: translate(0%, 0%);
        transform: translate(0%, 0%);
    }

    /* ----------------------------------------------------- */
    /* --ヘッダーナビ/言語切替/ユーザーネーム/ログイン履歴/ログアウト-- */
    .nav-head {
        padding: 0;
        font-size: 75%;
        font-weight: 500;
        position: relative;
        min-height: 36px;
        width: auto;
    }

        .nav-head ul {
            width: 100%;
            padding-right: 0px;
            margin: 0;
            font-size: 11px;
        }

            .nav-head ul li {
                padding: 0;
                vertical-align: middle;
                line-height: 1.5em;
                height: 40px;
            }

            .nav-head ul > li span {
            }

        .nav-head span:before {
            line-height: 1em;
        }


        .nav-head span, .nav-head a {
            padding: 0em;
        }

        /* --ユーザーネーム-- */

        .nav-head ul > li.li-user {
            padding-left: 4em;
            width: auto;
        }

            .nav-head ul > li.li-user span.myid {
                padding-left: 2em;
                width: auto;
                max-width: 300px;
                display: block;
                text-overflow: ellipsis;
                white-space: nowrap;
                overflow: hidden;
                text-align: left;
            }
        /* --言語切替-- */
        .nav-head ul > li.li-language {
            text-align: right;
        }


        .nav-head select.select-language {
            height: 24px;
        }

        /* --ログアウト-- */

        .nav-head ul > li.li-logout {
            width: 70px;
        }

            .nav-head ul > li.li-logout span {
                line-height: 1.55em;
                height: 100%;
                display: table-cell;
            }


        .nav-head ul > li span.logout a {
            padding: 2em 0.25em 0.25em 0.25em;
            font-weight: 500;
            height: auto;
            border-radius: 0;
            display: block;
            width: 64px;
            position: relative;
            font-size: 10px;
        }

            .nav-head ul > li span.logout a:before {
                left: 50%;
                font-size: 130%;
                line-height: 1em;
                margin-left: -0.5em;
                top: 5px;
                margin-top: 0;
            }

        /* --ログイン履歴-- */

        .nav-head ul > li.li-history {
            padding-right: 0.5em;
            width: 85px;
        }

            .nav-head ul > li.li-history .history {
                width: 80px;
            }

                .nav-head ul > li.li-history .history a {
                    display: block;
                    font-size: 10px;
                }
/* ==========================================================================
01-12
========================================================================== */
    .nav, .nav ul {
        width: auto;
    }

        .nav ul, .nav ul li {
            display: block;
        }

            .nav ul li {
                border-left: none;
                padding: 1em 0 0 0;
                display: none;
                -webkit-transition: .5s ease-in-out;
                -moz-transition: .5s ease-in-out;
                transition: .5s ease-in-out;
            }

                .nav ul li:first-child {
                }

    .nav {
        display: block;
        position: fixed;
        bottom: inherit;
        top: 0;
        padding-top: 0;
        left: 0;
        z-index: 3;
        width: 100%;
        background-color: transparent;
        height: auto;
        padding-bottom: 0;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        margin: 0;
    }

        .nav ul {
            height: auto;
            -webkit-transition: .5s ease-in-out;
            -moz-transition: .5s ease-in-out;
            transition: .5s ease-in-out;
            top: -100%;
            position: relative;
            border: none;
            background-color: transparent;
        }
    /* ----------------------------------------------------- */
    /* --Toggle Button-- */
    #nav-toggle {
        display: none;
        position: absolute;
        left: 4px;
        top: 5px;
        width: 34px;
        height: 30px;
        cursor: pointer;
        z-index: 101;
    }

        #nav-toggle div {
            position: relative;
        }

        #nav-toggle span {
            display: block;
            position: absolute;
            height: 2px;
            width: 100%;
            left: 0;
            -webkit-transition: .35s ease-in-out;
            -moz-transition: .35s ease-in-out;
            transition: .35s ease-in-out;
        }

            #nav-toggle span:nth-child(1) {
                top: 0;
            }

            #nav-toggle span:nth-child(2) {
                top: 6px;
            }

            #nav-toggle span:nth-child(3) {
                top: 13px;
            }

    #nav-toggle {
        display: block;
        padding: 8px 8px 3px 8px;
        display: none;
    }

    .nav.open {
    }
    /* --#nav-toggle 切り替えアニメーション-- */
    .open #nav-toggle span:nth-child(1) {
        top: 8px;
        -webkit-transform: rotate(315deg);
        -moz-transform: rotate(315deg);
        transform: rotate(315deg);
    }

    .open #nav-toggle span:nth-child(2) {
        width: 0;
        left: 50%;
    }

    .open #nav-toggle span:nth-child(3) {
        top: 8px;
        -webkit-transform: rotate(-315deg);
        -moz-transform: rotate(-315deg);
        transform: rotate(-315deg);
    }

    /* --#global-nav スライドアニメーション-- */
    .open #global-nav {
        /* --#global-nav top + #mobile-head height-- */
        -moz-transform: translateY(556px);
        -webkit-transform: translateY(556px);
        transform: translateY(556px);
    }

    .nav.open {
        height: 100%;
        overflow: auto;
    }

    .nav.open {
        top: 0;
    }

        .nav.open ul {
            top: 0;
        }

    .nav-ul_01 li:first-child {
        padding-top: 2.5em;
    }

    .nav.open ul li {
        display: block;
    }

    #nav-toggle {
        display: block;
    }

    .nav li:before {
        display: none;
    }
/* ==========================================================================
01-13
========================================================================== */
    h1, h2 {
        width: auto;
    }

        h1.title-head {
            height: auto;
            background-image: none;
            padding-bottom: 0;
            position: relative;
        }

        h2 > span {
            width: auto;
        }

    h3 > span {
        left: 0.5em;
        padding: 0 0.5em;
    }

/* ----------------------------------------------------------------------------
*
*02-TOP//
*
*---------------------------------------------------------------------------- */
/*
//A-共通スタイルをトップページのみスタイルを変更したい場合は　id="index"　を親にして変更
*/
/* ==========================================================================
02-A-01
========================================================================== */
    #main-index {
        width: auto;
    }
/* ==========================================================================
02-A-02
========================================================================== */

/* ==========================================================================
02-A-03
========================================================================== */
    #index .header {
        height: auto;
        padding: 0px 0 10px 0;
    }
/* ==========================================================================
02-A-04
========================================================================== */
    #index .nav {
    }

        #index .nav ul {
        }

        #index .nav.open {
        }

            #index .nav.open ul {
            }

            #index .nav.open li {
            }
/* ==========================================================================
02-B-01
========================================================================== */

    /* --背景-- */
    #bg-body {
    }

        #bg-body:before {
        }

    /* --main-- */
    #main-index {
    }


/* ==========================================================================
02-B-02
========================================================================== */

    .artical {
        width: auto;
        padding-bottom: 1em;
    }

/* ==========================================================================
02-B-03
========================================================================== */
    h3.title-link { /* --リンク設定タイトル-- */
    }

    h3.title-info { /* --お知らせ設定タイトル-- */
    }

    h3.title-acount { /* --ログイン・新規登録タイトル-- */
    }

    h3.title-link:before {
    }

    h3.title-info:before {
    }

    h3.title-acount:before {
    }
/* ==========================================================================
02-B-04
========================================================================== */


    .li-info_index {
        display: block;
    }

        .li-info_index dd, .li-info_index dt {
            display: block;
            width: 100%;
        }

        .li-info_index dd {
            padding: 0.75em 2em 0.5em 0.5em;
        }
/* ==========================================================================
02-B-05
========================================================================== */

    .li-link_index li {
        -webkit-flex-basis: 100%;
        flex-basis: 100%;
    }

    .li-btn_index {
        height: auto;
        margin: 0;
        width: 100%;
        background-color: rgba(0,0,0,0.1);
    }

        .li-btn_index a {
            height: auto;
        }

            .li-btn_index a:hover {
                height: auto;
            }

            .li-btn_index a:before {
            }

        .li-btn_index:after {
        }
/* ==========================================================================
02-B-06
========================================================================== */
    /* --content-- */

    .col_12 .inner .login {
        display: block;
    }

        .col_12 .inner .login .col-login {
            display: block;
            width: 100%;
            margin-bottom: 1em;
        }
    /* ---------------------------------------------- */
    /* --form-- */

    form-login {
    }

    .form-login dt {
        padding: 0.75em 0 0 0;
    }

    .form-login dd {
    }

    .inner-login {
        padding: 2em;
    }


/* ----------------------------------------------------------------------------
*
*03-FREE//
*
*---------------------------------------------------------------------------- */
/* ==========================================================================
03-01
========================================================================== */
/* ==========================================================================
03-02
========================================================================== */
    /* --推奨環境-- */

    .browser li {
        flex-basis: 50%;
    }

        .browser li > p {
            padding-left: 1em;
        }

            .browser li > p:before {
                left: 0;
            }


/* ----------------------------------------------------------------------------
*
*04-MYPAGE//マイページ専用のスタイル// 
*
*---------------------------------------------------------------------------- */
/* ==========================================================================
04-01
========================================================================== */
/* ==========================================================================
04-02
========================================================================== */
    .area-btn_download {
        margin-top: 0.5em;
        padding: 0.5em;
    }
/* ==========================================================================
04-03
========================================================================== */

h3.title-info_my { /* --お知らせ-- */
}

h3.title-user_my { /* --代表者情報-- */
}

h3.title-delegate_my {/* --種別代表者-- */
}

h3.title-edit_my {/* --種別-- */
}

h3.title-link_my {/* --リンク-- */
}


h3.title-info_my:before {
}

h3.title-user_my:before {
}

h3.title-delegate_my:before {
}

h3.title-edit_my:before {
}

h3.title-link_my:before {
}
/* ==========================================================================
04-04
========================================================================== */

    .li-info_my {
        display: block;
    }

        .li-info_my dd, .li-info_my dt {
            display: block;
            width: 100%;
        }

        .li-info_my dd {
            padding: 0.75em 2em 0.5em 0.5em;
        }

        .li-info_my .info-day {
            text-align: left;
            padding: 0.25em 0;
        }
/* ==========================================================================
04-05
========================================================================== */

    .li-link_my {
        display: block;
    }

    .li-btn_my a {
    }

        .li-btn_my a:before {
            left: 1em;
            top: 50%;
            margin-top: -0.5em;
            line-height: 1em;
        }

        .li-btn_my a:after {
            top: 50%;
            margin-top: -0.5em;
            line-height: 1em;
        }
/* ----------------------------------------------------------------------------
*
*05-CONTACT//
*
*---------------------------------------------------------------------------- */
/* --title-- */
h4.title-contact {
}

    h4.title-contact:before {
    }

/* --content-- */
    section.contact {
        padding: 1em;
        width: auto;
    }

    .contact > .wrap {
        width: auto;
    }
    
/* --box-- */
    .inner-contact {
        padding: 0.5em 0;
        width: auto;
    }

    
/* ----------------------------------------------------------------------------
*
*06-JQUERY CUSTOM/jquery ui使用箇所にカスタマイズスタイルをあてる
*
*---------------------------------------------------------------------------- */

/* --レスポンシブ対応していません-- */

/* ----------------------------------------------------------------------------
*
*07-OTHER/システムで使用されているその他のページ
*
*---------------------------------------------------------------------------- */

/* --レスポンシブ対応していません-- */


/* ----------------------------------------------------------------------------
*
*08-REG/登録ページ
*
*---------------------------------------------------------------------------- */

/* --レスポンシブ対応していません-- */


/* ----------------------------------------------------------------------------
*
*09-FREE SPACE
    //上記に用意していないスタイルを記述
    //任意のスタイルを追加してください --author nameをクラス名に使うなど差別化のおすすめ
*
*---------------------------------------------------------------------------- */




/* ↑↑↑end↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑*/
}

/* ↓↓↓↓↓400px以下の解像度で使用↓↓↓↓↓↓↓↓↓↓↓↓ */
@media (max-width: 400px) {
    .nav-head ul > li.li-user span.myid {
        max-width: 100px;
    }
}