@charset "utf-8";

/* ---------------------------------------------------------------------------------
base */

*{}

@media(max-width:750px){
	
body{ font-size:140%;}

}

li img{ width:100%;}

img{ vertical-align:bottom;}

a:link{ color:#ee6fb2;text-decoration: none;}
a:visited{ color:#ee6fb2;text-decoration: none;}
a:active{ color:#ee6fb2;text-decoration:underline;}
a:hover{ color:#ff0000;text-decoration:none;}


body{ background:#fff ; height:100%; width:100%;}

ul li a{transition: all  0.2s ease;}
ul li a:hover{opacity: 0.8;}

@media(max-width:750px){

body{  }
 
}

p{ line-height: 1.8em;}

.hrTac img{ width:100%;}
img{ width:100%;}



.btnArea{ text-align: center; padding-bottom: 50px;}

a.btn_type01{
border-radius: 10px;
background: rgb(66,43,0);
background: linear-gradient(0deg, rgba(66,43,0,1) 0%, rgba(178,160,19,1) 100%);
padding: 20px 40px;
color: #fff;
display: inline-block;
transition: all  0.2s ease;
}

a.btn_type01:hover{
    opacity: 0.8;
}


@media(max-width:750px){
    
a.btn_type01{
font-size: 150%;
padding: 30px 50px;

}
    
}

/* ---------------------------------------------------------------------------------
contents */


#mainVisual{ background: url(/common/images/mainVisual.jpg) no-repeat center bottom; background-size: cover;
height: 700px;}


#mainVisual p{ display: none;}

#subPage #mainVisual{ background: url(/common/images/mainVisual.jpg) no-repeat center bottom -190px; background-size: cover;
height: 75px;}{}



#introCatch{ background: url(/common/images/bg_intro.png) no-repeat center top; background-size: 100%; margin-top: -100px;padding-top: 150px;padding-bottom: 100px;}

#introCatch >.inner{ width: 1000px; margin: 0 auto;}

#introCatch h2{ text-align: center; font-size: 60px; margin-bottom: 30px; color: #df4868;}
#introCatch p.sub01{text-align: center; font-size: 24px; margin-bottom: 20px; color: #c59449;}
#introCatch p.sub02{text-align: center; font-size: 16px;}


@media(max-width:750px){
#introCatch >.inner{ width: auto; }
#introCatch{ background: url(/common/images/bg_intro.png) no-repeat center top; background-size: cover;}

#introCatch p.sub01{ font-size: 34px; }
#introCatch p.sub02{ font-size: 24px;}
    
    
#subPage #mainVisual{ background: url(/common/images/mainVisual.jpg) no-repeat center bottom -190px; background-size: cover;
height: 215px;}{}

    
}









#specialBnrArea{ background: #1b0801;}
#specialBnrArea >.inner{ width: 800px; margin: 0 auto;padding-bottom: 50px;}

#specialBnrArea ul{
width: 100%;
margin: 0 auto ;
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 15px;
row-gap: 15px;  

}

@media(max-width:750px){
#specialBnrArea{padding-top: 50px;}
#specialBnrArea >.inner{ width: auto; margin: 0 50px;padding-bottom: 50px;}

}







/* ---------------------------------------------------------------------------------
top */


.cmnSec{ background: #1b0801;}
.cmnSec >.inner{ width: 1100px; margin: 0 auto}

.cmnHeader{padding: 80px 0 70px;}
.cmnHeader h2{ text-align: center; color: #c59449; font-family: 'Italianno', cursive; font-size: 50px; font-weight: normal; margin-bottom: 10px;}
.cmnHeader p{ text-align: center; color: #ce1443;}
.cmnHeader p.cmnHeaderComment{ text-align: center; color: #ffdec3; font-size: 86%;}


@media(max-width:750px){
.cmnSec >.inner{ width: auto; margin: 0 auto}

.cmnHeader{padding: 80px 0 70px;}
.cmnHeader h2{ font-size: 80px; font-weight: normal; margin-bottom: 10px;}
.cmnHeader p{font-size: 34px;}
.cmnHeader p.cmnHeaderComment{  font-size: 110%; margin: 0 50px; text-align: left;}

    
}




#ROOMSPRICE{ background: #1e0f0a;}
#ROOMSPRICE >.inner{width: auto;}


.roomList{padding-bottom: 50px;}
.roomList p{ background: #1b0902; text-align: center;}

.roomMinHeader{border-bottom: 3px double #674f46; margin-bottom: 20px; position: relative;padding-bottom: 10px;}
.roomMinHeader h2{ font-weight: normal; font-size: 170%;}
.roomMinHeader .minPrice{ position: absolute; right: 0; top: 0;}
.roomMinHeader dl{ display: inline; margin-right: 30px;}
.roomMinHeader dl:last-child{margin-right: 0;}
.roomMinHeader dt{ display: inline; font-size: 80%;}
.roomMinHeader dd{ display: inline; font-size: 110%; }

@media(max-width:750px){
.roomMinHeader dl{ display: inline; margin-right: 20px;}
.roomMinHeader dt{ display: inline; font-size: 90%;}
.roomMinHeader dd{ display: inline; font-size: 120%; }
}


ul#roomSlide{width: 1100px;    margin:0 auto;}
ul#roomSlide{ position: relative;}

@media(max-width:750px){
    
ul#roomSlide{
width: auto;
    margin: 0 50px;
    }
}

.roomSlideHeader{ position: absolute; bottom: 0 ; background: rgba(0,0,0,0.6);  display: block; width: 100%; padding: 10px;}
.roomSlideHeader h3{ font-weight: normal; font-size: 170%;}
.roomSlideHeader .minPrice{ position: absolute; right: 10px; top: 10px;}
.roomSlideHeader dl{ display: inline; margin-right: 30px; }
.roomSlideHeader dl:last-child{margin-right: 0;}
.roomSlideHeader dt{ display: inline; font-size: 100%;}
.roomSlideHeader dd{ display: inline; font-size: 150%;  color: #c59449;}

@media(max-width:750px){
.roomSlideHeader dl{ display: inline; margin-right: 20px;}
.roomSlideHeader dt{ display: inline; font-size: 90%;}
.roomSlideHeader dd{ display: inline; font-size: 120%; }
}
















.rlBody{ padding-top: 50px; padding-bottom: 400px; background: #1e0f0a url(/common/images/room_bg.jpg) no-repeat center bottom; background-size: 100% auto;}
#subPage .rlBody{ padding-top: 50px; padding-bottom: 400px; background: #1d0f09 url(/common/images/room_bg.jpg) no-repeat center bottom; background-size: 100% auto;}


.rlBody >.inner{ width: 1100px; margin: 0 auto;}

.roomList ul{
width: 100%;
margin: 0 auto ;
display: grid;
grid-template-columns: repeat(4, 1fr);
column-gap: 10px;
row-gap: 18px;  

}

.mini .roomList ul{
grid-template-columns: repeat(7, 1fr);
column-gap: 8px;
row-gap: 18px;  

}


.roomList ul li a{color: #fff;}

.roomCategory{
    width: 700px; margin: 0 auto; text-align: center;margin-bottom: 40px; 
}

.roomCategory li{display: inline-block; }
.roomCategory li a{ border: 1px solid #ffdec3; display: inline-block; padding: 5px 10px; color: #fff; margin-right: 10px; line-height: 1em;}

.roomCategory li a:hover{}

.roomCategory li:last-child{ margin-right: 0;}

.roomCategory li a{}

@media(max-width:750px){

.rlBody { padding-bottom: 200px; }
.rlBody >.inner{ width: auto; margin: 0 50px; }

.roomList ul{
width: 100%;
margin: 0 auto ;
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 10px;
row-gap: 10px;
}

.mini .roomList ul{
grid-template-columns: repeat(3, 1fr);
column-gap: 8px;
row-gap: 18px;  

}
    
.roomCategory{    width: auto; margin: 0 50px; text-align: center;}

.roomCategory li{display: inline-block; margin-bottom: 10px; }
.roomCategory li a{ border: 1px solid #ffdec3; display: inline-block; padding: 20px 20px; color: #fff; margin-right: 10px; line-height: 1em;}
    
    
}




/* ---------------------------------------------------------------------------------
common */



#SERVICE{ background: url(/common/images/bg_service.jpg) no-repeat center top; background-size: cover; padding-bottom:50px;}
#SERVICE >.inner{}


#SERVICE .cmnHeader h2{ color: #fff; }
#SERVICE .cmnHeader p{color: #fff;}

#SERVICE ul{
width: 100%;
margin: 0 auto ;
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 25px;
row-gap: 25px;  
    padding-bottom: 100px;
}

#SERVICE ul .imgBox{ text-align: center; margin-bottom: 30px;}
#SERVICE ul .imgBox img{border-radius:50%; width: 270px;}
#SERVICE ul h3{ text-align: center; font-size: 110%; margin-bottom: 20px; line-height: 1.5em;}
#SERVICE ul p{ text-align: center; font-size: 80%; color: #ffdec3;}



@media(max-width:750px){

    #SERVICE >.inner{ width: auto; margin: 0 50px}
    
#SERVICE ul{
grid-template-columns: repeat(1, 1fr);
row-gap: 80px;  
    padding-bottom: 100px;
}
    
    
#SERVICE ul .imgBox{ text-align: center; margin-bottom: 30px;}
#SERVICE ul .imgBox img{width: 470px;}
#SERVICE ul h3{ text-align: center; font-size: 150%; margin-bottom: 20px;}
#SERVICE ul p{ text-align: center; font-size: 120%; color: #ffdec3;}
    
}


/* ---------------------------------------------------------------------------------
INTRO */

#NEWS{ }
#NEWS >.inner{padding-bottom: 100px;}


#NEWS ul{
width: 80%;
margin: 0 auto ;
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 25px;
row-gap: 25px;  
    padding-bottom: 50px;
}


.newsList .imgBox{ margin-bottom: 5px;}
.newsList .date{ font-size:80%;}
.newsList .single{ color: #f54773;}
.newsList .week{ color: #fae349}
.newsList .date span{display: inline-block; color: #fff; background: #777; margin-left: 10px;padding: 3px 5px; line-height: 1em;font-size: 90%; font-weight: bold;}
.newsList h3{ font-size: 93%; line-height: 1.4em;}

.newsList span.cat01{ background:#df4868 ;}

@media(max-width:750px){

    
#NEWS ul{
width: auto;
margin: 0 50px ;
display: grid;
grid-template-columns: repeat(1, 1fr);
column-gap: 25px;
row-gap:50px;  
    padding-bottom: 50px;
}
.newsList .date{ font-size:150%;}
.newsList .date span{padding:8px 10px;font-size: 90%; }
.newsList h3{ font-size: 180%; line-height: 1.4em;}

}







/* ---------------------------------------------------------------------------------
INFO2 */


#MEMBERS{ background: url(/common/images/bg_member.jpg) no-repeat center top; background-size: cover;padding-bottom: 100px;}
#MEMBERS >.inner{}


#MEMBERS ul{
width: 100%;
margin: 0 auto ;
display: grid;
grid-template-columns: repeat(5, 1fr);
column-gap: 20px;
row-gap: 20px;  
padding-bottom: 50px;
}

#MEMBERS ul .imgBox{ text-align: center;}
#MEMBERS ul .imgBox img{ width: 40%; margin-bottom: 10px;}
#MEMBERS ul h3{ color: #a3783a; text-align: center; font-size: 100%; margin-bottom: 10px; line-height: 1.5em;}
#MEMBERS ul p{ font-size: 80%; letter-spacing: -0.1em;}



@media(max-width:750px){

#MEMBERS ul{
    width: auto;
    margin: 0 50px;
grid-template-columns: repeat(1, 1fr);
column-gap: 20px;
row-gap: 20px;  
}

    
#MEMBERS ul .imgBox{ text-align: center;}
#MEMBERS ul .imgBox img{ width: 160px; margin-bottom: 10px;}
#MEMBERS ul h3{ text-align: left; font-size: 170%; }
#MEMBERS ul p{ font-size: 130%; letter-spacing: -0.1em;}


    
}



/* ---------------------------------------------------------------------------------
RESULT */



#FOODDRINK{ background: url(/common/images/bg_food.jpg) no-repeat center top; background-size: cover;padding-bottom: 100px;}
#FOODDRINK >.inner{}


#FOODDRINK .cmnHeader h2{ color: #fff; }
#FOODDRINK .cmnHeader p{color: #fff;}


#FOODDRINK .foodList{
width: 100%;
margin: 0 auto ;
display: grid;
grid-template-columns: repeat(4, 1fr);
column-gap: 20px;
row-gap: 20px;  
padding-bottom: 50px;
}


@media(max-width:750px){

#FOODDRINK .foodList{
width: auto;
margin: 0 50px ;
display: grid;
grid-template-columns: repeat(2, 1fr);
column-gap: 20px;
row-gap: 20px;  
padding-bottom: 50px;
}
    
}


/* ---------------------------------------------------------------------------------
MESSAGE */


#FACILITY{ background: url(/common/images/bg_facility.jpg) no-repeat right bottom; background-size: cover;}
#FACILITY >.inner{ padding-bottom: 100px;}

.facilityBlock ul{
width: 100%;
margin: 0 ;
display: grid;
grid-template-columns: repeat(2, 1fr);
column-gap: 0;
row-gap: 10px;  
    border-bottom: 1px solid #674f46;
    padding-bottom: 10px;
}


.facilityBlock { position: relative;}
.facilityBlock li{ display: table; border-top: 1px solid #674f46; padding-top: 10px;}
.facilityBlock li .imgBox{ display: table-cell; vertical-align: middle;}
.facilityBlock li .textBox{ display: table-cell; vertical-align: middle; padding-left: 10px;}
.facilityBlock li .imgBox img{ width: 60px;}
.facilityBlock dt{ font-size: 80%; padding-bottom: 0px; line-height: 1.4em;}
.facilityBlock dd{ font-size: 90%;}

.facilityBlock.fb02 ul{ width: 600px;}
.facilityImage { width: 450px;  position: absolute;  right: 0; top: 0;}


@media(max-width:750px){

.facilityBlock.fb02 ul{ width: auto; margin: 0 50px}

.facilityImage { width: auto; margin: 50px 50px 0;  position: relative;  right: 0; top: 0;}




}


/* ---------------------------------------------------------------------------------
RANKING */


#ACCESS{ background: url(/common/images/bg_access.jpg) no-repeat center top; background-size: cover;}
#ACCESS >.inner{ padding-bottom: 100px;}

.accessBox{ width: 800px; margin: 0 auto;}

.accessBox .gMap{ vertical-align: baseline; margin-bottom: 0;overflow: hidden;}

.accessDetail{background: url(/common/images/bg_accessInner.jpg) no-repeat center top; background-size: cover; padding: 50px 0; margin-top: -10px;}
.accessDetail dl{ text-align: center;}
.accessDetail dt{ font-size: 80%; color: #c59449;}
.accessDetail dd{ font-size: 90%; margin-bottom: 10px;}
.accessDetail dd.tel{ font-size: 200%; font-weight: bold;}
.accessDetail dd.tel a{}

@media(max-width:750px){

.accessBox{ width: auto; margin: 0 50px;}
    .accessDetail { padding: 50px 50px 30px}
.accessDetail dl{ text-align: left;}
.accessDetail dt{ font-size: 120%; color: #c59449;margin-bottom: 10px;}
.accessDetail dd{ font-size: 130%; margin-bottom: 30px;}
.accessDetail dd.tel{ font-size: 200%; font-weight: bold;}
}








/* ---------------------------------------------------------------------------------
top concept */




@media(max-width:750px){


} /* Responsive End */












/* ---------------------------------------------------------------------------------
footer */



@media(max-width:750px){



}



/* ---------------------------------------------------------------------------------
onebox */



@media(max-width:750px){
	

}





/* ---------------------------------------------------------------------------------
yoko */



@media(max-width:750px){

    
    
}




/* ---------------------------------------------------------------------------------
kekka */




a.instaLink{ display: inline-block; border: 1px solid #333; padding: 0.5em 2em; line-height: 1em; margin-top: 10px; color: #333; font-size: 14px;}
a.instaLink:hover{background: #ec74a9; border-color: #ec74a9; color: #fff;}

a.spaceLink{ display: inline-block; border: 1px solid #333; padding: 0.5em 2em; line-height: 1em; margin-top: 10px; color: #333; font-size: 14px;}
a.spaceLink:hover{background: #ec74a9; border-color: #ec74a9; color: #fff;}




@media(max-width:750px){

a.instaLink{ display: inline-block; border: 1px solid #333; padding: 0.5em 2em; line-height: 1em; margin-top: 10px; color: #333; font-size: 30px;}
a.instaLink:hover{background: #ec74a9; border-color: #ec74a9; color: #fff;}

a.spaceLink{ display: inline-block; border: 1px solid #333; padding: 0.5em 2em; line-height: 1em; margin-top: 10px; color: #333; font-size: 30px;}
a.spaceLink:hover{background: #ec74a9; border-color: #ec74a9; color: #fff;}

}
	







a.arrowBtn{ display:block; color:#fff; font-weight:bold; background:#322; text-align:center;padding:15px; position:relative; margin-left:auto; margin-right:auto; width:80%; max-width:600px;
/* box-shadow */
box-shadow:-2px 0px 0px -50px #75dc90;

/* border-radius */
border-radius:5px;
}


a.arrowBtn::after{
	content:"";
	display: block;
	width:6px;
	height:6px;
	border-top:2px solid #fff;
	border-right:2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	left:20px;
	top:50%;
	margin-top:-4px;
}


a.arrowBtn:hover{ background:#000;}


















.acd-check{
    display: none;
}
.acd-label{
    background:url(../images/acPlus.png) no-repeat right  50%;
    background-size:20px 20px;
  background-position: right 15px center;
    color: #555;
    display: block;
    font-weight: bold;
    margin-bottom: 10px;
    padding: 25px 20px;
    font-size: 16px;
    position: relative;
    z-index: 1;
    border-top: 1px solid #eee
}


.acd-label span.hsize{ font-size: 190%; margin-right: 10px; color: #aaa}
.acd-content span.hsize{ font-size: 190%; margin-right: 10px; color: #aaa}


.acd-content{
    position: relative; top: -30px;
    z-index: 0;
    height: 0;
    opacity: 0;
    padding: 0 30px 0 30px;
    transition: 0.5s;
    visibility: hidden;
}
.acd-check:checked + .acd-label + .acd-content{
    height: auto;
    opacity: 1;
    padding: 50px 30px 30px 30px;
    visibility: visible;
    background: #fff;
}



.acd-check:checked + .acd-label{
    background: url(../images/acMinus.png) no-repeat right top;
    background-size:20px 20px;
  background-position: right 15px center;
}

@media(max-width:750px){
    
.acd-label{
    font-size: 26px;
    padding-right: 2em;
}
    .acd-content p{ font-size: 26px;}
    
}

.acd-content p{ position: relative;}
.acd-content a{position: relative; z-index: 10;}















#subVisual{text-align: center;
    padding: 200px 0;
}
#subVisual img{
   width: 260px; 
}


@media(max-width:750px){

#subVisual{text-align: center;
    padding: 200px 0;
}
#subVisual img{
   width: 400px; 
}


}






@media(min-width:751px){

}








/* ---------------------------------------------------------------------------------
common */


.clear{ clear:both;}
.tac{ text-align:center !important;}

@media(min-width:751px){
.sp{ display:none !important;}
} /* Responsive End */

@media(max-width:750px){
.pc{ display:none !important; }
} /* Responsive End */

@media(max-width:750px){
#commonFooter{ display:none !important; }
}

@media(max-width:750px){
#commonFooter{ display:none !important; }
}


@media(max-width:750px){
.tac_pc{ text-align:left !important;}
.tac_sp{ text-align:center !important;}
}

@media(min-width:751px){
.tac_pc{ text-align:center !important;}
.tac_sp{ text-align:left !important;}
}