

#concept1{margin:0 0 4.8rem;}
#concept2{margin:0;}



/* スライドショー部分 */
	#concept .slider {
		width:100%;
		max-width:800px;
		margin: 0 auto;
		position: relative;
		overflow: hidden;
	}

	#concept .slider-viewport {
		width:100%;
		height:calc(500vw / 8);
		max-width:800px;
		max-height:500px;
		cursor: grab;
		-webkit-user-select: none;
		user-select: none;
	}

	#concept .slider-items {
		display: flex;
		pointer-events: none;
	}

	#concept .slider-slide {
		flex: 1;
	}

	#concept .slider-image {
		position: relative;
		width:100%;
		max-width:800px;
		height:calc(500vw / 8);
		max-height:500px;
	}
	#concept .slider-image img {
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	
	@media print, (min-width: 768px) {
		#concept .slider-controls {
		margin-top: 20px;
		}
	}
	@media screen and (max-width: 767px) {
		#concept .slider-controls {
		margin-top: 15px;
		}
	}

	#concept .slider-controls-inner {
		position: relative;
	}
	
	#concept .slider-nav button {
		display: block;
		position: absolute;
		top: 0;
		height: 100%;
		padding: 0;
		border: none;
		background: none;
		font: inherit;
		line-height: 1;
		cursor: pointer;
		-webkit-appearance: none;
		appearance: none;
	}
	@media print, (min-width: 768px) {
		#concept .slider-nav button {
		width: 40px;
		}
	}
	@media screen and (max-width: 767px) {
		#concept .slider-nav button {
		width: 25px;
		}
	}

	/* 矢印アイコンのスタイル */
	#concept .slider-nav button::before {
		content: '';
		display: block;
		position: absolute;
		top: 50%;
		background: #c11a51;
		-webkit-mask: url(../images/slider_arrow.svg) 0 0/contain no-repeat;
		mask: url(../images/slider_arrow.svg) 0 0/contain no-repeat;
		transition: opacity 300ms cubic-bezier(.215, .61, .355, 1);
	}
	@media print, (min-width: 768px) {
		#concept .slider-nav button::before {
		width: 25px;
		height: 20px;
		margin-top: -10px;
		}
	}
	@media screen and (max-width: 767px) {
		#concept .slider-nav button::before {
		width: 19px;
		height: 15px;
		margin-top: -7.5px;
		}
	}

	@media print, (min-width: 768px) {
		#concept .slider-nav button:hover::before,
		#concept .slider-nav button:active::before {
		opacity: 0.5;
		}
	}

	#concept .slider-nav button:nth-child(1) {
		left: 0;
	}
	#concept .slider-nav button:nth-child(1)::before {
		left: 0;
		transform: scaleX(-1);
	}

	#concept .slider-nav button:nth-child(2) {
		right: 0;
	}
	#concept .slider-nav button:nth-child(2)::before {
		right: 0;
	}
	
	#concept .slider-thumbnails {
		overflow: hidden;
	}
	@media print, (min-width: 768px) {
		#concept .slider-thumbnails {
		width: 670px;
		margin: 0 auto;
		}
	}
	@media screen and (max-width: 767px) {
		#concept .slider-thumbnails {
		margin: 0 25px;
		}
	}

	#concept .slider-thumbnails-center {
		width: 20%;
		margin: 0 auto;
	}

	#concept .slider-thumbnails-items {
		display: flex;
	}

	#concept .slider-thumbnails-slide {
		flex: 1;
	}
	@media print, (min-width: 768px) {
		#concept .slider-thumbnails-slide {
		padding: 0 5px;
		}
	}
	@media screen and (max-width: 767px) {
		#concept .slider-thumbnails-slide {
		padding: 0 3px;
		}
	}

	#concept .slider-thumbnails-slide button {
		display: block;
		position: relative;
		width: 100%;
		aspect-ratio: 1480/832;
		margin: 0;
		padding: 0;
		border: none;
		background: none;
		font: inherit;
		line-height: 1;
		cursor: pointer;
		-webkit-appearance: none;
		appearance: none;
		transition: opacity 300ms cubic-bezier(.215, .61, .355, 1);
	}

	#concept .slider-thumbnails-slide button::before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 2px solid #fff;
		opacity: 0;
		transition: opacity 300ms cubic-bezier(.215, .61, .355, 1);
	}

	#concept .slider-thumbnails-slide button img {
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	/* サムネイルのホバー・アクティブ状態 */
	@media print, (min-width: 768px) {
		#concept .slider-thumbnails-slide button:hover,
		#concept .slider-thumbnails-slide button:active {
		opacity: 0.5;
		}
	}

	
	#concept .slider-thumbnails-slide.is-current button {
		pointer-events: none;
	}
	#concept .slider-thumbnails-slide.is-current button::before {
		opacity: 1;
	}
	#concept .slider.is-grabbing .slider-viewport,
	#concept .slider.is-grabbing .slider-viewport * {
		cursor: grabbing !important;
	}

	
	#concept .slider.is-lte5 .slider-controls {
		display: flex;
		justify-content: center;
	}
	@media print, (min-width: 768px) {
		#concept .slider.is-lte5 .slider-nav button:nth-child(1) {
		left: -35px;
		}
	}
	@media print, (min-width: 768px) {
		#concept .slider.is-lte5 .slider-nav button:nth-child(2) {
		right: -35px;
		}
	}
	@media print, (min-width: 768px) {
		#concept .slider.is-lte5 .slider-thumbnails {
		width: auto;
		}
	}
	#concept .slider.is-lte5 .slider-thumbnails-center {
		width: auto;
	}
	#concept .slider.is-lte5 .slider-thumbnails-track-wrapper {
		width: auto !important;
	}
	#concept .slider.is-lte5 .slider-thumbnails-track-offset {
		transform: none !important;
	}
	#concept .slider.is-lte5 .slider-thumbnails-track {
		transform: none !important;
	}
	#concept .slider.is-lte5 .slider-thumbnails-items {
		transform: none !important;
	}
	#concept .slider.is-lte5 .slider-thumbnails-slide {
		flex: none;
	}
	@media print, (min-width: 768px) {
		#concept .slider.is-lte5 .slider-thumbnails-slide {
		width: 124px;
		}
	}
	@media screen and (max-width: 767px) {
		#concept .slider.is-lte5 .slider-thumbnails-slide {
		width: 53px;
		}
	}
		


/* 建築家部分 */
#concept #architect {display:flex;}
#concept .architect-detail{
	width:80%;
}
#concept .architect-photo{
	width:20%;
	padding:10px;
	text-align:right;
}
#concept .architect-photo img{
	width:200px;
	height: 250px;
	object-fit: cover;
}

#concept .architect-name{
	margin:0 0 2rem;
}
#concept .name-box{
	font-family: 'Bitter';
	color: #000000;
	font-size: 137.5%;
	text-shadow: none;
	line-height: 1.2;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	text-align: inherit;
	letter-spacing: normal;
	word-spacing: normal;
	text-transform: none;
	font-weight: 400;
}
#concept .ruby-box{
	font-family: 'Bitter';
	color: #000000;
	font-size: 81.25%;
	text-shadow: none;
	line-height: normal;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	text-align: inherit;
	letter-spacing: normal;
	word-spacing: normal;
	text-transform: none;
	font-weight: 400;
}
#concept .architect-detail{
	font-family: 'Bitter';
	color: #000000;
	font-size: 87.5%;
	text-shadow: none;
	line-height: 2rem;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	text-align: inherit;
	letter-spacing: 2px;
	word-spacing: normal;
	text-transform: none;
	font-weight: 400; 
}


@media print, (max-width: 768px) {
	#concept #architect{display:block;}
	#concept .architect-detail, #concept .architect-photo{width:100%;}
	#concept .architect-detail p{line-height:2rem;}
}