@charset "utf-8";

/* =======================================================================================
	COMMON
======================================================================================= */


/* =======================================================================================
	PAGE
======================================================================================= */
/* ---------------------------------------------------------------
introTxtSection
--------------------------------------------------------------- */
	.introTxtSection .copy{
		color: #0398cc;
		display: block;
		text-align: center;
		font-family: var(--site-font_family-sans);
		font-weight: 500;
		margin-bottom: 6em;
	}
	.introTxtSection em{
		display: block;
		min-width: 230px;
		width: 25%;
		margin: 1em auto 3em;
	}



/* ---------------------------------------------------------------
stsrtsGroupSection
--------------------------------------------------------------- */

	/*　afterServiceintro
	-------------------------------------*/
	.afterServiceintro{
		max-width: 1600px;
		margin: 0 auto;
		padding: var(--site-marpad-M) 0 0;
	}



	/*　afterService
	-------------------------------------*/
	.ag-achievementListWrap{
		margin-top:var(--site-marpad-XL);
	}
	/* doubleBorder
	----------------------- */
.ag-achievementListWrap .doubleBorder {
		border-color: #15387a;
	}
.ag-achievementListWrap .doubleBorder::before,
.ag-achievementListWrap .doubleBorder::after {
		border-color: #15387a;
	}
	.ag-achievementListWrap h4 .hTxt{
		/*border: 1px solid #2e3192;*/
		padding: .5em 0;
		margin-bottom: 0;
		text-align: center;
		font-family: var(--site-font_family-sans);
		color: #15387a;
		font-weight: 500;
	}
	  .ag-achievementBox .hTxt {
		text-align: center;
	  }
	  .ag-achievementList {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-top:var(--site-marpad-XS);
	  }
	  .ag-achievementList .item{
		position: relative;
		  width: 33%;
		  margin-bottom: .5%;
	  }
	.ag-achievementList .cap{
		position: absolute;
		bottom: 0;
		right: 0;
		padding: 0.3em 0.5em 0.4em;
		font-size: 0.781em;
		line-height: 1.1;
		text-align: right;
		background:rgba(0,0,0,0.65);
		color: #fff;
		letter-spacing: 0.05em;
	}



@media screen and (max-width: 900px) {
	.ag-achievementListWrap{
		margin-top:var(--site-marpad-L);
	}
  .ag-achievementList .item{
		background: #000;
  }
  .ag-achievementList .item{
	  width: 49%;
	  margin-bottom: 2%;
  }
}
@media screen and (max-width: 600px) {
	.ag-achievementListWrap{
		margin-top:var(--site-marpad-M);
	}	
	.ag-achievementList .cap {
		position: static;
		text-align: center;
	}
}



/* ---------------------------------------------------------------
businessSection
--------------------------------------------------------------- */

	/*mainTxtBox
	-------------------------------------*/
	.mainTxtBox .sentensBox{
		line-height: 2;
	}

	/*serviceContBox
	-------------------------------------*/
	.serviceContBox{
		margin-top:8em;
	}
	.serviceContBox .enHeading_S {
		color: #00a7dd;
		font-family: var(--site-font_family-en_2);
		--M-fluidFontSize-max-fontsize: 30;
		--M-fluidFontSize-min-fontsize: 24;
	}
	.serviceContBox .heading_Line04_inner::before,
	.serviceContBox .heading_Line04_inner::after {
		background-color: #00a7dd;
	}
	.serviceContBox .sentensBox{
		margin: 20px auto;
	}

@media screen and (max-width: 900px) {
	.serviceContBox{
		margin-top:5em;
	}
}



/*afterServiceListWrap
-------------------------------------*/
	.afterServiceListWrap{
		margin-top:var(--site-marpad-L);
	}
	.afterServiceList {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.afterServiceList li {
		width: 24%;
		background:#fafafa;
		margin-top: 1.5%;
		/*box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);*/
	}
	.afterServiceList .txtbox {
		padding: 1.5em 1em 2em;
		font-size: 1.125em;
	}
	.afterServiceList .txtbox .ttl {
		display: block;
		border-bottom: 1px solid #9c9c9c;
		padding-bottom: 0.5em;
		margin-bottom: 0.5em;
		text-align: left;
		font-weight: bold;
		letter-spacing: 0.04em;
		line-height: 1.4;
	}
	.afterServiceList .txtbox .ttl .en {
		display: block;
		text-align: left;
		font-size: 0.676em;
		font-family: var(--site-font_family-en_2);
		color: #0398cc;
		/*letter-spacing: 0.01em;*/
		line-height: 1.2;
		font-weight:normal;
		margin-bottom: 0.2em;
	}
	.afterServiceList .txtbox [class*="copy"] {
		font-family: var(--site-font_family-sans);
	}
	.afterServiceList .txtbox .maincopy {
		font-weight: bold;
		font-size: 0.87em;
		display: block;
	}
	.afterServiceList .txtbox .subcopy {
		font-size: 0.786em;
		line-height: 1.4;
		letter-spacing: 0.02em;
		margin-top: 0.5em;
		display: block;
	}

@media screen and (max-width: 1200px) {
	.afterServiceList::after {
	  content: "";
	  width: 32%; /* .itemと同じ幅 */
	}
	.afterServiceList li {
		width: 32%;
	}
}
@media screen and (max-width: 900px) {
	.afterServiceListWrap{
		margin-top:var(--site-marpad-L);
	}
	.afterServiceList li {
		width: 48%;
		margin-top: 4%;
	}
	.afterServiceList .txtbox{
		font-size: 1.208em;
	}
}
@media screen and (max-width: 600px) {
	.afterServiceListWrap{
		margin-top:var(--site-marpad-M);
	}
	.afterServiceList li {
		width: 100%;
		max-width: 420px;
		margin: 2em auto 0;
	}
	.afterServiceList .txtbox{
		font-size: 1.509em;
	}
	.afterServiceList .txtbox .ttl .en {
		font-size: 4vw;
	}

}





/* ---------------------------------------------------------------
ichinoeAreaSection
--------------------------------------------------------------- */
	.ichinoeAreaSection {
		background: #f8f3de;
	}


	/*ag-ichinoeArea
	-------------------------------------*/
	.ag-ichinoeArea .mainBox{
		max-width: 1600px;
		width: 88%;
		margin: 0 auto var(--site-marpad-XXL);
	}
	.ag-ichinoeArea .txtBox{
		margin-bottom: var(--site-marpad-L);
	}


@media screen and (max-width: 900px) {
	.ichinoeAreaSection {
		padding-top: 0;
	}
	.ag-ichinoeArea .mainBox{
		width: 100%;
	}
	.ag-ichinoeArea .txtBox{
		margin-bottom: var(--site-marpad-S);
	}
}







	/*disaster-mitigationArea
	-------------------------------------*/

	.disaster-mitigationArea{
		margin-top:  180px;
	}

	.disaster-mitigationArea .generalColBox {
		--base-generalColBox-margin-row:	30px;
		--base-generalColBox-margin-column:	40px;
	}

	:root {
	  --deco-color: #08a6cf;  
	  --deco-size: 18px;       /* 四角の1辺の長さ */
	  --deco-gap: 4px;         /* 角からの余白（外側） */
	  --deco-step: 18px;       /* 2つ目をどれだけ右下にずらすか */
	  --box-border: #08a6cf;  
	}
	.activityBox {
		position: relative;
		background: #fff;
		border: 4px solid var(--box-border);
		padding: 2em 2em 2em 3.5em ;
		font-family: var(--site-font_family-sans);

		--M-fluidFontSize-max-fontsize: 14.5;
		--M-fluidFontSize-min-fontsize: 13;
		--M-fluidFontSize-max-viewport: 900;
		--M-fluidFontSize-min-viewport: 700;
		--M-fluidFontSize-fontSize: clamp( var(--M-fluidFontSize-min-fontsize) * .1rem, (var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - (var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport))), var(--M-fluidFontSize-max-fontsize) * .1rem );
		min-height: 0.001vw;		/* for safari | font-sizeにclamp()使用時必須 */
		line-height: 1.73;
		font-size: var(--M-fluidFontSize-fontSize);
		letter-spacing: .09em;
	}
	.activityBox .hTxtStyh5 {
		text-align: left;
		font-weight: 500;
	}
	.deco::before,
	.deco::after {
	  content: "";
	  position: absolute;
	  width: var(--deco-size);
	  height: var(--deco-size);
	  background: var(--deco-color);
	  top: var(--deco-gap);
	  left: var(--deco-gap);
	}
	.deco::after {
	  transform: translate(var(--deco-step), var(--deco-step));
	}




@media screen and (max-width: 600px) {
	.disaster-mitigationArea{
		margin-top:  100px;
	}
	:root {
	  --deco-size: 12px;       /* 四角の1辺の長さ */
	  --deco-step: 12px;       /* 2つ目をどれだけ右下にずらすか */
	}
	.activityBox {
		padding: 2.5em 1.5em 2em ;
	}
}