@charset "utf-8";

/*
+++++++++++++++++++++++++++++++

メインタイトル

+++++++++++++++++++++++++++++++
*/


.main-title {
    
	z-index: 1;
	height: 100vh;
    margin-bottom: 40px;
}

@media screen and (min-width: 992px),
print {
    .main-title {
    margin-bottom: 80px;
}
}

.slider-item01 {
    background:url(../../../../img/title-sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item01 {
    background:url(../../../../img/title.jpg);
}
    }

.slider-item02 {
    background:url(../../../../img/dinner/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item02 {
    background:url(../../../../img/dinner/title.jpg);
}
    }

.slider-item03 {
    background:url(../../../../img/drink/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item03 {
    background:url(../../../../img/drink/title.jpg);
}
    }

.slider-item04 {
    background:url(../../../../img/party/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item04 {
    background:url(../../../../img/party/title.jpg);
}
    }

.slider-item05 {
    background:url(../../../../img/shop/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item05 {
    background:url(../../../../img/shop/title.jpg);
}
    }

.slider-item06 {
    background:url(../../../../img/fukuwabi/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item06 {
    background:url(../../../../img/fukuwabi/title.jpg);
}
    }

.slider-item {
    width: 100%;/*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/
    height:100vh;/*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
    background-repeat: no-repeat;/*背景画像をリピートしない*/
    background-position: center;/*背景画像の位置を中央に*/
    background-size:cover;
    display: flex;
  justify-content: center;
  align-items: center;
}

.title-txt{
color:#fff;
    font-size:50px;
}

@media screen and (min-width: 992px),
print {
   .title-txt{
color:#fff;
    font-size:120px;
} 
}


/*
+++++++++++++++++++++++++++++++

サブタイトル

+++++++++++++++++++++++++++++++
*/


.subtitle01{
    font-size:27px;
    position: relative;
    margin-bottom:35px;
}

.subtitle01:after {
  content: "";
  position: absolute;
  bottom:-5px;
  left:5px;
  height:1px;
    width:60px;
    background:#D8D8D8;
    
}


@media screen and (min-width: 992px),
print {
    .subtitle01{
    font-size:45px;
        margin-bottom: 45px;
}

.subtitle01:after {
  bottom:-5px;
  left:5px;
  height:1px;
    width:60px;
    background:#D8D8D8;
    
}
}


.sub-title02 {
	position: relative;
	padding-bottom:15px;
	font-size: 23px;
    margin-bottom: 30px;
}

.sub-title02::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 6px;
	background-image: repeating-linear-gradient(45deg, #F3F3F3 0px, #b4a983 1px, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%);
	background-size: 8px 8px;
}

@media screen and (min-width: 992px),
print {
    .sub-title02 {
text-align: center;
		max-width: 900px;
		margin:0 auto 40px;
        font-size: 25px;
}

}

.subtitle03{
    font-size:23px;
    position: relative;
    margin-bottom:35px;
}

.subtitle03:after {
  content: "";
  position: absolute;
  bottom:-5px;
  left:5px;
  height:1px;
    width:60px;
    background:#D8D8D8;
    
}


@media screen and (min-width: 992px),
print {
    .subtitle03{
    font-size:35px;
        margin-bottom: 45px;
}

.subtitle03:after {
  bottom:-5px;
  left:5px;
  height:1px;
    width:60px;
    background:#D8D8D8;
    
}
}

.lis01{
    margin-bottom:30px;
}

@media screen and (min-width:992px),
print {
    .lis01{
    margin-bottom:60px;
}
}

.lis01 li{
    padding-bottom: 20px;
    margin-bottom:20px;
    border-bottom:1px #EFEFEF solid;
}

@media screen and (min-width:992px),
print {
    .lis01 li{
    padding-bottom: 30px;
    margin-bottom:30px;
}
}



/*
++++++++++++++++

テーブル

+++++++++++++++++
*/


.table01 {
	width: 95%;
	table-layout: fixed; 
	border-collapse: collapse;
    margin:0 auto 30px;
}

@media screen and (min-width: 992px),
print {
    .table01 {
	max-width:1000px;
    margin-bottom:60px;
}
}


.table01 th,
.table01 td {
	padding: 15px;
	border: 1px solid #ccc;
}
.table01 th {
	background: #f7f7f7;
    text-align: center;
    vertical-align: middle;
}

/*for SP*/
/*モバイルレイアウトでは縦積みになるように上書き*/
@media screen and (max-width: 767px) {
	.table01 tr,
	.table01 th,
	.table01 td {
		display: block; /*縦積み化*/
		margin-top: -1px; /*罫線を重ねる*/
		text-align: left;
	}
    .table01 th,
	.table01 td {
		padding-left:10px;
	}
    
}

@media screen and (min-width: 768px),
print {
    .table01 th {
		width:30%;
	}
}





/*
++++++++++++++++++++++++++++++++++++++

@media screen and (min-width: 992px),
print {
    
}

@media screen and (min-width: 768px) and (max-width:991px)
{
}

+++++++++++++++++++++++++++++++++++++++++
*/

/*
+++++++++++++++++++++++++++++++

メインタイトル

.xxx img{
    border-radius:15px; 
}

grid-template-columns: 1fr 1fr;

grid-column-gap:50px;

    grid-template-columns: 1fr 1fr;


+++++++++++++++++++++++++++++++
*/

.k10{
  margin-bottom: 10px;  
}

.k20{
  margin-bottom: 20px;  
}

.k30{
  margin-bottom: 30px;  
}


.k40{
  margin-bottom: 30px;  
}

@media screen and (min-width: 992px),
print {
    .k40{
  margin-bottom: 40px;  
}
}



.k50{
  margin-bottom: 30px;  
}

@media screen and (min-width: 992px),
print {
   .k50{
  margin-bottom: 50px;  
}
}


