:root {
    --white-color: #fff;
    --black-color: black;
    --bk-color: #8b917f;
    --bk-color2: #f6f3ef;
    --brown-color: #2F170A;
    --gold-color: #a7660f;
    --hover-color: #e6e6e6;
}

body {
    font-family: "Lora", serif;
    -webkit-font-smoothing: antialiased;
    color: var(--black-color);
}

.loading {
    background: var(--brown-color);
}

@media screen and (min-width: 769px) {

    .mainvisual-bg:before {
        content: "";
        display: block;
        /* background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 100%), url(../img/mainvisual-pc.jpg); */
        background: url(../img/mainvisual-pc.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        width: 100%;
        height: 100vh;
        top: 0;
        left: 0;
        z-index: -1;
    }

    .under-bg:before {
        /* background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 100%), url(../img/mainvisual-pc.jpg); */
        background: url(../img/mainvisual-pc.jpg);
        background-size: 1920px auto;
        background-position: center 60%;
        background-repeat: no-repeat;
    }

    .loading img {
        width: 40%;
    }

    .mainvisual {
        background: none;
    }

    .logo-area a {
        display: block;
        background: url(../img/h-logo.png);
        background-size: 160px;
        background-position: center;
        background-repeat: no-repeat;
        width: 190px;
        height: 60px;
    }

    #nav a:hover {
        color: #d6d6d6;
    }

    .header-bg {
        background: var(--brown-color);
    }

    .weekly-schedule {
        background: var(--brown-color);
    }

    .weekly-schedule ul {
        border-top: 0;
        border-bottom: 0;
    }

    .weekly-schedule li a {
        color: var(--white-color);
    }

    .weekly-schedule li a.current {
        color: var(--white-color);
    }

    .recruit-mainvisual {
        padding-top: calc(386 / 900* 69.5%);
        width: 57%;
        margin: 9rem auto 3rem;
    }

    .blog-detail-update:after {
        border-bottom: 1px solid var(--black-color);
        border-top: 1px solid var(--black-color);
    }

}

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

    .logo-area a {
        display: block;
        background: url(../img/h-logo.png);
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
        width: 120px;
        height: 40px;
        text-indent: -999999px;
    }

    .header-bg {
        background: var(--brown-color);
    }

    .under-bg:before {
        content: "";
        display:block;
        background: url("../img/mainvisual.jpg");
        background-size: cover;
        background-position: center top -300px;
        background-repeat: no-repeat;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        z-index: -1;
      }

    #nav-circle-bg {
        background: var(--brown-color);
    }

    .logo-area {
        top: 0.5rem;
    }

    .visual-logo {
        padding: 22% 0;
    }

    .pickup-container .contents-ttl {
        margin: 0;
    }

    .clamp-text3 {
        background: none;
    }

    .news-under-wrap {
        border-bottom: 1px solid var(--black-color);
    }

    .prev-btn {
        padding-bottom: 1rem;
    }

    .weekly-schedule li a.current {
        background: #CCB9AB;
    }

    .weekly-schedule li a {
        border: 1px solid var(--black-color);
    }

    .detail-tbl tr th+th,
    .detail-tbl tr td+td {
        border-top: none;
    }

    .recruit-mainvisual {
        padding-top: calc(450 / 900* 100%);
    }

    .sp-foot {
        background: #8b917fd5;
    }

    .blog-container .contents-ttl {
        margin-top: 0;
    }

    .news-inner-info {
        width: 60%;
        background: var(--white-color);
    }

    .news-under-wrap {
        border-bottom: 1px solid var(--black-color);
    }

    .news-detail-info .news-ico {
        padding: 0.18rem;
    }

    .blog-detail-wrap {
        background: var(--white-color);
    }

    .days-text {
        padding-top: 0.4rem;
    }
    
    .news-detail-info p {
        margin-left: 0.2rem;
        padding-top: 0.2rem;
    }

    .footer-logo {
        background: url(../img/f-logo.png);
        background-size: 75%;
        background-position: center;
        background-repeat: no-repeat;
        padding: 8% 0;
    }
}

main {
    background: none;
}

.under-wrap .col-wrap .news-col {
    background: var(--white-color);
}

.under-wrap {
    background: var(--bk-color);
    padding-top: 1.5rem;
}

.under-h {
    top: 0;
    background: var(--brown-color);
}

.main-style01 {
    background: var(--bk-color);
}

.main-style02 {
    background: var(--bk-color);
}

.main-style03 {
    background: var(--bk-color2);
    
}

.contents-ttl {
    background: none;
    color: var(--white-color);
}

.contents-ttl p {
    margin-top: 0.2rem;
}

.news-text-wrap li span {
    background: var(--gold-color);
}

.news-text-wrap li:first-child {
    color: var(--black-color);
}

.more-btn a {
    color: var(--black-color);
    border: 1px solid var(--black-color);
    background: var(--white-color);
}

.more-btn a:hover {
    background: var(--hover-color);
}

.todays-wrap {
    color: var(--black-color);
    background: none;
    /* background: rgba(255, 255, 255, 0.8); */
}

.staff-box {
    color: var(--brown-color);
}

.staff-box>ul li+li {
    border-top: 1px solid var(--black-color);
}

.staff-box>ul li:nth-child(3) {
    background: var(--gold-color);
    color: var(--white-color);
    border-top: 0;
}

.blog-box+.blog-box {
    border-top: 1px solid var(--black-color);
}


.blog-container .contents-ttl {
    color: var(--black-color);
}

.twitter-container .contents-ttl {
    color: var(--black-color);
}


.reserve-bnr,
.qa-bnr,
.recruit-bnr {
    background: none;
}

.reserve-bnr a,
.qa-bnr a,
.recruit-bnr a {
    background: var(--white-color);
    color: var(--gold-color);
    border: 1px solid var(--black-color);
}

.reserve-bnr a:hover,
.qa-bnr a:hover,
.recruit-bnr a:hover {
    background: var(--hover-color);
}

.reserve-bnr a p, .qa-bnr a p, .recruit-bnr a p {
    margin-top: 0.2rem;
}

.list-wrap h3:before {
    border-top: 0;
}

.list-wrap h3:after {
    border-bottom: 0;
}

.list-wrap p {
    color: var(--white-color);
}

.list-wrap h3 {
    background: var(--brown-color);
    color: var(--white-color);
}

.list-wrap h3 {
    border-top: 0;
    border-bottom: 0;
}

.list-wrap dl {
    background: var(--white-color);
}

.list-wrap dt {
    background: var(--gold-color);
}

.list-wrap dt,
.list-wrap dd {
    border: 1px solid rgb(58, 54, 31);
}

.list-wrap li {
    color: var(--white-color);
}

.list-wrap dd {
    border-left: 0;
}

.credit-bnr a {
    background: none;
    filter: none;
}

.credit-bnr span {
    color: var(--black-color);
    border: 1px solid var(--black-color);
    background: var(--white-color);
    text-shadow: none;
}

.credit-bnr span:hover {
    background: var(--hover-color);
}

.list-wrap li {
    margin: 0 auto;
}

.news-ico {
    background: var(--gold-color);
}

.news-btn a {
    color: var(--black-color);
    border: 1px solid var(--black-color);
    background: var(--white-color);
}

.news-btn a:hover {
    background: var(--hover-color);
}

.archive h3 {
    background: var(--brown-color);
}

.archive li {
    border: 1px solid var(--black-color);
    border-top: 0;
}

.archive li a {
    color: var(--black-color);
}

.news-detail-info {
    color: var(--black-color);
}

.news-detail-info:after,
.blog-detail-info:after {
    border-bottom: 1px solid var(--black-color);
    border-top: 1px solid var(--black-color);
}

.news-text-area,
.blog-text-area {
    color: var(--black-color);
}

.end-line {
    border-bottom: 1px solid var(--black-color);
    border-top: 1px solid var(--black-color);
}

.prev-btn a {
    color: var(--black-color);
    border: 1px solid var(--black-color);
    background: var(--white-color);
}

.prev-btn a:hover {
    background: var(--hover-color);
}

.filter-wrap select {
    border: 1px solid var(--black-color);
    color: var(--black-color);
    background-image: url(../img/filter-arrow.svg),
        linear-gradient(to bottom, var(--black-color) 0%, var(--black-color) 100%);
    background-size: 2.625rem 2.625rem;
    background-position: right center;
    background-repeat: no-repeat;
}

.filter-inner {
    border: 1px solid var(--black-color);
}

.filter-inner input[type="submit"] {
    background: var(--black-color);
}

.filter-inner input[type="checkbox"]:checked+.check-point:after,
.reserve input[type="checkbox"]:checked+.check-point:after {
    border-bottom: 3px solid var(--black-color);
    border-right: 3px solid var(--black-color);
}

.filter-wrap .filter-reset a {
    color: var(--white-color);
}

.tab-switch:checked+.tab-label {
    background: var(--brown-color);
    color: var(--white-color) !important;
}

.tab-label {
    background: #f1f1f1;
    color: var(--black-color);
}

.detail-tbl thead {
    color: var(--white-color);
}

.detail-tbl tr td {
    background: var(--white-color);
    color: var(--black-color);
}

.detail-wrap li {
    border-bottom: 1px dotted var(--black-color);
}

.shop-cmt {
    border-bottom: double var(--black-color);
}


.shop-cmt:after {
    border-bottom: 1px solid var(--black-color);
    border-top: 1px solid var(--black-color);
}

.blog-update {
    color: var(--black-color);
}

.blog-detail a {
    color: var(--black-color);
    border: 1px solid var(--black-color);
    background: var(--white-color);
}

.blog-detail a:hover {
    background: var(--hover-color);
}

.reserve {
    background: var(--white-color);
}

.reserve>div {
    background: none;
}

.form-caution {
    color: var(--white-color);
}

.reserve input[type="text"],
.reserve input[type="number"],
.reserve input[type="tel"],
.reserve input[type="email"],
.reserve input[type="date"],
.reserve select {
    border: 1px solid var(--black-color) !important;
}

.reserve #schedule {
    border: 1px solid var(--black-color);
    background-image: url(../img/calendar.svg),
        linear-gradient(to bottom, var(--black-color) 0%, var(--black-color) 100%) !important;
    background-size: 2.5rem 2.5rem;
    background-position: right center;
    background-repeat: no-repeat;
}

.ui-widget-header {
    background: var(--black-color) !important;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    background: var(--black-color) !important;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight {
    color: var(--white-color) !important;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
    border: 1px solid var(--black-color) !important;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    background: var(--black-color) !important;
}

.reserve input[type="radio"]+label:before {
    border: 1px solid var(--black-color) !important;
}

.reserve input[type="time"] {
    border: 1px solid var(--black-color) !important;
}

.reserve select {
    background-image: url(../img/select-arrow.svg),
        linear-gradient(to bottom, var(--black-color) 0%, var(--black-color) 100%) !important;
}

.reserve textarea {
    border: 1px solid var(--black-color) !important;
}

.reserve input[type="submit"][disabled] {
    border: 1px solid #e0e0e0;
}

.reserve input[type="submit"] {
    color: var(--white-color);
    border: 1px solid var(--gold-color);
    background: var(--gold-color);
}

.accordion>ul>li>div {
    background: var(--gold-color);
    border: 1px solid var(--gold-color);
}

.accordion li .accordion_icon span {
    background: #a38358;
}

.recruit-main {
    background: var(--bk-color);
}

.job-box dl dt {
    background: var(--gold-color);
}

.job-box dl dt+dd {
    background: var(--white-color);
}

footer {
    background: #69422e;
}

.footer-logo {
    padding: 15% 0;
}

.clamp-text2 a {
    color: var(--black-color);
}

.news-detail-info .clamp-text3 {
    color: var(--black-color);
}

a.js-modal-close {
    background: var(--white-color);
    color: var(--black-color);
    border: 1px solid var(--black-color);
}

/* 追記 */
@media screen and (min-width: 769px) {
    .btn-style {
        width: 50%;
        margin:  0 auto;
    }
}

@media screen and (max-width: 769px) {
    .btn-style {
        width: 93%;
        margin:  0 auto;
        padding-bottom: 1rem;
    }
}

.ttl-style {
    margin:  0 auto;
}

    
.todays-wrap {
    line-height: 1.6;
}