@charset "utf-8";

/* ---------------------------------------
	max-width: 800px
--------------------------------------- */

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

    html { font-size:  14px; }

    /*
        Other
    ******************************/

    .break__sp{
        display: block;
    }
    .break__pc{
        display: none;
    }

   
    /************************************************************

         Breadcrumb

    ************************************************************/

    .breadcrumbs{
        margin: 6.4vw 0 3.2vw;
    }
    .breadcrumbs ul li{
        display: inline-block;

    }
    .breadcrumbs ul li span{
        font-size: 0.8em;
    }

    /************************************************************

         Footer

    ************************************************************/

    .footer{
        margin: 3.2vw 0 0;
        padding-top: 6.4vw;
        padding-bottom: calc( 64px + 2.4vw );
    }
    .f-nav ul li{
        margin: 0 0.25em;
    }
    .f-sns{
        position: relative;
        margin: 1em 0;
        top: auto;
        right: auto;
    }
    .footer .f-copyright{
        position: relative;
        font-size: 0.7em;
        bottom: auto;
        right: auto;
    }

}/* max-width: 800px */


/* ---------------------------------------
	max-width: 600px
--------------------------------------- */
@media screen and (max-width: 640px){
    .c-header__links{
        right: 140px;
    }
    /*.c-header__links ul li.__ec{
        display: none;
    }*/
    .c-header__links ul li a{
        padding: 0 1.5em;
    }
    /************************************************************

          Header

    ************************************************************/

    .c-header .c-logo{
        margin-top: -18px;
        left: 30px;
    }
    .c-header .c-logo a{
        width: 180px;
        height: 36px;
    }
    /* .c-header__links{
        right: 100px;
    }*/
    .c-header__links ul li a{
        display: block;
        font-size: .8em;
        padding: 0 1.0em;
    }
    /*.o-nav__btn{
        width: 100px;
        height: 100px;
        padding: 42px 40px;
    }*/
    .o-nav__inner{
        padding: 5vh 9.6vw;
    }
    .o-nav__head{
        font-size: 0.8em;
        padding-top: 60px;
    }


    /* Internal / In page links */
    .o-nav__item.__internal{
        position: relative;
        margin: 4.8vw 0;
    }
    .o-nav__item.__internal .__head h2{
        position: relative;
        font-size: 0.8em;
        margin-bottom: 1em;
        top: auto;
        left: auto;
    }
    .o-nav__item.__internal ul{
        position: relative;
        padding-left: 3.2vw;
        padding-right: 3.2vw;
        padding-top: 0;
        padding-bottom: 0;
    }
    .o-nav__item.__internal ul li{
        border-bottom: 1px solid #333;
    }
    .o-nav__item.__internal ul li a{
        display: block;
        font-size: 1.2em;
        padding: 2.4vw 0;
    }

    /* Content */
    .o-nav__item.__content{
        margin: 4.8vw 0 0;
        padding: 4.8vw 0;
		border-top:none;
    }
    .o-nav__item.__content ul li{
        display: inline-block;
        margin: 0 1.2vw;
    }
    .o-nav__item.__content ul li a{
        font-size: .8em;
        line-height: 2.4;
    }

    /* Links */
    .o-nav__item.__links{
        display: block;
        margin-top:14%;
    }
    .o-nav__item.__links ul{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .o-nav__item.__links ul li{
        margin: 0 0.2em;
		width: 45%;
    }
    .o-nav__item.__links ul li a{
        padding: 1.2em;
        font-size: 0.8em;
        font-weight: 600;
        display: block;
        background: #fff;
        border-radius: 3px;
		text-align: center;
    }

    /* SNS */
    .o-nav__item.__sns{
        padding-bottom: 64px;
    }
    .o-nav__head .__right .__links{
        display: none;
    }

    .o-nav__head .__left p{
        border-left: 3px solid #fff;
        padding: 1em 1em 1em 1.4em;
        font-size: 1.0em;
        line-height: 2em;
        font-weight: 700;
        color: #fff; 
    }
    /************************************************************

         Breadcrumb

    ************************************************************/

    .breadcrumbs{
        margin: 6.4vw 0 3.2vw;
    }
    .breadcrumbs ul li{
        display: inline-block;

    }
    .breadcrumbs ul li span{
        font-size: 0.8em;
    }

    /************************************************************

         Footer

    ************************************************************/

    .footer{
        margin: 3.2vw 0 0;
        padding-top: 6.4vw;
        padding-bottom: calc( 64px + 2.4vw );
    }
    .f-nav ul li{
        margin: 0 0.25em;
    }
    .f-sns{
        position: relative;
        margin: 1em 0;
        top: auto;
        right: auto;
    }
    .footer .f-copyright{
        position: relative;
        font-size: 0.7em;
        bottom: auto;
        right: auto;
    }
    
}



/* ---------------------------------------
	max-width: 600px
--------------------------------------- */
@media screen and (max-width: 600px) {
    .break__sp{
        display: block;
}
    .break__pc{display: none;
}

    /************************************************************

          Header

    ************************************************************/

    .c-header{
        height: 80px;
    }
    .c-header .c-logo{
        margin-top: -14px;
        left: 20px;
    }
    .c-header .c-logo a{
        width: 144px;
        height: 28px;
    }
    .c-header__links{
        right: 80px;
    }
    .c-header__links ul li a{
        font-size: .8em;
        line-height: 1.4em;
        padding: 0.2em 1.5em;
    }
    .o-nav__btn{
        width: 80px;
        height: 80px;
        padding: 32px 30px;
    }
    .is-fixed .o-nav__btn{
        width: 80px;
        height: 80px;
        padding: 32px 30px;
    }
     .o-nav__btn::before{
        display: none;
    }
}
@media screen and (max-width: 600px) {


    /************************************************************

         Footer

    ************************************************************/

    .footer{
        margin: 4.8vw 0 0;
        padding-top: 9.6vw;
        padding-bottom: calc( 56px + 2.4vw );
    }
    .footer .f-logo{
        width: 144px;
        height: 28px;
    }
    .footer .f-logo a{
        width: 144px;
        height: 28px;
    }
    .f-nav ul{
        border-top: 1px solid #333;
    }
    .f-nav ul li{
        display: block;
        margin: 0;
        border-bottom: 1px solid #333;
    }
    .f-nav ul li a{
        display: block;
        padding: 2.8vw;
    }
    .footer .f-copyright{
        font-size: 0.65em;
    }

}/* max-width: 600px */


/* ---------------------------------------
	max-width: 480px
--------------------------------------- */

@media screen and (max-width: 480px) {}/* max-width: 480px */



/* ---------------------------------------
	max-width: 320px
--------------------------------------- */

@media screen and (max-width: 320px) {
    html { font-size:  13px; }

    /************************************************************

          Header

    ************************************************************/

    .o-nav__btn{
        position: absolute;
        right: 0px;
    }

    .o-nav__inner{
        padding: 4vh 9.6vw;
    }
    .o-nav__head{
        position: relative;
        width: 100%;
        font-size: 0.8em;
        color: #fff;
        z-index: 100002;
        margin-bottom: 4.8vw;
        padding-bottom: 4.8vw;
        border-bottom: 1px solid #555;
    }

    /* Internal / In page links */
    .o-nav__item.__internal{
        position: relative;
        margin: 3.6vw 0;
    }
    .o-nav__item.__internal .__head h2{
        font-size: 0.65em;
        margin-bottom: 0.5em;
    }
    .o-nav__item.__internal ul li{
        border-bottom: 1px solid #333;
    }
    .o-nav__item.__internal ul li:last-child{
        border-bottom: none;
    }
    .o-nav__item.__internal ul li a{
        display: block;
        font-size: 0.9em;
        padding: 2.0vw 0;
    }

    /* Content */
    .o-nav__item.__content{
        margin: 3.6vw 0 0;
        padding: 3.6vw 0;
    }
    .o-nav__item.__content ul li{
        display: inline-block;
        margin: 0 1.2vw;
    }
    .o-nav__item.__content ul li a{
        font-size: 0.9em;
        line-height: 2.0;
    }

}

/* max-width: 320px */