/*common*/
body{
  /* font-family: Avenir, "Helvetica Neue" , Helvetica , Arial , Verdana , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif ; */
  font-family: Avenir, "Helvetica Neue" , Helvetica , Arial , Verdana , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic", "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif ;
  color: #ffffff ;
  font-size: 14px ;
  background-color: #000 ;
  /* background-color: #231815 ; */
  margin: 0 ;
}

a{
  display: block;
  color: #888 ;
}

a[href^="tel:"]{
  cursor: default ;
  color:#fff;
  text-decoration:none;
}

a[href^="tel:"]:hover,
a[href^="tel:"]:focus{
  cursor: default ;
  color:#fff;
  text-decoration:none;
}

img{
  display: block;
  margin:auto;
  max-width: 100%;
  height: auto ;
}

.section{
  margin: 0 ;
  padding: 60px 0 ;
}

[class*="article-"]{
  text-align: center;
  margin:0;
  padding:54px 0 0 0;
}

[class*="article-"] h2{
  margin: 0 auto 50px auto;
  padding:0;
}

[class*="article-"] h2 img,
[class*="article-"] h3 img,
[class*="article-"] h4 img {
  display:inline-block;
}

[class*="article-"] h3{
  margin: 0 auto 20px auto;
  padding: 0;
}

[class*="article-"] h4{
  margin: 0 auto 96px auto;
  padding: 0;
}

[class*="article-"] .box-text,
.modal-flavor .box-text{
  padding-bottom:calc(68px - 1.0rem);
}

[class*="article-"] .box-text p,
.modal-flavor .box-text p{
  font-size:1.1rem;
  line-height:2.2rem;
  margin-bottom:1rem;
}

.container{
  max-width:1280px;
  position:relative;
}

.divider-bricks{
  height: 48px ;
  margin: 0 ;
  padding: 0 ;
  background-image: url("../images/bg_bricks.jpg");
  background-size: auto 100% ;
  background-repeat: repeat-x ;
}

.divider-chain{
  height: 14px ;
  margin: 0 ;
  padding: 0 ;
  background-image: url("../images/divider.png");
  background-size: auto 100% ;
  background-repeat: repeat-x ;
}

article + .divider-chain{
  margin-top:-7px;
  margin-bottom:-7px;
  position:relative;
  z-index:2000;
}
.row.no-gutter{
  margin-left:0;
  margin-right:0;
}

.row.no-gutter [class*="col-"]{
  padding-left:0;
  padding-right:0;
}

/* Header */
header{
  margin: 0 ;
}

header h1{
  margin: 0 ;
  font-size: .8rem ;
  font-weight:100;
  color: #ffffff ;
  font-size: 1.0rem ;
}

.site-description {
  padding-top: 6px ;
  padding-bottom: 4px ;
  border-bottom: solid 1px #0088d2 ;
}

/* Nav Global */
.nav-global {
  display:-webkit-flex;
  display:-moz-flex;
  display:-ms-flex;
  display:flex;
  justify-content: space-around ;
  margin:30px 0 0 0;
  padding: 0;
  text-align:center;
  transition:.6s;
}

.nav-global li {
  margin: 0;
  padding: 0;
  width: 100%;
  list-style: none ;
}

.nav-global li a{
  display: inline-block;
  padding: 10px 0;
}

.nav-global li a img{
  margin: auto;
}

.nav-global-fixed{
  background-color:#000;
  position:fixed;
  width:100%;
  top:-100px;
  left:0;
  transition:.6s;
  z-index: 5000;
  margin: 0;
  padding: 10px 0;
}

.nav-global-fixed.slide-in{
  position:fixed;
  width:100%;
  top:0px;
  left:0;
  transition:.6s;
}

#following {
  position: fixed ;
  top: 60px ;
  right: 0 ;
  z-index:4000;
}

#following ul {
  display: flex ;
  flex-direction: column ;
  margin: 0;
  padding: 0;
}

#following li {
  list-style: none ;
}

#following li + li{
  margin-top:6px;
}

#following ul li a {
  display: block;
  background-color: #1E2C5C ;
  padding: 8px 20px;
  /* padding: 13px 26px ; */
}

/*Main Visual*/
.hero {
  /* background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main.jpg") ; */
  background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main_01.jpg") ;
  animation:main_transition 15s linear 0s infinite;
  background-repeat: no-repeat,no-repeat;
  background-position: center bottom, center bottom;
  background-size: 100%,cover ;
  height: 860px ;
  transition:.3s;
}

@keyframes main_transition {
  0%{
    background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main_01.jpg"),url("../images/main/bg_main_02.jpg"),url("../images/main/bg_main_03.jpg") ;
    transition:.3s;
  }
  31%{
    background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main_01.jpg"),url("../images/main/bg_main_02.jpg"),url("../images/main/bg_main_03.jpg") ;
    transition:.3s;
  }
  33%{
    background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main_02.jpg"),url("../images/main/bg_main_03.jpg"),url("../images/main/bg_main_01.jpg") ;
    transition:.3s;
  }
  64%{
    background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main_02.jpg"),url("../images/main/bg_main_03.jpg"),url("../images/main/bg_main_01.jpg") ;
    transition:.3s;
  }
  66%{
    background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main_03.jpg"),url("../images/main/bg_main_01.jpg"),url("../images/main/bg_main_02.jpg") ;
    transition:.3s;
  }
  98%{
    background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main_03.jpg"),url("../images/main/bg_main_01.jpg"),url("../images/main/bg_main_02.jpg") ;
    transition:.3s;
  }
  100%{
    background-image: url("../images/bg_bricks.jpg"),url("../images/main/bg_main_01.jpg"),url("../images/main/bg_main_02.jpg"),url("../images/main/bg_main_03.jpg") ;
    transition:.3s;
  }
}

.hero .container{
  height:100%;
}

.hero .container > div{
  display: flex ;
  height: 100%;
  width: 100% ;
  flex-direction: column;
  justify-content: center ;
  align-items: center ;
  align-content: center ;
  position: relative;
}

.scroll-down{
  position:absolute;
  bottom:90px;
  left:calc(50% - 120px);
  cursor: pointer;
}

.shisha {
  position: absolute;
  right: 0;
  bottom: 0px ;
}

/* Concept Resort */
.article-concept .box-resort{
  margin:0;
  padding:38px 0 0 0;
}

.article-concept .box-resort h3{
  margin-bottom:36px;
}

/* System */
.article-system .content-system{
  padding-bottom:40px;
}

.article-system .content-system img{
  margin:auto;
}

/* Menu */
.article-menu{
  padding-top:74px;
}

.article-menu h2{
  margin-bottom:80px;
}

.article-menu h3{
  margin-bottom:40px;
}

.article-menu h4{
  margin-bottom:40px;
}

.article-menu [class*="area-"]{
  padding:70px 0 0 0;
  margin:0;
}

.article-menu .area-drink{
  background-color: #2C1323 ;
}

.article-menu .area-food{
}

.article-menu .btn-food,
.article-menu .btn-party{
  margin:0;
  text-align:right;
}

.article-menu .btn-food{
  padding:56px 0 68px 0;
}

.article-menu .btn-party{
  padding:42px 0 54px 0;
}

.article-menu .btn-food a,
.article-menu .btn-party a{
  display:inline-block;
}

.article-menu .area-party{
  background-color: #002702 ;
}

.article-menu .area-party .row [class*="col-"]{
  padding-left:30px;
  padding-right:30px;
}

[class*="bg-icon-"]{
  position:absolute;
}

.bg-icon-menu-01{
  top:10px;
  right:214px;
}

.bg-icon-menu-02{
  top:54px;
  right:112px;
}

.bg-icon-menu-03{
  top:32px;
  right:192px;
}

.bg-icon-menu-04{
  top:-38px;
  right:158px;
}

.bg-icon-menu-05{
  top:204px;
  right:98px;
}

.bg-icon-menu-06{
  bottom:18px;
  left:54px;
}

/* Flavor */
.article-flavor {
  padding: 80px 0 54px 0;
  background-color: #111B39 ;
  background-image: url("../images/flavor/flavor_bg.png");
  background-repeat:no-repeat;
  background-position:center 70px;
}
.content-flavor{
  margin:0;
  padding:0;
}
.content-flavor-shisha{
  position:absolute;
  top:72px;
  left:0px;
}
.content-flavor-shisha img{
  height:700px;
}
.box-flavor{
  background-image:url("../images/flavor/flavor_divider.png");
  background-size:1144px 178px;
  background-repeat:no-repeat;
  background-position:center center;
}
.box-flavor > div{
  display:flex;
  justify-content:center;
}
.box-flavor > div > div{
  margin:18px 28px;
  padding:0;
  width:262px;
  height:42px;
  cursor:pointer;
}

/* Gallery */
.article-gallery{
  padding:112px 0 80px 0;
}

.article-gallery h3{
  margin-bottom:78px;
}

.article-gallery .box-gallery .row{
  margin-bottom:28px;
}

.article-gallery .box-gallery .row [class*="col-"]{
  padding-left:5px;
  padding-right:5px;
}

/* Access */
.article-access{
  padding:82px 0 0 0;
}
.article-access .box-text .text-tel{
  font-size: 1.8rem;
  line-height:3.7rem;
}

/* Map */
.article-map h2{
  margin:0 auto 20px auto;
}

.article-map .btn-map{
  margin:0;
  padding:56px 0 46px 0;
}

.article-map .btn-map a{
  display:inline-block;
}

#map-canvas{
  width:980px;
  height:540px;
  margin:auto;
}

.box-twitter{
  width:500px;
  height:750px;
  overflow-y:scroll;
  margin:auto;
}

.box-facebook{
  width:500px;
  height:750px;
  overflow-y:scroll;
  margin:auto;
}

.nav-info{
  text-align:center;
  padding:0;
  margin:32px auto 44px auto;
}

.nav-info li{
  list-style:none;
  display:inline-block;
}

.nav-info li + li:before{
  content:'|';
  font-size:1.4rem;
  padding:0 22px;
}

.nav-info li a{
  font-size:1.4rem;
  color:#fff;
  display:inline-block;
}

/* Footer */
footer{
  position: relative;
  margin: 0 auto ;
  padding:54px 0 0 0;
  background-color: #171717 ;
}

footer .nav-sns{
  display:-webkit-flex;
  display:-moz-flex;
  display:-ms-flex;
  display:flex;
  justify-content:center;
  margin-bottom:92px;
}

footer .nav-sns li{
  list-style:none;
  padding:0 54px;
  position:relative;
}

footer .nav-sns li > img{
  position:absolute;
  top:-20px;
  left:-128px;
}

.nav-footer{
  display:-webkit-flex;
  display:-moz-flex;
  display:-ms-flex;
  display:flex;
  justify-content: center ;
  margin:30px 0 70px 0;
  padding: 0;
}

.nav-footer li {
  list-style: none ;
  margin: 0;
  padding: 0 40px;
}

.nav-footer li a{
  display: inline-block;
  padding: 10px 0;
}

.nav-footer li a img{
  margin: auto;
}

.copyright{
  font-size:1.1rem;
  line-height:2.2rem;
  text-align:center;
  padding-bottom:40px;
  margin:0;
}

.scroll-top{
  position:absolute;
  right:28px;
  bottom:56px;
}

 .lb-outerContainer {
  border-radius:0!important;
  background-color: #000!important;
}
 .lightbox .lb-image {
  border-radius:0!important;
  border: 4px solid #000!important;
}

.no-js .owl-carousel, .owl-carousel.owl-loaded{
  position:relative;
}

.owl-nav{
  position:absolute;
  top:300px;
  width:100%;
}

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel button.owl-dot{
  font-size:5rem;
}

.owl-carousel .owl-nav button.owl-prev{
  position:absolute;
  left:calc(50% - 600px);
  font-size:5rem!important;
}

.owl-carousel .owl-nav button.owl-next{
  position:absolute;
  right:calc(50% - 600px);
  font-size:5rem!important;
}

.owl-carousel .owl-nav button.owl-prev:focus,
.owl-carousel .owl-nav button.owl-next:focus{
  outline:none;
  box-shadow:none;
}

.owl-carousel .owl-item .box-resort{
  opacity:0;
  transform:translateY(50px);
  transition:.3s;
}

.owl-carousel .owl-item.active .box-resort{
  opacity:1;
  transform:translateY(0px);
  transition:.3s 1s;
}

.iziModal.modal-flavor{
  /* border-radius:0; */
  background:url('../images/flavor/flavor_modal_divider.png'),url('../images/flavor/flavor_modal_bg.jpg');
  background-repeat:no-repeat,repeat-x;
  background-size:auto auto,auto 100%;
  background-position:center calc(100% - 20px),left top;
  text-align:center;
}

.iziModal-content{
  padding:16px 0 0px 0 !important;
}

.iziModal.modal-flavor h3{
  opacity:1;
  transform:translateY(0px);
  transition:.3s;
}

.iziModal.modal-flavor .box-text{
  opacity:1;
  transform:translateY(0px);
  transition:.3s;
  margin-top:25px;
}

.iziModal.modal-flavor .box-text p{
  font-size:1.0rem;
  line-height:1.6rem;
}

.iziModal.modal-flavor .box-text img{
  margin-top:-25px;
}

.iziModal-navigate{
  z-index:3500!important;
}

.iziModal-navigate-prev{
  margin-left:-456px!important;
}

.iziModal-navigate-next{
  margin-right:-456px!important;
}

.iziModal.modal-flavor h3.modal-transition,
.iziModal.modal-flavor .box-text.modal-transition{
  opacity:0;
  transform:translateY(10px);
}

.scroll-down {
	position: absolute;
	z-index: 2;
	/*top: 50%;*/
	/* bottom: 100px; */
  bottom:150px;
  /* bottom:90px; */
	/* left: 50%; */
	/* margin-left: -60px; */
  /* left:calc(50% - 120px); */
  left:calc(50% - 60px);
  /* left:calc(50% - 90px); */
  /* left:calc(50% - 60px); */
  /* width: 240px; */
  width: 133px;
	/* width: 180px; */
  /* height: 240px; */
  height: 133px;
	/* height: 180px; */
  cursor: pointer;
}
.scroll-down a{
	display: table;
  /* width: 240px; */
  width: 133px;
	/* width: 180px; */
  /* height: 240px; */
  height: 133px;
	/* height: 180px; */
	position: relative;
}
.scroll-down a:hover,
.scroll-down a:focus{
  text-decoration: none;
}
.scroll-down a::before,
.scroll-down a::after{
	content: '';
	display: block;
  /* width: 240px; */
  width: 133px;
	/* width: 180px; */
  /* height: 240px; */
  height: 133px;
	/* height: 180px; */
	top: 0;
	left: 0;
	border-radius: 100%;
	position: absolute;
	-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
       -o-box-sizing: border-box;
      -ms-box-sizing: border-box;
          box-sizing: border-box;
}
.scroll-down a::before{
	z-index: 1;
	border: 1px solid #fff;
	-webkit-animation: pulsate 2s ease-out infinite;
	-moz-animation: pulsate 2s ease-out infinite;
	-o-animation: pulsate 2s ease-out infinite;
	animation: pulsate 2s ease-out infinite;
}
.scroll-down a::after{
	z-index: 2;
	border: 2px solid #fff;
	border-color: #fff rgba(255,255,255,.5) rgba(255,255,255,.5) #fff;
	background-color: rgba(0,0,0,.3);
	/*@include animation(btnRotate 2s linear infinite);*/
	/*@include transition;*/
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.scroll-down a span{
	z-index: 3;
	position: relative;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	color: #fff;
	font-family: 'Lora', serif;
	font-weight: 400;
	/*@extend %txt-en;*/
	/*@include fz(14);*/
  /* font-size: 14px; */
  font-size: 1.1rem;
	/* font-size: 1.4rem; */
	line-height: 1.1;
	padding-bottom: 20px;
}
.scroll-down a span::before,
.scroll-down a span::after{
	content: '';
	display: block;
	width: 2px;
	height: 30px;
	background-color: #fff;
	position: absolute;
	bottom: 20px;
	left: 50%;
	/*@include box-shadow(0 2px 2px rgba(0,0,0,.3));*/
}
.scroll-down a span::before{
	/*@include rotate(center bottom, -60deg);*/
	-webkit-transform-origin: center bottom;
	-ms-transform-origin: center bottom;
	transform-origin: center bottom;
	-webkit-transform: rotate(-60deg);
	-ms-transform: rotate(-60deg);
	transform: rotate(-60deg);
}
.scroll-down a span::after{
	/*@include rotate(center bottom, 60deg);*/
	-webkit-transform-origin: center bottom;
	-ms-transform-origin: center bottom;
	transform-origin: center bottom;
	-webkit-transform: rotate(60deg);
	-ms-transform: rotate(60deg);
	transform: rotate(60deg);
}
.scroll-down:hover a::after{
	/*@include rotate(center center, 360deg);*/
	-webkit-transform-origin: center center;
	-ms-transform-origin: center center;
	transform-origin: center center;
	-webkit-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);
}
/* @media only screen and (max-width:767px){
	.scroll-down {
		position: absolute;
		z-index: 2;
		bottom: 100px;
		left: 50%;
		margin-left: -60px;
		width: 120px;
		height: 120px;
	}
} */
@keyframes pulsate {
	0% {transform: scale(1,1);}
	50% {opacity: .7;}
	100% {transform: scale(1.5, 1.5); opacity: 0.0;}
}
@keyframes btnRotate {
	0% {transform-origin: center center;transform: rotate(0deg);}
	/*50% {transform: rotate(0deg);}*/
	100% {transform: rotate(360deg);}
}


.cd-modal-action {
  position: relative;
}
.cd-modal-action .btn {
  /* width: 12.5em;
  height: 4em;
  background-color: #123758;
  border-radius: 5em; */
  transition: color 0.2s 0.3s, width 0.3s 0s;
}
.cd-modal-action .btn.to-circle {
  /* width: 4em; */
  /* color: transparent; */
  transition: color 0.2s 0s, width 0.3s 0.2s;
}
.cd-modal-action .cd-modal-bg {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-2em);
  width: 4em;
  height: 4em;
  background-color: #123758;
  border-radius: 50%;
  opacity: 0;
  visibility: hidden;
  transition: visibility 0s 0.5s;
}
.cd-modal-action .cd-modal-bg.is-visible {
  opacity: 1;
  visibility: visible;
}
