@charset "UTF-8";

.pc {
    display: block;
}

.tab {
    display: none;
}

.mob {
    display: none;
}

header {
    font-feature-settings: "palt" 1;
    height: 60px;
    margin: 0;
    padding: 0 !important;
    width: 100%;
    /* background: url(../images/bg_head.png); */
    background-color: rgba(255, 255, 255, 0.6);
    position: fixed;
    top: 0;
    z-index: 99999;
}

header .inner {
    font-size: 0;
    margin: 0 auto;
    max-width: 1080px;
    /* padding: 5px 0 35px 0; */
    width: 100%;
    height: 60px;
    position: relative;
}

header .inner .header_flex {
    display: flex;
    width: 100%;
    margin: 0 auto;
    justify-content: space-between;
}

header .inner .inner-left {
    width: 50px !important;
    margin: 5px;
    padding: 0;
    height: 50px;
}

/*header .inner .inner-left h1{background: url(../images/header_logo.png) no-repeat 0 0; width: 220px; height: 50px;margin: 0;overflow: hidden;padding: 0;text-indent: 100%;vertical-align: top;white-space: nowrap; display: inline-block;}*/
header .inner .inner-left h1 a {
    display: block;
    width: 220px;
    height: 60px;
    margin: 0;
    padding: 0;
}

header .inner .inner-right {
    line-height: 50px;
    color: #fff;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: end;
    align-items: center;
}

/* header .inner .inner-right p.header_catch {
    max-width: 60%;
    height: 50px;
    line-height: 50px;
    color: #fff;
    margin: 0;
    padding: 0;
    vertical-align: top;
    display: inline-block;
    font-size: 18px;
    float: left;
    font-weight: bold;
} */

header .inner .inner-right p.header_tel {
    font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    font-size: 34px;
    height: 50px;
    color: #b70000;
    margin: 0 10px;
    font-weight: bold;
    line-height: 47px;
}

header .inner p.line_recruit {
    width: 140px;
    height: 50px;
    margin: 0 10px;
    padding: 0;
    text-align: center;
    line-height: 50px;
    /* right: 100px; */
    /* position: absolute; */
    /* z-index: 100; */
    /* top: 10px; */
    background-color: #06C755;
    border-radius: 60px;
}

header .inner p.line_recruit a {
    color: #fff;
    font-size: 18px;
}

header .inner p.line_reserve {
    width: 50px;
    height: 50px;
    margin: 0 auto;
    padding: 0;
    /* right: 0;
    position: absolute;
    z-index: 100;
    top: 10px; */
}

.nav_display {
    display: none;
}

nav.sticky {
    background: #fff;
    height: 54px;
    margin: 0;
    padding: 0;
    position: sticky;
    position: -webkit-sticky;
    top: 60px;
    width: 100%;
    z-index: 99;
}

.gnav {
    display: flex;
    height: 60px;
    margin: 0 auto;
    max-width: 1120px;
}

.gnav>li {
    width: 140px;
    height: 54px;
}

.gnav li {
    list-style: none;
    font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    position: relative;
}

.gnav li a {
    color: #fff;
    display: block;
    font-size: 17px;
    /* height: 54px; */
    line-height: 1.2;
    margin: 0;
    padding: 0;
    text-align: center;
    text-decoration: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.gnav li a span {
    font-size: 14px;
}

.gnav li:hover {
    background: #eeede5;
}

.gnav li a:hover {
    color: red !important;
}

.gnav li.current {
    background: #eeede5;
}

.gnav li.current a {
    color: red !important;
}

.gnav li.current a:hover {
    background: #eeede5;
}

.gnav li.recruit {
    border-right: none;
}

.gnav li.recruit a {
    border-right: none;
    color: #f11819;
    display: block;
    font-size: 17px;
    height: 54px;
    line-height: 54px;
    margin: 0;
    padding: 0;
    text-align: center;
    text-decoration: none;
}

.gnav li.recruit a:hover {
    background: #eeede5;
}

@media only screen and (max-width: 1200px) {
    header .inner {
        font-size: 0;
        margin: 0 auto;
        max-width: 95%;
        /*! padding: 5px 0 35px 0; */
        width: 100%;
        height: 60px;
        position: relative;
    }

}

@media screen and (min-width:768px) and (max-width:999px) {
    .pc {
        display: none;
    }

    .tab {
        display: block;
    }

    .mob {
        display: none;
    }

    nav.sticky {
        display: none;
    }

    header {
        height: 80px;
        margin: 0;
        padding: 0;
        position: fixed;
        width: 100%;
        z-index: 9999;
    }

    header .inner {
        height: 60px;
        margin: 0 auto;
        padding: 0;
        position: relative;
        width: 95%;
    }

    header .inner .inner-left {
        width: 40px !important;
        margin: 10px 15px 0 0;
        padding: 0;
        height: 50px;
        display: inline-block;
    }

    header .inner .inner-left img {
        text-align: left !important;
    }

    header .inner .inner-left h1 {
        background: url(../images/header_logo.png) no-repeat left center;
        width: 60px;
        height: 60px;
        margin: 0;
        overflow: hidden;
        padding: 0;
        text-indent: 100%;
        vertical-align: top;
        white-space: nowrap;
        display: inline-block;
    }

    header .inner .inner-left h1 a {
        display: block;
        width: 60px;
        height: 60px;
        margin: 0;
        padding: 0;
    }

    header .inner .inner-right {
        width: 514px;
        height: 34px;
        margin: 10px 15px 10px 0;
        padding: 0;
        vertical-align: top;
        display: inline-block;
        text-align: left;
    }

    header .inner .inner-right p.header_catch {
        height: 20px;
        line-height: 20px;
        color: #fff;
        font-size: 16px;
        /*! display: block; */
        /*! float: none; */
        text-align: left;
        padding-top: 7px;
    }

    header .inner .inner-right p.header_tel {
        width: 45%;
        font-size: 27px;
        line-height: 32px;
        color: #b70000;
        margin: 0;
        padding: 0;
        text-align: center;
        vertical-align: top;
        display: block;
        float: none !important;
    }

    header .inner p.line_recruit {
        width: 140px;
        height: 30px;
        margin: 0 auto;
        padding: 0;
        top: 5px;
        right: 150px;
        position: absolute;
        z-index: 100;
        top: 14px;
    }

    header .inner p.line_recruit img {
        width: 140px;
        height: 60px;
        margin: 0;
        padding: 0;
    }

    header .inner p.line_reserve {
        width: 60px;
        height: 60px;
        margin: 0 auto;
        padding: 0;
        top: 5px;
        right: 75px;
        position: absolute;
        z-index: 100;
        top: 10px;
    }

    header .inner p.line_reserve img {
        width: 60px;
        height: 60px;
        margin: 0;
        padding: 0;
    }

    button {
        border: none;
        background: none;
        outline: none;
    }

    .nav_display {
        display: block;
    }

    .menu,
    .menu span {
        display: inline-block;
        -webkit-transition: all .4s;
        transition: all .4s;
        box-sizing: border-box;
    }

    .menu {
        position: fixed;
        top: 30px;
        right: 25px;
        width: 35px;
        height: 22px;
        z-index: 999;
        margin: 0;
        padding: 0;
    }

    .menu span {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: #c90146;
        z-index: 999;
    }

    .menu span:nth-of-type(1) {
        top: 0px;
        background: #bb0000;
    }

    .menu span:nth-of-type(2) {
        top: 10px;
        background: #bb0000;
    }

    .menu span:nth-of-type(3) {
        bottom: 0px;
        background: #bb0000;
    }

    .menu.active span:nth-of-type(1) {
        -webkit-transform: translateY(10px) rotate(45deg);
        transform: translateY(10px) rotate(45deg);
    }

    .menu.active span:nth-of-type(2) {
        opacity: 0;
    }

    .menu.active span:nth-of-type(3) {
        -webkit-transform: translateY(-10px) rotate(-45deg);
        transform: translateY(-10px) rotate(-45deg);
    }

    #navigation {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 999;
        width: 100%;
        height: 100vh;
        opacity: 0;
        background-color: #111;
        transition: all 0.3s ease-in-out;
        visibility: hidden;
    }

    #navigation.active {
        right: 0;
        opacity: 0.9;
        -moz-transform: translateX(0);
        -webkit-transform: translateX(0);
        transform: translateX(0);
        visibility: visible;
    }

    #navigation ul {
        margin: 50px 0;
        padding: 20px 0;
        z-index: 999;
    }

    #navigation ul li {
        list-style-type: none;
        z-index: 999;
        font-size: 16px;
    }

    #navigation ul li a {
        display: block;
        padding: 10px 0;
        transition: all 0.2s ease-in-out;
        text-align: center;
        text-decoration: none;
        color: #fff;
        z-index: 9999;
    }

    #navigation ul li a:hover {
        display: block;
        background: rgba(240, 25, 25, 0.8);
        padding: 10px 0;
        transition: all 0.2s ease-in-out;
        text-align: center;
        text-decoration: none;
        color: #fff;
        z-index: 9999;
    }
}

@media screen and (max-width:767px) {
    .pc {
        display: none;
    }

    .tab {
        display: none;
    }

    .mob {
        display: block;
    }

    nav.sticky {
        display: none;
    }

    header {
        height: 60px;
        margin: 0;
        padding: 0;
        position: fixed;
        width: 100%;
        z-index: 9999;
    }

    header .inner {
        width: 95%;
        height: 40px;
        margin: 11px auto 10px auto;
        padding: 0;
        position: relative;
        text-align: left;
    }

    header .inner .inner-left {
        width: 40px !important;
        margin: 0 15px 0 0;
        padding: 0;
        height: 40px;
        /*! display: inline-block; */
    }

    header .inner h1 {
        /*! background: url(../images/header_logo.png) no-repeat 0 0; */
        /*! background-size: contain!important; */
        /*! display: inline-block; */
        /*! height: 40px!important; */
        margin: 0;
        /*! overflow: hidden; */
        /*! padding: 0; */
        /*! text-indent: 100%; */
        /*! vertical-align: top; */
        /*! white-space: nowrap; */
        width: 251px !important;
        font-size: 10px !important;
    }

    header .inner h1 a {
        display: block;
        height: 40px;
        margin: 0;
        padding: 0;
        width: 176px;
    }

    header .inner .inner-right {
        display: none;
    }

    header .inner .inner-right p.header_catch {
        height: 20px;
        line-height: 20px;
        color: #fff;
        font-size: 16px;
        display: block;
    }

    header .inner .inner-right p.header_tel {
        width: auto;
        font-size: 24px;
        line-height: 32px;
        color: #b70000;
        margin: 0;
        padding: 0;
        text-align: left;
        vertical-align: top;
        display: block;
        float: none !important;
    }

    header .inner p.line_recruit {
        display: none;
    }

    header .inner p.line_reserve {
        display: none;
    }

    button {
        border: none;
        background: none;
        outline: none;
    }

    .nav_display {
        display: block;
    }

    .menu,
    .menu span {
        display: inline-block;
        -webkit-transition: all .4s;
        transition: all .4s;
        box-sizing: border-box;
    }

    .menu {
        position: fixed;
        top: 20px;
        right: 20px;
        width: 30px;
        height: 22px;
        z-index: 999;
        margin: 0;
        padding: 0;
    }

    .menu span {
        position: absolute;
        left: 0;
        width: 100%;
        height: 3px;
        background-color: #c90146;
        z-index: 999;
    }

    .menu span:nth-of-type(1) {
        top: 0px;
        background: #c7001c
    }

    .menu span:nth-of-type(2) {
        top: 10px;
        background: #c7001c;
    }

    .menu span:nth-of-type(3) {
        bottom: 0px;
        background: #c7001c;
    }

    .menu.active span:nth-of-type(1) {
        -webkit-transform: translateY(10px) rotate(45deg);
        transform: translateY(10px) rotate(45deg);
    }

    .menu.active span:nth-of-type(2) {
        opacity: 0;
    }

    .menu.active span:nth-of-type(3) {
        -webkit-transform: translateY(-10px) rotate(-45deg);
        transform: translateY(-10px) rotate(-45deg);
    }

    #navigation {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 999;
        width: 100%;
        height: 100vh;
        opacity: 0;
        background-color: #800;
        transition: all 0.3s ease-in-out;
        visibility: hidden;
    }

    #navigation.active {
        right: 0;
        opacity: 0.9;
        -moz-transform: translateX(0);
        -webkit-transform: translateX(0);
        transform: translateX(0);
        visibility: visible;
    }

    #navigation ul {
        margin: 50px 0;
        padding: 20px 0;
        z-index: 999;
    }

    #navigation ul li {
        list-style-type: none;
        z-index: 999;
        font-size: 24px;
        height: 70px;
    }

    #navigation ul li a {
        display: block;
        padding: 10px 0;
        transition: all 0.2s ease-in-out;
        text-align: center;
        text-decoration: none;
        color: #fff;
        z-index: 9999;
        line-height: 0.8;
    }

    #navigation ul li a small {
        font-size: 14px;
    }

    #navigation ul li a:hover {
        display: block;
        background: rgba(240, 25, 25, 0.8);
        padding: 10px 0;
        transition: all 0.2s ease-in-out;
        text-align: center;
        text-decoration: none;
        color: #fff;
        z-index: 9999;
    }

    header .inner ul.sns {
        display: inline-block;
        font-size: 0;
        margin: 14px 0 14px 0;
        padding: 0;
        vertical-align: top;
    }

    header .inner ul.sns li {
        display: inline-block;
        height: 32px;
        list-style-type: none;
        margin: 0 1px 0 1px;
        padding: 0;
        vertical-align: top;
        width: 32px;
    }

    header .inner ul.sns li img {
        height: 32px;
        margin: 0;
        padding: 0;
        width: 32px;
    }

    header .inner .reservation {
        height: 40px;
        margin: 0;
        padding: 0;
        position: absolute;
        width: 40px;
    }

    header .inner2 {
        height: 30px;
        margin: 0;
        padding: 0;
        width: 100%;
    }

    header .inner2 ul {
        font-size: 0;
        margin: 0;
        padding: 0;
    }

    header .inner2 ul li {
        background: url("../images/bg_main.jpg") repeat;
        border: 1px solid #9b8978;
        box-sizing: border-box;
        color: #ff6a9d;
        display: inline-block;
        font-size: 16px;
        font-weight: bold;
        line-height: 30px;
        list-style-type: none;
        margin: 0;
        padding: 0;
        text-align: center;
        vertical-align: top;
        width: 33.3%;
    }

    header .inner2 ul li a {
        color: #ff6a9d;
        display: block;
        margin: 0;
        padding: 0;
        text-decoration: none;
    }

    header .inner2 ul li a:hover {
        background: #ff6a9d;
        color: #fff;
        display: block;
        margin: 0;
        padding: 0;
        text-decoration: none;
    }

    header .inner2 ul li.current {
        background: #ff6a9d url("../images/bg_main.jpg") repeat;
        border: 1px solid #9b8978;
        box-sizing: border-box;
        color: #ff6a9d;
        display: inline-block;
        font-size: 16px;
        font-weight: bold;
        line-height: 30px;
        list-style-type: none;
        margin: 0;
        padding: 0;
        text-align: center;
        vertical-align: top;
        width: 33.3%;
    }

    header .inner2 ul li.current a {
        background: #ff6a9d;
        color: #fff;
        display: block;
        margin: 0;
        padding: 0;
        text-decoration: none;
    }

    header .inner2 ul li.current a:hover {
        background: #82caff;
        color: #fff;
        display: block;
        margin: 0;
        padding: 0;
        text-decoration: none;
    }
}