@charset "utf-8";
/* CSS Document */

body {
    overflow: visible;
}

#container {
    overflow: visible;
}

#contents {
    padding-top: 100px;
}

.post-type-archive-premiumcard .main,
main {
    display: block;
    overflow: visible;
}

.mincyo {
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-style: normal;
}

.visual-wrapper {
    position: relative;
    width: 100%;
}

.visual-title {
    padding: 1em 0 1em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 950px;
    background: rgba(0, 0, 0, .7);
    color: #fff;
    text-align: center;
    z-index: 1;
    font-size: 3.2rem;
    letter-spacing: .1em;
    line-height: 1.4;
}

.visual-title img {
    margin: 0 auto;
}

.slider-wrapper {
    position: relative;
    z-index: 0;
}

.slick-slide {}

.slider-items img {
    max-width: 100%;
    height: auto;
}

.slider-items.slider3,
.slider-items.slider4 {
    display: none;
}

.btn-coupon {
    margin: 5em auto;
    text-align: center;
}

.btn-coupon a {
    padding: .5em 0;
    display: inline-block;
    color: #fff;
    background: #A31C1C;
    font-size: 2.4rem;
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-style: normal;
    line-height: 1;
    width: 500px;
}

.btn-coupon a img {
    margin-right: 1em;
    width: 40px;
    height: auto;
    display: inline-block;
    vertical-align: middle;
}

.shop_cat {
    margin-bottom: 5rem;
    display: flex;
    justify-content: center;
}

.shop_cat li {
    margin: .5rem;
    width: 9.5rem;

}

@media screen and (max-width:640px) {
    .shop_cat li {
        margin: 1%;
        width: 18%;

    }
}

.shop_cat a {
    padding: 1rem .5rem .5rem;
    background: #fff;
    display: flex;
    flex-direction: column;
    font-size: 1.4rem;
    text-align: center;
    justify-content: center;
    height: 100%;
    line-height: 1.2;
    letter-spacing: 0;
}

.shop_cat .act {
    background: rgba(144, 131, 112, .1);
}

@media screen and (max-width:640px) {
    .shop_cat a {
        font-size: 1.2rem;
    }
}

.shop_cat a span {
    display: flex;
    min-height: 3em;
    align-items: center;
    justify-content: center;
}

.shop_cat a img {
    margin: 0 auto .5rem;
    max-width: 3.5rem;
    max-height: 3.5rem;
}

.ShopWrapper {
    padding: 6em 0;
    background: #EDEDED;
    width: 100%;
}

.ShopWrapper .inner {
    margin: 0 auto;
    padding: 0 30px;
    width: 100%;
    max-width: 1520px;
}

.choise-coupon {
    margin-bottom: 2em;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4rem;
    color: #A31C1C;
}

.choise-coupon img {
    margin: 0 .5em;
}

.ShopTitle {
    text-align: center;
}

.ShopTitle h2 {
    margin: 0 auto 2em;
    padding-bottom: .25em;
    color: #766C57;
    border-bottom: solid 1px rgba(0, 0, 0, .25);
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-style: normal;
    display: inline-block;
}

.ShopList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.ShopList img {
    max-width: 100%;
    height: auto;
}

.ShopItem {
    margin-bottom: 30px;
    width: 49%;
    background: #fff;
}

.ShopItem:hover {
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, .2);
    background: #F9F8F5;
}

.ShopItem figure {}

.ShopBody {
    margin: 2em;
    position: relative;
}

.ShopBody h3 {
    margin: 0 0 1.5em;
    padding: 0 100px 0 40px;
    padding-bottom: .5em;
    border-bottom: solid 1px rgba(0, 0, 0, .25);
    font-size: 2.4rem;
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-style: normal;
    position: relative;
}

.ShopBody h3 img {
    display: inline-block;
    height: 36px;
    position: absolute;
    top: .15em;
    left: 0;
}

.ShopInfo {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ShopData {
    width: 55%;
}

.ShopBenefits {
    width: 40%;
}

.ShopBenefits .btn-coupon {
    margin: 0 0 1em;
}

.ShopData dl {
    display: flex;
    gap: 2px 0;
    flex-wrap: wrap;
    align-items: flex-start;
}

.ShopData dt,
.ShopData dd {
    padding: .25em .5em;
    font-size: 1.4rem;
}

.ShopData dt {
    width: 6em;
    background: rgba(144, 131, 112, .1);
}

.ShopData dd {
    width: calc(100% - 6em);
}

.ShopService {
    padding: .75em .5em;
    color: #fff;
    background: #8C7A46;
    font-size: 1.8rem;
    text-align: center;
    line-height: 1.2;
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-style: normal;
    letter-spacing: .1em;
}


.ShopBody>.ShopService {
    margin-bottom: 1em;
    font-size: 2.4rem;
}

.ShopBody .btn-coupon {}

.ShopBody .btn-coupon a {
    padding: .75em 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    font-size: 2.2rem;
}

.ShopBody .btn-coupon a img {
    width: 3.4rem;
}

.ShopLink {
    position: absolute;
    top: .25em;
    right: 0;
    display: flex;
    gap: 2px 0;
}

.ShopLink .tel {
    display: none;
}

.ShopLink a {
    padding: .2em 1em;
    color: #fff;
    background: #000;
    font-size: 1.6rem;
    display: flex;
    align-items: center;
    position: relative;
}

.ShopLink .map a:before {
    margin-right: .5em;
    content: '';
    display: inline-block;
    background: url(../img/premiumcard/icon_map.svg) no-repeat center center;
    background-size: 100% auto;
    width: 1.4rem;
    height: 1.9rem;

}

.ShopLink a:hover {
    background: #8C7A46;
}

.ShopPartner {
    text-align: center;
    font-size: 2rem;
    line-height: 1.5;
}

.ShopPartner h2 {
    margin: 0 0 1em;
    color: #A31C1C;
    font-size: 4rem;
    letter-spacing: .1em;
}

.LINETouroku {
    padding: 5em;
    text-align: center;
}


.LINETouroku img {
    margin: 0 auto;
}

.LINETouroku h3 {
    margin: 0 0 1.5em;
    font-size: 2.4rem;
    color: #807C5D;
    letter-spacing: .1em;
}

.sticky {
    display: none;
}


/*全て共通：hideエリアをはじめは非表示*/
.hide-area {
    display: none;
}

/*全て共通：モーダルのボタンの色を変更したい場合*/
.modaal-close:after,
.modaal-close:before {
    background: #ccc;
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before {
    background: #666;
}

/*確認を促すモーダル：タイトルの色を変更したい場合*/
#modaal-title {
    font-size: 1.2rem;
    text-align: center;
    margin: 0 0 20px 0;
}

/*動画表示のモーダル：余白を変更したい場合*/
.modaal-video .modaal-inner-wrapper {
    padding: 0;
}

/*以下はコンテンツ内のレイアウト*/
.info-list dl,
.gallery-list {
    display: flex;
}

.info-list dt {
    margin: 0 10px 0 0;
}

.gallery-list li {
    margin: 0 10px 0 0;
}

.ShopList::after {

    display: block;
    content: "";
    width: 32%;

}

@media screen and (max-width:640px) {
    .main {
        overflow: visible;
    }

    #contents {
        padding-top: 44px;
    }

    .visual-title {
        padding: 1em 0 1em;
        width: 100%;
        font-size: 4.8vw;
        letter-spacing: .1em;
        line-height: 1.4;
    }

    .visual-title img {
        width: 80%;
        height: auto;
    }

    .slider-wrapper {
        position: relative;
        z-index: 0;
    }

    .slider-items img {
        width: 100%;
        height: auto;
    }

    .slider-items.slider3,
    .slider-items.slider4 {
        display: block;
    }

    .btn-coupon {
        margin: 5em auto;
        text-align: center;
    }

    .btn-coupon a {
        padding: 3vw 0;
        display: inline-block;
        color: #fff;
        background: #A31C1C;
        font-size: 5vw;
        font-family: 'Noto Serif JP', serif;
        font-weight: 500;
        font-style: normal;
        line-height: 1;
        width: 100%;
    }

    .btn-coupon a img {
        margin-top: -1vw;
        margin-right: 1em;
        width: 7vw;
        height: auto;
        display: inline-block;
        vertical-align: middle;
    }

    .ShopWrapper {
        padding: 16vw 0 8vw;
        background: #EDEDED;
    }

    .ShopWrapper .inner {
        margin: 0 auto;
        padding: 0 4vw;
        width: 100%;
        max-width: 100%;
        min-width: 100%;
    }

    .choise-coupon {
        font-size: 2rem;
    }

    .choise-coupon img {
        height: 1.25em;
    }


    .ShopTitle {
        text-align: center;
    }

    .ShopTitle h2 {
        margin-bottom: 1.5em;
        font-size: 6vw;
    }

    .ShopList {
        display: block;
    }

    .ShopList img {
        max-width: 100%;
        height: auto;
    }

    .ShopItem {
        margin-bottom: 5vw;
        width: 100%;
        background: #fff;
        box-shadow: 0 8px 12px 0 rgba(0, 0, 0, .1);
    }

    .ShopItem:hover {
        box-shadow: 0 8px 12px 0 rgba(0, 0, 0, .2);
        background: #F9F8F5;
    }

    .ShopItem figure {}

    .ShopBody {
        margin: 0;
        padding: 5vw;
        position: relative;
    }

    .ShopBody h3 {
        margin: 0 0 1em;
        padding-left: 8vw;
        padding-right: 0;
        font-size: 5vw;
    }

    .ShopBody h3 img {
        margin-right: .5em;
        display: inline-block;
        height: 6vw;
    }

    .ShopInfo {
        display: block;
        align-items: center;
    }

    .ShopData {
        margin-bottom: 5vw;
    }

    .ShopData,
    .ShopBenefits {
        width: 100%;
    }

    .ShopService {
        padding: .75em .5em;
        color: #fff;
        background: #8C7A46;
        font-size: 4vw;
        text-align: center;
        line-height: 1.2;
    }

    .ShopBody>.ShopService {
        font-size: 4vw;
    }

    .ShopLink {
        margin-top: 2.5vw;
        position: static;
        justify-content: space-between;
    }

    .ShopLink li {
        width: 49%;
    }

    .ShopLink .tel {
        display: block;
    }

    .ShopLink a {
        padding: .5em 0;
        color: #fff;
        background: #000;
        font-size: 1.6rem;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        text-align: center;
    }

    .ShopLink .map a:before {
        margin-right: 1em;
        background-size: auto 100%;
        width: 4vw;
        height: 5vw;
    }

    .ShopLink .tel a:before {
        margin-right: 1em;
        content: '';
        display: inline-block;
        background: url(../img/premiumcard/icon_tel.svg) no-repeat center center;
        background-size: auto 100%;
        width: 3vw;
        height: 5vw;
    }

    .ShopLink a:hover {
        background: #8C7A46;
    }

    .ShopPartner {
        text-align: center;
        font-size: 4vw;
        line-height: 1.5;
    }

    .ShopPartner h2 {
        margin: 1.5em 0 1em;
        color: #A31C1C;
        font-size: 5.6vw;
        letter-spacing: 0;
    }

    .LINETouroku {
        padding: 8vw 3vw;
        text-align: center;
    }

    .LINETouroku h3 {
        margin: 0 0 1.5em;
        font-size: 5vw;
        color: #807C5D;
        letter-spacing: .1em;
    }

    .LINETouroku img {
        width: 100%;
    }

    .sticky {
        display: block;
        position: -webkit-sticky;
        position: sticky;
        bottom: 0;
        left: 0;
        background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
        z-index: 10;
        width: 100%;

    }

    .sticky .btn-coupon {
        margin: 0;
        padding: 4vw;
    }

    .sticky .btn-coupon a {
        display: block;
    }

}

.coupon-body {
    background: #E6E6E6;
}

.coupon-wrapper {
    width: 100%;
    background: #E6E6E6;
    text-align: center;
    letter-spacing: .1em;
}

.coupon-inner {
    padding: 0 5vw 5vw;
}

.coupon-shop {
    margin-bottom: 1em;
    text-align: center;
    font-weight: normal;
    font-size: 4.2vw;
}

.coupon-use {
    margin: 1.5em 0;
    padding: 5vw 5vw 3vw;
    background: #fff;
    font-size: 3.2vw;
    letter-spacing: .1em;
}

.coupon-detail {
    margin: .75em 0;
    color: #A31C1C;
    font-size: 4.8vw;
}

.coupon-use .btn-coupon {
    margin: 0 auto;
    text-align: center;
}

.coupon-use .btn-coupon button {
    border: solid 2px #A31C1C;
    padding: 4vw 0 4vw 4vw;
    font-size: 4vw;
    font-weight: 500;
    font-style: normal;
    line-height: 1;
    width: 100%;
}

.coupon-use .btn-coupon .use {
    color: #fff;
    background: #A31C1C url(../img/premiumcard/icon_coopon.png) no-repeat 15% center;
    background-size: auto 60%;
}

.coupon-use .btn-coupon .complete {
    color: #A31C1C;
    background: #fff url(../img/premiumcard/icon_use.png) no-repeat 15% center;
    background-size: auto 60%;
    display: none;
}

.coupon-use .notes {
    font-size: 2.8vw;
}

.btm-notes {
    font-size: 2.2vw;
    text-align: left;
}