@charset "utf-8";

.contentWrap h2.contentTtl {
	border-bottom: none;
}

/*----------------------------
	sec
------------------------------*/
.sec {
	padding: 85px 0;
}
.sec h3 {
	font-family: "Oswald", sans-serif;
	font-size: var(--40px);
	font-weight: 500;
	line-height: 1.26;
	letter-spacing: 0.04em;
	text-align: center;
}
.sec h3 span {
	font-family: "Noto Sans JP", sans-serif;
	font-size: var(--16px);
	display: block;
	margin-top: 20px;
}
.sec h4 {
	font-size: var(--24px);
	font-weight: 600;
	margin-bottom: 60px;
}
.sec .mainPic {
	margin-top: 55px;
	text-align: center;
}
.sec .mainLead {
	margin-top: 65px;
	font-size: var(--24px);
	font-weight: 600;
	text-align: center;
}
.sec .subLead {
	margin-top: 30px;
	line-height: 2.25;
	text-align: justify;
}
.sec h3 + .subLead {
	margin-top: 50px;
}
.sec.bgBlack,
.sec.bgBlack a,
.sec.bgBlue,
.sec.bgBlue a {
	color: #fff;
}
.sec.bgBlack h3,
.sec.bgBlue h3 {
	font-weight: 400;
}
.sec .explanatoryWrap {
	margin-top: 90px;
}
.sec .explanatoryWrap .explanatoryList {
	border-top: 1px solid #d9d9d9;
	padding: 90px 0;
}
.sec .explanatoryWrap .explanatoryList .detailWrap dt {
	font-size: var(--18px);
	font-weight: 600;
	margin-bottom: 25px;
}
.sec .explanatoryWrap .explanatoryList .detailWrap dd.listTxt {
	font-size: var(--16px);
	line-height: 2.25;
	text-indent: -1em;
	padding-left: 1em;
}
.sec .explanatoryWrap .explanatoryList .detailWrap dd.txt {
	font-size: var(--16px);
	line-height: 2.25;
	text-align: justify;
}
.sec .explanatoryWrap .explanatoryList .detailWrap dd.listTxt + dd.txt {
	margin-top: 15px;
}
.sec .explanatoryWrap .explanatoryList .detailWrap dd.pic {
	margin-top: 30px;
}
.sec .explanatoryWrap .explanatoryList .detailWrap dd.note {
	font-size: var(--14px);
	line-height: 2;
	margin-top: 15px;
}
.sec .explanatoryWrap .explanatoryList .detailWrap.flex {
	display: flex;
	flex-wrap: wrap;
	gap: 50px 40px;
}
.sec .explanatoryWrap .explanatoryList .detailWrap.flex dl {
	width: calc(50% - 20px);
}
.sec .explanatoryWrap .explanatoryList p.txt {
	font-size: var(--16px);
	line-height: 2.25;
	text-align: justify;
}
@media (max-width: 768px) {
	.sec {
		padding: 45px 0;
	}
	.sec h3 {
		font-size: var(--30px);
	}
	.sec h3 span {
		font-size: var(--14px);
		margin-top: 8px;
	}
	.sec h4 {
		font-size: var(--20px);
		margin-bottom: 30px;
	}
	.sec .mainPic {
		margin-top: 35px;
	}
	.sec .mainLead {
		margin-top: 30px;
		font-size: var(--19px);
	}
	.sec .subLead {
		margin-top: 15px;
		font-size: var(--15px);
		line-height: 1.66;
	}
	.sec h3 + .subLead {
		margin-top: 20px;
	}
	.sec .explanatoryWrap {
		margin-top: 45px;
	}
	.sec .explanatoryWrap .explanatoryList {
		padding: 45px 0;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap dt {
		font-size: var(--15px);
		margin-bottom: 15px;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap dd.listTxt {
		font-size: var(--14px);
		line-height: 1.5;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap dd.txt {
		font-size: var(--14px);
		line-height: 1.78;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap dd.listTxt + .listTxt {
		margin-top: 10px;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap dd.listTxt + dd.txt {
		margin-top: 15px;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap dd.pic {
		margin-top: 25px;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap dd.note {
		font-size: var(--13px);
		line-height: 1.53;
		margin-top: 16px;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap.flex {
		display: flex;
		flex-wrap: wrap;
		gap: 40px 0;
	}
	.sec .explanatoryWrap .explanatoryList .detailWrap.flex dl {
		width: 100%;
	}
	.sec .explanatoryWrap .explanatoryList p.txt {
		font-size: var(--14px);
		line-height: 1.78;
	}
}

/*----------------------------
	facadeDesignWrap
------------------------------*/
/* .slide */
.facadeDesignWrap .slide {
	width: 100%;
	max-width: 1400px;
	position: relative;
	margin: 80px auto 0;
	padding-left: 80px;
	padding-bottom: 100px;
}
@media (min-width: 1401px) {
	.facadeDesignWrap .slide:has(.swiper.swiper-initialized) {
		width: calc(50% + 700px);
		max-width: none;
		margin-top: 80px;
		margin-right: 0;
		margin-bottom: 0;
		margin-left: max(0px, calc((100% - 1400px) / 2));
	}
}
@media (max-width: 768px) {
	.facadeDesignWrap .slide {
		margin: 35px auto 0;
		padding-left: 0;
		padding-bottom: 50px;
	}
}

@media (max-width: 768px) {
	.facadeDesignWrap .swiper {
		padding-right: 3.333333%;
	}
}


.facadeDesignWrap .swiper-slide {
	width: calc((100% - 25px)/2.8);
	padding-right: 25px;
	height: auto;
}
@media (max-width: 768px) {
	.facadeDesignWrap .swiper .swiper-wrapper {
		gap: 0;
	}
	.facadeDesignWrap .swiper-slide {
		width: calc((100% - 4.137931%)/1.3);
		padding-right: 0.804598%;
		padding-left: 3.333333%;
		height: auto;
	}
}

/* swiper:not */
.facadeDesignWrap .slide:has(.swiper:not(.swiper-initialized)) {
	padding-right: 80px;
}
.facadeDesignWrap .swiper:not(.swiper-initialized) .swiper-wrapper {
	justify-content: center;
	gap: 0 25px;
}
.facadeDesignWrap .swiper:not(.swiper-initialized) .swiper-slide {
	width: calc((100% - 50px)/3);
	padding-right: 0;
}
.facadeDesignWrap .swiper:not(.swiper-initialized) + .pager {
	display: none;
}
@media (max-width: 768px) {
	.facadeDesignWrap .slide:has(.swiper:not(.swiper-initialized)) {
		padding: 0 6.666667% 20px;
	}
	.facadeDesignWrap .swiper:not(.swiper-initialized) {
		padding: 0;
	}
	.facadeDesignWrap .swiper:not(.swiper-initialized) .swiper-slide {
		width: 100%;
		padding-right: 0;
		padding-left: 0;
	}
}

.facadeDesignWrap .pager {
	position: absolute;
	width: 71.428571%;
	max-width: 1000px;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0 20px;
	z-index: 10;
}
@media (min-width: 1401px) {
	.facadeDesignWrap .pager {
		left: 50%;
		transform: translateX(-50%);
		margin-left: calc(50% - 50vw);
	}
}
@media (max-width: 768px) {
	.facadeDesignWrap .pager {
		width: 86.666667%;
		gap: 0 15px;
	}
}

.facadeDesignWrap .pager .swiper-pagination {
	position: static;
	width: calc((100% - 36px - 20px));
	display: flex;
}
.facadeDesignWrap .pager .swiper-pagination .swiper-pagination-bullet {
	background: #c2c2c2;
	border: none;
	border-radius: 0;
	opacity: 1;
	width: calc(100% / 4);
	width: 100%;
	height: 6px;
	margin: 0;
	transition: background 0.6s ease-out;
}
.facadeDesignWrap .pager .swiper-pagination .swiper-pagination-bullet-active {
	background: #262626;
}
.facadeDesignWrap .pager .swiperPause {
	display: block;
	width: 36px;
	z-index: 10;
}
.facadeDesignWrap .pager .swiperPause img {
	display: block;
}
@media (max-width: 768px) {
	.facadeDesignWrap .pager .swiper-pagination {
		width: calc((100% - 15px));
	}
	.facadeDesignWrap .pager .swiper-pagination .swiper-pagination-bullet {
		height: 3px;
	}
	.facadeDesignWrap .pager .swiperPause {
		width: 24px;
	}
}

/* .swiperInner */
.facadeDesignWrap .swiperInner {
	height: 100%;
	background: #fff;
	position: relative;
	z-index: 2;
}
.facadeDesignWrap .swiperInner .num {
	position: absolute;
	right: 12px;
	bottom: 15px;
	font-family: "Oswald", sans-serif;
	font-size: var(--65px);
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.04em;
	color: #e0e0e0;
	z-index: -1;
}
.facadeDesignWrap .swiperInner .pic {
	width: 100%;
	background: #e0e0e0;
}
.facadeDesignWrap .swiperInner .pic img {
	width: 100%;
	aspect-ratio: 560 / 370;
	object-fit: contain;
}
.facadeDesignWrap .swiperInner .txtWrap {
	padding: 30px 25px var(--48px);
}
.facadeDesignWrap .swiperInner .txtWrap .txt01 {
	font-size: var(--20px);
	font-weight: 600;
	line-height: 1.5;
	text-align: justify;
}
.facadeDesignWrap .swiperInner .txtWrap .txt02 {
	font-size: var(--14px);
	line-height: 2;
	margin-top: 20px;
	text-align: justify;
}
@media (max-width: 768px) {
	.facadeDesignWrap .swiperInner .num {
		right: 8px;
		bottom: 9px;
		font-size: var(--45px);
	}
	.facadeDesignWrap .swiperInner .txtWrap {
		padding: 20px 20px var(--25px);
	}
	.facadeDesignWrap .swiperInner .txtWrap .txt01 {
		font-size: var(--15px);
		font-weight: 600;
		line-height: 1.46;
	}
	.facadeDesignWrap .swiperInner .txtWrap .txt02 {
		font-size: var(--14px);
		line-height: 1.6;
		margin-top: 12px;
	}
}


/*----------------------------
	bcpWrap
------------------------------*/
.sec.bcpWrap {
	padding-bottom: 0;
}
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap.flex .detailWrapLeft,
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap.flex .detailWrapRight {
	width: calc(50% - 20px);
}
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap.flex .detailWrapLeft dl,
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap.flex .detailWrapRight dl {
	width: 100%;
}
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap.flex .detailWrapLeft dl + dl,
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap.flex .detailWrapRight dl + dl {
	margin-top: 50px;
}
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap dd.listTxt.inlineTxt {
	display: inline;
	text-indent: 0;
	padding-left: 0;
	margin-right: 0.5em;
}
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap dd.pic.pic01 {
	background: #fff;
	padding: 15px;
}
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap dd.pic.pic03 {
	background: #fff;
	padding: 10px 15px 12px;
}
.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap dd.pic.pic04 {
	background: #fff;
	padding: 8px 15px 2px;
}
@media (max-width: 768px) {
	.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap.flex .detailWrapLeft {
		width: 100%;
	}
	.sec.bcpWrap .explanatoryWrap .explanatoryList .detailWrap.flex .detailWrapLeft dl + dl {
		margin-top: 40px;
	}
}


/*----------------------------
	esgWrap
------------------------------*/
.sec.esgWrap {
	padding-bottom: 0;
}
.sec.esgWrap .explanatoryWrap li:first-child {
	display: flex;
	align-items: center;
	gap: 0 80px;
	padding-right: 35px;
}
.sec.esgWrap .explanatoryWrap li .txtWrap {
	flex: 1;
}
.sec.esgWrap .explanatoryWrap .explanatoryList p.txt {
	text-align: left;
}
.sec.esgWrap .explanatoryWrap li .pic {
	width: 104px;
}
@media (max-width: 768px) {
	.sec.esgWrap .explanatoryWrap li:first-child {
		display: block;
		padding-right: 0;
	}
	.sec.esgWrap .explanatoryWrap li .txtWrap {
		width: 100%;
	}
	.sec.esgWrap .explanatoryWrap li .txtWrap .spFlex {
		display: flex;
		gap: 0 13px;
	}
	.sec.esgWrap .explanatoryWrap li .txtWrap .spFlex .pic {
		width: 27.230769%;
		max-width: 89px;
		margin-top: 5px;
	}
	.sec.esgWrap .explanatoryWrap li .txtWrap .spFlex .txt {
		flex: 1;
	}
}


/*----------------------------
	outlinewrap
------------------------------*/
.sec.outlinewrap {
	padding-bottom: 0;
}
.outlinewrap .outlineTxt {
	margin-top: 80px;
	display: flex;
	flex-wrap: wrap;
	gap: 30px 40px;
}
.outlinewrap .outlineTxt dl {
	width: calc(50% - 20px);
	display: flex;
	gap: 0 30px;
}
.outlinewrap .outlineTxt dl dt {
	width: 7.5em;
	font-weight: 600;
}
.outlinewrap .outlineTxt dl dd {
	width: calc(100% - 7.5em - 30px);
}
@media (max-width: 768px) {
	.outlinewrap .outlineTxt {
		margin-top: 30px;
		display: block;
	}
	.outlinewrap .outlineTxt dl {
		width: 100%;
		display: flex;
		gap: 0 18px;
		font-size: var(--12px);
		line-height: 1.66;
	}
	.outlinewrap .outlineTxt dl dd {
		width: calc(100% - 7.5em - 18px);
	}
	.outlinewrap .outlineTxt dl + dl {
		margin-top: 13px;
	}
}
