@charset "utf-8";

/* ++++++++++++++++++++++++++++++++++++++++

	ownersvoice.html

++++++++++++++++++++++++++++++++++++++++ */

#contents_nav .ownersvoice {
	display: none;
}

#mv,
#mv .img::after {
	background: #e4e4e5;
}

#mv {
	padding-top: calc(126 / 1200 * 100%);
}

#mv .en {
	right: calc(35 / 1200 * 100%);
	top: calc(38 / 646 * 100%);
	width: calc(712 / 1200 * 100%);
}

#mv .jp {
	top: 0;
	bottom: 0;
	z-index: 2;
	width: calc(146 / 1200 * 100%);
}
#mv .jp img {
	width: calc(79 / 146 * 100%);
	padding: calc(41 / 146 * 100%) 0 0 calc(32 / 146 * 100%);
}

#mv .img {
	margin-left: calc(146 / 1200 * 100%);
}

#mv .border {
	left: 0;
	bottom: 100%;
	width: calc(289 / 1054 * 100%);
}

#mv .file {
	right: calc(35 / 1200 * 100%);
	z-index: 2;
	background: #fff;
	width: calc(110 / 1200 * 100%);
	height: calc(40 / 646 * 100%);
	animation-duration: .5s;
	animation-delay: 2s;
}
#mv .file img,
.nav a span img {
	position: absolute;
	left: 50%;
	top: calc(11 / 40 * 100%);
	width: auto;
	height: calc(22 / 40 * 100%);
	transform: translateX(-50%);
}

section section,
.title {
	position: relative;
	box-sizing: border-box;
	width: calc(890 / 1200 * 100%);
	margin: auto;
}
section h2 {
	position: absolute;
	top: 0;
	box-sizing: border-box;
	width: calc(490 / 890 * 100%);
	margin-top: calc(330 / 890 * 100%);
	padding: calc(30 / 890 * 100%) calc(40 / 890 * 100%) calc(25 / 890 * 100%) calc(50 / 890 * 100%);
}
section h2::before,
.owner>div {
	background: #7a6a56;
}
section h2::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	mix-blend-mode: multiply;
}
section h2 img {
	position: relative;
}
section h2+figure figcaption {
	margin-top: calc(10 / 890 * 100%);
	text-align: right;
	line-height: 1;
}

.subtitle {
	position: relative;
	margin-top: calc(80 / 890 * 100%);
	padding-top: calc(172 / 890 * 100%);
}
.subtitle::before,
.subtitle::after {
	content: '';
	position: absolute;
	width: calc(200 / 890 * 100%);
	height: calc(70 / 172 * 100%);
	border: solid;
}
.subtitle::before {
	left: 0;
	top: 0;
	border-width: 1px 0 0 1px;
}
.subtitle::after {
	right: 0;
	bottom: 0;
	border-width: 0 1px 1px 0;
}
.subtitle img {
	position: absolute;
	left: 50%;
	top: 50%;
	width: auto;
	height: calc(30 / 172 * 100%);
	transform: translate(-50%,-50%);
}

section section {
	margin-top: calc(100 / 1200 * 100%);
}
section h3 {
	margin-bottom: calc(45 / 890 * 100%);
}
section h3::before {
	content: '';
	display: block;
	width: calc(130 / 890 * 100%);
	background: #000;
}
section h3 img {
	width: auto;
	height: calc(27 / 1200 * 100vw);
}

.img_box figure {
	width: calc(400 / 890 * 100%);
	margin-top: calc(10 / 890 * 100%);
}

.owner {
	border: solid calc(5 / 1200 * 100vw) #efefef;
	padding: calc(65 / 1200 * 100%);
}
.owner::before {
	content: '';
	position: absolute;
	right: 100%;
	top: calc(-5 / 1200 * 100vw);
	width: calc(5 / 890 * 100%);
	margin-right: calc(5 / 1200 * 100vw);
	padding-top: calc(130 / 890 * 100%);
	background: #bf1926;
}
.owner h3 {
	position: absolute;
	top: 0;
	padding: calc(22 / 880 * 100%) 0;
}
.owner h3::before,
.building h3::before {
	display: none;
}
.owner h3 img {
	height: calc(21 / 1200 * 100vw);
}
.owner>div {
	display: flex;
	align-items: center;
}
.owner figure {
	width: calc(300 / 750 * 100%);
}
.owner>div p {
	width: calc(343 / 750 * 100%);
	margin-left: calc(55 / 750 * 100%);
}
.owner>p {
	margin: calc(45 / 750 * 100%) 0 -.625em;
	letter-spacing: .06em;
}

.building {
	width: auto;
	background: #e4e4e5;
}
.building>div {
	position: relative;
	width: calc(750 / 1200 * 100%);
	margin: auto;
	padding: calc(70 / 1200 * 100%) 0;
}
.building h3 {
	position: absolute;
	top: 0;
	transform: translateY(-50%);
}
.building h3 img {
	height: calc(28 / 1200 * 100vw);
}
.building dt,
.building dd {
	padding: .25em 0;
	line-height: 1.75;
}
.building dt {
	position: absolute;
}
.building dd {
	box-sizing: border-box;
	padding-left: calc(90 / 390 * 100%);
	border: solid 0 #fff;
	border-width: 0 0 1px;
	white-space: nowrap;
}
.building figure {
	width: calc(330 / 750 * 100%);
}

.building .new dt {
	width: calc(50 / 750 * 100%);
	padding-top: calc(20 / 750 * 100%);
}
.building .new dd {
	padding-top: calc(15 / 750 * 100%);
	border-bottom-width: 0;
}

.building .link {
	text-align: center;
	margin-top: calc(20 / 750 * 100%);
}
.building .link a {
	display: inline-block;
	text-decoration: none;
	line-height: 1;
}

.nav {
	width: calc(600 / 1200 * 100%);
	margin: calc(130 / 1200 * 100%) auto 0;
}
.nav a,
.nav a span {
	padding-top: calc(40 / 600 * 100%);
}
.nav a {
	display: block;
	position: relative;
}
.nav a span {
	position: absolute;
	right: 0;
	top: 0;
	width: calc(110 / 600 * 100%);
	background: #000;
}


/* ----------------------------------------
	ownersvoice02
---------------------------------------- */

.ownersvoice02 section h2 {
	width: calc(332 / 890 * 100%);
	margin-top: calc(35 / 890 * 100%);
	padding: calc(35 / 890 * 100%) calc(40 / 890 * 100%) calc(25 / 890 * 100%) calc(20 / 890 * 100%);
}
.ownersvoice02 section h2::before,
.ownersvoice02 .owner>div {
	background: #5b82ab;
}
.owner>div p {
	width: calc(288 / 750 * 100%);
}



/* ++++++++++++++++++++++++++++++++++++++++

	PC

++++++++++++++++++++++++++++++++++++++++ */

@media (min-width: 769px) {
	section h3::before {
		margin-bottom: calc(30 / 890 * 100%);
		padding-top: calc(5 / 890 * 100%);
	}

	.img_box {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.img_box p {
		width: calc(460 / 890 * 100%);
		letter-spacing: .06em;
	}

	.building>div>div {
		display: flex;
		justify-content: space-between;
	}
	.building>div>div dl {
		width: calc(390 / 750 * 100%);
	}

	.building ul {
		display: flex;
		justify-content: space-between;
	}
	.building li {
		width: calc(330 / 750 * 100%);
	}
	.building li dd {
		padding-left: calc(90 / 330 * 100%);
	}
	.building li figure {
		width: 100%;
		margin-top: calc(45 / 330 * 100%);
	}

	.building li .link {
		margin-top: calc(20 / 330 * 100%);
	}

	.nav a {
		transition: .2s;
	}
	.nav a:hover {
		opacity: 0.7;
	}


/* ----------------------------------------
	ownersvoice02
---------------------------------------- */

	.ownersvoice02 .img_box {
		display: block;
	}
	.ownersvoice02 .img_box figure {
		float: left;
		margin-right: calc(50 / 750 * 100%);
		margin-bottom: calc(30 / 750 * 100%);
	}
	.ownersvoice02 .img_box p {
		width: auto;
	}
}



/* ++++++++++++++++++++++++++++++++++++++++

	SP

++++++++++++++++++++++++++++++++++++++++ */

@media only screen and (max-width: 768px) {
	#mv {
		overflow: hidden;
	}
	#mv .img img {
		transform: scale(calc(920 / 767));
		transform-origin: 100% 0;
	}

	.title {
		width: calc(717 / 767 * 100vw);
	}

	section h2 {
		width: calc(321 / 767 * 100vw);
		margin-top: calc(265 / 767 * 100vw);
		padding: calc(22 / 767 * 100vw) calc(30 / 767 * 100vw) calc(22 / 767 * 100vw) calc(43 / 767 * 100vw);
	}
	section h2+figure figcaption {
		margin-top: calc(15 / 767 * 100vw);
		font-size: calc(16 / 767 * 100vw);
	}

	.subtitle {
		width: calc(657 / 767 * 100vw);
		margin: calc(80 / 767 * 100vw) auto 0;
		padding-top: calc(172 / 767 * 100vw);
	}
	.subtitle::before,
	.subtitle::after {
		width: calc(200 / 767 * 100vw);
		height: calc(70 / 767 * 100vw);
	}

	section section {
		width: calc(657 / 767 * 100vw);
		margin-top: calc(90 / 767 * 100vw);
	}
	section h3 {
		position: relative;
		margin-bottom: calc(105 / 767 * 100vw);
	}
	section h3::before {
		position: absolute;
		bottom: calc(-65 / 767 * 100vw);
		width: calc(130 / 767 * 100vw);
		height: calc(5 / 767 * 100vw);
	}
	section h3 img {
		height: calc(28 / 767 * 100vw);
	}

	section h3.multilineSP img {
		height: calc(74 / 767 * 100vw);
	}

	section p {
		font-size: calc(26 / 767 * 100vw);
		line-height: 2.15;
	}
	.img_box figure {
		width: calc(500 / 767 * 100vw);
		margin: calc(50 / 767 * 100vw) auto 0;
	}

	.owner {
		border-width: calc(5 / 767 * 100vw);
		padding: calc(65 / 767 * 100vw) calc(25 / 767 * 100vw);
	}
	.owner::before {
		top: calc(-5 / 767 * 100vw);
		width: calc(8 / 767 * 100vw);
		margin-right: calc(5 / 767 * 100vw);
		padding-top: calc(208 / 767 * 100vw);
	}
	.owner h3 {
		padding: calc(25 / 767 * 100vw) 0;
	}
	.owner h3 img {
		height: calc(19 / 767 * 100vw);
	}
	.owner figure {
		overflow: hidden;
		width: calc(202 / 767 * 100vw);
	}
	.owner figure img {
		width: auto;
		height: calc(260 / 767 * 100vw);
		margin-left: calc(-10 / 767 * 100vw);
	}
	.owner>div p {
		width: calc(351 / 767 * 100vw);
		margin-left: calc(15 / 750 * 100vw);
	}
	.owner>p {
		margin: calc(20 / 767 * 100vw) 0 -.575em;
	}

	.building>div {
		width: calc(657 / 767 * 100vw);
		padding: calc(70 / 767 * 100vw) 0;
	}
	.building li+li {
		margin-top: calc(60 / 767 * 100vw);
	}
	.building h3 img {
		height: calc(30 / 767 * 100vw);
	}
	.building dt,
	.building dd,
	.building .link {
		font-size: calc(20 / 767 * 100vw);
	}
	.building dt,
	.building dd {
		line-height: 1.8;
		padding: .3em;
	}
	.building dd {
		padding-left: calc(175 / 767 * 100vw);
	}
	.building figure {
		width: calc(500 / 767 * 100vw);
		margin: calc(50 / 767 * 100vw) auto 0;
	}

	.building .new {
		margin-top: calc(50 / 767 * 100vw);
		border-top: solid 1px #fff;
	}
	.building .new dt,
	.building .new dd {
		padding-top: calc(20 / 767 * 100vw);
	}
	.building .new dt {
		width: calc(60 / 767 * 100vw);
	}

	.building .link {
		margin-top: calc(40 / 767 * 100vw);
	}

	.nav {
		width: calc(600 / 767 * 100vw);
		margin-top: calc(70 / 767 * 100vw);
		margin-bottom: calc(50 / 767 * 100vw);
	}


	/* ----------------------------------------
		ownersvoice02
	---------------------------------------- */

	.ownersvoice02 .img_box {
		display: flex;
		flex-direction: column;
	}
	.ownersvoice02 .img_box figure {
		order: 3;
	}

	.ownersvoice02 .owner>div p {
		width: calc(308 / 767 * 100vw);
	}
	.ownersvoice02 .owner figure img {
		margin-left: calc(-50 / 767 * 100vw);
	}
}

/* ----------------------------------------
  ownersvoice03
---------------------------------------- */
.ownersvoice03 section .multilineSP img {
  height: calc(60 / 1200 * 100vw);
}
.ownersvoice03 .img_box.ver_right_img figure {
    float: right;
    margin-right: 0;
    margin-left: calc(50 / 750 * 100%);
}
.ownersvoice03 .owner>div p {
    width: calc(370 / 750 * 100%);
}

.nav.ver_column_2_list {
  width: 96%;
  max-width: 1000px;
}
.nav.ver_column_2_list ul {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.nav.ver_column_2_list li {
  width: 48%;
  margin-bottom: 50px;
  margin-right: 4%;
}
.nav.ver_column_2_list li:nth-child(2n) {
  margin-right: 0;
}
p.caption {
    text-align: right;
    font-size: 0.8em;
}
@media only screen and (max-width: 768px) {
  .ownersvoice03 section .multilineSP img {
      height: calc(156 / 767 * 100vw);
  }
  .ownersvoice03 section .ttl_002 img {
    height: calc(39 / 767 * 100vw);
  }
  .ownersvoice03 .img_box.ver_right_img figure {
      margin-right: auto;
      margin-left: auto;
  }
  .ownersvoice03 .owner>div p {
      width: calc(450 / 750 * 100%);
  }
  .nav.ver_column_2_list {
    width: 80%;
  }
  .nav.ver_column_2_list ul {
    display: block;
  }

  .nav.ver_column_2_list li {
    width: 100%;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
  }
  .nav.ver_column_2_list li:nth-child(2n) {
    margin-right: auto;
  }

}