@charset "utf-8";
/* CSS Document*/
body {
  -webkit-text-size-adjust: 100%;
	overflow-y: auto;
}
article {
  color: #555;
  margin-bottom: -5px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-style: normal;
}
@media screen and (max-width: 1240px) {
  #articlein {
    width: 95%;
  }
}
@media screen and (max-width: 980px) {
  #articlein {
    width: 100%;
  }
}
article a {
  color: #555;
  font-weight: normal;
}
article h3 {
	width: 16%;
  margin: 50px 0;
  font-family: 'Nunito', sans-serif;
  text-align: center;
  color: #231815;
  font-size: 30px;
  border: solid 3px #231815;
  padding: 0.3em 0.5em;
  border-radius: 0.3em;
}
article img {
	max-width: 100%;
	height: auto;
}

#gFooter {
	margin-top: 0!important;
}
.box950 {
  max-width: 950px;
  margin: 0 auto;
}
.box800 {
  width: 800px;
  margin: 0 auto;
}
.box600 {
  width: 600px;
  margin: 0 auto;
}
.box475 {
  width: 475px;
}
.left {
  float: left;
}
.right {
  float: right;
}
@media screen and (max-width: 639px) {
	article h3 {
		width: 50%;
	}
	.box950 {
		width: 95%;
	}
	.bl_backToTop{
		z-index: 10;
	}
}
/* ---------------------------
#mail
------------------------------ */
.mail {
	width: 8%;
  position: fixed;
  bottom: 10px;
  right: 10px;
	text-align: right;
  z-index: 11;
	
}
a:hover {
  opacity: 0.6;
  filter: brightness(110%);
}

@media screen and (max-width: 639px) {
	.mail {
		width: 25%;
	}
}
/* ---------------------------
#title
------------------------------ */
#title {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 50px;
}
#title h1 {
  max-width: 950px;
  margin: 0 auto;
}
#animation {
  display: none;
}
/* ---------------------------
	#topp
------------------------------ */
#topp {
  text-align: left;
  letter-spacing: 0.1em;
  line-height: 230%;
  padding: 70px 50px;
  background-color: #F5EDE1;
}
#topp p {
  font-size: 15px;
}
#topp h2 {
  font-family: 'Nunito', sans-serif;
  text-align: left;
  color: #231815;
  font-size: 36px;
  margin-bottom: 10px;
}
@media screen and (max-width: 639px) {
	#topp h2 {
		line-height: 110%;
	}
}
/* ---------------------------
#area
------------------------------ */
#area {
  padding: 70px 50px;
}

.placebox h2 {
  font-family: 'Nunito', sans-serif;
  text-align: left;
  color: #231815;
  font-size: 36px;
  margin-bottom: 10px;
}
.placepic {
  max-width: 950px;
  position: relative;
  margin: 0 auto;
  height: 650px;
}
.placepic01 {
  position: absolute;
  top: 3%;
  left: 5%;
  z-index: 2;
}
.placepic02 {
  position: absolute;
  top: 45%;
  left: 10%;
  z-index: 1;
}
.placebox {
  padding: 70px 50px;
  margin: 2em 0 10em;
  background-color: #F5EDE1;
  width: 50%;
  height: auto;
  position: absolute;
  text-align: left;
  right: 0;
  top: 10%;
  z-index: 3;
  font-size: 15px;
  letter-spacing: 0.1em;
  line-height: 230%;
}
.list45 li {
  width: 49.5%;
}

@media screen and (max-width: 639px) {
	#area {
		padding: 0;
	}
	.placepic {
		height: 100%;
	}
	.placepic01 {
		width: 100%;
		margin-bottom: 20px;
		position: relative;
		top: 0;
		left: 0;
	}
	.placepic02 {
		width: 100%;
		position: relative;
		top: 0;
		left: 0;
	}
	.placebox {
		position: relative;
		top: 0;
		 width: 100%;
		text-align: start;
		margin-bottom: 0;
	}
}
/* ---------------------------
#plan
------------------------------ */
#plan {
  padding-top: 50px;
  text-align: center;
}
#plan h1 {
  padding-bottom: 40px;
}

@media screen and (max-width: 639px) {
	#plan p img {
		width: 100%;
	}
	#plan img {
		width: 80%;
	}
}

/* ---------------------------
#photos
------------------------------ */
#photos {
  text-align: center;
}
#photos p {
  margin-bottom: 50px;
}
.phototate {
  width: 950px;
  text-align: center;
}
#photos {
  font-size: 18px;
}
#click {
  text-align: center;
  margin-top: 50px;
}
#photos ul {
  max-width: 750px;
  margin: 0 auto;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(95px, 1fr));
  text-align: center;
}
@media screen and (max-width: 639px) {
	#photos p {
		text-align: left;
		font-weight: 15px;
	}
}
/*--------------------------------------------------
 #virtualtour
----------------------------------------------------*/
#virtualtour {
  max-width: 950px;
  margin: 10vw auto;
	font-size: 1.5rem;
}
#virtualtour h3 {
	width: 30%;
}
.vrbox {
  width: 100%;
}
.vrbox iframe {
  height: 600px;
}
#virtualtour .vrbox {
  width: 100%;
}
#virtualtour .txt {
	max-width: 100%;
	margin-bottom: 1em;
	line-height: 230%;
}
/*スマホ表示*/
@media screen and (max-width: 768px) {
	#virtualtour {
		width: 95%;
	}
	#virtualtour h3 {
		width: 65%;
	}
  .vrbox iframe {
    padding-left: 10px;
    padding-right: 10px;
    height: 400px;
  }
}
/* ---------------------------
details
------------------------------- */

#details {
  margin-top: 80px;
  max-width: 950px;
  margin: 50px auto;
	font-size: 1.5rem;
}
#details table th,
#details table td {
  border-block-end: 1px dotted #424a61;
  padding-inline-start: 10px;
  vertical-align: middle;
  height:auto;
	line-height: 210%;
}

#wakugaiyoL table,
#wakugaiyoR table {
  width: 100%;
  margin: 0 auto;
}
#details table th,
#details table td {
  display: table-cell;
  text-align: justify;
}
#details table th {
  background: none;
  padding-inline-start: 0;
}
#details th {
	white-space: nowrap;
}

/* clearfix */
.clearfix:after {
	clear: both;
	content: "";
	display: block;
}
.clearfix {
	*zoom: 1;
}
/*sp表示*/
@media screen and (max-width: 639px) {
  #details {
    clear: both;
	  width: 95%;
  }
  #wakugaiyoL,
  #wakugaiyoR {
    float: none;
    margin: 0 auto;
    width: 95%;
  }
  .wakugaiyo td,
  .wakugaiyo th {
    line-height: 210%;
    text-align: justify;
  }
  #details table th,
  #details table td {
    display: block;
    height: auto;
    padding-inline-start: 10px;
    border-block-end: 1px dotted #424a61;
    vertical-align: middle;
  }
  #details table th {
    background: #f4ecdf9c;
    width: 100%;
    font-weight: normal;
    /*color: #013d72;*/
  }
  #details td {
    width: 100%;
  }
  #wakugaiyoL table,
  #wakugaiyoR table {
    margin: 0 auto;
  }
}
	
	
  /* ---------------------------
問い合わせ
------------------------------ */
.inquiry {
    text-align: center;
    padding-bottom: 100px;
    margin: 0 auto;
  }

  /* ---------------------------
gmaps
------------------------------ */
  #map {
    width: 100%;
    margin: 0 auto;
  }