@charset "utf-8";
/* ****************************************************************************

　目次

-------------------------------------------------------------------------------
　00. 共通
　01. Lead
　02. STAY01 02
　03. ご利用詳細（ご利用料金・施設・備品について・TEL）
  04. ご利用方法
  
******************************************************************************* */

/* ==

　00. 共通

=============================================================================== */
body{background-color:transparent;}
#container{
	width:100%;
	padding-top:0;
	padding-bottom:0;
}
#container .section{padding: 100px 0 80px;}
#container .fade:hover{
  opacity: 0.7;
  transition: all 0.3s ease 0s;
}

/* tit txt
---------------------------------*/
h2, h3, #container p{
  line-height: 1.6;
	color: #333;
}
#container h2{
  margin:0;
  text-align:center;
  background:transparent;
}
#container h3{
  margin-bottom:30px;
  font-size:210%;
  border:0;
  text-align:center;
}
#container h3.tit3{
  margin-bottom:20px;
  padding:15px 10px;
  font-size:130%;
  border:0;
  color:#fff;
  text-align:left;
  background:#2b1f14;
}
#container h4{
  margin: 0 0 10px;
  font-size:154%;
  text-align:center;
}
#container p,
#container li{font-size:134%;}
#container p.fsS{ font-size:100%; }

/* section
---------------------------------*/
.section.shdw{ position:relative;}
.section.shdw:before{
	display: block;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 8px;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0.0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.25) 0%,rgba(0,0,0,0.0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#40000000', endColorstr='#08000000',GradientType=0);
	z-index:1;
} 
.baseIn {
  width: 950px;
  position: relative;
  margin: 0 auto;
  text-align: left;
}
.baseIn.wBg {
	padding:60px 20px 40px;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#60FFFFFF,endColorstr=#60FFFFFF); 
  background: rgba(255, 255, 255, 0.8);
  box-sizing: border-box
}

/* column
---------------------------------*/
.colBlock01 .col{
  float:left;
  width:460px;
  margin:0 30px 30px 0;
}
.colBlock02 .col{
  float:left;
  width:310px;
  margin:0 10px 0 0;
}
.colBlock03 .col{
  float:left;
  width:230px;
  margin:0 10px 0 0;
}
.wBg .colBlock01 .col{width:430px;}
.wBg .colBlock02 .col{
  margin-right:20px;
  width:290px;
}
.colBlock01 .col:last-child,
.colBlock02 .col:last-child,
.colBlock03 .col:last-child{margin-right:0;}


/* other
---------------------------------*/
#container .imgCap{
  padding:5px 0;
  font-size:116%;
  text-align:center;
}
#container .mb00{margin-bottom:0 !important;}
#container p.indent,
#container .indent li{
  text-indent:-1em;
  padding-left:1em;
}
/* clearfix
---------------------------------*/
#container .colBlock01:after,
#container .colBlock02:after,
#container .colBlock03:after,
#container .section dl:after{ content:''; display:block; clear:both; }


/* ==

　01. Lead

=============================================================================== */
#lead{background:#ebe5e0;}
#lead h1{
  margin-bottom:40px;
  border-bottom:0;
  text-align:center;
}
#lead .txt{
  padding-bottom:50px;
  text-align:center;
  font-size:200%;
  font-family:"ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#lead .colBlock02 .col a{
  margin: 0 auto;
  max-width:460px;
  display:block;
  text-align:center;
  padding:15px;
  background:#2b1f14;
  box-sizing: border-box;
}



/* ==

　02. STAY 01 02 

=============================================================================== */
#container #stay01{
  background:#eeece6 url("../images/bg01.png") no-repeat 0 bottom;
  background-size:100% auto;
}
#container #stay02{
  background:#eeece6 url("../images/bg02.png") no-repeat 0 bottom;
  background-size:100% auto;
}
#container .stay h2{margin-bottom:20px;}
#container .stay .dataBlock{
  margin:20px 0;
  padding:20px 10px;
  text-align: center;
  border-top:1px solid #2b1f14;
  border-bottom:1px solid #2b1f14;
  background: rgba(238, 236, 230, 0.5);
}
#container .stay .dataBlock .address {
  font-size:250%;
  font-weight:bold;
  line-height:1.2;
}
#container .stay .dataBlock .address span {font-size:70%;}
#container .stay .dataBlock .capacity{
  display:inline-block;
  margin:0 auto 10px;
  padding:10px 20px;
  font-size:150%;
  background:#2b1f14;
  text-align:center;
  font-weight:bold;
  color:#fff;
}
#container .stay .dataBlock .data{color:#333;}
#container .stay .photo{
  margin:40px -20px 10px;
  text-align: center;
}
#container .stay .txtNotes{
  width:950px;
  margin:15px auto 0;
  text-align:right;
  font-size:12px !important;
  color:#fff;
  text-shadow:1px 1px 6px #000000;
}

/* ==

　03. ご利用詳細（ご利用料金・施設・備品について・TEL）

=============================================================================== */
#detail{
  background:#fff url("../images/bg03.png") no-repeat 0 bottom;
  background-size:100% auto;
}
#detail .price dl,
#detail .equipment{
  display:table;
  width:100%;
  border:1px solid #9f9f9f;
  box-sizing: border-box;

}
#detail .price dt,
#detail .price dd,
#detail .equipment dt,
#detail .equipment dd{
  display:table-cell;
  padding:20px 10px;
  background:#dcdcdc;
  font-weight:bold;
  font-size:136%;
  text-align:center;
  box-sizing: border-box;  
}
#detail .price dt{min-width:5em;}
#detail .price dd{
  border-left:1px solid #9f9f9f;
  color:#e11d1d;
  background:#fff;
  text-align:right;
  width:150px;
  box-sizing: border-box;
}
#detail .equipment{border-top:0;}
#detail .equipment dt,
#detail .equipment dd{
  width: auto !important;
  display:block;
  padding:10px 20px;
  border-top:1px solid #9f9f9f;
}
#detail .equipment dd{
  padding:20px;
  text-align:left;
  background:#fff;
  font-weight:normal;
}

.infoBlock{
width: 740px;
margin: 0 auto;
}
.infoBlock .baseIn{
width: auto;
display: flex;
justify-content: center;
align-items: center;
}
#stay01 .infoBlock{
margin-top: 80px;
}



#container .bgw{
  margin: 10px auto;
  padding:5px;
  font-size:14px;
  text-align:center;
}
#container .bgw .txtNote{
  padding: 5px 10px;
  font-size: 100%;
  background:rgba(255,255,255,0.9);
  display: inline-block;
}







/* ==

  04. ご利用方法

=============================================================================== */
#step{
  background:#fff url("../images/bg04.png") no-repeat 0 bottom;
  background-size:100% auto;
}
#container #step.section {padding: 0;}
#container #step.section .wBg{padding:100px 20px 80px;}
#container #step.section h2{margin-bottom:30px;}
#container #step.section h3{
  margin:50px 0 10px;
  text-align:left;
  font-size:150%;
}
#step #info{
  margin-top:-120px;
  padding-top:120px;
}
#step .indentBlock01 li{
  text-indent: -1em;
  margin-left: 1em;
}



/* ==

　05. ネット予約　ボタンエリア

=============================================================================== */
.btnBlock{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    margin: 50px auto 0;
}
.btnBlock div{
    margin-right: 3%;
}
.btnBlock div img{
    width: 385px;
}
.btnBlock div:nth-child(2){
    margin-right: 0;
}



/* お客さまの声 */
#container .userVoice{
  max-width: 400px;
  margin: 60px auto 0;
  padding:10px;
  font-size:117%;
  background:rgba(255,255,255,0.9);
  text-align: center;
}
#container .userVoice p{
  color: #3d7445;
  font-weight: bold;
}
#container .userVoice p a{
  color: #c00;
}
#container .userVoice .txtNote{
  font-size: 100%;
  color: #333;
  font-weight: normal;
}


