@charset "utf-8";
.photo-blur {
  filter: blur(20px);
  animation:blur .6s linear forwards
}
@keyframes blur {
  0% {
    filter: blur(20px);
  }
  100% {
    filter: blur(0);
  }
}


/*-------------------------------------------
stage延床面積表示
--------------------------------------------*/


.floor-plan{
	margin:0px auto 20px;
	background:rgba(255,255,255,.6);
	padding:20px;
}

.floor-plan .map{
	padding:20px;
	text-align:center;
}

.floor-plan .map li{
	margin:0px 0 20px;
}
.icon-list {
	display:flex;
	justify-content:center;
	align-items:center;
	gap:0 40px;
	margin:10px 0 0px;
	padding:10px 0 ;
	border-bottom:1px solid #333;
	font-size:.8rem;

}
@media (max-width: 768px) {
.icon-list {
	flex-wrap:wrap;
	gap:3px 15px;
	justify-content:center;
	max-width:100%;
	margin: 0 auto;
	}
}
.icon-list dl{
	display:flex;
	align-items:center;
	gap:0 10px;

}
@media (max-width: 768px) {
.icon-list dl{
	display:flex;
	align-items:center;
	gap:0 10px;
	width:40%;
	}
.icon-list img{
	max-width:25px;
	}
}
/*-------------------------------------------
stage説明分
--------------------------------------------*/
.stage-introduction{
	text-align:center;
	margin: 0 auto;
	font-size:1.15rem;
	line-height:2.5;
}
@media (max-width: 768px) {
.stage-introduction{
	font-size:1rem;
	}
}
/*-------------------------------------------
構造の構成
--------------------------------------------*/
.equipment-main{
	border-top:1px solid #333;
	padding:30px 0;
	margin: 60px auto;
}
@media (max-width: 768px) {
.equipment-main{
	margin: 60px auto 40px;
	}
}


.equipment-title{
	text-align:center;
	font-size:1.9rem;
	padding:0px 0 30px;
}
@media (max-width: 768px) {
.equipment-title{
	font-size:1.5rem;
	}
}
/*---2枚の場合--*/
.equipment-photo{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:0 20px;
}
@media (max-width: 768px) {
.equipment-photo{
	grid-template-columns:1fr;
	gap:10px 0;
	}
}
/*---1枚の場合--*/
.equipment-photo_one{
	display:grid;
	grid-template-columns:1fr;
	margin:0 0 25px;
}

.equipment-photo div ,
.equipment-photo_one div{
	position:relative;
}
.position-type_left{
	position:absolute;
	left:3px;
	bottom:5px;
}
.position-type_left_another{
	position:absolute;
	left:3px;
	bottom:-20px;
	font-size:1rem;
}
@media (max-width: 768px) {
.position-type_left_another{
	bottom:-15px;
	font-size:.8rem;
	}

}

.position-type_right{
	position:absolute;
	right:3px;
	bottom:5px;
}
.equipment-text{
	margin:40px auto 0px;
	text-align:center;
}
@media (max-width: 768px) {
.equipment-text{
	margin:20px auto 0px;
	
	}
}
.equipment-text dt{
	font-size:1.4rem;
}
@media (max-width: 768px) {
.equipment-text dt{
	font-size:1.2rem;
	}
}
.equipment-text dd{
	font-size:1rem;
	margin:0px 0 0;
}
@media (max-width: 768px) {
.equipment-text dd{
	font-size:.9rem;
	text-align:left;
	}
}
/*-------------------------------------------
構造の写真リスト
--------------------------------------------*/
.equipment-photo_sub{
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:40px 20px;
}
@media (max-width: 768px) {
.equipment-photo_sub{
	grid-template-columns:repeat(2, 1fr);
	gap:30px 20px;
	}
}
.equipment-photo_sub div dt{
	position:relative;
}
.equipment-photo_sub div dd{
	font-size:.9rem;
	line-height:1.2;
	margin:5px 0 0;
}
.equipment-photo_sub div dd span{
	font-size:.8rem;
	display:block;
}
@media (max-width: 768px) {
.equipment-photo_sub div dd span{
	font-size:.7rem;
	}
}

.equipment-space{
	margin:70px 0 0;
}
@media (max-width: 768px) {
.equipment-space{
	margin:50px 0 0;
	}
}
/*-------------------------------------------
スライダーの構成
--------------------------------------------*/
.slick-slider div { transition: none; }
.slider {
	width:100%;
	margin:0 auto;
}
@media (max-width: 768px) {
.slider {
	width:95%;
	}
}

.slider img {
	width:100%;
	height:auto;
}

.slider p{
	position:relative;
}
.slider p span{
	position:absolute;
	left:5px;
	bottom:0;
	color:#fff;
	font-size:.7rem;
}


.slider .slick-slide {
	margin:0 10px;
}
.slick-prev, 
.slick-next {
	position: absolute;
	top: 30%;
	cursor: pointer;
	outline: none;
	border-top: 2px solid #666;
	border-right: 2px solid #666;
	height: 15px;
	width: 15px;


}

.slick-prev {
	left: -2%;
	transform: rotate(-135deg);
	display:none;
}

.slick-next {
	right: -2%;
	transform: rotate(45deg);
	display:none;
}


.slick-dots {
	text-align:center;
	margin:20px 0 0 0;
}

.slick-dots li {
	display:inline-block;
	margin:0 5px;
}

.slick-dots button {
	color: transparent;
	outline: none;
	width:5px;
	height:13px;
	display:block;
	background:none;
	border:1px solid #000;
}

.slick-dots .slick-active button{
    background:#000;
}
.slider-text{
	text-align:center;
	margin:10px 0 0;
}
.slider-text dt{
	font-size:1.2rem;
	margin:0 0 5px;
	font-weight:700;
}
.slider-text dd{
	font-size:1rem;
}
@media (max-width: 768px) {
.slider-text dt{
	font-size:1rem;
}
.slider-text dd{
	font-size:.9rem;
	}

}

.stage-select {
	text-align:center;
	max-width:300px;
	margin: 0 auto;
	position:relative;
}
.stage-select a{
	font-size:1.1rem;
	text-decoration:none;
	color:#333;
	background:#ddd;
	padding:10px 20px;
	display:block;
	border-radius:50px;
}
@media (max-width: 768px) {
.stage-select a{
	font-size:.9rem;
	}
}

.stage-select:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 1px #333;
  border-right: solid 1px #333;
  transform: rotate(-45deg);
  position: absolute;
  top: 0;
  left: 20px;
  bottom: 0;
  margin: auto;
	}

/*-------------------------------------------
stage別の構成
--------------------------------------------*/
.floor_list{
	margin:60px 0 60px;
}
.stage_b{
	display:grid;
	grid-template-columns:1.5fr 1.5fr;
	gap:0 40px;
}
.stage_a{
	display:grid;
	grid-template-columns:1fr;
	gap:0 40px;
	
}
.position-style{
	position:absolute;
	left:10px;
	bottom:10px;
	text-shadow: 3px 3px 5px rgba(14, 51, 29, 0.8);
	padding: .1rem .8rem .5rem;
	color:#fff;
}
.position-style dt{
	font-size:1.5rem;
	margin:10px 0 0;
}
.position-style dt span{
	font-size:1rem;
	display:inline-block;
	margin:0 15px;
}

.position-style dd{
	font-size:.95rem;
}
@media (max-width: 768px) {
.position-style{
	position:static;
	left:0px;
	bottom:0px;
	background:none;
	padding: 0rem 0rem 2rem;
	color:#222;
	text-shadow:none;
}
.position-style dt{
	font-size:1.15rem;
}
.position-style dd{
	font-size:.9rem;
	}
.position-style dt span{
	font-size:.9rem;
	}	
}


@media (max-width: 768px) {
.floor_list{
	margin:30px auto 50px;

	}
.stage_b{
	grid-template-columns: 1fr;
	gap:0px 0px;
	}
}

.floor_list dt{
	font-size:1.4rem;
}
@media (max-width: 768px) {
.floor_list .first{
	margin:0px 0 40px;
}
.floor_list dt{
	font-size:1.1rem;
	margin:10px 0 0;
	}
}
.floor_list dd{
	font-size:1rem;
}
@media (max-width: 768px) {
.floor_list dd{
	font-size:.9rem;
	}
}

.color-orange{
	color:#F4582D;
}

/*------------------------------

stage構成

--------------------------------*/
.stage-lbl-div{
	display:grid;
	grid-template-columns:1fr 3fr;
	padding:50px 0 ;
	align-items:center;
	gap:0 20px;
}
@media (max-width: 1040px) {
.stage-lbl-div{
	grid-template-columns:1fr;
	gap:20px 0;
	}
}


.stage-lbl-div .room_detail{
	display:flex;
	font-size:.8rem;
	gap:0 10px;
	justify-content:center;
	padding:5px 60px;
	margin:0px 0 0;
	background:#ccc;
}
.room-size .notice_sp{
	display:none;
	}
@media (max-width: 1040px) {

.room-size ul li .notice{
	display:none;
	}
.room-size .notice_sp{
	display:block;
	font-size:.8rem;
	margin:10px 0 0;
	}
}


/*--------------------------------------------

矢印指定

---------------------------------------------*/
.read-btn{
	margin: 30px auto 60px;
}
@media (max-width: 768px) {
.read-btn{
	text-align:center;
	}
}

/*
.btnarrow{
	position: relative;
	padding: 5px 30px;
	display: inline-block;
	text-decoration: none;
	color:#fff;
	outline: none;
	transition: all .2s linear;
	background:none;
	font-size:1.2rem;
	border:3px solid #fff;
}

.btnarrow:hover{
	color: #fff;
	border:3px solid #333;
}
*/




/*-------------------------------------------
stage-body
--------------------------------------------*/
.stage-body{
	background:#404040;
	color:#fff;
	padding:3rem 0;
	text-align:center;
}
@media (max-width: 768px) {
.stage-body{
	padding:.2rem 0;
	}
}
.stage-title{
	display:flex;
	justify-content:center;
	align-items:center;
	max-width:500px;
	margin: 0 auto 0px;
	gap:0 40px;
}
.stage-title .order01{
/*	background:#ccc;*/
	text-align:center;
}

@media (max-width: 768px) {
.stage-title{
	grid-template-columns:1fr 2fr;
	max-width:100%;
	margin: 0 auto 0px;
	}
}
.stage-title p{
	font-size:1.1rem;
	letter-spacing:3px;
}
@media (max-width: 768px) {
.stage-title p{
	font-size:1.1rem;
	}
}
.stage-title p span{
	font-size:2.8rem;
	display:inline-block;
	margin:0 5px;
}
@media (max-width: 768px) {
.stage-title p span{
	font-size:2.3rem;
	}
}
.room_detail{
	display:flex;
	justify-content:center;
	align-items:center;
	gap:0 5px;
	font-size:1rem;
	background:#ccc;
	padding:0px 40px;
	color:#333;
}
@media (max-width: 768px) {
.room_detail{
	font-size:.9rem;
	padding:0px 20px;
	}
}
.stage-room-size{
	max-width:500px;
	margin: 0 auto 0px;
	letter-spacing:2px;
}

.stage-room-size .main-size li{
	font-size:1.2rem;
}
@media (max-width: 768px) {
.stage-room-size .main-size li{
	font-size:1rem;
	}
}

.stage-room-size .main-size li:before{
	content:"■";
}
.stage-room-size .main-size li:nth-child(1){
	margin:-0px 0 -15px;
}
@media (max-width: 768px) {
.stage-room-size .main-size li:nth-child(1){
	margin:-10px 0 -15px;
	}
}
.stage-room-size .main-size li span{
	font-size:2rem;
}
@media (max-width: 768px) {
.stage-room-size .main-size li span{
	font-size:1.7rem;
	}
}
.stage-room-size .sub-size{

	gap:0 10px;
	font-size:1.05rem;
}
@media (max-width: 768px) {
.stage-room-size .sub-size{
	font-size:.9rem;
	}
}
.notice-stage{
	max-width:500px;
	margin: 10px auto 0px;
	font-size:.8rem;
}
.color_b{
	color:#333;
}


.img--photo img{
	vertical-align:bottom;
}

.materials a{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display:block;
}

.materials a:hover{
	background:rgba(0,0,0,.2);
}
.materials{
	position:relative;
	margin: 100px auto 30px;
	background:#222;
	display:grid;
	grid-template-columns:1fr 1.2fr 1fr;
	align-items:center;
}
@media (max-width: 768px) {
.materials{
	grid-template-columns:1fr;
	}

}

.materials .photo img,
.materials .photo02 img{
	vertical-align:bottom;
}
/*
.materials .photo::before{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:347px;
	height:auto;
	display:block;
	background:rgba(0,0,0,.5);
	padding:173px 0;
}
.materials .photo02::before{
	content:"";
	position:absolute;
	right:0;
	bottom:0;
	width:347px;
	height:auto;
	display:block;
	background:rgba(0,0,0,.5);
	padding:173px 0;
}
@media (max-width: 768px) {
.materials .photo::before{
	width:100%;
	padding:76px 0;
}
.materials .photo02::before{
	width:100%;
	padding:76px 0;
	}
}
*/
.materials dl{
	background:#222;
	color:#fff;
	padding:1.3rem 0;
	font-size:1.6rem;
	letter-spacing:3px;
	text-align:center;

}

.materials dd{
	font-size:1.1rem;
}

.topleft{
	position:absolute;
	left:5px;
	bottom:3px;
	font-size:.8rem;
	color:#fff;
	z-index:1;
}
.bottomright{
	position:absolute;
	right:5px;
	bottom:3px;
	font-size:.8rem;
	color:#fff;
	z-index:1;
}


/*
@media (max-width: 768px) {
.materials{
	margin: 60px auto;
}
.materials dt{
	font-size:1.2rem;
	padding:.5rem 0;
	}
}

.materials dd{
	color:#191919;
	font-size:1.1rem;
	line-height:1.3;
	letter-spacing:3px;
	text-align:center;
	padding:1.2em 0em;
}
@media (max-width: 768px) {
.materials dd{
	font-size:.9rem;
	line-height:1.3;
	padding:.8em 0em;
	}
}
*/

.ac-list{
	display: flex;
	justify-content: center;
	align-items: center;
	gap:0 20px;
}
.ac-list a{
	display:block;
	text-decoration:none;
	color:#fff;
	font-size:clamp(15px,2.5vw,18px);
	padding:10px 60px;
	letter-spacing:2px;
}
.ac-list .type_a{
	background:#8A987F;
}
.ac-list .type_b{
	background:#CA8367;
}


.materials_inner{
	display:grid;
	grid-template-columns:1.05fr 1.3fr 1.05fr;
	margin:30px 0;
	align-items:center;
	background:#1a1a1a;
  position:relative;
}
@media (max-width: 768px) {
.materials_inner{
	grid-template-columns:1fr 1fr ;

	}
.materials_inner .textarea{
	grid-column:span 3;
	grid-row: 1;
	}
}

.materials_inner div{
	background:#1a1a1a;
	color:#fff;
	text-align:center;
	position:relative;
}

@media (max-width: 768px) {
.materials_inner div dl{
	padding:10px 0px;
	}

}

.materials_inner div dl dt{
	font-size:1rem;
	letter-spacing:1px;
}
@media (max-width: 768px) {
.materials_inner div dl dt{
	font-size:.9rem;
	}
}
.materials_inner div dl dd{
	font-size:1.4rem;
	letter-spacing:1px;
	position: relative;
}
@media (max-width: 768px) {
.materials_inner div dl dd{
	font-size:1.1rem;
	}
}


.materials_inner div dl dd:before{
	content: '';
	position: absolute;
	bottom:18px;
	right:5%;
	width: 8%;
	height: 2px;
	background:#fff;

}
.materials_inner div dl dd:after{
	content: '';
	position: absolute;
	bottom:23px;
	right:5%;
	width: 15px;
	height:2px;
	background:#fff;
	transform: rotate(35deg);
}

@media (max-width: 768px) {
.materials_inner div dl dd:before{
	bottom:15px;
	width: 15%;
}
.materials_inner div dl dd:after{
	bottom:20px;
	}
}

.materials_inner img{
	vertical-align:bottom;
}

.materials_inner a{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}
.materials_inner a:hover{
	background:rgba(255,255,255,.2);
}