@charset "utf-8";


/*----アンカーリンク--------------------------*/
.gallery-anc_body{
	max-width:700px;
	margin: 0 auto 80px;
}
.gallery-anc_body ul{
	display:flex;
	justify-content:center;
	gap:0 40px;
	font-size:1rem;
	letter-spacing:var(--spacing);
}
.pc-none{
	display:none;
}

@media screen and (max-width:768px){
.gallery-anc_body ul{
	flex-wrap:wrap;
	gap:20px 20px;
	font-size:1rem;
	max-width:90%;
	margin: 0 auto;
	}
.gallery-anc_body ul li{
	width:calc(95% / 2);
	text-align:center;
	}
.pc-none{
	display:block;
	}
}
.gallery-anc_body ul li a{
	display:block;
	padding:10px 60px;
	background:#fff;
	border:1px solid #555;
	box-shadow:1px 3px 6px #c6c6c6;
	color:#555;
	border-radius:100px;
	font-weight:var(--w-500);
}
/*----コピー--------------------------*/
.gallery-top_text{
	text-align:center;
	font-size:2rem;
	letter-spacing:var(--spacing);
}
.gallery-top_text span{
	display:block;
	font-size:1.3rem;
}
@media screen and (max-width:768px){
.gallery-top_text{
	font-size:1.7rem;
	}
.gallery-top_text span{
	font-size:1rem;
	}
}
/*----号棟タイトル--------------------------*/
.building-number{
 position: relative;
  padding: 0 65px;
  text-align: center;
	font-size:1.6rem;
	letter-spacing:var(--spacing);
	margin:40px 0 10px;
}
.building-number:before {
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  width: 100%;
  height: 1px;
  content: '';
  background: #000;
}
@media screen and (max-width:768px){
.building-number{
	font-size:1.3rem;
	}
}
.building-number span{
  position: relative;
  padding: 0 1em;
  background: #ABABAB;
}

/*----ギャラリーページ--------------------------*/
.slick-slider div { transition: none; }
.gallery-slider{
	padding:40px 0 ;
}
@media screen and (max-width:768px){
.gallery-slider{
	padding:0px 0 ;
	}
}
.gallery-common li{
	list-style:none;
	position:relative;

}

.gallery-common .gallery-name{
	position:absolute;
	left:15px;
	bottom:5px;
	display:block;
	color:#fff;
	font-size:.9rem;
	filter: drop-shadow(2px 0px 3px #000);
}

.slick-prev, 
.slick-next {
	position: absolute;
	z-index: 3;
	top: 50%;
	cursor: pointer;
	outline: none;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	height: 18px;
	width: 18px;
	filter: drop-shadow(2px 0px 3px #000);
}
.slick-prev {
	left:2.5%;
	transform: rotate(-135deg);
}
.slick-next {
	right:2.5%;
	transform: rotate(45deg);
}

.choice-btn-common li{
	cursor: pointer;
	outline: none;
	background:#333;
	list-style:none;
	margin:10px 0 0;

}

.choice-btn-common li img{
	opacity: 0.2;
}

.choice-btn-common li.slick-current img{
	opacity: 1;
}

.thumnail-none{
	display:none!important;
}

.con-btn{
	text-align:center;
	margin:20px 0 60px;
}
@media screen and (max-width:768px){
.con-btn{
	margin:20px 0 20px;
	}
}
.btnarrow-req{
	position: relative;
	padding: 8px 60px 8px 60px;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	color: #fff;
	outline: none;
	transition: all .2s linear;
	background:#555;
	border-radius:50px;
	letter-spacing:1px;
	font-size:1.05rem;
}

.btnarrow-req:hover{
	background:#333;
	color:#fff;
}

.btnarrow-req::before{
	content:"";
	position: absolute;
	top:51%;
	right:10px;
	width:20px;
	height:1px;
	background:#fff;
	transition: all .2s linear;
}

.btnarrow-req::after{
	content:"";
	position: absolute;
	top: 35%;
	right: 13px;
	width:2px;
	height:8px;
	background:#fff;
	transform:skewX(45deg);
	transition: all .2s linear;
}

.btnarrow-req:hover::before{
	right:15px;
}

.btnarrow-req:hover::after{
	right:17px;
}

.gallery-notice{
	font-size:.9rem;
	margin:20px 0 0;
	line-height:1.4;
}

@media screen and (max-width:768px){
.gallery-notice{
	margin:10px 0 0;
	text-indent:-1em;
	padding-left:1em
	}
}


.tab-buttons {
	display: flex;
	justify-content:center;
	list-style: none;
	margin-bottom: 10px;
	gap: 30px;
}
@media screen and (max-width:768px){
.tab-buttons {

	gap: 10px;
	}
}

.tab-buttons li {
	cursor: pointer;
	display: flex;
	gap: 30px;
}
@media screen and (max-width:768px){
.tab-buttons li {
	gap: 10px;

	}
}

.tab-buttons li p{
	color:#fff;
	letter-spacing:1px;
	font-size:1.2rem;
	text-align:center;
	padding: 10px 80px;
}
@media screen and (max-width:768px){
.tab-buttons li p{
	font-size:1rem;
	padding: 10px 34px;

	}
}

.tab-buttons li p span{
	display:block;
	font-size:.7rem;
}
@media screen and (max-width:768px){
.tab-buttons li p span{
	font-size:.6rem;
	line-height:1.3;
	}
}

.tab-buttons li p.modelhouse{
	background-image: linear-gradient(300deg, #9aa7c6, #848fa7 54%);
}
.tab-buttons li p.exterior{
	background-image: linear-gradient(300deg, #354f8b, #000f3b 69%);
}
.tab-buttons li p.modelhouse:hover{
	opacity:.8;
	background-image: linear-gradient(125deg, #9aa7c6, #848fa7 54%);
}
.tab-buttons li p.exterior:hover{
	background-image: linear-gradient(125deg, #354f8b, #000f3b 69%);
}
.tab-content {
	display: none;
}
.tab-content.active {
	display: block;
}