@charset "utf-8";
/* =============================================================
 * 標準仕様一覧
 * ============================================================= */
.content {
 	padding: 5% 0;
}
.wrap01 {
	width: 80%;
	margin: 0 auto 3%;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap02 {
	width: 80%;
	margin: 0 auto;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap03 {
	width: 80%;
	margin: 0 auto 3%;
	background: #E5DDD9;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap04 {
	width: 80%;
	margin: 0 auto 3%;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap05 {
	width: 80%;
	margin: 0 auto 3%;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap06 {
	width: 80%;
	margin: 0 auto 3%;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap07 {
	width: 80%;
	margin: 0 auto 3%;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap08 {
	width: 80%;
	margin: 0 auto 3%;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap09 {
	width: 80%;
	margin: 0 auto 3%;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap10 {
	width: 80%;
	margin: 0 auto;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.wrap11 {
	width: 80%;
	margin: 0 auto 3%;
	background: #FFF;
	color: #000;
	box-sizing: border-box;
	padding: 2%;
}
.headline {
	margin: 0 0 2%;
	border-bottom: 1px dotted #000000;
	font-size: 1.8vw;
	font-weight: bold;
}
.wrap01 .txt01 {
	font-weight: bold;
	color: #00003A;
	margin: 0 0 3%
}
.wrap01 .span01 {
	font-size: 1.4vw;
	color: #000; 
}
.wrap01 .txt02 {
	font-size: 1.1vw;
	margin: 0 0 0.5%;
	font-weight: bold;
}
.wrap01 .txt03 {
	margin: 0 0 1%;
}
.wrap01 .image-wrap {
	margin: 0 0 3%;
}
.wrap01 .image01 {
	width: 32%;
	margin: 0 2% 0 0;
	float: left;
}
.wrap01 .image02 {
	width: 32%;
	float: left;
}
.wrap01 .image03 {
	margin: 1% 5% 0;
	width: 40%;
	float: left;
}
.wrap01 .btn {
  margin: 0 auto;
  width: 20%;
  border: 1px solid #FFFFFF;
  background-color: #00003A;
  text-align: center;
}
.wrap01 .btn a {
  width: 100%;
  padding: 2% 0;
  color: #FFFFFF;
  font-weight: bold;
  display: block;
}
.wrap02 .txt01 {
	margin: 0 0 3%;
}
.wrap02 .image-wrap {
	margin: 0 0 3%;
}
.wrap02 .image01 {
	width: 32%;
	margin: 0 2% 0 0;
	float: left;
}
.wrap02 .image02 {
	width: 32%;
	float: left;
}
.wrap03 .box01  {
	width: 47%;
	float: left;
}
.wrap03 .logo  {
	margin: 0 0 7%;
	width: 60%;
}
.wrap03 .txt01 {
	font-size: 1.5vw;
	font-weight: bold;
	color: #00003A;
	margin: 0 0 7%
}
.wrap03 .txt02 {
	margin: 0 0 1%;
}
.wrap03 .txt03 {
	font-size: 1.5vw;
	font-weight: bold;
	color: #00003A;
	margin: 0 0 1%
}
.wrap03 .txt04 {
	margin: 0 0 5%;
	width: 70%;
}
.wrap03 .roof-wrap  {
	margin: 0 0 3%;
}
.roof-wrap .box01  {
	width: 50%;
	float: left;
}
.wrap03 .box02  {
	width: 47%;
	float: right;
}
.wrap03 .box03 {
	width: 85%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding: 2%;
	box-sizing: border-box;
	margin: 0 0 5%;
	background-color: #FFFFFF;
}
.wrap03 .tile01 {
	text-align: center;
	font-size: 1.3vw;
	margin: 0 5% 0 0;
	width: 30%;
	float: left;
}
.wrap03 .tile02 {
	text-align: center;
	font-size: 1.3vw;
	margin: 0;
	width: 30%;
	float: left;
}
.wrap03 .tile-wrap01 {
	margin: 0 auto 3%;
}
.wrap03 .tile-wrap02 {
	margin: 0 auto;
}
.wrap03 .box03 .image {
	margin: 0 auto 1%;
	width: 80%;
}
.wrap04 .txt01 {
	font-size: 1.5vw;
	font-weight: bold;
}
.wrap04 .txt02 {
}
.wrap04 .box01 {
	width: 35%;
	float: left;
}
.wrap04 .box02 {
	width: 60%;
	margin: 0 0 5%;
	float: right;
}
.wrap04 .box03 {
	width: 50%;
	float: right;
}
.wrap04 .box04 {
	width: 45%;
	float: left;
}
.wrap04 .box04 {
	width: 45%;
	margin: 0 0 5%;
	float: left;
}
.bar {
	border-bottom: 1px dotted #000000;
	clear: both;
	margin: 0 0 3%;
}
.wrap04 .box05 {
	width: 55%;
	float: right;
}
.wrap04 .box06 {
	width: 45%;
	float: left;
}
.wrap04 .image01  {
	margin: 0 auto 5%;
	width: 70%;
}
.wrap04 .box07 {
	width: 50%;
	margin: 20% 0 0;
	float: right;
}
.wrap05 .box01  {
	width: 44%;
	float: left;
}
.wrap05 .box02 {
	width: 51%;
	float: right;
}
.wrap05 .box03  {
	width: 47%;
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding: 0 5%;
	box-sizing: border-box;
}
.wrap05 .box04 {
	width: 47%;
	float: right;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding: 0 5%;
	box-sizing: border-box;
}
.wrap05 .image {
	margin: 0 0 10%;
}
.wrap05 .txt01  {
	font-size: 1.3vw;
	margin: 0 0 1%;
	font-weight: bold;
}
.wrap05 .txt02 {
	margin: 0 0 5%;
}
.wrap06 .txt01 {
	font-weight: bold;
	color: #00003A;
	margin: 0 0 3%
}
.wrap06 .door-wrap {
}
.wrap06 .box01  {
	width: 50%;
	float: left;
}
.wrap06 .box02 {
	float: right;
	margin: 0 0 3%;
	width: 45%;
}
.wrap06 .txt02 {
	font-size: 1.3vw;
	font-weight: bold;
}
.wrap06 .txt03 {
	margin: 0 0 5%
}
.wrap07 .photo-wrap01 {
	margin: 0 0 5%;
}
.wrap07 .photo-wrap02 {
	margin: 0 auto;
	width: 70%;
}
.wrap07 .box01 {
	width: 31%;
	float: left;
}
.wrap07 .box02  {
	margin: 0 0 0 4%;
	width: 31%;
	float: left;
}
.wrap07 .box03 {
	width: 31%;
	float: right;
}
.wrap07 .box04  {
	width: 35%;
	float: left;
}
.wrap07 .box05 {
	width: 35%;
	float: right;
}
.wrap07 .photo {
	margin: 0 0 4%;
}
.wrap07 .txt01 {
	font-size: 1.4vw;
	font-weight: bold;
}
.wrap08 .txt {
	width: 65%;
	float: left;
}
.wrap08 .image01 {
	width: 35%;
	float: right;
}
.wrap08 .image02 {
	margin: 0 4% 0 0;
	width: 48%;
	float: left;
}
.wrap08 .image03 {
	width: 48%;
	float: left;
}
.wrap09 .interior {
	margin: 0 0 5%;
	width: 100%;
}
.wrap09 .box01 {
	width: 30%;
	float: left;
}
.wrap09 .box02 {
	width: 65%;
	float: right;
}
.wrap09 .txt01 {
	font-weight: bold;
	color: #00003A;
	margin: 0 0 3%;
	font-size: 1.1vw;
}
.wrap09 .txt02 {
	font-size: 1.1vw;
}
.wrap10 .txt01 {
	font-weight: bold;
	color: #00003A;
	margin: 0 0 3%;
	font-size: 1.1vw;
}
.wrap10 .image01 {
	margin: 10% 3% 0 0;
	width: 27%;
	float: left;
}
.wrap10 .image02  {
	float: right;
	width: 40%;
}

.wrap11 .box01  {
	float: left;
	width: 55%;
}
.wrap11 .headline img {
	width: 64%;
}
.wrap11 .txt01 {
	font-size: 2vw;
	font-weight: bold;
	margin: 4% 0 5%;
}
.wrap11 .txt02 {
	line-height: 1.75;
	padding-right: 8%;
}
.wrap11 .box02 {
	float: right;
	width: 45%;
	display: flex;
	flex-wrap: wrap;
	row-gap: 3em;
}
.wrap11 .box02 img {
}
.wrap11 .box03 {
	display: flex;
	justify-content: space-between;
	column-gap: 2%;
	margin: 3% 0 0;
}
.wrap11 .box03 > * {
	width: 32%;
}


/* 
=============================
　　　　スマホ
=============================
*/
@media screen and (max-width: 699px) {
.wrap01 {
	width: 90%;
}
.wrap02 {
	width: 90%;
}
.wrap03 {
	width: 90%;
}
.wrap04 {
	width: 90%;
}
.wrap05 {
	width: 90%;
}
.wrap06 {
	width: 90%;
}
.wrap07 {
	width: 90%;
}
.wrap08 {
	width: 90%;
}
.wrap09 {
	width: 90%;
}
.wrap10 {
	width: 90%;
}
.wrap11 {
	width: 90%;
}
.headline {
  font-size: 16px;
}
.wrap01 .span01 {
  font-size: 14px;
}
.wrap01 .txt02 {
  font-size: 14px;
}
.wrap01 .image01 {
  width: 100%;
  margin: 0 0 1%;
  float: none;
}
.wrap01 .image02 {
  width: 100%;
  float: none;
}
.wrap01 .image03 {
  margin: 0 0 5%;
  width: 100%;
  float: none;
}
.wrap01 .btn {
  margin: 0 auto;
  width: 80%;
}
.wrap02 .image01 {
  width: 100%;
  margin: 0 0 1%;
  float: none;
}
.wrap02 .image02 {
  width: 100%;
  float: none;
}
.wrap03 .box01 {
  width: 100%;
  float: none;
}
.wrap03 .txt01 {
  font-size: 14px;
}
.wrap03 .logo {
  margin: 10% auto 5%;
  width: 80%;
}
.wrap03 .box02 {
  width: 100%;
  float: none;
	margin: 0 0 10%;
}
.wrap03 .txt03 {
  font-size: 16px;
  margin: 0 0 3%;
}
.wrap03 .box03 {
  width: 100%;
}
.wrap03 .tile01 {
  font-size: 12px;
}
.wrap03 .tile02 {
  font-size: 12px;
}
.wrap03 .txt04 {
  margin: 0 0 5%;
  width: 100%;
}
.wrap04 .box01 {
  width: 100%;
  float: none;
}
.wrap04 .box02 {
  width: 100%;
  float: none;
}
.wrap04 .box03 {
  width: 100%;
  float: none;
}
.wrap04 .txt01 {
  font-size: 14px;
}
.wrap04 .box04 {
  width: 100%;
  float: none;
}
.wrap04 .box05 {
  width: 100%;
  float: none;
}
.wrap04 .box06 {
  width: 100%;
  float: none;
}
.wrap04 .image01 {
  margin: 0 auto 5%;
  width: 60%;
}
.wrap04 .box07 {
  width: 100%;
  margin: 0;
  float: none;
}
.wrap05 .box01 {
  width: 100%;
  float: none;
}
.wrap05 .txt01 {
  font-size: 14px;
}
.wrap05 .box02 {
  width: 100%;
  float: none;
}
.wrap05 .box03 {
  width: 100%;
  float: none;
}
.wrap05 .box04 {
  width: 100%;
  float: none;
}
.wrap06 .box01 {
  width: 100%;
  float: none;
}
.wrap06 .txt02 {
  font-size: 14px;
}
.wrap06 .box02 {
  float: none;
  margin: 0 0 3%;
  width: 100%;
}
.wrap07 .box01 {
  width: 100%;
  float: none;
}
.wrap07 .box02 {
  width: 100%;
  float: none;
	margin: 0;
}
.wrap07 .box03 {
  width: 100%;
  float: none;
}
.wrap07 .box04 {
  width: 100%;
  float: none;
}
.wrap07 .box05 {
  width: 100%;
  float: none;
}
.wrap07 .txt01 {
  font-size: 14px;
}
.wrap07 .txt02 {
  margin: 0 0 15%;
}
.wrap08 .txt {
  width: 100%;
  float: none;
}
.wrap08 .image01 {
  width: 60%;
}
.wrap08 .image02 {
  width: 100%;
  float: none;
}
.wrap08 .image03 {
  width: 100%;
  float: none;
}
.wrap09 .box01 {
  width: 100%;
  float: none;
}
.wrap09 .txt01 {
  font-size: 14px;
}
.wrap09 .txt02 {
  font-size: 14px;
}
.wrap09 .box02 {
  width: 100%;
  float: none;
}
.wrap10 .txt01 {
  font-size: 14px;
}
.wrap10 .image01 {
  margin: 5% 2% 5% 0;
  width: 48%;
}
.wrap10 .image02 {
  float: none;
  width: 100%;
}

.wrap11 .box01  {
	float: none;
	width: 100%;
}
.wrap11 .txt01 {
	font-size: 18px;
}
.wrap11 .txt02 {
}
.wrap11 .box02 {
	float: none;
	width: 100%;
	row-gap: 20px;
	margin-top: 5%;
}
.wrap11 .box02 img {
}
.wrap11 .box03 {
	flex-wrap: wrap;
	row-gap: 20px;
}
.wrap11 .box03 > * {
	width: 100%;
}


}