@charset "UTF-8";

.main {
	width:100%;
	height:100%;
	z-index:-1;
	text-indent:-9999px;
	position:fixed;
	left:0;
	top:0;
	background:url(../images/main.jpg) no-repeat center top;
	background-size:cover;
}

ul.navi {
 margin: 100px 0 50px 0;
}
ul.navi li {
 float: left;
 margin: 0 32px 27px 0;
}
ul.navi li:nth-child(3),
ul.navi li:nth-child(6) {
 margin: 0 0 27px 0;
}
.roomplan {
 position: relative;
}
div.roomplan01 {
 float: left;
 max-width: 313px;
 padding-bottom: 30px;
}
div.roomplan02 {
 float: right;
 width: 750px;
 text-align: center;
 padding-bottom: 60px;
}
.type {
 margin-bottom: 50px;
}
.torikago {
 text-align: center;
 margin: 50px 0;
}

div.roomplan01 ul li {
 margin: 0 0 15px 0;
}
p.at {
 font-size: 12px;
 text-indent: -1em;
 margin: 0 0 10px 1em;
 line-height: 1.6;
}
p.at2 {
 font-size: 12px;
 position: absolute;
 left: 0;
 bottom: 0;
}
p.pdf {
 margin: 30px 0;
}
p.hanrei {
 position: absolute;
 right: 0;
 bottom: 0;
}
div.complement {
 background-color: #e6e6e6;
 padding: 25px;
 margin: 60px 0;
}
div.complement h2 {
 text-align: center;
 font-size: 18px;
 padding-bottom: 5px;
 border-bottom: 1px solid #858585;
 margin-bottom: 10px;
}
div.complement p {
 font-size: 12px;
}
div.complement p span {
 color: #a2773d;
}

@media screen and (max-width: 700px) {
	div#header {
		position: fixed;
	}
	.main {
		height: auto;
		z-index:0;
		text-indent:0;
		position: static;
		padding: 40px 0 0 0;
	}
	.main img {
		width:100%;
		height:auto;
	}
 ul.navi {
  margin: 50px 0 15px 0;
 }
 ul.navi li {
  float: left;
  margin: 0 0 15px 0;
  width: 48%;
 }
 ul.navi li:nth-child(3),
 ul.navi li:nth-child(6) {
  margin: 0 0 15px 0;
 }
 ul.navi li:nth-child(even) {
  float: right;
 }
 .roomplan {
  position: relative;
 }
 div.roomplan01 {
  float: none;
  max-width: inherit;
  padding-bottom: 0;
  
 }
 div.roomplan02 {
  float: none;
  width: auto;
  text-align: center;
  padding-bottom: 0;
  margin-bottom: 30px;
 }
 .type {
  margin-bottom: 20px;
  text-align: center;
 }
 .type img {
  width:100%;
 }
 .torikago {
  margin: 0;
  float: left;
  width: 50%;
 }
 .torikago img {
  width: 100%;
 }
 div.roomplan01 ul {
  width: 45%;
  float: right;
 }
 div.roomplan01 ul li {
  margin: 0 0 10px 0;
  line-height: 0;
 }
 div.roomplan01 ul li img {
  width: 100%;
 }
 p.at {
  font-size: 8px;
  text-indent: -1em;
  margin: 0 0 5px 2em;
  line-height: 1.4;
  width: 40%;
  float: right;
 }
 p.at2 {
  font-size: 8px;
  position: static;
  width: 40%;
  float: right;
  text-indent: -1em;
  margin: 0 0 0 2em;
  line-height: 1.4;
 }
 p.madori {
  margin: 30px 0;
 }
 p.pdf {
  margin: 30px 0;
 }
 p.pdf img {
  width: 50%;
 }
 p.hanrei {
  position: static;
 }
 p.hanrei img {
  width: 70%;
 }
 div.complement {
  background-color: #e6e6e6;
  padding: 15px;
  margin: 30px 0;
 }
 div.complement h2 {
  font-size: 14px;
 }
 div.complement p {
  font-size: 10px;
 }
}