@charset "utf-8";

/* ヘッダー */


header.toppage {
    position: absolute;
	width: 100vw;
    z-index: 100;
    top: 0;
}

header.toppage {
    height: 120px;
}
        @media screen and (max-width : 767px) {
            header.toppage {
                height: 100px;
            }
        }   


header.subpage {
    position:static;
    width: 100vw;
}
        
header.subpage {
    height: 120px;
}
        @media screen and (max-width : 767px) {
            header.subpage {
                height: 100px;
            }
        }  

        
        




div#logo_navi {
    width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
@media screen and (max-width : 767px) {
    div#logo_navi { 
        width: 100vw;
    }
} 


.header_logo {
    margin-top: auto;
}

        @media screen and (max-width : 767px) {
            .header_logo {
                margin-top: 10px;
                width: 50vw;
            }
            .header_logo>a>h1 {
               margin: auto;
            }
        }

.header_logo img{
    margin-top: 20px;
}


.header_right {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;

}

        @media screen and (max-width : 767px) {
            .header_right {
                width: 40vw;
                flex-direction: row-reverse;
                margin-top: 0 !important;
            }
        }



.h_center{
    margin-right: 20px;
}

        @media screen and (max-width : 767px) {
            .h_center {
                width: 25%;
                margin-top: 0;

            }
        }

.tel_lang{
    width: 460px;
    display: flex;
    justify-content: space-between;
    color: rgb(255, 255, 255);
    padding: 0;
    border-bottom: 0.5px solid white;
}

.tel_lang>ul{
    list-style: square; 
    display: flex;
    justify-content: space-between;
    margin-top: 17px;
    height: 20px;
}

.tel_lang>ul>li{
    margin-left: 30px;
    padding-left: 0;
}

.tel_lang>ul>li>a{
    color: rgb(255, 255, 255);
    font-size: 0.8em;
}


.telephone {
    font-size: 22x;
}


.telephone span{
    font-size: 28px;
}





.header_rsv {
 margin-top: 10px;
}
        @media screen and (max-width : 767px) {
            .header_rsv {
                width: 25%;
                margin-top: 0;
            }
        }

.header_rsv>a {
    font-size: 1.2em;
    color: white;
    text-decoration: none;
    letter-spacing: 0.2em;
    display: inline-block;
    width: 120px;
    height: 80px;
    line-height: 80px;
    background: linear-gradient(to top, rgba(0,0,0,0.1), rgba(255, 255, 255, 0.2) 100%), #ff5618;
    text-align: center;
    text-decoration: none;
    margin-top: 25px;
}

        @media screen and (max-width : 767px) {
            div.header_rsv>a {
                margin-top: 0;
                width: 25vw ;
                height: 100px;
                line-height: 100px;
                font-size: 1.0em;
            }
        }

.header_rsv>a>span {
    margin-right: -0.3em;
}


.header_rsv>a:hover {
opacity: 0.9;
}







/* ■■■■■■■■■■■■■■■■■■
メディアクエリー
■■■■■■■■■■■■■■■■■■ */
@media screen and (max-width : 767px) {

    /* ヘッダー */

    header {
        position: absolute;
        height: 120px;
        width: 100%;

    
    }
    
    header>div {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: space-between;
    }


    .tel_lang {
        display: none;
    }



    }


    header h1 {
        width: 80%;
    }




    .header_rsv>a {
        font-size: 1.2em;
        color: white;
        text-decoration: none;
        letter-spacing: 0.2em;
        display: inline-block;
        width: 120px;
        height: 80px;
        line-height: 80px;
        background: linear-gradient(to top, rgba(0,0,0,0.1), rgba(255, 255, 255, 0.2) 100%), #ff5618;
        text-align: center;
        text-decoration: none;
        margin-top:0;
    }
    .header_rsv>a>span {
        margin-right: -0.3em;
    }
    
    
    .header_rsv>a:hover {
    opacity: 0.9;
    }





}