@charset "utf-8";


/*--------------------------
ポップアップ後
----------------------------*/
.plan-pop-bg {
	background: #FFF;
	width:100%;
}

.plan-pop-area {
	width: 90%;
	max-width: 1200px;
	margin:auto;
	margin-top: 100px;
	margin-bottom: 50px;
	text-align: center;
	font-size: 16px;
	letter-spacing: 0;
  font-family: 'Amiri', 'Noto Serif', 'Times New Roman', Times, '游明朝', YuMincho, 'HG明朝B', 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'ＭＳ 明朝', serif;
	color:#444;
-webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}


@media screen and (min-width:769px){
.plan-pop-area .flex {
	display: flex;
	align-items: baseline;
	justify-content: center;
}
	}

.plan-pop-area h2.type {
	font-size: 2.0em;
	margin-bottom: 40px;
  display: inline-block;
  position: relative;
	font-weight: normal;

}


.plan-pop-area h2.type span {
	font-size: 0.8em;
}



.plan-pop-area h2:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -20px; /*下線の上下位置調整*/
  display: inline-block;
  width: 0px; /*下線の幅*/
  height: 1px; /*下線の太さ*/
	-moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translate(-50%); /*位置調整*/
  background-color: var(--accent-color-one) ;/*下線の色*/
	animation: line 2s ease 0s 1 forwards;
}


@keyframes line {
	0%{
		width:0px;
	}
	
	100% {
		width:70px;
	}
}

@-webkit-keyframes line {
	0%{
		width:0px;
	}
	
	100% {
		width:70px;
	}
}



/*.plan-pop-area .type:after {
	content:"";
	width: 10px;
	position: absolute;
	bottom:0;
	right:0;
	left:0;
	background-color:#FFF;
}*/

.plan-pop-area .muki {
background: #B8B288;
display: inline-block;
padding: 10px;
vertical-align: middle;
margin-left: 20px;
margin-top: -10px;
color: #FFF;
}
.plan-pop-area .madori {
	font-size: 1.65em;
/*	color: #FFF;
	background:#000;*/
	padding: 10px 0 6px;
	margin-bottom:15px;
	letter-spacing: 0em;
	display: inline-block;
}

.plan-pop-area .madori span{
	font-size: 0.7em;
	letter-spacing: 0;
}

.plan-pop-area .menseki{
		margin-bottom: 10px;
	letter-spacing: 0.1em;
}
.plan-pop-area .menseki span {
	font-size: 2.4em;
	padding-left:5px;
}
.plan-pop-area .terrace {
padding-bottom: 10px;
}
@media screen and (min-width:769px){

.plan-pop-area .madori {
	font-size: 2.0em;
	letter-spacing: 0.15em;
	}
.plan-pop-area .menseki{
margin-right: 15px;
}
	

	
.plan-pop-area .terrace {
margin-right: 10px;
}

}
.plan-pop-area .balcony span{
	padding-left:5px;
	font-size: 1.2em;
}
.plan-pop-area .plan-img {
	max-width: 600px;
	margin:auto;
	margin-top:40px;
}

.plan-pop-area .plan-img-wide {
	max-width: 1200px;
	margin:auto;
	margin-top:40px;
}

.plan-pop-area .plan-img-wide2{
	max-width:750px;
	margin:auto;
	margin-top:40px;
}
.plan-pop-area .plan-img-wide2 > img {
	width: 90%;
	height:auto;
}

.plan-pop-area .print {
	border:1px solid #B8B288;
	max-width: 250px;
	margin:auto;
	font-size: 1.2em;
	margin-top: 30px;
	transition: 0.5s;
	color:#B8B288;
}

.plan-pop-area .print a {
	width:100%;
	height:100%;
	display: block;
	padding: 20px;
}

.plan-pop-area .print:hover {
	cursor:pointer;
	background:#B8B288;
	color:#FFF;
}

@media screen and (min-width:769px){
	.btn-area {
		display: flex;
		justify-content: center;
		margin-top: 40px;
	}
	.plan-pop-area .print{
		width:42%;
		margin: 15px 5px;
	}

}

@media screen and (max-width:1024px){
.slider {
	display: none!important;
}}

@media screen and (min-width:600px) and (max-width:1600px){
.plan-img-wide {
width: 80%;
max-width: 1000px;
}

}
/*--------------------------
タイムラプス
----------------------------*/
.timelapse {
	display: block;
	text-align: center;
	margin:auto;
	width:90%;
	max-width: 1000px;
	margin-bottom: 30px;
}

.timelapse video {
	width:100%;
	height:auto; 
}

.timelapse p {
    font-size: 8px;
	text-align: right;
	margin-top: 2px;
}


@media print {
	#content-mv-area {display: none; height: 0;}
	.mainvisual-fixed {height:0; background:none;}
	.plan-pop-area {margin-top:50px;}
	
}


.view-caption {
font-size: 13px;
position: static;
text-align: left;
max-width: 90%;
margin:auto;
margin-top: 10px;
}

@media screen and (min-width: 768px){
.view-caption {
text-align: center;

}

}

.planc-img > img {
	width: 80%;
	margin: auto;
	
}




.setsubi-list {
	border: 1px solid var(--second-color);
    font-size: 17px;
    line-height: 2.5em;
    margin: 50px auto 20px;
    padding: 30px;
    text-align: justify;
	max-width: 750px;
}

.point-area li {
border: 1px solid var(--accent-color-one);
padding: 20px 0;
font-size: 1.2em;
margin:20px auto 0;
max-width: 600px;
background: var(--second-color);
}



.attention {
font-size: 12px;
opacity: 0.9;
}