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

/***共通項目***/
body { color:#FEFEFE; }
body::before {position: fixed; width: 100%; height: 100%; top: 0; left: 0;  content: "";background: url("../img/bg.jpg") no-repeat; background-position: right 20% top 50%; background-size: cover; z-index: -1;}

@media (min-width: 769px) {
	a[href^="tel:"] { pointer-events: none; }
}

.w100 { width:100%; }

a, a:visited { color: #555; transition: 0.4s; }

img { backface-visibility: hidden;}

hr { width: 100%; height: 1px; border: none; position: relative; background: rgba(0,0,0,0.8); }
hr::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%); width: 90%; height: 1px; content: ""; display: block; background: rgba(255,255,255,0); border-radius: 0.5px; border-bottom: dashed 1px rgba(255,255,255,0.2); }
    @media(min-width:992px){
        hr { background: transparent;}
    }


/***コンテンツ***/
.wrapper { display: flex; width: 100%; margin: 0; padding: 0; font-size: 0; flex-wrap: wrap;}
.wrapper .left { width: 100%;}

.box { display: flex; align-items: center; justify-content: center;  flex-wrap: wrap; box-sizing: border-box; width: 100%; background: rgba(0,0,0,0.8); }
.box .logo {width: 100%;}
.box p { font-size: 1.0rem; font-weight: 500; line-height: 1.8rem;}

h1 { width: 100%; text-align: left; font-size: 1.5rem; font-weight: 700;  line-height: 1.9rem; }
.intro  { font-size: 1.0rem; line-height: 1.8rem; font-weight: 400; color: #FEFEFE; min-height: 1px; display: inline; position: relative;}

p.caution { font-size: 0.8rem; color: #AAA; width: 100%; line-height: 1.0rem; padding-left: 1.0rem; text-indent: -1.0rem; padding-bottom: 0.1rem;}

@media(min-width:992px){
        .wrapper .left { width: 50%;}
        .box { /*height: 100vh;*/ width: 100%; background: transparent;}
        .box .logo {width: auto; height: 100%;}
        h1 { font-size: 2.4rem; line-height: 3.0rem; }
	}

.gallery { width: 100%; }
.gallery li { display: inline-block; width: 33.333333%; padding: 0.25rem;}
.gallery li img { width: 100%;}

.btn span { padding: 0.25rem 6.0rem; text-align: center; font-size: 1.0rem; font-weight: 400; border: solid 2px #079BB3; position: relative; transition: 0.8s; margin-top: 0;}
.btn span a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px;}
.btn:hover span { background-color: #079BB3; color: #FEFEFE;}

p.price { font-size: 1.0rem; font-weight: 700; color: #FF7BAC; line-height: 2.7rem;}
p.price span { font-size: 5.0rem; font-family: 'Lato', sns-serif;}
	
    @media(min-width:992px){
        .btn span { padding: 0.25rem 8.0rem; }
		p.price { font-size: 1.6rem; line-height: 3.2rem;}
		p.price span { font-size: 5.7rem; font-family: 'Lato', sns-serif;}
	}

/***店舗情報***/
.shop { background: rgba(0,0,0,0.8);}
.shop .venue { text-align: center; font-size: 1.6rem; font-weight: 500; }
.shop .venue span { font-size: 1.0rem;}

.shop .info div[class^="col-"] { } 
.shop .info p { width: 100%; margin: 0; margin-bottom: 1.5rem; font-size: 1.2rem; padding:0.5rem 0; border-bottom: dashed 1px #FEFEFE;}
.shop .info p:last-child { margin-bottom: 0;}
.shop .info p span { font-size: 0.8rem; margin-right: 0.5rem; vertical-align: middle;}
.shop .info p span[class^="icon-"] { font-size: 1.6rem; }
.shop .info p a, .shop .info p a:visited { color: #FEFEFE;}
.shop .info p a:hover{ color:#AAAAAA; }
    @media(min-width:768px){
        .shop .info p { text-align: left; font-size: 1.0rem; vertical-align: middle; padding:0.25rem 0; }
        .shop .info p span { font-size: 0.8rem;}
        .shop .info p span[class^="icon-"] { font-size: 1.7rem; }
        .shop .info .col-s-5 img { padding-right: 1.0rem;}
    }
    @media(min-width:992px){
        .shop { background: transparent;}
    }


/***フッター***/
.footer { width: 100%; margin: 0; padding:1.0rem 0; text-align: center; font-size: 0; background: rgba(0,0,0,0.8); }
.footer span { font-size: 4.5rem;}
.footer .copy { font-size: 0.6rem; }
    @media(min-width:992px){
        .footer { background: transparent;}
    }


