@charset "UTF-8";
/* CSS Document */

.btn-visit a {
	background: rgb(0,154,164);
background: linear-gradient(90deg, rgba(0,154,164,1) 0%, rgba(0,90,96,1) 100%);
}

.btnGrd {
	background: rgb(0,61,149);
	/*background: linear-gradient(90deg, #024fa0 0%, #009eff 50%, #024fa0 100%);*/
	background: linear-gradient(90deg, #0c295e 0%, #2056b4 50%, #0c295e 100%);
	background-position: -100%;
	background-size: 200%;
}
.btnGrd:hover {
	background-position: -200%;
	opacity: 1 !important;
}
.info-in {}
.info-in p.tag {
	color: #005A60;
}
.info-in h2 {
	color: #A8001B;
	font-size: 4vw;
	font-size: clamp(30px, 4vw, 54px);
	letter-spacing: 0.1em;
	font-family: 'YakuHanMP','Noto Serif JP', serif;
	max-width: 840px;
	margin: 0 auto;
	padding-bottom: 0.2em;
	letter-spacing: 0;

}
.info-in h2 span {
	display: inline-block;
	font-size: 40%;
	letter-spacing: 0;
}
.info-in h2 sup {
	margin-top: -0em;
vertical-align: top;
}
.info-in p.msg {
	border-top: #000 solid 1px;
	border-bottom: #000 solid 1px;
	text-align: center;
	max-width: 840px;
	margin: 0 auto;
	padding: 1% 0;
}
.info-in p.msg span {
	font-size: 140%;
	letter-spacing: 0.2em;
}

/*.info-in h2 span {
	font-size: 70%;
}*/
#pageTit h2 {
	padding: 0.6em;
	background-color: #005A60;
	color: #fff;
	text-align: center;
	font-family: 'Noto Serif JP', serif;
	font-size: 28px;
	line-height: 1.3;
	font-weight: normal;
	
}
#pageTit h2 span{
	font-family: 'Cinzel', serif;
	display: block;
	font-size: 70%;
	letter-spacing: 0.2em;
}
.engTxt {
	/*font-family: 'Gilda Display', serif;*/
	font-family: 'Cinzel', serif;
	letter-spacing: 0.2em;
}
#pageWrap {
	padding: 60px 0 0;
	font-family: 'YakuHanMP','Noto Serif JP', serif;
}
#pageWrap h2,#pageWrap h3, #pageWrap h4,#pageWrap h5 {
	font-weight: normal;
}
#pageWrap a {
	transition: 0.3s;
}
#pageWrap img {
	width: 100%;

}
#pageWrap a:hover {
	opacity: 0.6;
	text-decoration: none;
}
.flex-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.wrapWidth {
	width: 100%;
	margin: 0 auto 60px;
}
.boxWidth {
	width: 96%;
	max-width: 1200px;
	margin: 0 auto;
}
.brSp {
	display: none;
}
#contents-wrap *,#contents-wrap *::after,#contents-wrap *::before {
	box-sizing: border-box;
}
.imgBox {
  position: relative;
}
.iconEco::before {
  content: '';
  position: absolute;
  text-align: right;
  right: -10%;;
  top: -15%;
  width: 25%;
  max-width: 50px;
  height: 50%;
  background-image: url("../img/icon-eco.png");
  background-size: contain;
  background-position: center top;
  background-repeat: no-repeat;
  z-index: 2;
}

.capImg::after
{
  content: 'image';
  position: absolute;
  font-size: 10px;
  text-align: right;
  right: 0.5em;
  bottom: 0.1em;
  color: #fff;
  text-shadow: 0px 0px 1px rgba(0,0,0,0.5),1px 1px 0px rgba(0,0,0,0.5),-1px 1px 0px rgba(0,0,0,0.5),-1px -1px 0px rgba(0,0,0,0.5),1px -1px 0px rgba(0,0,0,0.5);
}
.sanko::after {
  content: '参考写真';
}
.capdata::after {
	content: attr(data-caption);
}

.capBk::after {
  color: #000;
  text-shadow: 0px 0px 1px rgba(255,255,255,0.5),1px 1px 0px rgba(255,255,255,0.5),-1px 1px 0px rgba(255,255,255,0.5),-1px -1px 0px rgba(255,255,255,0.5),1px -1px 0px rgba(255,255,255,0.5);
}
.seko::after {
  content: '※当社施工例';
}
.capLeft::after {
  right: inherit;
  left: 0.6em;
}

@media screen and (max-width: 959px) {
  #pageTit h2 {
		font-size: 2.7vw;
		font-size: clamp(20px, 2.7vw, 22px);
	}
	#pageWrap {
		padding: 30px 0 0;
	}
	.info-in h2 {
			font-size: 6vw;
			/*font-size: clamp(30px, 5.6vw, 46px);*/
		

		}

}
@media screen and (max-width: 599px) {
	#pageTit h2 {
		font-size: 4.8vw;
		font-size: clamp(17px, 4.8vw, 19px);
	}
	.brSp {
		display: inline;
	}
	.info-in h2 {
			font-size: 9vw;
			/*font-size: clamp(18px, 7.5vw, 36px);*/

		}
	.info-in p.msg {
		font-size: 13px;
		line-height: 1.3;
	}
	.info-in p.msg span {
		display: block;padding-bottom: 0.2em;
	}
}
	
	

/*=========お詫びと訂正==========*/
section.apology {}
section.apology dl {
	background-color: rgba(0,0,0,0.2);
	padding: 0.3em 1em;
}
section.apology dt {
	font-size: 16px;
	font-size: clamp(14px, 1.5vw, 16px);
}
section.apology dd {
	line-height: 1.2;
	font-size: 1.1vw;
	font-size: clamp(11px, 1.1vw, 13px);
	padding-bottom: 0.5em;
	text-align: center;
letter-spacing: 0em;
	
}
section.notice:first-of-type dl {
	display: none;
}
@media screen and (max-width: 599px) {
	section.apology dd {
	text-align: justify;
	}
}

/*=========ページ下部メニュー==========*/
#footBtWrap {
	background-color: #00595e;
	padding: 30px 0;
margin-top: 5%;
}
#footBtWrap .flex {
	justify-content: center;
	gap: 10px 1%;
}
#footBtWrap .flex a {
	display: block;
	background-color: #fff;
	color: #000;
	font-size: 1.3vw;
	font-size: clamp(12px, 1.3vw, 17px);
	width: calc((100% / 5) - 1%);
	height: 4em;
	display: flex;
justify-content: center;
align-items: center;
	box-shadow: 2px 2px rgba(0,0,0,0.7);
	transition: 0.3s;
}
#footBtWrap .flex a:hover {
	opacity: 0.7;
	text-decoration: none;
	transform: translate(1px,1px);
	box-shadow: 1px 1px rgba(0,0,0,0.9);
}
.notes-area {
    margin: 0% auto 0;
}

@media screen and (max-width: 599px) {
	#footBtWrap {
		
	}
	#footBtWrap .flex {
		gap: 4px 1%;
	}
	#footBtWrap .flex a {
		font-size: 3.4vw;
		font-size: clamp(10px, 3.4vw, 14px);
		line-height: 1.2;
		width: calc((100% / 3) - 1%);
		height: 4em;
	}
	#footBtWrap .flex a:nth-child(6),
	#footBtWrap .flex a:nth-child(7) {
		letter-spacing: -0.08em;
	}
}